IT・技術研修ならCTC教育サービス

コース内容

コース概要

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

当コースは、Reactをベースとしたフレームワークとして人気のNext.jsを中心に、TypeScriptおよびその静的な型システムを前提としたtRPCやPrismaといったライブラリを活用して、型安全に生産性高くWebアプリケーションを開発するためのコースです。
Next.jsは、Reactを基としてサーバーサイドレンダリングや静的サイトの生成、設定無しでのルーティング（ファイルベースルーティング）、状態管理やキャッシュ管理を兼ね備えたデータフェッチなどなど、昨今のWebアプリケーションをしっかりと作成するための様々な機能を備えたJavaScriptフレームワークです。
tRPCは、TypeScriptで記述されており、TypeScriptの型システムを上手く活用してフロントエンドとバックエンドのやり取りに静的な型を導入する事ができるライブラリです。tRPCを導入することで生産性高く型安全にWeb APIを開発できます。
PrismaはTypeScriptライブラリで、データベースへのアクセスを行うアプリケーションを素早く型安全に記述することができます。Prismaはデータモデルの作成、データ操作、マイグレーションなど様々な機能を提供しています。

学習目標

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

対象者

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

前提知識

・Reactを使って簡単なアプリケーションを作成できる方
・Node.jsを使って簡単なアプリケーションを作成できる方
・『React入門（*）』『Node.js入門（*）』『TypeScriptイントロダクション（*）』をご受講いただいた方もしくは、同等の技術を習得している方
・ECMAScript2015以降の文法でJavaScriptのコーディングを行ったことのある方
（*）：株式会社カサレアル主催コース

スクール環境

※使用ソフトウェアについて
変更頻度が高いため、詳細につきましてはお問い合わせください。

内容

●Next.jsの基礎
・Next.jsの基礎
・Reactとの違い
・Server Side Rendering
・ファイルベースルーティング
・データフェッチ
・CSSの適用
●サーバサイドtRPC Routerの作成
・tRPCとは
・tRPCによるサーバーサイド処理の実装
・エラーハンドリング
・クライアントからの型安全なWeb APIコール
●Prismaによるデータベースアクセス
・Prismaとは
・Prismaを使ったデータベース操作
・データベースマイグレーション
・Next.js、tRPC、Prismaを統合したアプリケーションの作成

●付録：TypeScript要点速習

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

備考

※オンラインでのご受講の方は【オンライン研修環境】をご確認ください。

【オンライン研修環境】
■使用ツール
　動画配信：Zoom
　※業務用PCに追加アプリをインストールできない場合は、ブラウザからのご参加をお願いします。
　※Zoomのシステム要件について、より詳細な情報は、こちらをご参照ください。
　（https://support.zoom.us/hc/ja/articles/201362023-System-Requirements-for-PC-Mac-and-Linux）

　質疑応答：オンラインチャットシステム

　演習環境：仮想デスクトップ

■システム要件
　・インターネットに常時接続できること
　・Webカメラおよびマイク
　※PC本体の他に、モニターやiPad等の拡張ディスプレイをご用意いただくことを推奨いたします。
　　（1台：Zoom、オンラインチャットシステム用、1台：演習環境用用）

■OS/ブラウザ
　・OS：Windows　/　ブラウザ：Google Chrome
　　上記以外の環境でもご受講いただくことが可能ですが、操作感が異なる可能性がある点をご了承ください。

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