自分のRepositoryにForkする。(右上Forkボタン、"Create fork")
git clone [email protected]:<あなたのユーザー名>/test-web1.git
pnpm install
pnpm devNext.jsとChakra UIを使用して、src/pages/index.tsxのみを編集して、以下のようなページを作ってください。
2024-05-22.19.27.57.mov
どちらもすでにインストールされています。
https://pokeapi.co/api/v2/pokemon/<ID>(ID 25がピカチュウ)
取得したJSONの中の、json.nameが名前(英語)、json.sprites.front_defaultが画像です。
2024-06-27.20.44.17.mov
Next.jsとChakra UIを使用して、src/pages/login.tsxのみを編集して、以下のようなページを作ってください。
どちらもすでにインストールされています。ボタンは必ずこの色にしてください。また、ID欄やパスワード欄は「画面の中央」に配置してください。
POST https://api.we.tips/v1/login
{
"id": "<ID>",
"password": "<パスワード>"
}でリクエストすると、
{
"accessToken": "<Access Token>",
"expiresIn": 86400,
"expiresAt": 1719574844,
"refreshToken": "<Refresh Token>",
"requiresUpdate": false,
"userData": {
"success": true,
"username": "<ID>",
"attributes": {
"sub": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
"email_verified": "true",
"admin": true,
"id": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
"role": "teacher",
"email": "[email protected]",
"displayName": "<お名前>",
"director": [
"<チームの名前>",
"<チームの名前>"
]
}
}
}と帰ってきます。