강의

N
챌린지

멘토링

N
클립

로드맵

Programming

/

Front-end

フロントエンドウィング：Vue、Reactを学ぶ前に必ず知っておくべき知識

この講義を通じて、Webpack、NPMなどのフロントエンド開発者になる前に必ず知っておくべき知識をしっかりと固めることができます。

（4.9）受講レビュー 397件

受講生 8,248名

難易度 初級

受講期間 無制限

Webpack
Webpack
Webpack
Webpack
Thumbnail

学習した受講者のレビュー

4.9

5.0

상은쓰

100% 受講後に作成

ジムコーディング様の講義を聞いて感心するたびに額を打ったところ、カメの木が完治しました。 正しい姿勢で次の講義も引き裂きに行きます。

5.0

때구니

100% 受講後に作成

＆quot;フロントエンド - 翼の取り付け＆quot;という教育名を "ロケット乗り飛び"に変えなければならないようです。フロントエンド開発のために様々な常識、原理、環境などについてとてもよく学びました。 言葉で表現できない大韓民国最高のフロントエンド選手講義です。 ありがとうございました。私は後続の講義であるVue.js3完璧マスター＆quot;基本編＆quot;に直進します。~~

5.0

현정이

100% 受講後に作成

混乱していた部分を理解しやすく説明してくれます

受講後に得られること

  • Webpackとは何かがわかります。

  • NPMとは何かがわかります。

  • Web技術の全体的な理解

バックグラウンド知識をしっかり知っておく必要があり、
本物のフロントエンド開発者になることができます😁

フロントエンド翼の取り付け✈

フロントエンド開発をしており、多くの方がWebpack、NPM、モジュールシステムなどについて確実に理解できていないと感じました。
現在、多くの講座がVuejs、React、Angularなど、そのフレームワークのテーマで講義を扱っていますが、フロントエンド開発者になるためのBackgroundの知識はあまりありませんでした。
だから準備することになった「フロントエンドの翼」の講義です。簡単な説明で準備した講義なので、たくさん助けてほしいです。 🙂

「聞いた説明の中で最もきれいで、核心だけをつかむ説明でした」
 -APIとは何か-

「丁寧に入ったシンプルですが、とてもお得な講義でした。ありがとうございます。」
-Webpackの基礎-

「講義をよく見ました。初心者の私の基準で、本当に親切で理解しやすい内容でした。
NPM関連の内容が気になりましたが、探してみると、このような有用な映像があったとは知りませんでした」
-NPM基礎-


講義で学ぶ内容🎉

この講座はフロントエンドの開発者になるための選手知識で、Vuejs、React、Angularなどのフレームワークを学ぶ前にぜひご覧ください。以下を含むフロントエンド開発者のためのさまざまな知識を共有します。

  • DOM/BOM
  • API
  • 同期/非同期
  • モジュールシステム
  • NPM
  • Webpack
  • モジュールシステム

こんな方なら注目👀

import、exportなど
何か分からない方

JavaScriptモジュールシステム
について理解したい方

NPMとWebpackの
核心概念を学びたい方

知識共有者を紹介します✒️

実用的なコーディングコンテンツを作っていくYouTube のジムコーディングチャンネルです。
YouTube | フェッヘット​Gymスターグラム| Codingスターグラム

こんな方に
おすすめです

学習対象は
誰でしょう？

  • import、export、npmが何であるかを正確に知らない人

  • React、Vue、Angularを学ぶ前にぜひ！このコースを受講してください！

  • フロントエンド開発者になろうとする方

前提知識、
必要でしょうか？

  • HTML、CSS、JavaScriptの基本

こんにちは
gymcodingです。

インフラン認証

キャリア認証

38,444

受講生

3,123

受講レビュー

1,784

回答

4.9

講座評価

18

講座

こんにちは！ 👋
コーディング教育クリエイターのジムコーディングです 😊

非開発者の方でもついてこられるよう、最大限分かりやすく、そして実務者の方も満足できるよう深く教えます。
フルスタック開発歴15年で、現在はYouTubeやInflearnでプログラミング・AIの知識を共有しています。With 15 years of experience as a full-stack developer, I am currently sharing programming and AI knowledge on YouTube and Inflearn.Với 15 năm kinh nghiệm phát triển Full-stack, hiện tại tôi đang chia sẻ kiến thức về lập trình và AI trên YouTube và Inflearn.

KT・起亜などの大企業サービス開発から、Cafe24のEコマースプラットフォーム、スマートシティIoTデータプラットフォーム、そして教育会社を運営しながら自ら作り上げた自社サービスまで、フロントエンド・バックエンド・AWSインフラのすべてを直接設計し、構築してきました。

これまでに積み上げてきた開発経験を、今は分かち合うことに注いでいます。
AI時代に不可欠な知識を、分かりやすく深くお伝えします。

🏆 検証された成果

🥇 インフラン 2026 クロード・コード講義 BEST 1

🏆 インフラン Awards 2025 ベストセラー選定

🔥 インフラン 2025 '今最もホットな講義' - Claude Code

🎬 YouTube チャンネル登録者数 5万人以上 · 累計再生回数 360万回以上

👨‍💻 経歴

  • 15年目のフルスタックエンジニア・現職IT企業代表

  • フロントエンド: React · Vue · TypeScript

  • バックエンド: Node.js · Java · Spring · Python

  • インフラ: AWS · Serverless · Lambda アーキテクチャ設計

  • Inflearn 知識共有者

     

スタートアップ（起業家）

  • 特許・商標の出願・登録経験

  • 政府の創業支援事業に多数選定（スマートベンチャーキャンパス「最優秀」など）

企業教育 (B2B)

  • マルチキャンパス - 企業実務者向け 'Claude Code' オフライン教育

  • 新韓カード開発者教育 - マルチキャンパス主管、オンラインライブ

  • 韓国ソフトウェア人材開発院 特講・官公庁 ITメンター

🙋‍♂️ もっと見る

もっと見る

カリキュラム

全体

17件 ∙ (3時間 15分)

講座掲載日: 
最終更新日: 

受講レビュー

全体

397件

4.9

397件の受講レビュー

  • one95563851님의 프로필 이미지
    one95563851

    受講レビュー 2

    ∙

    平均評価 5.0

    5

    100% 受講後に作成

    混乱していた部分を理解しやすく説明してくれます

    • maddux님의 프로필 이미지
      maddux

      受講レビュー 11

      ∙

      平均評価 5.0

      5

      100% 受講後に作成

      基礎知識を身につけるのに役立ちました。

      • gymcoding
        知識共有者

        ありがとうございます~! 👍

    • sanggusseu2599님의 프로필 이미지
      sanggusseu2599

      受講レビュー 7

      ∙

      平均評価 5.0

      5

      100% 受講後に作成

      ジムコーディング様の講義を聞いて感心するたびに額を打ったところ、カメの木が完治しました。 正しい姿勢で次の講義も引き裂きに行きます。

      • gymcoding
        知識共有者

        うわー！亀の治療まで！ 😂 私の講義を見つけてくれてありがとう！ 👍 ファイティング💪

    • taegeunkim2252님의 프로필 이미지
      taegeunkim2252

      受講レビュー 25

      ∙

      平均評価 5.0

      5

      100% 受講後に作成

      ＆quot;フロントエンド - 翼の取り付け＆quot;という教育名を "ロケット乗り飛び"に変えなければならないようです。フロントエンド開発のために様々な常識、原理、環境などについてとてもよく学びました。 言葉で表現できない大韓民国最高のフロントエンド選手講義です。 ありがとうございました。私は後続の講義であるVue.js3完璧マスター＆quot;基本編＆quot;に直進します。~~

      • gymcoding
        知識共有者

        良い言葉ありがとうございます〜！ 🙂🎉

    • lwo939842님의 프로필 이미지
      lwo939842

      受講レビュー 4

      ∙

      平均評価 5.0

      5

      35% 受講後に作成

      • gymcoding
        知識共有者

        ありがとうございます~! 👍

    gymcodingの他の講座

    知識共有者の他の講座を見てみましょう！

    Claude Code 完全マスター：AI開発ワークフローの基礎から実践まで

    gymcoding

    探索 → 計画 → 実装 → コミット。検証済みのAI開発ワークフローをClaude Codeでマスターしましょう。 MCP、サブエージェント、プロンプトエンジニアリングまで、23のミッションで学び、3つの実践プロジェクトを完成させます。

    入門

    入門

    React, AI, claude

    Claude Code 完全マスター：AI開発ワークフローの基礎から実践まで

    gymcoding

    入門者のための、HTML&CSS ウェブ開発入門講義サムネイル

    入門者のための、HTML&CSS ウェブ開発入門

    gymcoding

    HTMLとCSSを学ぶことで、ウェブサイトの制作に必要な基本的な知識を学ぶことができます。コーディングに初めて触れる際に恐れがないように、本当に分かりやすく説明した講義です。

    入門

    入門

    HTML/CSS

    入門者のための、HTML&CSS ウェブ開発入門講義サムネイル

    入門者のための、HTML&CSS ウェブ開発入門

    gymcoding

    React を完全にマスター: 基本概念から Lean Canvas プロジェクトまで講義サムネイル

    React を完全にマスター: 基本概念から Lean Canvas プロジェクトまで

    gymcoding

    React を初めて学習しますか? この講座で React の基礎を学び、LinCanvas プロジェクトを通じて実務経験を積んでください。そうすれば、自信を持ってフロントエンド開発者として就職できます!

    初級

    初級

    React, react-query, react-router

    React を完全にマスター: 基本概念から Lean Canvas プロジェクトまで講義サムネイル

    React を完全にマスター: 基本概念から Lean Canvas プロジェクトまで

    gymcoding

    クエサー（Quasar）完璧マスター：Vueフロントウェブをすばやく作成したい場合（Based Vue3）講義サムネイル

    クエサー（Quasar）完璧マスター：Vueフロントウェブをすばやく作成したい場合（Based Vue3）

    gymcoding

    Vue.jsでウェブ開発を行い、クエサー（Quasar）を利用したい方のための講義です。社内でフロントウェブをすばやく構築する必要がある方、または自分だけの素敵なUIを作成しなければならない方ですか？このレッスンを通じて簡単かつ迅速にフロントウェブを作成できます。

    初級

    初級

    Quasar, Vue.js

    クエサー（Quasar）完璧マスター：Vueフロントウェブをすばやく作成したい場合（Based Vue3）講義サムネイル

    クエサー（Quasar）完璧マスター：Vueフロントウェブをすばやく作成したい場合（Based Vue3）

    gymcoding

    TailwindCSS を完全にマスター: ポートフォリオから管理まで!講義サムネイル

    TailwindCSS を完全にマスター: ポートフォリオから管理まで!

    gymcoding

    1つの講義でTailwindCSSの入門から実践までを完了! 2つのプロジェクトでレイアウト構成からレスポンシブデザイン、ダークモードまで完璧に学んでください。

    初級

    初級

    HTML/CSS, TailwindCSS, JavaScript

    TailwindCSS を完全にマスター: ポートフォリオから管理まで!講義サムネイル

    TailwindCSS を完全にマスター: ポートフォリオから管理まで!

    gymcoding

    Vue3パーフェクトマスター：基礎から本番まで - 「本編」講義サムネイル

    Vue3パーフェクトマスター：基礎から本番まで - 「本編」

    gymcoding

    Vue.js 3で本番プロジェクトを開発し、Composition APIの使い方を理解しています。さらに、このコースを受講すると、「Vue Router v4」と「Pinia」、「Boostrap」のスキルを取得できます。

    初級

    初級

    Vue.js

    Vue3パーフェクトマスター：基礎から本番まで - 「本編」講義サムネイル

    Vue3パーフェクトマスター：基礎から本番まで - 「本編」

    gymcoding

    Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)講義サムネイル

    Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)

    gymcoding

    最新のNext.js v15 App Routerを学習しながら、Notion基盤の実用的な開発者ブログを一緒に構築する講義です。さらにCursor AI活用法など様々なインサイトも得ることができます。

    初級

    初級

    React, Blog, Next.js

    Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)講義サムネイル

    Next.js完璧マスター (v15): Notion基盤開発者ブログ作り (with CursorAI)

    gymcoding

    非同期プログラミング: Promise、async/await を徹底的に理解する講義サムネイル

    非同期プログラミング: Promise、async/await を徹底的に理解する

    gymcoding

    この講義では、JavaScript 非同期プログラミングにおける Promise と async/await の概念と動作原理を明確に説明し、実務で非同期処理を熟練して扱うことができるように支援します。

    初級

    初級

    promise, async-await, asynchronous-programming

    非同期プログラミング: Promise、async/await を徹底的に理解する講義サムネイル

    非同期プログラミング: Promise、async/await を徹底的に理解する

    gymcoding

    入門者のための、ES6+の最新のJavaScript入門講義サムネイル

    入門者のための、ES6+の最新のJavaScript入門

    gymcoding

    周辺でコーディングを初めて始める方々をたくさん見ました。 キャリアの方はJavaScriptが簡単だと言いますが、初めて接する方は難しく感じるしかありません。 だから今回の講義はコーディングに入門される王初歩の方々のために簡単！ちょっと！内容を用意しました。 💪🙂

    初級

    初級

    JavaScript, ES6

    入門者のための、ES6+の最新のJavaScript入門講義サムネイル

    入門者のための、ES6+の最新のJavaScript入門

    gymcoding

    最新のVue 3完全ガイド：プロジェクト設定＆仕様総定理講義サムネイル

    最新のVue 3完全ガイド：プロジェクト設定＆仕様総定理

    gymcoding

    "Vue 3 完全マスター" 後続の講義で最新の Vue 3 バージョンのプロジェクト設定と最新のスペックを習得する講義です。

    初級

    初級

    Vue.js, Vue 3, TailwindCSS

    最新のVue 3完全ガイド：プロジェクト設定＆仕様総定理講義サムネイル

    最新のVue 3完全ガイド：プロジェクト設定＆仕様総定理

    gymcoding

    ポートフォリオ サイトを作成して公開まで！: Web 開発入門活用編講義サムネイル

    ポートフォリオ サイトを作成して公開まで！: Web 開発入門活用編

    gymcoding

    HTML&CSS、JavaScript を学んだら、それらを利用して自分でポートフォリオ サイトを作成し、公開してみましょう。実際に使ってみると、私たちのスキルを向上させるのに大いに役立ちます。

    入門

    入門

    HTML/CSS, JavaScript, github-pages

    ポートフォリオ サイトを作成して公開まで！: Web 開発入門活用編講義サムネイル

    ポートフォリオ サイトを作成して公開まで！: Web 開発入門活用編

    gymcoding

    [最新]Vue川の終わりの王：Nuxt 3完璧マスター講義サムネイル

    [最新]Vue川の終わりの王：Nuxt 3完璧マスター

    gymcoding

    Vueベースでパフォーマンスに優れたWebをすばやく作成するのに役立つNuxtフレームワーク講義です。

    中級以上

    中級以上

    Vue.js, Nuxt.js, pinia

    [最新]Vue川の終わりの王：Nuxt 3完璧マスター講義サムネイル

    [最新]Vue川の終わりの王：Nuxt 3完璧マスター

    gymcoding

    Vue 3 & Firebase 10 コミュニティ作成フルスタック - 「活用編」 (with Pinia、Quasar、Tiptap、VueUse)講義サムネイル

    Vue 3 & Firebase 10 コミュニティ作成フルスタック - 「活用編」 (with Pinia、Quasar、Tiptap、VueUse)

    gymcoding

    Vue3＆amp; Firebase(v10)を活用してコミュニティを作る講義でVue3実践活用法、Firebase基礎から実戦、最新のWeb技術活用法、知識共有者経験共有など多様な方面で開発者として一段階成長できるようにします！

    中級以上

    中級以上

    Vue.js, Firebase, Quasar

    Vue 3 & Firebase 10 コミュニティ作成フルスタック - 「活用編」 (with Pinia、Quasar、Tiptap、VueUse)講義サムネイル

    Vue 3 & Firebase 10 コミュニティ作成フルスタック - 「活用編」 (with Pinia、Quasar、Tiptap、VueUse)

    gymcoding

    Vue3完全マスター：基礎から実践まで - 「基本編」講義サムネイル

    Vue3完全マスター：基礎から実践まで - 「基本編」

    gymcoding

    Vue.js 3でウェブ開発ができるよう、公式ドキュメントに基づいてVue 3の仕様を詳しく、かつ深く掘り下げて解説します。

    初級

    初級

    Vue.js

    Vue3完全マスター：基礎から実践まで - 「基本編」講義サムネイル

    Vue3完全マスター：基礎から実践まで - 「基本編」

    gymcoding

    Vuetify Admin Templateを作成する - 本番編 (Based Vue2)講義サムネイル

    Vuetify Admin Templateを作成する - 本番編 (Based Vue2)

    gymcoding

    Vue&Vuetifyで実務で開発されている人のための便利なヒント！ 😃

    初級

    初級

    Vue.js, Vuetify

    Vuetify Admin Templateを作成する - 本番編 (Based Vue2)講義サムネイル

    Vuetify Admin Templateを作成する - 本番編 (Based Vue2)

    gymcoding

    Vuetify Admin Templateの作成 - 基本編 (Based Vue2)講義サムネイル

    Vuetify Admin Templateの作成 - 基本編 (Based Vue2)

    gymcoding

    Vuetifyの基礎を学び、素晴らしいMaterial Design Adminのウェブサイトを作成することができます😃

    初級

    初級

    Vue.js, Vuetify

    Vuetify Admin Templateの作成 - 基本編 (Based Vue2)講義サムネイル

    Vuetify Admin Templateの作成 - 基本編 (Based Vue2)

    gymcoding

    似ている講座

    同じ分野の他の講座を見てみましょう！

    フロントエンド開発環境の理解と実践 (webpack, babel, eslint..)講義サムネイル

    フロントエンド開発環境の理解と実践 (webpack, babel, eslint..)

    jeonghwan

    すでに構築済みの開発環境を理解できます。 最初から自分で開発環境を構築できます。

    中級以上

    中級以上

    Node.js, Webpack, Babel

    フロントエンド開発環境の理解と実践 (webpack, babel, eslint..)講義サムネイル

    フロントエンド開発環境の理解と実践 (webpack, babel, eslint..)

    jeonghwan

    フロントエンド開発者のためのWebpack講義サムネイル

    フロントエンド開発者のためのWebpack

    captain

    1000人が選んだWebpack講座！新しくリリースされたWebpackバージョンに合わせてリニューアルされた講座です。実習中心でより簡単にWebpackを学んでみましょう :)

    初級

    初級

    Webpack

    フロントエンド開発者のためのWebpack講義サムネイル

    フロントエンド開発者のためのWebpack

    captain

    無料