Run Local Development

Setup & Installation

There are a few steps to run the generated application for local development.

Setup Environment Variables

To run the generated application locally, you need to copy the environment settings. In the ROQ Console go to the Application Details → Environments menu and then Copy Env File in the Local Development section.

Paste the environment settings into the file .env in the root of the generated application project, you need to create this file if it doesn't exist. For instance, bistro-94be has these settings:

# .env
# Public variables, used on client - Delete these if you are not using Next.js
NEXT_PUBLIC_ROQ_CLIENT_ID=0da52755-06d4-46cf-b64b-c7a433f4f56a
NEXT_PUBLIC_ROQ_PLATFORM_URL=https://qa02.roq-platform.com

# If you change the host or port on your local installation from http://localhost:3000 to another value,
# then you need to update the settings in the console as well. ROQ Console: https://console.roq.tech/
# Modify this to your application URL
NEXT_PUBLIC_BASE_URL=http://localhost:3000

# Server variables used for ROQ connection
ROQ_BASE_URL=http://localhost:3000
ROQ_PLATFORM_URL=https://qa02.roq-platform.com
ROQ_ENVIRONMENT_ID=0da52755-06d4-46cf-b64b-c7a433f4f56a
ROQ_API_KEY=9be9dd8d-371d-4eb4-9cc9-004b214ade4c

# Server variables for ROQ auth
ROQ_SECRET=CHANGE_THIS_SECRET
ROQ_CLIENT_ID=0da52755-06d4-46cf-b64b-c7a433f4f56a
ROQ_CLIENT_SECRET=9be9dd8d-371d-4eb4-9cc9-004b214ade4c
ROQ_AUTH_CALLBACK_URL=http://localhost:3000/api/auth/callback
ROQ_AUTH_LOGIN_URL=http://localhost:3000/api/auth/login
ROQ_AUTH_LOGOUT_URL=http://localhost:3000/api/auth/logout
ROQ_AUTH_URL=https://0t2xvgrhx2cccakulsofdq8a2.auth.qa02.roq-platform.com

DATABASE_URL=we_will_set_it_later

Install Database

The generated application uses Prisma ORM (opens in a new tab) so you can use any database that is supported by Prisma. For this tutorial, we will use PostgreSQL (opens in a new tab) and then we will add DATABASE_URL key value in the env file.

PostgreSQL is an open-source relational database. You can install the database from this link (opens in a new tab).

To create a database, we will use pgAdmin, a bundled GUI application for administering PostgreSQL. Let's call this database a bistro.

pgAdmin

With the default PostgreSQL installation and with the database name bistro, the database URL for the generated application is:

DATABASE_URL=postgresql://postgres:3113@127.0.0.1/bistro

Run The Application

To run the application type this command in the terminal

npm run dev

By default, the local application will be running on http://localhost:3000 and for first-time use, you need to create an account to be able to use the generated application.

Bistro app

If you want the application to run on another port, change the port value in the .env file as well as the settings in the ROQ Console and go to the Application Details → Settings.

App auth URLs settings

Change the port value only, for example, if the port number is 3000, you can change it to 2112 or any accesible port. Make sure to change Sign-in URL, Allowed Logout URLs, and Allowed Callback URLs and save them.

Troubleshooting Guide

If you encounter any difficulties while running a local development, kindly refer to our FAQ or Troubleshooting section.

Application Development Add/Modify APIs