一口サイズでかじり取るNext.js

バイブコーディングは速いですが、速すぎるあまり基礎が疎かになったまま通り過ぎてしまいがちです。AIが書いたコードが「なぜ動くのか」を知りたい方のために — 揺るぎないバイブコーディングに必要な8つの核心的基礎（ターミナル・ウェブ・デプロイ・バージョン管理・DB・認証など）と、どのような順序で学ぶべきかを解説します。コーディング0日目の方でもついてこれます！

概念からユニークなプロジェクトまで一緒に扱いながら、JavaScriptとReactをこの講義で一度に終わらせましょう。 学習は短く、応用は長く、18時間のボリュームを誇るAll-in-one講義！

AIはまさにあなた次第で素晴らしくなります。AI活用法 → 基礎・核心知識 → プロジェクト開発の3段階で完成する完璧なバイブコーディング。バイブコーディングを本格的に学んでみたい方のために、どんなAIを使用しても変わらない核心概念を、一口サイズに凝縮してお届けします。

文法を超えて動作原理と概念の理解まで、学んでも学んでも混乱しがちなTypeScriptを、今こそしっかり学びましょう！皆さんをTypeScriptの魔法使い🧙🏻‍♀️にお仕立てします。

いよいよ実践に挑戦する番です 🔥 React.js + TypeScript + Supabaseで実務レベルのSNSを一緒に開発しながら、認証・認可、無限スクロール、画像アップロード、いいね、無限ネストコメント、ダークモードなどの機能を実装します。この過程で、ZustandとTanstack Queryを利用したサーバーおよびグローバル状態管理の手法も学んでいく予定です。

Zustand、Tanstack Query、Tailwind CSSで、あなたのReactアプリをアップグレードしましょう！複雑なプロジェクトにも挑戦できるよう、さまざまなツールの核心的な概念と使用方法をご案内します。

文法を超えて動作原理と概念の理解まで、学んでも学んでも混乱しがちなTypeScriptを、今こそしっかり学びましょう！皆さんをTypeScriptの魔法使い🧙🏻‍♀️にお仕立てします。

概念からユニークなプロジェクトまで一緒に扱いながら、JavaScriptとReactをこの講義で一度に終わらせましょう。 学習は短く、応用は長く、18時間のボリュームを誇るAll-in-one講義！

いよいよ実践に挑戦する番です 🔥 React.js + TypeScript + Supabaseで実務レベルのSNSを一緒に開発しながら、認証・認可、無限スクロール、画像アップロード、いいね、無限ネストコメント、ダークモードなどの機能を実装します。この過程で、ZustandとTanstack Queryを利用したサーバーおよびグローバル状態管理の手法も学んでいく予定です。

一見素晴らしいサービスではなく、ユーザーに会ってフィードバックを受けることができるサービスを作成できます。 Web開発に自信をもっていただけます。

Web開発者が（特にReact開発者であれば）本当に手軽にアプリをリリースできる時代になりました。Expoを使えば、さらに素早くAndroidとiOS両方のアプリをリリースできます。Expoを通じて、アプリまでスピーディーにリリースできる開発者になりましょう。

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

初心者でもできる、ウェブ、サーバー、モバイル アプリ、機械学習まで習得できるフルスタックの最終講義!! 開発をどこから始めたらよいかわからない場合は、この講義を強くお勧めします。Javascript 1 つで進めます!

タイプスクリプトを正しく理解するには、公式文書を一度見てください。 文書の重要な部分だけがコックを拾い、分かりやすく伝えます。 実戦に必要な内容も一緒にお知らせする講義です！

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

この講座は、AI時代に開発生産性を最大化する方法を学びたい方のための実践中心の講座です。 単にAIを使う方法を超えて、実際の開発環境でClaude Codeをどのように活用すべきか、そしてどうすれば「質の高い成果」を生み出せるのかに焦点を当てます。 多くの開発者がAIを使いながらも、 ❌ 結果が一貫しない ❌ コードの品質が落ちる ❌ プロジェクトが次第に複雑になる といった問題に直面しています。 この講座では、これらの問題を解決するために、 ✔ スペックベースのワークフロー ✔ 構造化されたコマンドシステム ✔ サブエージェントおよび自動化戦略 を通じて、AIを単なるツールではなく「開発パートナー」として活用する方法をお伝えします。 また、Firebase、Figma、GitHub、Vercelといった実際のサービスと連携し、 最初から最後まで一つのアプリケーションを完成させ、デプロイする経験を提供します。

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

Mobile App Front-End開発のためのReact Nativeの基礎知識の習得を目指しています。進入障壁の低い言語/APIの活用により、非専門家も簡単にNative Mobile Appを開発できるように作られた講義です。

React, Electron, Zustandを活用しタイマーアプリを直接制作、クロスプラットフォーム（Windows、macOS、Linux）へデプロイまで行う実践講義です。 慣れ親しんだReactウェブ開発を皮切りに、Zustandを通じたグローバル状態管理と最終的なGUIデプロイまで、デスクトップアプリ開発の全体的な流れを学ぶことができます！

フロントエンド開発者なのにログイン機能を実装できず、悔しい思いをしたことはありませんか？DBを利用してデータを保存・取得する機能を実装したいけれど、クエリを勉強するのは負担に感じていませんでしたか？Firebaseなら簡単に実現できます！ReactとFirebaseの力を借りて、ユーザー認証、データ保存、ホスティングなど、Web開発に不可欠な機能を一緒に実装してみましょう！（本講義は22年8月に収録されたもので、Firebaseのメジャーアップデートを反映した内容となっています。）

Next.js + Cursor IDE でチャットプログラムを1時間で実装できる能力が身につきます。

ReactとFirebaseを活用して、ログイン、投稿管理、ファイルアップロード、プロフィール管理など、実際のサービスで使用されるコア機能を実装するウェブアプリケーションを作成する講座です。 Firebase Authenticationを利用したメールログインとソーシャルログイン、Firestoreベースのデータ保存およびリアルタイムデータ処理、Firebase Storageを活用したファイルアップロード機能、そしてプロフィール管理機能まで段階的に実装しながら、一つの完成されたウェブサービスを作ることができます。 フロントエンド開発を学んでいる方が、複雑なサーバー構築なしにFirebaseを活用して素早くウェブサービスを実装する方法を理解できるように構成された講座です。

コーディングができなくてもOK！ あなたのアイデアを、わずか4週間で実際の収益に変えてみましょう。 AIと最新ツールを活用し、ウェブサイトとアプリを同時に構築して、すぐにサービス展開まで繋げます。

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

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

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