コース概要

フロントエンド/バックエンド双方を備えたWebアプリケーションを高い生産性で開発するためのNext.js入門コースです。

当コースは、Reactをベースとしたフレームワークとして人気のNext.jsを中心に、TypeScriptおよびその静的な型システムを前提としたtRPCやPrismaといったライブラリを活用して、型安全に生産性高くWebアプリケーションを開発するためのコースです。

Next.jsは、Reactを基としてサーバーサイドレンダリングや静的サイトの生成、設定無しでのルーティング（ファイルベースルーティング）、状態管理やキャッシュ管理を兼ね備えたデータフェッチなどなど、昨今のWebアプリケーションをしっかりと作成するための様々な機能を備えたJavaScriptフレームワークです。

tRPCは、TypeScriptで記述されており、TypeScriptの型システムを上手く活用してフロントエンドとバックエンドのやり取りに静的な型を導入する事ができるライブラリです。 tRPCを導入することで生産性高く型安全にWeb APIを開発できます。
PrismaはTypeScriptライブラリで、データベースへのアクセスを行うアプリケーションを素早く型安全に記述することができます。Prismaはデータモデルの作成、データ操作、マイグレーションなど様々な機能を提供しています。

※ このコースは株式会社カサレアルが開催いたします。

前提条件

• Reactを使って簡単なアプリケーションを作成できる方
• Node.jsを使って簡単なアプリケーションを作成できる方
• TypeScriptの文法についての知識がある方
• ECMAScript2015以降の文法でJavaScriptのコーディングを行ったことのある方

対象者

• Reactの発展としてNext.jsを学びたい方
• ReactやNode.jsの基礎は学んだがWebアプリケーションを実際にどう作成していくのか体験したい方

   

コース内容

【目的】
■ Next.jsを使ってフロントエンド/バックエンド双方を備えたWebアプリケーションを作成できる

【内容】
■ Next.jsの基礎
　□ Next.jsの基礎
　□ Reactとの違い
　□ Server Side Rendering
　□ ファイルベースルーティング
　□ データフェッチ
　□ CSSの適用

■ サーバサイドtRPC Routerの作成
　□ tRPCとは
　□ tRPCによるサーバーサイド処理の実装
　□ エラーハンドリング
　□ クライアントからの型安全なWeb APIコール

■ Prismaによるデータベースアクセス
　□ Prismaとは
　□ Prismaを使ったデータベース操作
　□ データベースマイグレーション
　□ Next.js、tRPC、Prismaを統合したアプリケーションの作成

■ 付録：TypeScript要点速習

※最新でより良い内容をお届けするため、一部の学習項目を予告なく変更する可能性がありますので
ご了承ください。

【実行環境】
■ Next.js v13以上
■ React v18以上
■ Node.js v18以上
■ TypeScript v5以上
■ Chrome
■ Visual Studio Code
※ 使用するソフトウェアおよびバージョンについては予告なく変更する可能性がありますので
ご了承ください。

注意事項

※受講に関する注意点※
進行の都合上、研修開始時間を過ぎてからのご参加はご遠慮いただいております。
大変恐れ入りますが、研修開始時間までにご参加いただけていない場合、
当日キャンセル扱いをさせていただく場合がございますのでご注意ください。