# Quickstart

1. After completing your payment, you'll receive an email with access to the GitLab repository containing both the Angular frontend and NestJS backend projects.

<figure><img src="/files/PAFFrONBfTgZOblDwvWW" alt=""><figcaption></figcaption></figure>

1. Clone both projects to your local machine.

<figure><img src="/files/2KQRc4xE37ecCCrDNijr" alt=""><figcaption></figcaption></figure>

1. For each project, run the following command to install dependencies:

   ```
   npm i
   ```
2. To set up the database and API, run:

   ```
   docker compose up -d
   ```

### Backend Setup

#### Environment Variables

Create a `.env` file in the root of your backend project and add the following variables:

```
API_NAME=db-api
PORT_HTTP=4001

DATABASE_URL=postgresql://dbuser:dbpassword@db-postgres:5432/db

FIREBASE_API_KEY=...
FIREBASE_AUTH_DOMAIN=..
FIREBASE_PROJECT_ID=...
FIREBASE_PRIVATE_KEY=-...
FIREBASE_CLIENT_EMAIL=...
FIREBASE_STORAGE_BUCKET=...

STRIPE_SECRET_KEY=...
STRIPE_WEBHOOK_SECRET=...
```

### Frontend Setup

In the Angular project, locate the `app.config.ts` file and update the `firebaseConfig` object with your Firebase credentials:

```typescript
const firebaseConfig = {
  apiKey: "...",
  authDomain: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "...",
  measurementId: "..."
};
```

### Third-Party Services Setup

#### Stripe

1. Create a Stripe account at [stripe.com](https://stripe.com).
2. Retrieve your API keys from the Stripe dashboard.
3. Update the `STRIPE_SECRET_KEY` and `STRIPE_WEBHOOK_SECRET` in your backend `.env` file with your Stripe credentials.

#### Firebase

1. Create a new project on the [Firebase Console](https://console.firebase.google.com/).
2. Set up Authentication and Storage services for your project.
3. Retrieve your Firebase configuration and credentials.
4. Update the Firebase-related environment variables in your backend `.env` file.
5. Update the `firebaseConfig` object in your frontend `app.config.ts` file.

### Running the Application

1. Start the backend server:

   ```
   npm run start:dev
   ```
2. Start the frontend development server:

   ```
   ng serve
   ```

Your SaaS application should now be up and running! Access the frontend at `http://localhost:4200` and the backend API at `http://localhost:4001`.\
\
![](/files/89mgzQ27gZmc2PnOIX5i)![](/files/b5n7yr5bJhzDxlvKAFRZ)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://syndrom.gitbook.io/syndrom/getting-started/quickstart.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.