2技術カテゴリ別 学習分野一覧
本期間の学習の中核。React / Next.js を中心に、最新の App
Router・Server
Actions・キャッシュ戦略・パフォーマンス最適化まで体系的に学習。
主な学習コンテンツ
-
Build & Deploy The Best Ecommerce Website Ever Next.js 2025(EC
サイト構築)
-
Next.js 15 & React - The Complete Guide(Next.js 15 体系学習)
-
Build & Deploy Multi Ecommerce Website React Next.js
2025(マルチ EC サイト)
-
Build a YouTube Clone with Next.js 15(YouTube クローン / tRPC /
Drizzle)
-
Fullstack Trello Clone: Next.js 14, Server Actions, React, Prisma,
Stripe(Trello クローン)
-
Next.js 15 / TypeScript / Supabase / Google Places
API(個人開発プロジェクト)
-
Sharpen your skills by building 50+ quick, unique and fun mini
projects(50 以上のミニプロジェクト)
- KEN のモダン Web 開発ラボ【React 入門シリーズ】
- React を使いこなすためのデザインパターン入門
- React Hook Form によるフォーム実装・非同期検証・並べ替え
-
Next.js のキャッシュ戦略(フルルートキャッシュ / ルーターキャッシュ
/ PPR)
- インターセプトルート / パラレルルートの実践
習得した主な技術
Next.js (App Router)
Server Actions
Server Components
ISR / SSR / SSG / PPR
React Hooks
Suspense
useOptimistic
useActionState
Zustand
TanStack Query / SWR
React Hook Form
Zod / Valibot
shadcn/ui
Tailwind CSS
Prisma
Drizzle ORM
Supabase
Clerk
Stripe
tRPC
Go 言語を新規に学習開始し、基礎文法からクリーンアーキテクチャでの API
構築まで到達。
主な学習コンテンツ
- Go The Complete Guide(体系的な Go 学習)
-
現役シリコンバレーエンジニアが教える Go 入門 + 応用(Fintech
アプリ開発)
- Go and React Full Stack App(Go + React フルスタック)
-
Build a Full Stack Movie Streaming App in Go(Go + React + MongoDB)
- Go 言語で構築するクリーンアーキテクチャ設計
習得した主な技術
Go
ポインタ / 構造体
インターフェース
Goroutine / Channel
Context
Gin
MongoDB
クリーンアーキテクチャ
コンテナ技術を深く理解し、CI/CD
パイプラインの構築・クラウドデプロイを実務で実践。
主な学習コンテンツ
- Docker and Kubernetes: The Complete Guide(体系学習)
- 仕組みと使い方がわかる Docker & Kubernetes の基本中の基本
- 理解して使う!Docker 入門+応用
- 【完全版】Cloudflare を 2 時間で学べるチュートリアル
- GitHub Actions による CI/CD 構築(実務)
- CloudRun + IAP + LoadBalancing 構成
習得した主な技術
Docker
Docker Compose
マルチステージビルド
Kubernetes
GitHub Actions
GCP (Cloud Run / Cloud Build)
AWS (ECS / EC2 / RDS)
Cloudflare (Pages / Workers / D1 / R2)
Nginx
設計思想の書籍を 1 年かけて通読し、日常的に設計判断に活用。
主な学習コンテンツ
- A PHILOSOPHY OF SOFTWARE DESIGN(通年で継続的に学習)
- ドメイン駆動設計入門
- TypeScript で学ぶ SOLID 原則・デザインパターン
- リバーシで学ぶアプリケーション設計入門
- システム設計の面接試験
習得した主な概念
Deep Module
複雑性管理
戦略的プログラミング
レイヤードアーキテクチャ
クリーンアーキテクチャ
CQRS
DDD
SOLID 原則
依存性逆転
Factory Method
Decorator
フロントエンドテストの体系的な理解と、Playwright による E2E
テストの実践。
主な学習コンテンツ
-
【React テスト入門】React Testing Library / Jest / Vitest
で学ぶフロントエンドテスト入門
- Web フロントエンド E2E テスト入門
- 【Playwright 入門】Web テスト自動化で E2E テストを効率化!
- Playwright でログインを丸ごと保持!E2E テスト効率化の秘訣
習得した主な技術
Jest
Vitest
React Testing Library
Playwright
Husky
カバレッジテスト
TDD
TypeScript
の型システムを基礎から再学習し、型レベルプログラミングまで理解を深めた。
主な学習コンテンツ
- プロを目指す人のための TypeScript 入門(体系学習)
-
うさぎでもわかる!TypeScript
の型レベルプログラミングと高度な設計手法
習得した主な概念
リテラル型
ジェネリクス
部分型(共変・反変)
ユニオン / インターセクション型
型ガード
keyof / typeof
as const
Web セキュリティの基礎を体系的に学習。
主な学習コンテンツ
- 安全な Web アプリケーションの作り方(継続的に学習)
- バイブコーディングに潜むセキュリティリスク(脆弱性)とその対策
習得した主な概念
XSS
SQL インジェクション
CSRF
CORS
Cookie セキュリティ
セッション管理
パスワードハッシュ化
IDEF1X 記法
インデックス設計
パーティション
正規化
バックアップ戦略
生成 AI
を開発ツールおよびアプリケーション機能として活用する技術を学習。
主な学習コンテンツ
- 画像生成 AI SaaS(Next.js App Router + Stripe サブスク決済)
- 実装レベルで学ぶ MCP!AI アプリ開発実践チュートリアル
-
Claude Code × Figma で「AI 感を消す」Web サイト・UI を作る方法
- コンテキストエンジニアリング入門
- SpeechToText と要約機能のモックアプリ開発
MCP
Claude Code
Cursor
AI SDK
Vercel AI SDK
SpeechToText
- Microfrontends with React: A Complete Developer's Guide
Module Federation
Runtime Integration
CSS スコープ戦略
- CSS 優良デザインアイデア事典
- Tailwind CSS と shadcn/ui で Web アプリでよく出る UI を作る回
- HTML/CSS + JavaScript をちゃんと学ぶ講座
流体レイアウト (clamp)
論理的プロパティ
Flexbox / Grid
レスポンシブデザイン
shadcn/ui
-
Git 100 本ノック+300 枚の図解+丁寧な解説で長期記憶に焼き付けろ!
Git 内部構造
merge / rebase
stash
GitHub Flow
Pull Request 運用
-
Google Professional Cloud Developer(2026年2月〜3月に集中学習)