
Webアプリケーションを正しく開発するための目標を設定します。 あなたの処分で、これまでにないような多くの記事や本があります。 これまで以上に、開発プロセスを簡素化および高速化できる多くのインターネットリソースが登場しています。 そこで、人気のWeb開発者であり続け、自分の分野で最高の存在であり続けるために、知っておくべき6つのことを紹介します。
1-コードの品質を改善する(JavaScriptおよびCSS)
有能なHTMLとCSSを書かないと生き残れません。
- すべてのコアJavaScript機能を学習します。
- 次に、言語の高度な機能に進みます
- 純粋なJSに自信を持つようになったら、 CoffeeScriptやTypeScriptなど、より高度な抽象化の言語に精通してください。 必要なJavaScriptライブラリの使用を改善します。最小要件のリストを次に示します。
- JQuery-ずっと前に学習しましたか?
- Require.js -JavaScriptファイルおよびモジュールダウンローダー。
- Underscore.js-優れたユーティリティライブラリ
- modernizrは、HTML / CSS機能をサポートするためのブラウザーです。
- history.js -HTML履歴APIのエミュレーション。ブラウザーの履歴を操作します。
そして、もう少しです:
- 便利なJavaScript ライブラリと jQuery プラグイン
- CrockfordのJavascriptリソース
- 特に仕事でMicrosoft .NETを頻繁に使用する場合は、 TypeScriptを試してください。
- CSSについては、 SASSまたはLess拡張機能を確認し、 CSS3テクニックを調べ、 CSS3のさまざまなブラウザーのサポートに注目してください。 レスポンシブデザインの概念を理解し、 メディアクエリの使用を開始します 。
2-レスポンシブデザインを作成する
今日、より多くのトラフィックがモバイルデバイスで消費されているため、ほとんどのWebサイトは、デフォルトであらゆるフォームファクターのデバイスで適切に表示されるはずです。 私のように、メディアクエリを使用してこれらすべてのWebページを作成する時間がない場合は、生活を楽にしてください。 レスポンシブデザインフレームワークを学びます。
Responsive Web Design(RWD)は、さまざまなデバイス(モニターからモバイルデバイスまで)で最適な外観(ズームを使用せずに読みやすく、ナビゲートしやすく、デバイスを回転し、スクロールする)を提供するようにサイトを設計する場合のWebデザインへのアプローチです
個人的には、 Twitter BootstrapとZurb's Foundationを使用しています。 私は長年Bootstrapを使ってきましたが、Foundationのチップには嬉しい驚きがあります。
必須の読書:
- Ethan MarcotteによるレスポンシブWebデザイン
- レスポンシブCSSフレームワークの比較
3-最も有用なJavaScript MVCフレームワークを探索する
一流のJavaScript開発者になりましょう。 クライアントには多くのJavascript MVCフレームワークがありますが、少なくとも5つ(はい、少なくとも5つ)を学びます。 私はあなたのためにスターターキットをコンパイルしました。
- Backbone.js
- Angularjs
- Spine.js
- KnockoutJS (MVVM)
- Ember.js
- ゆい
それらの機能を比較対照するには、 TodoMVCをご覧ください。これは非常にクールで便利なものです。 これは、目的に応じてMVCフレームワーク動物園から選択できるように作成されたプロジェクトです。
4-RESTとHTTPを理解する
Restful Webサービスがどのように機能するかを理解し、サイトのサーバー側の作成と管理に習熟する必要があります。 たとえば、 Node.jsを使用します。 .NETを使用している場合は、 Web APIから始めてください。 さらに、RESTの仕組みを理解します。 時間をかけてHypermediaを学習してください。 理論にこだわるのではなく、いくつかの例に従ってください。 次に、REST Webサービスの知識を上記のMVCフレームワークの1つと組み合わせ、これらのテクノロジーを使用して何らかのプロジェクトを作成します。 正しいHTTPリクエストを使用してください。
必須の読書:
- WOAはここにいる
- リチャードソン成熟モデル -マーティン・ファウラーによる記事
- 実際のREST
- ハイパーメディアとフォーム
これらの記事は、始めるのに適した場所です。 また、Meteor、SignalRなどの既製の実装にも注意してください。
5-未来はHTML5
HTML5標準は非常に動的ですが、多くはすでに承認されています。 サイトの開発とともに、HTML5は多くのコンテナ(例:PhoneGapなど)を提供します。これにより、アプリケーションをブラウザにパックできます。モバイルデバイス(いわゆるハイブリッドアプリケーション)のコンテナで、通常の流通チャネルを通じてネイティブアプリケーションとして配信できます。
HTML5は、Web上でコンテンツを構造化して表示するためのマークアップ言語であり、インターネットのコアテクノロジーです。 これはHTML標準の5番目の改訂版(1990年に作成され、1997年にHTML4として標準化された)であり、2012年11月に開発中です。その他のデバイス(Webブラウザー、パーサーなど)。
多くのクールなHTML5記事があります。
- Nettutsのチュートリアルと例
- Smashing誌の記事は、モダンデザインの哲学を理解するための素晴らしい出発点です。
- 上位25のHTML5機能
最も便利で印象的なHTML5 Javascript APIと言語の利点をご覧ください。 Webソケット、アプリケーションキャッシュ、Canvas API、ビデオ/オーディオなどに注意してください。 人気のあるテンプレートから始めて、 Initializrなどのテンプレートを作成するために使用できます。
これらのテクノロジーを調べて、仕事に本当に必要なものを探してください。
- HTML5機能の使用例
- html5pleaseやCanIUseのようなものを使用すると、設計を改善するために使用できる標準の最新の変更を認識するのに役立ちます。
- また、大手市場のプレーヤーがクロスプラットフォームハイブリッドアプリケーションを構築するためのプラットフォームとしてHTML5をどのように使用しているかをご覧ください-Webだけでなく、デスクトップやモバイルデバイスでも。
- Google Chromeパッケージアプリケーション
- Firefox OS
6-最適化
開発中および終了時に行うすべてを最適化します。
- CSSおよびJavascriptコードを構造化し、強化します。
- ページのコード検査ツールを使用して、JavaScriptのパフォーマンスをテストします
- Google Chromeのスピードトレーサー
- イスロー
- 必要に応じて、ネットワークトラフィックを監視します。いつでも必要な場合があります。このためには、 Fiddlerなどのツールをお試しください
- Screenflyなどの便利なサービスを使用して、さまざまなフォームファクターのデバイスでWebページの表示を確認します
- Rippleなどのシミュレーターを使用して、モバイルデバイスでWebサイトの動作をテストします。
それだけです、私はヒントになりました。 あなたは座って読んで改善し始めることができます、私はあなたの成功を願っています。
Anoop MadhusudananによるWeb開発者の時代の変化-翻訳を生き抜くために読むべき6つのヒント