# 2024/04/26 MENTA チョウカさん

[TOC]

## 近年のフロントエンドのロードマップ
- HTML
- CSS
- JavaScript（タブの切り替え、メニューの切り替え、ローディングアニメーションなどのサイトでよく使われる機能。jQueryは使われなくなってきている）
- - -
- Sass / Scss
- Git(バージョン管理ツール)
- WordPress
- GSAP（JSのアニメーションライブラリ）。JSの知識が必須。
- ScrollTrigger（GSAPのスクロール系のプラグイン）
- - -
- より深いJavaScriptの実装。
- Vue.js, React.js
- Vue.js, React.js を使いやすくしたもの → Nuxt.js, Next.js
- Webpack（ウェブパック） / Vite（ヴィート）。VueやReactを使うのに必須。
- WebpackやViteはNode.jsで動いているので、Nodeの基本的な仕組み。
- Nodeのパッケージ（プラグイン）管理にnpm / yarnの基本的な知識。
- Command Line Tools（コマンドラインツール）。Webpackなどを動かすのに必須。
- TypeScript（JavaScriptの上位言語。型を定義する）
- - -
- WebGL / Three.js（3D, CG）

## 案件の取り方と流れ
### 準備
- サイトの模写を３サイトくらいやる。
- 作ったサイトをまとめる、ポートフォリオサイトを作る。自分のプロフィール、お問い合わせなどを一緒に記載する。

### 案件の取り方
- 周りの人に声をかけて、練習でサイトを作らせてもらう。もし作らせてもらえたら、実績になるので、ポートフォリオに追加していく。
- ランサーズ、クラウドワークスで仕事に応募する。
- Webサイト制作会社、デザイン事務所などにメールで営業する。
- 自分のポートフォリオサイトのデザインを整えた上で、SEO対策もしていくことでサイトから受注する。SNSでもOK

### 案件の流れ
- デザインをクライアントからもらう
- 見積もりを送る。金額の大きい案件（50万〜）契約書を交わす。
- コーディング
- クライアントに確認してもらう
- 納品
- html, cssのサイトならファイルを直接送る or サーバーの情報をもらって、そこにアップロードする
- WordPressなどであれば、サーバーに直接アップロードする。
- 請求書を発行して、入金（翌月末が多い）