For this project you will need:
- NodeJS v18 or later.
- Vite.
- A Squid Cloud account and a Squid application. To sign up for Squid, go to Squid Cloud Console. Once signed up, you can create an application.
- The Squid Cloud CLI (
npm i @squidcloud/cli
).
After cloning this project, go to the Squid Cloud Console, create an application and click the Create .env file button under Backend project. This provides you with the command to create the .env
file required for this template to work and run.
Change to the backend directory, and install the required dependencies:
cd backend
npm install
Run the initialization command you copied from the console. The command has the following format:
squid init-env \
--appId YOUR_APP_ID \
--apiKey YOUR_API_KEY \
--environmentId YOUR_ENVIRONMENT_ID \
--squidDeveloperId YOUR_SQUID_DEVELOPER_ID \
--region YOUR_REGION
Open a new terminal window and navigate to the frontend
directory. You should now have two terminal windows open: one in which you will run the local backend server, and one in which you will run the frontend. Complete the environment setup with the following steps, ensuring you're in the frontend
directory:
npm run setup-env
This command prepares your .env
file for the Vite environment by generating a frontend/.env.local
file.
To launch the local backend server of your Squid application, run the following command from the backend
directory:
squid start
You'll see output similar to the following, indicating that your server is up and running:
> nodemon --watch ./src --exec ts-node -r tsconfig-paths/register src/main.ts
[Nest] 68047 - 03/15/2024, 7:55:23 PM LOG [NestApplication] Nest application successfully started +1ms
Initialize the frontend server by running the following commands in the frontend
directory:
npm install
npm run dev
Verify that Vite server has started, providing URLs to access your app:
VITE v5.1.6 ready in 149 ms
➜ Local: http://localhost:5173/
➜ Network: use --host to expose
➜ press h + enter to show help
With both servers running, visit http://localhost:5173/ in your web browser.