10年のツケを支払ったフロント界隈におけるJavaScript開発環境(2016年4月現在)。2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。Guide』という組み合わせが、いま僕の採用しているJavaScriptの環境です。React去年、一気に普及したReactは、今年に入っても絶好調です。2など、色々と騒がれていましたが、去年1年間で個人的に当面はReactに完全決着したと思っています。数年前は、jQueryが使えないとフロントの仕事は難しいと言われていましたが、これからはReactが使えないとフロントの仕事は難しいと言われることになるでしょう。Nativeによるモバイルアプリ開発も行えますので、今後ますます成長していきそうです。appsReactで本格的にアプリケーションを開発する場合はフレームワークが必要です。Reactの普及にともなって、Fluxや、Fluxxorなど様々なフレームワークが乱立しましたが、現在首位に立っているのは、Reduxだと感じています。僕も最初はFluxで開発していたのですが、その後、Reduxが登場し、評判が良いので全面書き換えを行ったのですが、その便利さがとても良く分かりました。actionなどの処理を結構地道に実装していく必要があったのですが、Reduxの場合、Fluxのときと比べて50%くらいのコード量で同じ機能を実装できました。始めてみるのが良いと思います。react-routerを選択しておけば、まず間違いないでしょう。リリースされたので、これから利用しはじめる場合は、そちらを利用しましょう。コンポーネントによって再現したフレームワークで、フロントアプリ開発が爆速になります。見た目とかそういうのではなく、とにかくHTMLとCSSを一切書かずに、用意されたコンポーネントをばんばん配置していくだけで、アプリケーションができていくため、UI設計に完全にフォーカスできるのが最大の利点だと思っています。ベースの方が楽なので乗り換えました。superagentのときと比べて、XHRまわりで悩まされなくなりました。ES2015(ES6)JSは書きにくい、という意見から、CoffeeScript、TypeScriptなどのAltJSを採用するプロジェクトも多くなりましたが、去年ES2015がリリースされたお陰で、本家へ原点回帰する流れができたような気がします。後述するBabelなどビルド環境が整ったお陰で、積極的にES2015の構文が利用できるようになった事も大きいのですが、実際にES2015を書いてみると、とても書き心地が良く、これが普及要因だと思っています。個人的には、これからJavaScriptを覚えたいという人は、最初からES2015で覚える方が良いでしょう。BUNDLERビルド環境についても、色々な動きがありました。トランスパイラは、BabelがReactをサポートしたことなどもあり、完全に一本化した感がありますが、ビルド処理は、Grunt、Gulp、Browserify、webpackなどのツールを、どの組み合わせで選択すれば良いのか、本当によく分かりませんでした。webpackに一本化する動きが広がってきており、僕もこの流れに乗っています。開発サーバーもwebpack-dev-serverを利用すれば、簡単に用意できるところも実にナイスです。{ES2015やReactを利用して開発するということは、大袈裟に言えば、必要となる構文知識が単純なJavaScriptの3倍になると言えます(大袈裟)。新しい構文、新しいライブラリを利用して開発するのであれば、新しい構文に早く慣れたいものです。Guideの組み合わせです。ESLintは、厳しめの構文チェッカで、設定が多いことでも有名でしたが、最近はプラグイン形式で第三者が作成した設定を簡単にインポートすることができるようになり、とても使いやすくなりました。Guideは、ES2015とReactの構文を、かなり前のめりでサポートするように設定されているため、警告に従って修正していれば、古いスタイルの記述が強制的にどんんどん新しくなっていき、速攻で新しい構文を学習できるため、とても助けられました。linter-eslintのプラグインを入れておくと良いでしょう。テストは...テストはまだどれが良いのか決まっていません。利用してみたりしていますが、Rubyもテストについては揺れていますので、一本化は難しいのかもしれません。まとめ去年1年はフロント回りの激しい流れに、多くの方が翻弄されたのではないかと思いますが、個人的には落ち着いてきたように見えてきました。学習コストは一気に跳ね上がりましたが、逆に言えば、Webの進化が激しい中、10年前からほぼ変っていなかったフロント回りの技術が、いよいよ時代に追い付かなければならなくなり、去年みたいな大変革が起きたと思えば、とても自然な流れと言えます。今後は、去年のような激しい変化は起きないと思いますので、フロント回りを静観しておられたかたは、ぜひ今年で一気に追い付くと良いでしょう。追記これからの時代を支えるエンジニアを育成する1年で最先端Webエンジニアになれる、サウスピーク光速Webエンジニアプラン【先着10名、5月末まで】という事業をやってみることにしました。興味のある方はぜひこちらもご欄ください。15:30フロント>サーバサイドも多少>5年後以降には将来はアプリ制作も考えたいと思っている者です。絶対的な答えはないので、沢山の方の意見が聞きたく質問しています。HTML5>CSS3>jQueryとやってきたのですが、その後どう学んでいくか迷っています。その後どうするかがわかりません。候補は下記ですが、・リアクト・メテオ・タイプスクリプト・jQueryはオワコンのようなので、JSその物でフロントを一年ほどやり、その後サーバサードをやる事になった時に、エクスプレスかメテオをやる。・jQueryはオワコンのようなので、JSその物でフロントを一年ほどやり、その後サーバサードをやる事になった時に、英語の読み書きをやってメテオをやる。リアクトはサーバサイドは出来ないようなので、いきなりメテオが出来れば一番合理的なのかなと思っていますが、重くて小中規模のサイトには向かないのと、本を買って学べば何とかなると思っていましたが、日本語の本もほとんどないという事なので数年は手が出せない物なのかなと思っています。リアクトをお勧めておられるので、サーバサイドのみ出来ないようですが、JSの基礎をやった後にすぐにリアクトを始め、その後サーバサードをやる事になった時に、エクスプレスかメテオをやるのが一番でしょうか?小中規模のサイト制作を請けるフリーランスか小規模企業での仕事を考えています。それでは、今後も勉強になる記事を楽しみにしています。@_tanakaworld日々、とんは語る。日本のWebエンジニアの大半が、変化に対応し...日々、とんは語る。1983年生まれの男。有言は3年遅れでも実行がモットー。