Working with Your Workspace

File Navigation

• Use the Explorer panel to navigate between all three folders
• The “Monorepo Root” section shows your top-level files
• Use Ctrl+P (or Cmd+P on Mac) to quickly open files from any part of your project

Integrated Terminal Management

Open separate terminals for each project:

1. Open terminal (Ctrl + `)
2. Click the + dropdown next to the terminal tabs
3. Select the folder where you want the terminal to open
4. Run your development servers:
   • Frontend terminal: npm run dev
   • Backend terminal: fastapi dev main.py

Git Management

Since everything is in one repository:

• All changes from frontend, backend, and root files appear in a single Source Control panel
• You can commit changes from all projects together
• Branching affects the entire monorepo
• This keeps everything synchronized and simplifies deployment

Common Workflows

Starting Development

1. Open your project.code-workspace file in VSCode
2. Open an integrated terminal for the backend folder
3. Activate the virtual environment: source venv/bin/activate (Linux/Mac) or venv\Scripts\activate (Windows)
4. Start FastAPI: fastapi dev main.py
5. Open a new terminal for the frontend folder
6. Start React: npm run dev

Making Changes Across Projects

1. Modify your FastAPI endpoints in the backend folder
2. Switch to the frontend folder to update API calls
3. Update documentation in the monorepo root if needed
4. All changes appear in one Git panel for easy committing

Managing Documentation and Configuration

• Edit README.md from the Monorepo Root folder
• Update .gitignore to exclude files from both projects
• Add project-wide scripts or configuration files at the root level