강의

멘토링

로드맵

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はどのように学べばよいでしょうか?

開発方式が自由なReactにルールを追加し、開発者が気にかけるべきルーティングやパフォーマンスなどを自動で管理してくれるNext.jsフレームワーク。膨大なNext.js公式ドキュメントの前で一人で道に迷う必要はありません。Next.js公式ドキュメントより理解しやすい日本語教材があるのですから。❤


数年間、初心者の視点から難しい技術を分かりやすく説明してきたキャプテンパンギョが、今度は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の必須概念と文法

作成したコードの流れを正確に理解できるよう、Kindで具体的な図式で説明します。CSR、SSR、Hydrationだけでなく、React、JavaScript必須文法まですべて説明してくれるお得な講義🎁

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

Webページが描画されるまでのリソース要求とレンダリング過程について、目で直接見せながら説明します。サーバー、CDN、HTTP、パフォーマンス最適化など、初心者の観点から馴染みのない用語はすべて詳しく説明いたします

短時間でコードを素早く正確に書く方法と熟練した実務者のショートカット꿀팁

実務者の重要なスキルの一つであるコーディング実力と実装能力。短時間で多くの機能を正確かつ迅速に実装できるショートカットキーとコーディングの裏技を大放出します🚀

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

장기효 (캡틴판교)

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


受講前の参考事項

実習環境

  • オペレーティングシステムおよびバージョン(OS):講義ではMacを使用しますが、Windows関連のショートカットキーもすべて説明します。

  • 使用ツール:VSCode

学習資料

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

  • ソースコードを確認できるGitHubリポジトリも提供されます 📘

  • 見ながらより多くの知識を身につけることができる無料教育動画と資料も多数提供されます ❤

前提知識および注意事項

위즈 띠배너 모음
도라 띠배너 모음 (3)

こんな方に
おすすめです

学習対象は
誰でしょう?

  • Next.js を始める初心者

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

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

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

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

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

  • JavaScript 基本文法

こんにちは
です。

48,226

受講生

4,702

受講レビュー

3,813

回答

4.9

講座評価

17

講座

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

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

カリキュラム

全体

70件 ∙ (7時間 57分)

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

受講レビュー

全体

97件

4.8

97件の受講レビュー

  • minkyungs2님의 프로필 이미지
    minkyungs2

    受講レビュー 2

    平均評価 5.0

    5

    100% 受講後に作成

    Đây là lần đầu tiên tôi nghe bài giảng của Đại úy Pangyo. Tôi là một nhà phát triển đã làm việc mà không có người giám sát trong 3 tháng. Mình đã giảng nhiều bài rồi nhưng như người khác đã nói, lực hút rất tốt! Với nhịp thở nhanh, tôi đặt mục tiêu và hoàn thành khóa học đầu tiên chỉ sau vài ngày. Tất nhiên, lực hút rất tốt, nhưng cuối cùng, "Tôi sẽ kể cho bạn nghe về điều này trong bài giảng tiếp theo." Tôi tò mò nên tiếp tục nghe bài giảng tiếp theo. Bạn có thể thấy nhiều bài giảng dạy nextjs, nhưng tại sao? Tôi không nghĩ rằng thật dễ dàng để tìm được một bài giảng dạy bạn và đặt ra những câu hỏi. Cuối cùng, những điều cơ bản? Tôi bắt đầu nghĩ rằng tôi cần phải đào sâu vào nó! Trong bối cảnh đó, tôi coi mình như một game bắn súng trực tuyến và sử dụng các mẹo thực tế cũng như mã này để giải thích "tại sao" Thật tuyệt vời khi bạn bảo tôi nên viết gì. (Trong các bài giảng khác, có thể tôi đã không tìm thấy hoặc ăn được nó..) Theo nghĩa đó, giáo viên vui lòng nhanh chóng đưa ra bài giảng chuyên sâu tiếp theo bằng bộ định tuyến ứng dụng. Trong thời gian chờ đợi, tôi sẽ áp dụng những gì bạn đã dạy vào công việc của mình.

    • captain
      知識共有者

      Ôi trời... thật là một bài ôn tập cảm động. Tôi đang làm việc không ngừng nghỉ. Tôi sẽ tặng nó cho bạn như một món quà khi bài giảng tiếp theo ra mắt! Cảm ơn :)

  • damin2003694581님의 프로필 이미지
    damin2003694581

    受講レビュー 1

    平均評価 5.0

    5

    100% 受講後に作成

    Tôi rất thích bài giảng! Tôi mong chờ những bài giảng tiếp theo :) Những điểm chính rất quan trọng, nhưng tôi thực sự thích cách bạn giải thích từng điều trong bài giảng và đặc biệt là những ghi chú bạn cung cấp để sắp xếp chúng!

    • captain
      知識共有者

      Cảm ơn bạn đã chỉ ra những điểm đặc biệt của khóa học. Tôi sẽ mang bài giảng tiếp theo tới nhanh chóng! :)

  • iamjjoal5302님의 프로필 이미지
    iamjjoal5302

    受講レビュー 9

    平均評価 5.0

    5

    100% 受講後に作成

    Quả là Captain Pangyo! Phần giải thích không thừa thãi, chỉ đúng những chỗ cần thiết, tài liệu bổ trợ bài giảng phong phú, độ dài bài giảng vừa đủ để tập trung,... đúng là một bài giảng hoàn hảo. (Giọng đọc rõ ràng dễ nghe và giọng nói hay là điểm cộng) Đột nhiên tôi được giao dự án next.js nên cảm thấy rất hoang mang, nhưng bài giảng này đã giúp tôi rất nhiều. Mỗi khi nhớ đến anh, tôi sẽ lạy về hướng Pangyo một lạy. Hãy làm việc chăm chỉ như trâu nhé! Cố lên!

    • modify님의 프로필 이미지
      modify

      受講レビュー 2

      平均評価 5.0

      5

      84% 受講後に作成

      Tôi là một nhà phát triển mới đang bối rối vì đột nhiên phải làm việc trên Next.js... ㅜㅜ Vị trí của tôi là back-end nên trước đây tôi không liên quan nhiều đến front-end framework nên tôi đã Tôi không biết nên bắt đầu từ đâu nhưng nó rất thú vị với mức giá phải chăng cho người mới bắt đầu. Tôi đã tham gia khóa học!! (Chất lượng không giảm chỉ vì rẻ!!) Một số người nói rằng họ không hài lòng với các chi tiết trong các bài đánh giá khóa học khác, nhưng tôi giới thiệu nó cho những người đã nghiên cứu trước đó... Cá nhân tôi cảm thấy rằng nó ít không cần thiết hơn và nó nhắc nhở tôi về những chi tiết cần thiết. rất vui vì bạn đã nhận được nó!! Lời cầu nguyện sâu sắc Bắt đầu từ hôm nay, tôi sẽ cầu nguyện cho bạn!!

      • nataek2159님의 프로필 이미지
        nataek2159

        受講レビュー 14

        平均評価 3.2

        4

        100% 受講後に作成

        期間限定セール、あと4日日で終了

        ¥895,976

        23%

        ¥6,748

        captainの他の講座

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

        似ている講座

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