Next.jsを始める

フロントエンド開発に必要なJavaScriptの基礎知識。実務者として必ず知っておくべき必須知識を簡単かつ迅速に説明します。2024年現代フロントエンド開発トレンドを反映した基本講座。

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

実力のあるフロントエンド開発の実務者になりたいなら必ず受けるべきテスト講義。テスティング入門から実践まで一気に終わらせる 👊

実務で最も多く使われているReactフレームワーク、簡単で速く楽しく学んでみましょう！ToDoアプリを作りながらReactの動作原理、コンポーネント設計、リファクタリング方法を学びます。

実務でよく使われるReactとVueのコードを書きながらTypeScriptの必須概念を学ぶ講座です。ReactとVueに型を適用する方法、ChatGPTの使い方まですべて押さえる実務者と入門者の両方のための講座!

Vue 2と最新のVue 3の両方で使用できるVue Composition APIを最も簡単かつ正確に学べる講座!

Vue.jsの最新バージョンVue 3を始める方のための講座です。Vue.jsの動作原理から実務開発を行う際に知っておくべき基本概念を学びましょう。

自分が作ったVue.jsサイトがより多くの人に露出されることを望むなら？キャプテンパンギョのVue.jsシリーズを全て聞いて、今度はサーバーサイドレンダリングもやってみたい方におすすめの講座です。Nuxt.js入門講座！

Vue.jsでTypeScriptを始める方のための最高の講座。2つの実習プロジェクトで楽しく学ぶVue.js + TypeScript完全攻略。学びながらすぐに実務に適用してみてください!😄

「TypeScript入門 - 基礎から実践まで」の実践活用編です。入門編を受講されていない方は入門編から受講してください 😄

TypeScriptを始める方のための講義です。最新のJavaScript文法を知らない方でも簡単に学べるようにカリキュラムを構成しました。難しく感じられるTypeScriptを初心者の視点から簡単で楽しく学んでいきましょう😄

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

Vue.jsで実務をされている方に必要なすべてを盛り込みました。実際のバックエンドAPIで実装する学習ノートCRUDアプリケーション。生産性の高いプロジェクト環境構築とバックエンド開発者と協業する方法についてのメッセージをぜひご確認ください :)

Vue.jsで簡単にWeb開発ができるよう、基本概念と核心機能について学習し、実装してみます。 講座を受講すると、Vue.jsでフロントエンド開発をするのが楽しくなるでしょう。

Do it! Vue.js 入門 -> Vue.js 初級講座 -> Vue.js 中級講座の系譜を継ぐVue.js 実践講座です。 Vue.js を実務で完璧に活用できるようサポートします。

Web技術でオフライン環境で動作するAppを作ることができます。プログレッシブウェブアプリが発展してきた時代的背景と主要な特徴を学び、主要技術で実際にプログレッシブウェブアプリを作ってみましょう。

Vue.js 中級講座 - 「誰でも」、「簡単に」、「素晴らしい」Webアプリケーションを作れるようサポートするVue.js活用講座です。Vue.jsに対する基本的な理解をもとにTodoアプリを作りながら、コード中心の実用的な知識を学びます。

ReactからNext.js 14に移行し、ReactとNext.jsの違いを学びます。 Next.jsをより深く理解することができます！

Next.jsの基本を扱う講座です。 Next.jsで地図サービスを最初から最後まで開発してみます。

ES6+と関数型プログラミングを学べる講義です。このコースでは、ES6+のイテラブル/イテレータ/ジェネレータプロトコルを詳細に扱い、応用します。 イテラブルに基づく関数型プログラミング、map/filter/reduce、パイプライン、ジェネレータによる遅延評価、Promise合成、同時性/並列性、async/awaitと非同期エラー処理などを学ぶことができます。このコースを習得して練習して、中級のJavaScript開発者に成長しましょう！

このコースは、関数型プログラミングとJavaScript ES6 +のシリーズコースで、さまざまなアプリケーションケースをカバーしています。

🔥 講義の登録から動画のアップロードまで、知識共有者機能をそのまま実装してみる実践フルスタック講義です。Next.js 15とNestJSを活用し、講義の作成、カリキュラム構成、サムネイルおよび動画のアップロード、詳細紹介の作成まで、実際のInflearn（インフラン）の流れに沿って作りながら、Prismaモデリング、JWT認証、S3 + CloudFrontアップロード、Swagger API設計など、実務に近い経験を積むことができます。

Next.js, YOLOv11, FastAPIを活用してリアルタイム火災検知システムを構築する方法を学びます。

🚀JavaScriptの文法を勉強したばかりのコリンズに適したミニプロジェクト実習講義です。

Next.js 15のApp Routerは、サーバーとクライアントの境界を完璧に制御し、高性能なWebサービスを構築するための強力なアーキテクチャです。本講義は、サーバーコンポーネント（RSC）の動作原理から3大キャッシング戦略（Static, Dynamic, ISR）に至る複雑なレンダリングメカニズムを、12の実務ミッションを通じて明確に結びつけます。これにより、ファイルシステムルーティングとネストされたレイアウトをビジネス要件に合わせて設計する能力を身につけ、原理のわからないコードをコピーしていた「雰囲気コーディング」の不安から完全に脱却できます。結果として、皆さんはAIが生成したコードの盲点を瞬時に見抜き、最適な構造を主体的に指示できるNext.jsアーキテクトへと成長することでしょう。

従来のReact開発方式とNext.jsを利用して開発する方式は全く異なります。この講義は最新のNext.js 16の核心を貫き、「本物の」Next.jsらしい開発方式をお教えします。就職ポートフォリオから実務プロジェクトまで、パフォーマンスと効率の両方を掴む方法を体験してください。 Next.jsらしく開発しましょう!Next.jsの機能をどのように適用すべきか、実際の例題を作りながら体で学べるように構成されています。サーバーコンポーネントを中心に見て、サーバーアクションとキャッシング戦略などを理論よりも実際にコードを通してより速く学習します。 講義の目標はできるだけ早くNext.jsの雰囲気についていくことであるため、講義自体はJavaScriptを利用して進行します。しかし、各講義の例題はTypescriptで制作されたものを追加で授業資料として提供します。 2025年12月18日 - Next.js 16バージョンにアップデート

FirebaseのSQL版！Supabaseを通じてNext.jsのフルスタックの基礎をマスターできます！

フルスタック開発に翼を授けるSupabase！ 3つのクローンプロジェクトを通じて、Next.js 14とSupabaseで実務レベルのフルスタック開発を行う方法を最速で学びます。

Web開発を活用して、AndroidとIOSでサービス可能なモバイルアプリ開発ができるようにする講座です。

思考を扱います。JavaScriptの核心と根本を論理的に整理できます。JavaScriptの経験や考えを自ら整理できるようになります。JavaScriptの技術論理を確立できます。JavaScript全体を見渡す視野を広げることができます。JavaScriptの技術面接対策ができます。

このコースでは、サーバー側の Javascript イン NodeJS を利用してクッキーとログイン機能を実装し、前の nodeJS コースで得た成果と合わせて完全な Web アプリケーションを作成します。

Whisperをローカルで実行し、FastAPIとNext.jsを活用してAI音声認識アプリを迅速に開発する実践プロジェクトの講義です。リアルタイム音声認識まで実装し、短時間で簡単なポートフォリオとして活用できる成果物を完成させることができます。

Webゲームも作って、フロントエンドWeb開発スキルも学ぶ1席3組授業！

JavaScript、TypeScriptに続いて、次はバックエンド開発です。NestJSを使用してREST APIバックエンド開発、Socket IO開発および配布を行うことができます。

最近、LLMが開発環境を変えていますが、本当に重要なのは「コードを代わりに書くこと」ではなく、サービスに機能として組み込むことです。 この講座では、Next.js + OpenAI APIを使って、軽量ながらも完成度の高いタロット占いサービスを段階別に実装します。 最初のステップでは、バックエンドなしでも可能なMVPを作成し、ユーザー入力のフロー（質問/スレッド/カード選択）から結果の生成までを繋げます。 その後のステップで、バックエンドの構築、一般ログインとOAuth、コミュニティ機能、リーディングダッシュボードへと機能を拡張します。 最後に、AWSへのデプロイとGoogleアドセンスの連携まで行い、実際に運営可能な形で仕上げます。 また、LLM APIの使用料金が負担にならないよう、料金構造の理解とコスト最適化戦略もあわせて扱います。

「なぜAIがこんなコードを書いたのか？」、「なぜさっき言ったことを覚えていないのか？」 Claude CodeのようなAIツールを使っていると直面するもどかしさ。その原因は、ツールがどのように動作しているかを知らないことにあります。この講義は、そのブラックボックスを透明に解き明かします。 全25講を通じて、LLMにファイルを見る「目（Read）」、コードを直す「手（Edit）」、命令を実行する「足（Bash）」を直接持たせ、実際の現場で使われるツールと同じように動作する自分だけのCoding Agentをゼロから実装します。単にライブラリの使い方を学ぶのではありません。AIがどのようにプロジェクト構造を把握し、なぜ長い会話で記憶を失うのか、それを技術的にどう解決するのか（Sliding Window、Summary）を、直接コードで実装しながら体得します。 この過程を通じて、皆さんはAIツールの単なる「ユーザー」から、作動原理を見抜き、ツールを自分好みに改造・評価できる「AI供給者」の視座を手に入れることになるでしょう。

"2026年度 UIUXデザイナー | コーディングするデザイナー エージェンシー合格ポートフォリオ公開" 面接官の目を引くUIUXウェブポートフォリオを制作する実践講義です。 単なるポートフォリオ制作ではなく、インタラクションを活用した差別化された成果物で、 UIUXデザイナーとしての就職競争力を高められるよう設計されたカリキュラムです。