フロントエンド技術を学ぼう 1-10.フロントエンドデベロッパーになるには

Front-end Developer Handbook 2017を教科書にフロントエンド周りの技術を習得する連載。

www.mojage.club

第10回はPart I. The Front-End Practiceから、
10項のHow Front-End Developers Are Madeを紹介します。

フロントエンドデベロッパーになるにはについての説明です。

Sponsored Link

フロントエンドデベロッパーになるには

どの様にしたら確実にフロントエンドデベロッパーになれるでしょうか?これは難しい問題です。フロントエンドエンジニアリングの学位を取得できる大学は、現在なお見当たりません。それにコンピュータサイエンスグラフィックデザインの学位を取得するために、HTML、CSS、JavaScript書くことができなくなっている、フロントエンドデベロッパーを見たことはありません。

私の見解では、現在フロントエンド界隈で働いている殆どの人々は、独学非公認のプログラム、コース、ブートキャンプから来ているようです。

フロントエンドデベロッパーになる為のプロセス

今日からフロントエンドデベロッパーになろうとする場合は、次項から説明する以下のプロセスに従ってみて下さい。(パート2「Learning Front-End Dev」では、学習リソースの詳細について説明します。)

  1. ウェブの仕組みの概要を学ぶ
    何かを深く掘り下げたりせず、ただ以下のそれぞれのパーツや、どの様にこれらが組み合わさるのかを理解して下さい。そして、フロントエンドアーキテクチャの概要に注目してください。簡単なWebページから始めて、フロントエンドアプリケーションを簡単に勉強しましょう。(SPAなど)
    • ドメインとは「何」で「どこ」であるか
    • DNS
    • URL
    • HTTP
    • ネットワーク
    • ブラウザ
    • サーバ/ホスティング
    • JSON
    • データAPI
    • HTML
    • CSS
    • DOM
    • JavaScript
  2. HTMLを学ぶ
  3. CSSを学ぶ
  4. JavaScriptを学ぶ
  5. DOMを学ぶ
  6. JSONとデータAPIを学ぶ
  7. ユーザーインターフェイスデザインの基本を学ぶ
    • UIパターン
    • インタラクションデザイン
    • ユーザーエクスペリエンスデザイン
    • ユーザビリティなど
  8. CLI /コマンドラインを学ぶ
  9. ソフトウェアエンジニアリングの実践を学ぶ
    • アプリケーションデザイン/アーキテクチャ
    • テンプレート
    • Git
    • テスト
    • 監視
    • 自動化
    • コード品質
    • 開発手法
  10. あなたにとって価値のあるツール集を作る
    • Webpack
    • React
    • Reduxなど
  11. Node.jsを学ぶ

学習に関するアドバイス

抽象化された技術を学ぶ前に、実際の基礎技術を学んでください。

  • jQueryを先に学んではいけません、DOMを学びましょう。
  • SASSを先にを学んではいけません、CSSを学びましょう。
  • HAMLを先にを学んではいけません、HTMLを学びましょう。
  • CoffeeScriptを先にを学んではいけません、JavaScriptを学びましょう。
  • Handlebarsを先にを学んではいけません、JavaScript ES6テンプレートを学びましょう。
  • Bootstrapを先にを学んではいけません、UIパターンを学びましょう。

学び始めの段階では、複雑さを排除することは避けるべきです。間違った手法で抽象化した結果、良い結果を生み出せたとしても、基本概念を理解していない開発者になります。

学習リソースとツールの紹介

そしてこの本の残りの部分では、フロントエンド開発の学習に使用できるリソースや、実践に使用できるツールを紹介します。この旅ではあなたは学習するだけでなく、ツールについて調査し実践することもあります。実践によって学ぶ、あるいは実践方法を学ぶ。どちらも有用ですが、両方を組み合わせて理解することを私は勧めます。ただ読むだけではなく、実際に手を動かしましょう。それが確かな道です!
学んで、試して、学んで、試して、、終わりなく繰り返すことで、物事が急速に変化していきます。これが、私が抽象概念ではなく基礎を学ぶことを重視する理由です。

有料学習コースについて

最近、多くの非公認で、高額なフロントエンドのコードスクール/ブートキャンプが登場しました。フロントエンドデベロッパーになるためのこれらの道は、伝統的なスタイルである、講師から学ぶコースです。(シラバス、テスト、クイズ、プロジェクト、チームプロジェクト、成績など)もしあなたが高額なトレーニングプログラムを受講しようとしているならば、これはWebだということを思い出して下さい!全ての学ぶべきものはWeb上にあり、少しもコストが掛かりません。

私は、インターネット接続とビデオチャットアカウント、燃えるような知識欲があれば、実質的に無料でなれる職業を他に知りません。

フロントエンド学習1歩目

今日は、以下の単発コースの1つ以上を試してみて下さい。

2016/2017 MUST-KNOW WEB DEVELOPMENT TECH (2016/2017年の知っておくべきWeb開発技術)

So, You Want to be a Front-End Engineer (だから、あなたはフロントエンジニアになりたい)

その他のリソース