강의

멘토링

로드맵

Inflearn brand logo image
BEST
Programming

/

Front-end

Next.js の開始

React を始める際に必ず知っておくべき Next.js フレームワーク。初心者向けに簡単に説明し、実務者が満足するほど詳細な動作原理を理解します。Next.js を一気に解決します。

  • captain
next
캡틴판교
Next.js
React
JavaScript

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

こんなことが学べます

  • Next.js 14(最新バージョン)

  • Next.js 実務プロジェクト フォルダ構造

  • Next と React コンポーネントの設計

  • Next.js 実務コーディングのヒント

  • React

  • JavaScript

  • NPM

  • REST API

  • ネットワークと HTTP プロトコル

  • パフォーマンスの最適化

Next.jsをたくさん書いていますが、どのように学ぶべきですか

Reactプロジェクトを開始するためにほぼ0位に選ばれるNext.jsフレームワーク。

開発方法が自由なReactにルールを加え、開発者が取り組むべきルーティングとパフォーマンスなどを知ってくれるNext.jsフレームワーク


長年にわたって入門者の観点から、難しい技術を簡単に説明してきたキャプテン版教が今回はNext.jsを公開します。

この講義の特徴

📌 REST APIを連動してショッピングモールサイトを作成しながら、Nextの基礎概念から高級概念まですべて体得します。

📌短時間でコードをすばやく正確に記述する11年目のフロントエンド開発者の蜂蜜チップ大放出

📌Chrome開発者ツール、HTTPプロトコル、パフォーマンスの最適化など、実際に知っておくべき知識も一緒に教えてくれます

📌中途中学んだ内容を消化できる実習があちこちに配置されています。

📌CSR 、SSR、Hydration、クライアントナビゲーションなどのすべての概念は、ブラウザを直接見て、一緒に目で見て理解します。

📌いつでもどこでも簡単にアクセスできるウェブサイトベースの講義教案が提供されます。

こんな方におすすめです

Next.jsプロジェクトを始めましょう。

Reactもよくわかりませんが、Next.jsで会社プロジェクトをしなければなりません。
開発を容易にするには、どのような概念とスキルを知る必要がありますか?

Reactで就職を準備しています。
採用発表ごとに資格要件に
Next.jsが入っています。
会社が実際に要求する能力は何ですか?

上手なフロントエンド開発者は
どのように働くのか気になります。
ネカラク船で認められている開発者はどんな能力を持っていますか?
熟練した実務者が知っている知識とノウハウが気になります。

受講後は

  • Next.jsでWebアプリケーションを実装するのは簡単です。

  • コードをより正確かつ迅速に記述するスキルが生まれます。

  • クライアントレベルの知識だけでなく、サーバー、ネットワーク、パフォーマンスの最適化についても学びます。

  • 実務からプロジェクト作成からフォルダ構造化などの全体的なコンベンションまで自信を持って主導できます。

このような内容を学びます。

実務プロジェクトフォルダ構造と実務開発環境設定方法

Next.jsの基本概念に基づいたフォルダ構造の設計方法とESLint、Prettierを使用してコードのタイピングを減らし、開発の生産性を減らす方法を学びます。

React + Next.jsの必須概念と文法

書いたコードの流れを正確理解できるように、フレンドリーで具体的な図式で説明します。

ネットワーク、HTTP、パフォーマンス最適化の深い理解

ウェブページが描画されるまでのリソースリクエストとレンダリング過程について目で見せながら説明します。

コードを短時間で素早く正確に書く方法と経験豊富な実務家のショートカットハニーチップ

実務者の重要なスキルの1つであるコーディングのスキルと実装能力

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

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

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


受講前の注意

練習環境

  • オペレーティングシステムとバージョン(OS):レッスンでMacを書きますが、Windows関連のショートカットもすべて説明します。

  • 使用ツール:VSCode

学習資料

  • いつでも気軽に見ることができるウェブサイトの教案が提供されます😄

  • ソースコードを確認できるフェッケンリポジトリも提供されています📘

  • 見ながら、より多くの知識を満たすことができる無料の教育映像や資料も多数提供されています

選手の知識と注意事項

ウィズバンドバナーコレクション
ドラティバナーコレクション (3)

こんな方に
おすすめです

学習対象は
誰でしょう?

  • Next.js を始める初心者

  • React と Next.js を一度に学びたい初心者

  • Next.js の実務開発に興味のあるフロントエンド開発者

  • Next.js に興味のある Web 開発者

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

  • React 基本文法(講師の指導に従って講義を受講することをお勧めします)

  • JavaScript 基本文法

こんにちは
です。

48,095

受講生

4,668

受講レビュー

3,812

回答

4.9

講座評価

17

講座

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

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

カリキュラム

全体

70件 ∙ (7時間 57分)

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

受講レビュー

全体

95件

4.8

95件の受講レビュー

  • 김민경님의 프로필 이미지
    김민경

    受講レビュー 2

    平均評価 5.0

    5

    100% 受講後に作成

    판교 캡틴님 강의는 처음 수강하네요 저는 사수 없이 일하고 있는 3개월 차 개발자입니다. 제가 많은 강의를 들어보았지만 다른 분들 이야기 하시는 것처럼 흡입력이 굉장히 좋으시네요! 빠른 호흡으로 몇 일만에 목표를 잡아두고 1차 완강을 해내었습니다. 물론 흡입력도 좋았지만 궁극적으로 "이건 다음 강의에서 알려드릴게요." 하시는데 궁굼해서 계속적으로 다음 강의를 듣게 되네요. nextjs 를 가르치는 강의는 많이 보실 수 있지만, 왜? 를 가르쳐 주고 궁굼증을 일으키게 하는 강의는 찾기 쉽지 않다고 생각합니다. 궁극적으로 원론? 을 파헤쳐야 한다고 점점 생각이 드는데요! 그런 맥락에서 제 온라인 사수 라고 생각하고 현업에서의 꿀팁과 이 코드를 "왜" 작성해야 하는지 알려주셔서 너무 좋았습니다. (여타의 강의에서는 제가 못 찾거나 떠먹지 못할 수도 있었겠지만요 ..) 그런 의미에서 선생님 얼른 앱라우터를 이용한 심화 next 강의 가져와주세요 .. 쉬지말고 일해주십시오.. 그 동안 저는 가르쳐 주신 것을 현업에 녹아내고 있겠습니다..

    • 장기효(캡틴판교)
      知識共有者

      세상에.. 감동적인 수강평이네요 ㅋㅋ 쉬지 않고 일하고 있습니다. 다음 강의 나오면 선물로 드릴게요! 감사합니다 :)

  • damin200369님의 프로필 이미지
    damin200369

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    강의 잘 들었습니다! 후속으로 나올 강의들도 기대하겠습니다 :) 핵심도 핵심이지만, 강의에서 하나하나 설명해주시고 특히 정리해서 제공해주시는 노트가 너무 좋습니다!

    • 강의 특장점들을 잘 짚어주셔서 감사합니다. 다음 강의도 빨리 들고 올게요! :)

  • Ara Jo님의 프로필 이미지
    Ara Jo

    受講レビュー 3

    平均評価 5.0

    5

    100% 受講後に作成

    역시 캡틴판교! 필요한 부분을 딱 짚어주는 군더더기 없는 설명에 강의 보충 자료도 풍부하고 집중하기 딱 좋은 강의 길이 등등 정말 완벽한 강의였습니다 (귀에 딱딱 박히는 딕션에 멋진 목소리는 덤) 갑자기 next.js 안건을 맡게 되어 막막했는데 정말 많은 도움이 되었어요 생각날때마다 판교쪽으로 절 한번씩 올릴게요 앞으로도 소처럼 일해주세요 화이팅!

    • 퇴근하고싶어님의 프로필 이미지
      퇴근하고싶어

      受講レビュー 2

      平均評価 5.0

      5

      84% 受講後に作成

      갑자기 Next.js를 할 일이 생겨서 막막했던 신입 개발자 입니다...ㅜㅜ 포지션도 백엔드라 기존에 프론트 관련 프레임워크를 다룰일이 별로 없어서 뭐부터 접근해야할까 막막했는데 사회 초년생에게 부담 없는 가격으로 너무 재밌게 수강했습니다!! (저렴하다고 퀄리티가 떨어지지 않습니다!! ) 다른 수강평에서 디테일에 대한 아쉬움을 말씀하시는 분들도 있는데, 어느정도 사전 학습이 되어있는 분들이 듣기를 추천드립니다... 저는 개인적으로 오히려 군더더기가 없고 필요한 디테일을 다시 상기시켜주신다는 느낌으로 잡아주시고 가주셔서 너무 좋았습니다!! 심화편 기원 오늘부터 물떠놓고 기도합니다!!

      • 민경언님의 프로필 이미지
        민경언

        受講レビュー 12

        平均評価 3.3

        4

        100% 受講後に作成

        ¥6,526

        captainの他の講座

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

        似ている講座

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