강의

멘토링

로드맵

Inflearn brand logo image
BEST
Programming

/

Front-end

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

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

  • captain
3시간 만에 완강할 수 있는 강의 ⏰
Webpack

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

こんなことが学べます

  • フロントエンド

  • Webpack

  • NPM

  • フロントエンド構築システム

  • ES6 Import と Export 文法

日々複雑になるフロントエンド開発エコシステムで
NPMとWebpackをすばやく学びます✨

フロントエンドビルドシステムの中核、
NPMとWebpack ✌

実務者や入門者にとって最も難しいと言われるNPMとWebpackを知ってこそ、自分でプロジェクトを整理できます。モダンなフロントエンド開発プロジェクトを構成する際に、必要な2つの概念をすばやく簡単に学びましょう。

ますます多くの企業が最新のフロントエンドフレームワークを使用しており、この中心にはNPMとWebpackを利用したフロントエンドビルドシステムがあるのです。多くの企業がこのビルドシステムを正確に理解し、自分で構築できる開発者を探しているので、この講義を通じて差別化されたフロントエンド開発者になることができるでしょう。

この講義だけの特徴✏️

  • NPMとWebパックをどこでも学び、学ぶことができるように、 Webサイトで制作された教案を提供します。
    (講義教案はPWAで製作されており、モバイルでも設置後楽にご覧いただけます。)
  • 会社で時間を追って早く学習しなければならない実務者の方、ウェブパックに初めて接する方の皆が満足できるように理論​​の説明は短く、実習は簡単ながらも細かく製作しました。


講義で扱うツール🔨

  1. VSCode
  2. Node.js LTSバージョン(v10以降)
  3. NPM
  4. Git

授業ではVSCodeに進みますが、好みの開発ツールがあればそれを使っても構いません。


予想されるQnA
🙋🏻‍♂️

Q.ビルドシステム、モジュール、バンドルなどの用語を知らないのですが、私は聞くことができますか?

バンドルとは、複数のファイルを1つにまとめるもので、ビルドシステムとは、自分が作成したアプリケーションをユーザーに配布できる形式に変換する方式を意味します。難しいかもしれない用語を非専攻者、入門者の観点から親切に解いて説明をしていますので心配しないで楽に聞いてください。
進行中に詰まっている部分と理解できない部分は、質問掲示板に残していただければ詳しく、親切にお答えします:)

Q.この講義だけの特別な利点がありますか?

この講義は、できるだけ簡単に理論を説明し、まさに実習を共にして学んだ理論を自ら理解する講座です。冗長な説明ではなく、短く簡潔な説明で素早く知識を伝えた後、実習中心に概念を正確に学ぶようにします。今すぐ始めましょうか?

Q. この講義を始めるきっかけがありますか?

3年前からウェブパックオフライン講座を行ってきました。この講座は、500人を超えるオフライン受講生のフィードバックと入門者の観点から新たに構成した講座です。 Webパックの設定とフロントエンドビルドシステムがこれ以上難しく感じられないようにお手伝いします!


関連ロードマップ🚎

Vue.jsで完成するフロントエンド開発者ロードマップ
キャプテン板橋様の簡単に取り扱え、生産的なVue.jsを通じて
実務ウェブ開発に挑戦できるように構成されたロードマップです。
この講義を含む


知識共有者の紹介👨‍🏫

チャン・ギヒョ(キャプテン板橋)

「Inflearnが出会った人」インタビュー

「講義収益でVue.jsオープンソース+
ライフコーディングを後援します😁」

講義割引を提供します!

シリーズ「Vue.jsで完成するフロントエンド
開発者ロードマップ" 25% 割引(クリック)

収入のない中・高校生、
大学生のための学生の50%割引(クリック)

こんな方に
おすすめです

学習対象は
誰でしょう?

  • NPM が何なのかわからないが、フロントエンド フレームワークを使用する必要がある開発者

  • フロントエンド開発入門者

  • パブリッシャー

  • ジュニア フロントエンド開発者

  • WebPack を試したことがないフロントエンド開発者

  • フロントエンド ビルド システムに興味のある人

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

  • HTML

  • CSS

  • Javascript

こんにちは
です。

48,096

受講生

4,668

受講レビュー

3,812

回答

4.9

講座評価

17

講座

인프런에서 8년째 지식을 공유하고 있습니다. 🏠 기술블로그, 📣 트위터, 💻 깃헙

📗 Do it! Vue.js 입문, 쉽게 시작하는 타입스크립트, 나는 네이버 프런트엔드 개발자입니다. 책 3권 집필
📖 Cracking Vue.js, 타입스크립트 핸드북, 웹팩 핸드북. 온라인 무료 가이드북 3권 집필
👨‍💻 캡틴판교의 프론트엔드 개발 유튜브 채널 운영 - 취준생, 주니어 개발자들의 고민을 들을 수 있는 곳
🥤 캡틴판교의 카카오톡 오픈 채팅방 운영 - 프런트엔드 개발 최신 정보와 업계 동료들의 생각과 고민을 들을 수 있는 곳

カリキュラム

全体

64件 ∙ (3時間 27分)

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

受講レビュー

全体

338件

4.9

338件の受講レビュー

  • windtail16님의 프로필 이미지
    windtail16

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    I've been eating kimchi made by others my whole life, but now I've learned how to make kimchi. Thank you.

    • a010414011600372님의 프로필 이미지
      a010414011600372

      受講レビュー 9

      平均評価 4.8

      3

      63% 受講後に作成

      There are so many 2-minute lectures, so it feels like they start by explaining the course, then go into the main topic, and then summarize the content at the end, so it feels like a waste of time. I think it would be better if the lectures were 5-7 minutes long.

      • halphas0951님의 프로필 이미지
        halphas0951

        受講レビュー 2

        平均評価 5.0

        5

        98% 受講後に作成

        This lecture is the real deal. Usually, front-end beginners (newbies) don't have much understanding of the development environment itself (including me). After watching this lecture, I thought, "Oh, this is it," "This is how it was, so I should look at this next time," "If I want to do it, I should modify this," etc. It is very helpful for building basic and overall flow and knowledge about the front-end development environment. Although you already share information for free on your blog, it is much better to acquire knowledge through this lecture. (For reference, I am taking Captain Pangyo's lecture for the fourth time. ==> I emphasize this as the opinion of a real student.)

        • captain
          知識共有者

          I am deeply touched because you said it was a real lecture.. Thank you so much for the real class review, halphas :) We will continue to update the webpack documentation in the future, so please come visit often~! :)

      • ybebee92274님의 프로필 이미지
        ybebee92274

        受講レビュー 3

        平均評価 4.7

        4

        100% 受講後に作成

        The lectures were faster than other lectures, so I had to go back and rewind and repeat them. ㅠ.ㅠ It felt more hectic than other Vue lectures. ㅠㅠ However, the lecture content was good for quickly understanding the concepts of webpack!

        • dhkdndksk2082님의 프로필 이미지
          dhkdndksk2082

          受講レビュー 1

          平均評価 4.0

          4

          100% 受講後に作成

          It's a shame that the explanation about Babel is too short, but I think it was a good lecture.

          ¥4,020

          captainの他の講座

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