feat(cli): Add the new frontend command

.github/workflows/ci.yml

@@ -536,10 +536,22 @@ jobs:
     - name: Wait for DB
       run: sleep 10
     - name: Run Platformatic DB server and E2E tests
+      id: build
       run: |
         node ./packages/cli/cli.js db start --config=./packages/db-dashboard/test/e2e/fixtures/e2e-test-config.json &
         sleep 5 &&
         cd packages/db-dashboard && pnpm run test:e2e
+    - name: Run Platformatic frontend cli and E2E tests
+      run: |
+        node ./packages/cli/cli.js db migrations apply --config=./packages/frontend-template/test/e2e/fixtures/platformatic.e2e.db.json &&
+        node ./packages/cli/cli.js db start --config=./packages/frontend-template/test/e2e/fixtures/platformatic.e2e.db.json &
+        sleep 5 &&
+        rm -rf packages/frontend-template/src/platformatic-generated-code
+        mkdir -p packages/frontend-template/src/platformatic-generated-code &&
+        cd packages/frontend-template/src/platformatic-generated-code &&
+        node ../../../cli/cli.js frontend http://127.0.0.1:9999 ts &&
+        pnpm run test:types &&
+        pnpm run test:e2e
 
   dependency-check:
     needs: setup-node_modules

CONTRIBUTING.md

@@ -156,6 +156,14 @@ If you encounter issues running tests (f.e. failing tests without making a chang
 
 __Before opening a pull request, please ensure that the tests are passing for the specific project you are working on.__
 
+### Updating the CLI docs
+
+The [cli.md](./docs/reference/cli.md) file is automatically generated through the [gen-cli-doc.mjs](./scripts/gen-cli-doc.mjs) script and you must not manually change it.
+
+To update the CLI docs:
+1. Update/add the txt helpers
+2. run `node scripts/gen-cli-doc.mjs`
+
 ### Releasing
 
 All platformatic modules share the same release number and are released

docs/getting-started/movie-quotes-app-tutorial.md

@@ -1,3 +1,5 @@
+import NewApiProjectInstructions from '../getting-started/new-api-project-instructions.md';
+
 # Movie Quotes App Tutorial
 
 This tutorial will help you learn how to build a full stack application on top
@@ -51,33 +53,7 @@ mkdir -p tutorial-movie-quotes-app/apps/movie-quotes-api/
 cd tutorial-movie-quotes-app/apps/movie-quotes-api/
 ```
 
-```bash
-npm create platformatic@latest
-```
-
-This interactive command-line tool will ask you some questions about how you'd
-like to set up your new Platformatic project. For this guide, select these options:
-
-```
-- Which kind of project do you want to create?  => DB
-- Where would you like to create your project?  => (.)
-- Do you want to create default migrations?     => No
-- Do you want to create a plugin?               => No
-- Do you want to use TypeScript?                => No
-- Do you want to install dependencies?          => Yes (this can take a while)
-- Do you want to generate types?                => Yes
-- Do you want to create the github action to deploy this application to Platformatic Cloud dynamic workspace? => No
-- Do you want to create the github action to deploy this application to Platformatic Cloud static workspace?  => No
-```
-Once the wizard is complete, you'll have a Platformatic app project in the
-folder `movie-quotes-api`, with example migration files and a plugin script.
-
-:::info
-
-Make sure you run the `npm/yarn/pnpm install` command manually if you
-didn't ask the wizard to do it for you.
-
-:::
+<NewApiProjectInstructions/>
 
 ### Define the database schema
 
@@ -397,7 +373,7 @@ And then we'll create a new `Astro` project:
 npm create astro@latest -- --template basics
 ```
 
-It will ask you some questions about how you'd like to set up 
+It will ask you some questions about how you'd like to set up
 your new Astro project. For this guide, select these options:
 
   **Where should we create your new project?**
@@ -1483,7 +1459,7 @@ We'll use `fluent-json-schema` to help us generate a JSON Schema. We can then
 use this schema to validate the request path parameters for our route (`id`).
 
 :::tip
-You can use [fastify-type-provider-typebox](https://github.com/fastify/fastify-type-provider-typebox) or [typebox](https://github.com/sinclairzx81/typebox) if you want to convert your JSON Schema into a Typescript type. See [this GitHub thread](https://github.com/fastify/fluent-json-schema/issues/78#issuecomment-669059113) to have a better overview about it. Look at the example below to have a better overview. 
+You can use [fastify-type-provider-typebox](https://github.com/fastify/fastify-type-provider-typebox) or [typebox](https://github.com/sinclairzx81/typebox) if you want to convert your JSON Schema into a Typescript type. See [this GitHub thread](https://github.com/fastify/fluent-json-schema/issues/78#issuecomment-669059113) to have a better overview about it. Look at the example below to have a better overview.
 :::
 
 Here you can see in practice of to leverage `typebox` combined with `fastify-type-provider-typebox`:

docs/getting-started/new-api-project-instructions.md

@@ -0,0 +1,54 @@
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+Run this command in your terminal to start the Platformatic creator wizard:
+
+<Tabs groupId="package-manager-create">
+<TabItem value="npm" label="npm">
+
+```bash
+npm create platformatic@latest
+```
+
+</TabItem>
+<TabItem value="yarn" label="yarn">
+
+```bash
+yarn create platformatic
+```
+
+</TabItem>
+<TabItem value="pnpm" label="pnpm">
+
+```bash
+pnpm create platformatic@latest
+```
+
+</TabItem>
+</Tabs>
+
+This interactive command-line tool will ask you some questions about how you'd
+like to set up your new Platformatic project. For this guide, select these options:
+
+```
+- Which kind of project do you want to create?  => DB
+- Where would you like to create your project?  => quick-start
+- Do you want to create default migrations?     => Yes
+- Do you want to create a plugin?               => Yes
+- Do you want to use TypeScript?                => No
+- Do you want to install dependencies?          => Yes (this can take a while)
+- Do you want to apply the migrations?          => Yes
+- Do you want to generate types?                => Yes
+- Do you want to create the github action to deploy this application to Platformatic Cloud dynamic workspace? => No
+- Do you want to create the github action to deploy this application to Platformatic Cloud static workspace?  => No
+```
+
+Once the wizard is complete, you'll have a Platformatic app project in the
+folder `quick-start`, with example migration files and a plugin script.
+
+:::info
+
+Make sure you run the npm/yarn/pnpm command `install` command manually if you
+don't ask the wizard to do it for you.
+
+:::

docs/getting-started/quick-start-guide.md

@@ -1,6 +1,8 @@
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
 
+import NewApiProjectInstructions from './new-api-project-instructions.md';
+
 # Quick Start Guide
 
 In this guide you'll learn how to create and run your first API with
@@ -20,72 +22,22 @@ Platformatic supports macOS, Linux and Windows ([WSL](https://docs.microsoft.com
 
 To follow along with this guide you'll need to have these things installed:
 
-- [Node.js](https://nodejs.org/) >= vv18.8.0 or >= v19.0.0
+- [Node.js](https://nodejs.org/) >= v18.8.0 or >= v19.0.0
 - [npm](https://docs.npmjs.com/cli/) v7 or later
 - A code editor, for example [Visual Studio Code](https://code.visualstudio.com/)
 
 ## Create a new API project
 
 ### Automatic CLI
 
-Run this command in your terminal to start the Platformatic creator wizard:
-
-<Tabs groupId="package-manager-create">
-<TabItem value="npm" label="npm">
-
-```bash
-npm create platformatic@latest
-```
-
-</TabItem>
-<TabItem value="yarn" label="yarn">
-
-```bash
-yarn create platformatic
-```
-
-</TabItem>
-<TabItem value="pnpm" label="pnpm">
-
-```bash
-pnpm create platformatic@latest
-```
-
-</TabItem>
-</Tabs>
-
-This interactive command-line tool will ask you some questions about how you'd
-like to set up your new Platformatic project. For this guide, select these options:
-
-```
-- Which kind of project do you want to create?  => DB
-- Where would you like to create your project?  => quick-start 
-- Do you want to create default migrations?     => Yes
-- Do you want to create a plugin?               => Yes
-- Do you want to use TypeScript?                => No
-- Do you want to install dependencies?          => Yes (this can take a while)
-- Do you want to apply the migrations?          => Yes
-- Do you want to generate types?                => Yes
-- Do you want to create the github action to deploy this application to Platformatic Cloud dynamic workspace? => No
-- Do you want to create the github action to deploy this application to Platformatic Cloud static workspace?  => No
-```
-
-Once the wizard is complete, you'll have a Platformatic app project in the
-folder `quick-start`, with example migration files and a plugin script.
-
-:::info
-
-Make sure you run the npm/yarn/pnpm command `install` command manually if you
-don't ask the wizard to do it for you.
-
-:::
+<NewApiProjectInstructions/>
 
 #### Start your API server
 
 In your project directory, run this command to start your API server:
 
 ```bash
-npm start 
+npm start
 ```
 
 Your Platformatic API is now up and running! 🌟
@@ -176,7 +128,7 @@ pnpm add platformatic
 #### Add a database schema
 
 In your project directory (`quick-start`), create a file for your sqlite3 database and also, a `migrations` directory to
-store your database migration files: 
+store your database migration files:
 
 ```bash
 touch db.sqlite