Development Guides
Generated Applications
Application Deployment AWS

Application Deployment on AWS

Amazon Web Services (opens in a new tab) or (AWS) is a subsidiary of Amazon providing on-demand cloud computing platforms and APIs to individuals, companies, and governments on a metered pay-as-you-go basis. AWS was launched in 2006, and over the years, it has grown to become the leading cloud service provider in the world.

For deploying the ROQ-generated application in AWS, several options are available due to the vast range of cloud computing products offered by AWS. We need two types of services for our generated application:

  • Hosting: The application can be deployed using Amazon EC2, Amazon Elastic Beanstalk, or AWS Amplify. Each AWS product has a different workflow for deployment. We will use AWS Amplify to ensure simplicity and faster deployment.

  • Database: ROQ's generated application default database is PostgreSQL. In AWS, we can use Amazon RDS to create the PostgreSQL database.

To follow this tutorial, you should have an AWS account (opens in a new tab). AWS also provides free tier (opens in a new tab) for a new user.

We will deploy the ROQ generated application in AWS Amplify after creating the database on Amazon RDS.

Amazon RDS

Amazon Relational Database Service (opens in a new tab) (Amazon RDS) is a cloud-based database service provided by Amazon Web Services (AWS). It is designed to make it easier for developers to set up, operate, and scale relational databases in the cloud. Amazon RDS supports several popular relational database engines: MySQL, PostgreSQL, MariaDB, Oracle, Microsoft SQL Server, and Amazon Aurora.

By default, ROQ-generated applications use PostgreSQL as the database. We can create and setup the database using Amazon RDS.

Create PostgreSQL

Go to AWS Console (opens in a new tab) for RDS, then click the Create database button. This will bring us to the database page:

create aws postgresql

This is a one-long page settings page, so we will only display what has changed while leaving the rest as its default. These are the settings that we modified for the purpose of this tutorial:

  • Engine options: Choose the PostgreSQL database
  • Templates: Free tier
  • Settings → Db instance identifier: animefiguredb
  • Settings → Master Password: Manual password entry (save it)
  • Connectivity → Public access: Yes

After creating a database, it will appear in the list of databases in the region where it was created. For example, if the database was created in us-east-1c (N. Virginia), it will be listed under that region.

Amazon database list

To access the database information, click on the name of the database as it is listed. For example, by clicking the animefiguredb DB identifier.

Database Information

The necessary details for establishing a database connection can be found under the Connectivity & Security and Configuration tabs. Specifically, we require the database URL, endpoint, and port number (the username and password have already been set up).

Database information

The security group rules also need to be configured to connect the PostgreSQL database from outside the Amazon Web Services network.

rds security rules

The CIDR/IP - Inbound type with the rule allows any traffic from outside the AWS network. Turning off this rule or limiting it to specific IPs is recommended.

Connect to Database

The recommended way to connect to Amazon RDS is by using SSL/TLS connections. By default, our database uses a Certificate Authority (CA), which can be found in the Connectivity & security tab. To connect to the PostgreSQL database outside the network, we must download a certificate bundle. We can download certificate bundles for all AWS regions (opens in a new tab) or certificate bundles for specific AWS regions (opens in a new tab).

From our PostgreSQL setup earlier, we have our connection data:

passwordGet your saved password or modify the existing password
dbnamepostgres (the default dbname if it's not set)
certificate bundleus-east-1-bundle.pem (opens in a new tab)

Store the certificate bundle us-east-1-bundle.pem in the application project root directory. This certificate is only required if connecting to the database from outside the AWS network. We can use the psql CLI tool to test the database connection:

psql "postgresql://"


ROQ's generated application needs the DATABASE_URL environment variable to work. Since we already know the connection information, we can form the database URI and set the environment variable:


To develop a generated application locally and want to use a database other than the ROQ provided, you can read this database installation documentation.

AWS Amplify

AWS Amplify (opens in a new tab) is a service from Amazon Web Services (AWS) that enables developers to build and deploy scalable and secure cloud-powered web and mobile applications. Amplify aims to simplify the process of building apps by providing a managed backend for handling authentication, storage, APIs, and other cloud functionalities. Amplify provides two services: Amplify Hosting and Amplify Studio.

To learn more about AWS Amplify, we recommend reading their official documentation (opens in a new tab).

Amplify Hosting is a fully managed hosting service for web apps. We will use this service to connect a repository, build, deploy, and host the web application.

To include the generated application code in your own GitHub repository, please follow our tutorial on application development.

In this tutorial, we will use the GitHub repository. There are a few steps that need to be taken care of:

Connect to GitHub

Amplify Hosting provides clear steps to get started on web hosting using GitHub. Choose GitHub as the source for the generated application.

AWS Amplify GitHub

Select Repository

To use a GitHub repository with Amplify Hosting, first install and authorize AWS Amplify.

AWS GitHub authorize

We have the option to grant authorization for all repositories or to select a specific repository for better control. Private repository is also supported.

add repository

To add a repository, select the repository and the default branch to be deployed.

Build Settings

For our ROQ-generated application, we need the Base URL. Unfortunately, we are unable to determine the URL until the application has been deployed or moved to the build state.


First time build will fail because we still need to setup the environment variables.

build failed

From the build information, we can get the Domain or the Base URL for our deployed application:

Set Environment Variables

Read this documentation section first on how to get the environment variables from ROQ Console.

In AWS Amplify, navigate to App settings, select Environment variables, and manually enter variables from ROQ Console or the .env file.

aws amplify build env

And also, add the DATABASE_URL from our previous setup:



AWS Amplify has an application build specification that can be edited through App settings or overridden by the amplify.yaml file. The build specification YML file controls how an app build will run and is stored on the servers.

To edit the build specification in the AWS Amplify, go to App settings, select Build settings, and edit App build specification.

build spec

We can override the AWS Amplify setting above by creating a amplify.yaml file on the application project root directory:

version: 1
        - npm install
        - env | grep -e ROQ_BASE_URL -e ROQ_PLATFORM_URL -e ROQ_ENVIRONMENT_ID -e ROQ_API_KEY >> .env
        - npm run build
    baseDirectory: .next
      - '**/*'
      - node_modules/**/*

Please note that environment variables that were previously entered manually are available only in build time. To make the environment variables available in runtime, we need to save the environment variables into a .env file.


Amplify Hosting supports adding environment variables to your application's builds by setting them in the project's configuration in the Amplify console. However, a Next.js server component cannot access those environment variables by default. For more information, please read it here (opens in a new tab).

Rebuild After Deployment

After the environment variables are setup, we can redeploy the application in Amplify Hosting. Click the application name. For example, anime-figure-store, this will bring us to the app homepage.

aws amplify main branch

Click the branch main that will bring us to the branch build details.

aws amplify main branch deploy

And click the Redeploy this version button to build and redeploy.

Test Application

To test the application, open the browser and go to the URL:

Initially, no users are registered. We can create an account in the application and manage it through the ROQ Console.

aws amplify deploy URL

Whenever we make changes to the source code and push it to the GitHub repository, AWS Amplify Hosting will automatically build the latest version of the application. This way, we will always have access to the most up-to-date version of the application.

ROQ Environment

The ROQ-generated application will work as expected if we configure the right environment settings. We must create a new environment on ROQ Console (opens in a new tab).

Select the desired application from the ROQ Console and add a new environment, or navigate to the ROQ Console Environment (opens in a new tab) for the active application.

AWS amplify roq env

We can call the new environment anything, for example, Amazon AWS. Later, we need to configure the base URL for the deployed application.

We already have information for the Base URL from our Amplify Hosting build. In the ROQ Console, go to the Application DetailsSettings to configure the environment variables.


We need to setup the Base URL and all the Authentication URLs.

Base URL
URL
Allowed Logout URLs
Allowed Callback URLs

Click the Copy Env File button to copy the environment variables and save them in a .env file in the application project root.


Please check the compute logs if the deployed application is not running as expected, such as an Internal Server Error. To read the logs on AWS Amplify, go to the App settings, then select Monitoring, and finally select Hosting compute logs.

And please look into our FAQ documentation section for other troubleshooting.