# Generating a Frontend Demo

Cool, You now have infra and core services up and running! For front-end, CX Cloud CLI allows you to generate a front-end demo to test the concept with end-to-end functionality. Currently, we provide Angular 7 demo. React is coming soon.

## Front-end generation

You start by creating a new package repository for the service in git monorepo, named for example `package-frontend`. Then navigate to this folder and start front-end demo generation by running the following commands:

```bash
$ cd package-frontend
$ cxcloud generate demo
```

You will go through a set of simple questions and receive an end-to-end working demo.

## Configuration

By default, the generated demo uses our live test API including end points with pre-filled sets of data for Commerce, Content and Search services.

In order to enable the frontend demo to work with the APIs you have generated and deployed, configuration files need to be modified. Configuration files can be found in this project directory `/src/environments/`.

To connect with new APIs, change the value of `apiUrl` for each service (notice that environments files should be modified depending on the used environment). If frontend and APIs running on the same domain, it is enough to use only relative paths to the APIs:

```javascript
export const environment = {
  production: false,
  siteName: "CXCloud DEV",
  commerce: {
    apiUrl: "/api/service-commerce/v1",
    indexName: "dev_COMMERCE"
  },
  content: {
    apiUrl: "/api/service-content/v1",
    indexName: "dev_CONTENT"
  },
  auth: {
    apiUrl: "/api/service-auth/v1"
  },
  search: {
    apiUrl: "/api/service-search/v1"
  }
};
```

## Local test

In case of Angular demo, to explore it, from inside of the project folder you should run the following command:

```bash
$ npm run dev
```

By default, your demo will be available at `http://localhost:4200/` but check the console logs.

## Deployment

CI/CD pipeline handles the deployment of microservices within the monorepo. Therefore, CI/CD pipeline should be set up and configured prior deployment of the services. More information about CI/CD pipeline configuration and monorepo settings for deployment can be found [here](/v3.0-docs/getting-started-1/setting-up-a-cxcloud-project/configuring-cicd.md).

## Routing

After deployment, you can make your service available to the world using a [Routing Manifest](/v3.0-docs/getting-started-1/setting-up-a-cxcloud-project/routing-manifest.md).

## Commit

As a final step, add git remote origin corresponding to your monorepo and commit changes to your Github repository by running the following commands:

```bash
$ git remote add origin https://github.com/user/my-monorepo.git
$ git add .
$ git commit -m "initial commit"
$ git push
```


---

# 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://docs.cxcloud.com/v3.0-docs/getting-started-1/setting-up-a-cxcloud-project/generating-a-frontend.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.