## 1. Setup
1. Open this study's [Github Repository Task Branch](https://github.com/Taremeh/genai-study-task-starter-template/tree/task-add-user-management)

2. Click on "Code" > "Codespaces" > "+"

3. Wait several minutes for Codespaces to load and automatically configure itself:
![Screenshot Setup Step 3](./instruction_assets/1_setup_step_3.png)


4. After the installation finishes (takes several minutes), open the codespace in your local VS Code program. This step is important (!), because only then can you use localhost addresses:
<img src="./instruction_assets/2_setup_step_4.png" width=400 />

5. Start the development servers by running `yarn run dev` in the VS Code terminal. It will start the frontend server (e.g. [127.0.0.1:3000](127.0.0.1:3000)) and backend server (e.g. [127.0.0.1:3001](127.0.0.1:3001)). Open both addresses as it will take some time for the first compilation.

6. Deactivate any generative autocomplete extensions (like Github Copilot).

**Note**: We highly recommend using the terminal output for debugging errors or logging during development. If your terminal output looks something like seen in the screenshot below, you have successfully completed the setup!
![Screenshot Terminal](./instruction_assets/3_setup_terminal.png)

<h3 style="color: green; text-align: center"> ✅ Successfully completed setup ✅</h3>

---

<h3 style="text-align: center"><a href="./TASK_1.md">You can now move on to TASK 1 (click) ➡️</a></h3>