モダンJavaScriptスタックチュートリアル、ゼロから始めるJavaScript生活へようこそ。
⚠️ ️ このチュートリアルのメジャーアップデート版を3月初旬に公開する予定です。ご期待下さい! より詳しく(英語).
これはJavaScriptスタックを使い始めるための最短最速のガイドです。このガイドは一般的なプログラミングの知識とJavaScriptの基礎を前提としています。これら全てのツールを一緒につなぎ合わせることにフォーカスしており、各ツールについて可能な限りシンプルな例を提供します。このチュートリアルは、独自のボイラープレートをゼロから準備するための方法として見ることもできます。
もちろん、ちょっとしたJSによるインタラクションを含むだけのシンプルなウェブページを作るのであれば、ここで紹介するスタックを全て使う必要はありません(ES6コードを複数のファイルに書いてCLIでコンパイルしたいのであれば、Browserify/Webpack + Babel + jQueryの組み合わせで十分です)。しかし、スケールするウェブアプリを構築するにあたってセットアップの手助けが必要であれば、このチュートリアルが重宝するでしょう。
このチュートリアルの目標はさまざまなツールを組み立てることにあるため、これらのツールの仕組みについて、それぞれの詳細については触れません。それらのより深い知識を習得したい場合、それぞれのドキュメントを参照するか、他のチュートリアルを探してください。
このチュートリアルで説明しているスタックはその大部分にReactを使用しています。もし初心者の方がReactについてのみ学びたいのであれば、create-react-appで設定済みのReact環境をすぐに試すことができます。例えばすでにReactを使っているチームに加わり、学習用playgroundでキャッチアップするということであれば、このようなアプローチをお勧めします。このチュートリアルでは、内部で何が行っているかをすべて理解してもらえるよう、既存の設定を使わないようにしています。
コード例は章ごとに利用できます。それぞれyarn && yarn start
またはnpm install && npm start
で実行できます。各章のステップバイステップの指示に従って全てゼロから入力することを推奨します。
すべての章には、それまでの章のコードが含まれています 。そのため、全てを含んだプロジェクトのボイラープレートを探しているのであれば、最終章をcloneすればそれで使えます。
注意: 章の順序は必ずしも最も教育的なものではありません。たとえば、テスティング/型検査はReactを導入する前に行うこともできます。しかしながら、章を移動させたり以前の章を修正するのは、以降の章を全て変更する必要があるため、かなり困難です。いったん状況が落ち着いてから、より良い方法のために配置を変更するかもしれません。
このチュートリアルのコードはLinux、macOS、Windows上で動作します。
1 - NodeとNPM、Yarn、そしてpackage.json
11 - MochaとChai、Sinonによるテスティング
本番/開発環境, Express, React Router, サーバサイドレンダリング, Styling, Enzyme, Gitフック。
- 中文 by @pd4d10
- Italiano by Fabrizio Bertone
- 日本語 by @takahashim
- Русский by React Theming
- ไทย by MicroBenz
翻訳を追加したい場合、translation recommendationsを読んでから始めてください!
- 英文の更新速度が早いので、英文に追従しやすくする
- 文の数と順番は維持する
- Markdownの記法は変更しない(一部改行を追加する)
- 日本語として読みやすくする
- 語順や節の順番は維持しない
you
は(「あなた」と)訳さない- 代名詞は適宜展開する
- 英単語と日本語の間の空白はトル
- 英単語の区切りにも
,
は使わず、
を使う :
はそのままにする
- テクニカルな用語については原文が透けて見える訳語にする
- 困ったらカタカナを使う
- もっと困ったらカッコ書きで原語も書く
Created by @verekia – verekia.com.
License: MIT