メインコンテンツへ移動

フロントエンド開発の成長ロードマップ

無料2015-06-02#Front-End#前端开发学习资料#web前端学习路线

「三人行えば必ずわが師あり」と言うように、これまでの道のりで、先輩方には多大な助けをいただきました。

0. 先輩方からのキャリア開発のアドバイス

  1. 忍耐

1pxへのこだわり

  1. 古い考えを捨て、新しい技術に注目すべき

互換性を言い訳にして新しい技術を無視しないこと

  1. 基礎を深め続ける

jsの基礎がまだ十分に固まっていない

  1. ユーザー体験を極める。仕事への姿勢が重要

ユーザー体験はデザイナーだけの仕事ではなく、フロントエンドエンジニアも同様に重視すべきである

  1. プロジェクトを推進する努力をし、フロントエンドに限定しない

フロントエンドエンジニアの役割はそれほど多くないかもしれないが、プロジェクトの成功には全メンバーの協力が必要である。例えば、プロジェクト開発を推進するためにPM向けのシンプルなキャンペーンページ設計ツールをカスタマインスするなど

  1. 新しい技術が何のためのものかを知る

新しい技術を追いかけて学習する必要はないが、常に注目し、ある程度の理解を持っておくべきである。遭遇した問題が新しい技術を使えば簡単に解決できるかもしれないからだ

  1. 自分の役割のことだけをせず、大局観を持つ

プロジェクトの成功はチームの全メンバーにとっての第一目標である

1. 先輩方から提示されたフロントエンド開発の要件

1. デザイン、製品、インタラクションに関する知識の蓄積

2. フロントエンドの新しい技術の学習:

  • フロントエンド自動化ツール(Gulp/Gruntなど)

  • モジュール化(CommonJS、AMD/CMDモジュールローダー、各種バンドラー、ES2015 Modulesなど)

  • フロントエンド MV* フレームワーク(Backbone、Angularなど)

  • CSSやJSにコンパイルされる言語(Less/Sass/CoffeeScriptなど)

  • フロントエンド自動化テストツール(Karma、Mocha、Web Driverなど)

  • NodeJSの学習方法:

    1. まずjsをマスターする。

    2. GitHubでシンプルなプロジェクトを探して模倣する。例:https://github.com/felixge/node-mysql

    3. NodeJSベースのブログ管理システムを作成する:記事の投稿、管理、会員管理、権限、ファイル管理。そして、それを自分のGitHubにプッシュする。

    4. 一歩ずつ完成させる。Wordpressのような形にする。

    5. ここまで来れば、次に何をすべきか分かるようになる。

  • TweenMaxなどのJSアニメーションライブラリの習熟(新興のThreeJS

3. ビジュアルコミュニケーション/色彩構成/平面構成の基礎知識を大まかに理解する

4. Webサイトのパフォーマンス最適化、SEO、サーバー側の基礎知識も習得必須である

2. 先輩に薦められたが、まだ読み終えていない本

  1. 『JavaScript Patterns』(javascript模式)

  2. 『High Performance JavaScript』(高性能javascript)

  3. 『JavaScript Framework Design』(Javascript框架设计)

  4. 『jQuery Internal』(jQuery技术内幕)

  5. 『JavaScript Web Applications』(基于mvc的javascript web富应用开发)

これらの基礎の上に jsMVC という概念を理解し、本書の著者がどのように JSMVC フレームワークを構築しているかを確認する必要がある。これらを理解するには、js 言語とフレームワークの両方に精通している必要がある。さらに深く学びたいのであれば、Backbone、Angular、Ember などのフロントエンド JSMVC ライブラリを使い、それぞれの利点を分析し、使いこなし、読み解くことで、自身のアーキテクチャ能力と言語能力がさらに向上する。

  1. ソースコードを読む

js のソースコードを読んでみる。推奨されるソースコード:backbone.js、lazyLoad.js、oz.js、sea.js、sizzle.js、underscore.js。もちろん jQuery のソースコードも読めるが、個人的には jQuery は少し骨が折れるのであまりお勧めしない。しかし、上記のコードは構造、js のテクニック、アルゴリズムのいずれにおいても明確な記述があり、js ソースコード学習の優れた手本である。

  1. コーディングを継続する

js コードを書き続けること。これがコーディング能力を向上させる唯一の基準である。読書は知識を与えてくれるが、実際のコーディングは深い理解を与えてくれる。自分でライブラリを一式書けるようになるのがベストである。一つは、他人が自分のライブラリを使って心地よいと感じてもらえるようにするため、もう一つは、自分のコーディングレベルを向上させ続けるためである。

3. その他

続く

コメント

コメントはまだありません

コメントを書く