はじめに
React + TypeScriptの学習の一環で、筋トレ記録アプリを作成しています。(現在進行形)
学習方法として、GitHubCopilotでコード生成し、不明点をネット記事やAIで質問して理解したものについてこの記事に挙げていきます。
※初学者のため的外れなことを書くかもしれませんので先に謝ります！
export interface
https://commte.net/nextjs-export-type-interface
export interfaceは、TypeScript においてインターフェースを外部ファイルに共有するための方法。
これを使うことで他のファイルからそのインターフェースをインポートして利用することができる。
例：
// types.ts
export interface IUser {
id: string
name: string
}
// pages/index.tsx
import { IUser } from '../types'
const user: IUser = {
id: '1',
name: 'John Doe',
}
React Router
ルーティングとは
「URLに応じて表示する画面を切り替える仕組み」
通常のWebサイトではページ遷移するとリロードが発生するが、
ReactではSPAで、ページをリロードせずに画面を切り替える。
用語集
- SPA(シングルページアプリケーション)
アプリのページ遷移を管理する司令塔