Node.js React.js NuxtJS/NextJS
専門学校でフロントエンドの講師をしています。その経験を生かしてサポートします!
できること
HTML
文書構造を意識したシンプルなHTMLを学べるようにサポートします。
※ 近年ReactやVueなどのフレームワークが使われるようになり、企業のサイトなどでも
文書構造を意識したHTMLを書いているケースが少なくなっています。
HTMLを正しく理解することで、CSSのシンプルな理解に繋がります。
また就職にもアピールできるポイントになるかと思います。
- 文書構造を意識したHTML
- 見た目と構造を分けたHTMLの考え方
CSS
文書構造を理解したHTMLを書くことで、分かりやすくCSSを理解できるようにサポートします。
- flexboxを使ったレイアウト
- コンポーネント単位で作る考え方(React,Vueを意識した作り)
- AltCSSについて「最近良く使われているSassやPostcssなどの使い方」
Javascript, Node
現在Javascriptを使って様々なことができるようになりました。
Javascriptの基礎からフレームワークを使ったwebサービス、Nodeをつかったサーバーまでサポートします
- Javascriptの基礎
- jQueryについて(あまり最近は使われなくなりましたがその理由についてなども合わせて)
- フレームワーク(React, Vue, Nuxt, Next)を用いたシングルページアプリケーションの構築
- Nodeを使ったサーバー側の実装
実際の学習、専門学校で教えていること
1. HTMLとCSSをしっかりと覚える
フロントエンドエンジニアへになるには
https://www.mindmeister.com/1918186629?t=Xw005HtJ2g
HTMLについて
https://clover.blue/tags/HTML,CSS%E8%AC%9B%E5%BA%A7
- それを知識をもとにして、いくつか実際にあるサイトを模写
2. Javascriptの知識をつける
Javascript 講座
https://clover.blue/tags/Javascript%E8%AC%9B%E5%BA%A7
Javascript 問題
https://clover.blue/tags/Javascript%E5%95%8F%E9%A1%8C
- VueやReactを使ったフレームワークなどを使ってポートフォリオの作成
- スクール時にcss変えることによる、パララックス効果などの動くサイトの作成
デザイン
Photoshop・Figmaを使ったサイトデザインのサポート。
下記参考
- 自分のブログ(https://clover.blue/)
- ゆるチャット(https://yuru.blue/)
- 生徒用の課題「花を送る」(https://fullbloom.herokuapp.com/)
- 生徒用の課題「ポートフォリオ」(https://reverent-edison-eaa819.netlify.app/)
メンタープロフィール
レビュー
このレビューにはコメントがありません。
ありがとうございました!
当方の問題点を発見していただきました。
ありがとうございました。
また今後ともよろしくお願いいたします。
会員登録後、全てのレビューをご覧いただけます。