Development Guides
Generated Applications
Application Development

Generated Application Development

As we stated earlier there is a live version and code repository for the generated application. After successfully generating an application using ROQ's AI Assistant the next step is to begin development such as adding features, doing improvements, etc. To achieve this we need to clone the code into our local development system. To begin local development we need a few software requirements.

The repository name can be searched in the ROQ's public GitHub repositories (opens in a new tab).

The default name for the GitHub repository is the same as the subdomain of the generated application deployed on Vercel. For instance, if the deployed generated application or the live Version URL is https://bistro-94be.vercel.app then the name of the GitHub repository is bistro-94be.

Software Requirements

Git Version Control

The generated application code resides in the GitHub public repository and to begin local development we need a version control software called Git (opens in a new tab).

To check if git is already installed in the local system or not. We can execute this command to the terminal:

git version

If it is already installed then we will get the git version response and then we are good to go to the next step, which is to clone the generated application code.

If the git is not installed, the git documentation website (opens in a new tab) will explain that in detail.

Node.js

The application generated by ROQ AI Assistant is Node.js-based project. At least we need Node.js 16.8 (opens in a new tab) version installed in our system.

To check if Node.js is installed in the system, type this command in the terminal:

node --version

if Node.js is already installed then we can go to the next step, which is to clone the generated application repository.

Clone the Repository

Clone the repository means copying the remote repository code into our local environment. To clone the generated application code from GitHub public repository, for instance, the repository name is bistro-94be.

Before cloning the repo, we need the repository URL from GitHub. Go to the generated application code repository https://github.com/roq-ai-snapshot/bistro-94be then we can copy the HTTPS clone repository URL.

Clone repository

We can also download the zip file version but for this tutorial purpose, we don't do that way.

git clone https://github.com/roq-ai-snapshot/bistro-94be.git

After cloning the repository, we should change the terminal directory to the application project repository and install all the dependencies using npm:

cd bistro-94be
 
npm install

npm is a node package manager and it's bundled with the Node.js installation. There is no need for extra steps to install it.

Remove Origin

Why remove the origin? The ROQ public repository doesn't allow written permission. The other option other than forking and then making a pull request, is to "move" the generated application code to our own repository.

An origin in git is actually an alias for the remote repository URL that we already cloned (that's it: https://github.com/roq-ai-snapshot/bistro-94be.git). To remove an origin from the git repository, we can use the git remote command with the remove option. Here's the syntax:

git remote remove origin

This command will remove the link between our local repository and the origin remote repository. It will not delete any data. We can later add a new origin or re-link to the original origin using git remote add origin.

You can verify that the origin was removed correctly by typing:

git remote -v

This command should now return no output, indicating that there are no remotes connected to our local git repository. The next step is to create a repository on GitHub or other providers such as GitLab or BitBucket. For this tutorial we choose GitHub.

Development on GitHub

Go to the GitHub (opens in a new tab) website and make an account if you haven't done already, then make a repository for our cloned generated application.

Create github repository

You can put any Repository name, and make the repository Public or Private but leave the other fields as it is. After you created it, GitHub will inform you how to add origin and how to push an existing repository.

git remote add origin git@github.com:junwatu/bistro-app.git

The command above adds a new origin or alias of the remote repository URL to our local repository.

Pushing Code to GitHub

To push or send our code to this GitHub repository, type this command:

git branch -M main
git push -u origin main

For local development you need to run the generated application, please go to this tutorial on how to do that.

Code Editor

You can use any code editor or IDE (Integrated Development Environment) to develop the generated application locally, Visual Studio Code (opens in a new tab) is a recommended option for this.