강의

멘토링

커뮤니티

Programming

/

Front-end

AIと一緒に学ぶNext.js

複雑なNext.jsの複数の概念を短時間で核心だけ学ぶことができます。Next.jsを初めて学ぶ方のための実務必須知識だけお教えします。フレームワーク講義だけで8年目を迎えるキャプテンパンギョのNext.js新規講義。「AI時代のフロントエンド開発者」のコーディングと学習方法を学ぶことができます!😊

  • captain
실습 중심
AI 코딩
next.js
react
cursor
JavaScript
React
Next.js
AI

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

受講後に得られること

  • 最新Next.jsの必須概念 - SSR、Hydration、サーバー/クライアントコンポーネント、キャッシングなど

  • AI ツールでWebアプリケーションを素早く作る方法

  • Next.jsフォルダ/ファイル構造化とコンポーネント設計方法

  • Next.jsを使用する際に必ず知っておくべき実務のコツ

  • Next.jsの様々なレンダリング方式と内部動作原理

最近のようなAI時代にNext.jsはどのように学ぶべきでしょうか?

"Reactは使ったことがあるけど、Next.jsはどう使えばいいのかよく分からないです 🤔"
"求人情報を見ると応募資格にNext.jsが多いけど、必ず知っておかなければならないものでしょうか? 😒"
"Next.jsでポートフォリオを作りたいけど、どうすればいいのか分からないです 😢"

最近、大学生、就職準備生、実務開発者の方々をメンタリングしながら共通して聞いた話です。就職も簡単ではなく、AIが私たち開発者を代替するという見通しが多いのですが、本当にそうなるのでしょうか?

AI ツールでフロントエンド開発チームの速度を2倍にする - 2025年ネイバーフロントエンド開発者ミートアップ

企業では依然として正確な技術知識と基礎力を備えた開発者を必要としています。AIツールを使う場合でも、曖昧に知っている人より正確に理解している人が作り出した成果物の品質がより優秀ですね。

"AI時代のFE開発者はどのような役割を果たすべきか? - 2025年FEConf開発リーダーパネルトーク"

この講義ではAI時代にフロントエンド開発者として何に集中すべきか、どのような技術を磨くべきかを明確に整理します。プロジェクトを一つ作成してデプロイまで行いながら、実務で必ず知っておくべき概念だけを素早く学ぶことができます。

この講義の特徴

📌 フレームワーク講義だけで8年目。現役フロントエンド開発者による体系的で面白いNext.jsカリキュラム

📌 バックエンドREST APIを直接呼び出しながら実際の実務環境と類似した状況を事前に体験してみます。

📌 理論30% 実習70%の比率。実装とエラーデバッグ中心の講義。作りながら学ぶのが一番頭に残りますからね。

📌 NPM、Node.js、ES6+、Gitなどの関連知識について、無料講義と詳細な資料をすべて提供します。

📌AIツールを活用して学習時間を短縮し、必要不可欠な内容に集中しましょう。

인프런 교안

講義を聞いている最中も、そして講義を聞いた後も移動しながら気軽に見ることができるウェブ教材が提供されます😄

こんな方におすすめです

Next.jsを早く学ばなければなりません

Next.jsでプロジェクトを進める必要があるのに、一度も使ったことがありません。公式ドキュメントを全部見るには時間が足りないと感じている実務者

フロントエンド開発者として
就職したいです

企業が求める新人開発者のレベルはどの程度でしょうか?実務で必ず必要な能力が気になる
就職準備生

AIツールはどのように使うべきでしょうか?

フロントエンド開発者はAIツールをどのように使うべきでしょうか?大企業の実務ではAIツールをどのように使っているのか気になるジュニア開発者

受講後には

  • Next.jsでReactウェブアプリケーションを作成してデプロイすることに恐れはありません。

  • AIツールを活用して素早くWebサービスを作成し、改良することが得意です。

  • SSR、Hydration、Server Component、Client Component、RSC Payloadなど複雑な概念を簡単に説明できます。

  • 実務プロジェクトのフォルダ構造を構成する方法とコンポーネント設計方法を知ることができました。

  • 面接で堂々と話せる就職ポートフォリオが一つできました。

こんな内容を学びます。

AIツールをフロントエンド開発に活用する方法

Next.jsのルーティング技法と内蔵コンポーネント

Next.jsの実務プロジェクトフォルダ/ファイル構造化方法

RSC、RCC、SSR、Hydration、レンダリングなどの高度な概念

この講義を作った人 👨‍💻

장기효 (캡틴판교)

受講前の参考事項

実習環境

  • 講義はMacOS基準で説明します。Windowsユーザーに必要なプログラムもすべてご案内します。

  • 開発ツールとしてCursorを使用します。VSCodeユーザーの方も講義を受講するのに問題ないと思います😄

学習資料

  • いつでもどこでも気軽に見ることができるNext.js教材を提供します。

  • 実務でよく使われるNext.js Page Router講座無料で提供しています。

  • JavaScript、NPM、Node.js、ES6+などの周辺知識はすべて無料講義とKind文書で提供します :)

前提知識および注意事項

  • JavaScriptの基本文法(変数、関数など)を知っていると良いです - JavaScript無料講義

  • Reactの基礎知識(jsx、コンポーネント、props)を知っていると良いです。- React基礎講座

  • その他の高度な知識はすべて講義で説明いたします😎

  • AIだけでNext.jsを学ぶ講座ではありません。技術を学ぶ際に実務者の観点からAIを活用する方法を学ぶことができます。

캡틴 판교

こんな方に
おすすめです

学習対象は
誰でしょう?

  • 最新のNext.jsを最大限早く学んで何かを作ってみたいウェブ開発者

  • 実務でどのようにAIツールを使用するのか気になるジュニア開発者

  • Next.jsで実務プロジェクトを進めなければならないフロントエンド/バックエンド開発者

  • ReactはやったことがあるけどNext.jsは一度もやったことがないフロントエンド開発者

  • フロントエンド採用公告の必須資格要件を身につけたい就職準備生

  • 実務サービス開発経験が気になる就職準備生

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

  • JavaScript

  • React

こんにちは
です。

48,882

受講生

4,775

受講レビュー

3,815

回答

4.9

講座評価

19

講座

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

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

カリキュラム

全体

64件 ∙ (7時間 53分)

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

受講レビュー

全体

14件

4.9

14件の受講レビュー

  • lsm66275394님의 프로필 이미지
    lsm66275394

    受講レビュー 1

    平均評価 5.0

    修正済み

    5

    100% 受講後に作成

    AIをツールとして活用した講義で、素早くプロジェクトの流れに沿ってNext.jsの核心を身につけるのに非常に効率的です。各講義は必ず知っておくべき概念中心にまとめられているため全体的な構造を把握しやすく、講義の長さとテンポがよく調整されているため負担なく消化でき、説明も要点を簡潔に指摘してくれるため初心者でも理解しやすかったです。

    • 9sujeongdev2345님의 프로필 이미지
      9sujeongdev2345

      受講レビュー 1

      平均評価 5.0

      5

      31% 受講後に作成

      キャプパンさんはやはり発音もとても良くて、説明も充実していて素晴らしいです!一緒にデバッグしてみたり、細かいエラー処理のような部分は実際誰に聞けばいいかも曖昧な部分なのに、今まさに始めたばかりのビギナーの方々にとてもためになる講義です!

      • sungjiny2193님의 프로필 이미지
        sungjiny2193

        受講レビュー 1

        平均評価 5.0

        5

        31% 受講後に作成

        聞き取りやすくてとても良いですね。そして多くのことを一度に教えるよりも、ゆっくりとビルドアップするように段階的に学べるのがとても良いです。

        • captain
          知識共有者

          おお、私が意図していたことをよく指摘してくださってありがとうございます、ソンジンさん😊 後続コンテンツもご期待ください!

      • xogml77343811님의 프로필 이미지
        xogml77343811

        受講レビュー 2

        平均評価 5.0

        5

        31% 受講後に作成

        • goodmorningcody8228님의 프로필 이미지
          goodmorningcody8228

          受講レビュー 10

          平均評価 4.9

          5

          25% 受講後に作成

          単純にNext.jsを教えてくださることにとどまらず、AIツールを活用してこのように学習できるということを見せてくれる良い講義です。さらにNext.js入門講義のクーポンまでくださるので、この講義を素早く完走した後、もう少し詳しく見ることができて良いですね。

          • captain
            知識共有者

            カカオトークルームまで入ってきて受講レビューを残してくださったのが感動でした、Codyさん。ありがとうございます!! :)

        ¥5,470

        captainの他の講座

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

        似ている講座

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