【評判】webpack 最速入門 〜実務でも利用できるフロントエンド開発環境を構築する方法を最短で学ぶ〜
-
-
本コースの特徴 -
受講生の声
講座情報
- ・講師名：shohei kadooka (soarflat)(詳しい経歴はこちら)
- ・作成日：2017-08-11
- ・レクチャー数：46
- ・週間：0記事
- ・月間：0記事
- ・年間：0記事
- ・全期間：19記事
レビュー数
レビュー数の推移
直近6か月以内に本講座のレビューに関して記載された記事はありません。
学習内容
webpackの基礎（webpackが何をするツールなのか、webpackの主要な機能や用語に関して）
webpack の様々な機能やプラグインなどを利用して開発環境を整える方法
webpackを利用して最適化したファイルを出力する方法
Babelとwebpackを連携して、JavaScriptのコードを様々なブラウザで動作するコードに変換する方法
コードの品質を保つためにESLintとPrettierとwebpackを連携して、JavaScriptのコードを検証、整形する方法
webpackでCSS（SassやPostCSSなど）を扱う方法
webpackで画像を扱う方法
詳細
webpack（v4.43.0）の基礎から応用までを学習し、実用に足るフロントエンド開発環境を構築できるようになるコースです。
## コースの特徴
webpack の基礎から応用までを短時間でしっかり学べます。
実用に足るフロントエンド開発環境をハンズオン形式で構築していくため、このコースで身につけた知識を実務でそのまま活用できます。
１つのレクチャーの時間は約5~6分（最長でも10分程度）です。そのため、学習の集中力を維持しやすいですし、レクチャーの復習もし易くなっています。
レクチャー毎のサンプルコードをダウンロード可能です。学習の助けになるコメント付きのサンプルコードも提供します。
また、このコース内に出てくる以下に関しては、全て詳細を解説をしています。
webpack の様々の機能を利用するためにインストールするパッケージ
設定ファイル
設定ファイルに追加する設定
そのため、受講者の方が以下のような状態に陥ることはありません。
なぜこのパッケージを利用するのかがわからない
この設定ファイルが、何のための設定ファイルなのかがわからない
設定ファイルに書かれている設定の内容がわからない
## コースの詳細
「コース概要」というプレビュー動画で、このコースの以下の点について説明をしていますので、まずはそちらをご覧ください。
このコースで構築する開発環境について（何ができる開発環境なのか）
コース構成（このコースの各セクションで学習すること）
サンプルコードについて
このコースが想定している前提知識や前提条件
このコースの注意点
また、上記以外のプレビュー動画も用意していますので、それらもご覧になってから受講をするかどうかの判断をしていただければと思います。
学べること
本コースを受講すると以下のことを学習できます。
- webpack（v4.43.0）の基礎から応用までを学習
- 実用に足るフロントエンド開発環境の構築
- webpackの機能を利用するためのパッケージのインストール
- 設定ファイルの理解と追加設定の実施
- 詳しい解説により、疑問や迷いの解消
本コースの特徴
本コースの特徴を単語単位でまとめました。以下の単語が気になる方は、ぜひ本講座の受講をオススメします。
強みと弱み(メリットとデメリット)
本コースの強みと弱みは、以下となります。
- 短時間で基礎から実践的な内容を学ぶことができる
- 配布されるコメント付きのコードが勉強になる
- 各回ごとに参考となるコードやドキュメントが提供される
- 説明が聞き取りやすく、一行ずつ丁寧に解説してもらえる
- 各用語やツールについて解説があり、理解が深まる
- typescriptのts-loaderの設定についての解説がない
- 構成図以外にもっと詳細な設定についての説明が欲しかった
- 最新の情報に対応していない可能性がある（例：eslintの変更に対応できていなかった）
- webpackとreactの機能の区別が分かりづらかった
- TypeScriptのts-loaderの設定や使用に関する解説が欲しかった
受講をオススメしたい方
以下のいずれかに当てはまる方には、本コースの受講を強くオススメします。
- JavaScript案件で活躍したい方
- Reactの機能とWebpackの機能の違いにモヤモヤを抱えている方
- 基礎から実践的な内容まで短時間で学びたい方
- コメント付きのコードを通じて学びたい方
- Webpackの基礎をしっかり理解したい方
受講者の感想
本講座を受講した皆さんの感想を以下にまとめます。
評価や口コミ
参考になる受講者の口コミやレビューを以下にまとめます。
良い点
- ● 短時間で基礎から実践的な内容まで学習でき、すごくいい講座だと思いますとても分かりやすかったです。
- ● 今までのwebpackをコピペで済ませていたものを理解することができてよかったです。
- ● 若干、わかんないところもあったけど、ざっくりと理解できたし、あとは実務にあたってWebpackの設定とかをのぞいてみて、理解していくのがいいのかなと思った。
レビューの一覧
・最近webpackを触って手こずったので整理した[2021-05-09に投稿]
・webpackをさっと学ぶ[2021-01-24に投稿]
・React の Context の更新による不要な再レンダリングを防ぐ 〜useContext を利用した時に発生する不要な再レンダリングを防ぐ方法に関して〜[2020-06-09に投稿]
・React.memo / useCallback / useMemo の使い方、使い所を理解してパフォーマンス最適化をする[2020-05-25に投稿]
・Babel 7でTypeScriptをトランスパイルしつつ型チェックをする 〜webpack 4 + Babel 7 + TypeScript + TypeScript EsLint + Prettierの開発環境を構築する〜[2019-04-10に投稿]
・Babel 7 の主な変更点まとめ[2018-12-26に投稿]
・webpackのTree Shakingを理解して不要なコードがバンドルされるのを防ぐ[2018-07-04に投稿]
・Redux 入門 〜Reduxの基礎を理解する〜[2018-05-11に投稿]
・webpack 4 の optimization.splitChunks の使い方、使い所 〜廃止された CommonsChunkPlugin から移行する〜[2018-03-16に投稿]
・Prettier 入門 ～ESLintとの違いを理解して併用する～[2018-02-22に投稿]
・Parcel 入門 ～Parcelはwebpackの代わりになるのか～[2017-12-10に投稿]
・async/await 入門（JavaScript）[2017-08-03に投稿]
・webpackのCommonsChunkPluginの使い方、使い所 （webpack 4で廃止）[2017-02-28に投稿]
・webpack 4 入門[2017-02-02に投稿]
・Webhookとは？[2016-12-17に投稿]
・ES2015(ES6) 入門[2016-12-15に投稿]
・CSSアニメーション 入門[2016-08-19に投稿]
・PATHを通すために環境変数の設定を理解する (Mac OS X)[2015-09-17に投稿]
・PATHを通すとは？ (Mac OS X)[2015-09-16に投稿]
他にオススメな関連講座のランキング
