Full-stack Application
application.nucal.com is an all-in-one platform for automating modern web projects. While the application allows to import an existing front-end project, also allows an existing front-end & back-end application to be ready to deploy with the help of a git provider. Import an existing frontend and backend project from a Git repository and deploy it on application.nucal.com. When importing own existing project repository to NuCAL application, continuous deployment will automatically update the your site each time the customer push changes
To create full-stack application
1. Go to the Application page
2. Click the Add application button
3. Select Full-stack Application
4. Connect to GitHub account
5. Give repository access permission
6. Pick a repository for front-end
7. Set front-end settings
8. Pick a repository for the backend
9. Set backend settings
10. Select a plan
11. Confirm and Payment
Deployment starts automatically, and for the manage your application clicks the Manage Application Button. The system redirects to nucal application portal.
GitHub Repository
If this is your first application, you’ll need to connect Nucal application to your GitHub account and Authorize NuCAL on GitHub.
Info
There may be occasions where you need to re-authenticate your GitHub account, for example, when we release an update to the GitHub integration or if you have not visited the Applications page for 3 months or more. This is because nucal application uses user access tokens to make calls to GitHub in the user’s name, and these tokens expire if they have not been used for 3 months or more.
select template
-Build a web application
connect to github
-Authorize NuCAL to connect to your GitHub account.
Connect Git Provider
You can specify exactly what this application has access to on the next screen. We aim to have as little access as possible to your data, so we recommend not giving the application access to all repositories. Click Only select repositories, and choose the repository you would like to deploy.
When clicking the GitHub button the Next button displays as active.
Deployment starts automatically, and for the manage your application clicks the Manage Application Button.
connect to github
-Connect NuCAL with your GitHub account.
Pick a frontend repository from Github
• The repositories in your Github account you are connected to are listed. If you have given permission for a single repository on GitHub, one repository will be listed, if you have allowed all repositories, all repositories will be listed.
• The existing repository as Public or Private is displayed on the repository list.
• You can search by repository name from the Search field.
• After selecting the repository, the Next button displays active.
• Click the Next button to proceed to the next step.
• If a previously used repository is selected again in the application, the system will display a warning message. You need to select a new repository.
Front-end Basic Build Settings
• Base directory: Specifies the directory that our buildbot changes to before starting a build. It’s where our build system checks for dependency management files such as package.json or .nvmrc. If not set, the base directory defaults to the root of the repository.
• Build command: where you should specify the command to run to build your site if you are using a static site generator or other build tool. For example, npm run build. The build command runs in the Bash shell, allowing you to add Bash-⁠compatible syntax to the command.
• Publish directory: directory (relative to the root of your repo) that contains the deploy-ready HTML files and assets generated by the build. If a base directory has been specified, it should be included in the publish directory path. For example, if your base directory is set to site, the publish directory should include the site/ prefix like so: site/public.
• Default branch: Set the branch that will be deployed on changes and manually.
Front-end Environment Variables
Environment variables allow you to configure your site’s build and functionality based on different parameters and deploy contexts. Environment variables are accessible during your build. This allows you to change behaviors based on deploy parameters or to include information you don’t want to save in your repository, such as API keys.
To use these environment variables, you need to ensure they’re set in the environment where the build will run - on NuCAL application through continuous deployment or in your local development environment.
Things to Pay Attention
• Maximum 10 environment variables can added.
connect to github
-Pick a repository
connect to github
-Front-end Basic Build Settings
Pick a backend repository from Github
• The repositories in your Github account you are connected to are listed. If you have given permission for a single repository on GitHub, one repository will be listed, if you have allowed all repositories, all repositories will be listed.
• The existing repository as Public or Private is displayed on the repository list.
• You can search by repository name from the Search field.
• After selecting the repository, the Next button displays active.
• Click the Next button to proceed to the next step.
• If a previously used repository is selected again in the application, the system will display a warning message. You need to select a new repository.
Info
Your frontend and backend applications can be in the same repo. The system allows the selects the same repository within two applications. If your application is in two different repositories, you should select the repository where your Frontend project is located in the Pick a Frontend repository step and the repository where your Backend application is located in the Pick a Backend repository step.
Backend Basic Build Settings
• Base directory: Specifies the directory that our buildbot changes to before starting a build. It’s where our build system checks for dependency management files such as package.json or .nvmrc. If not set, the base directory defaults to the root of the repository.
• Build command: where you should specify the command to run to build your site if you are using a static site generator or other build tool. For example, npm run build. The build command runs in the Bash shell, allowing you to add Bash-⁠compatible syntax to the command.
• Default branch: Set the branch that will be deployed on changes and manually.
Backend Environment Variables
Environment variables allow you to configure your site’s build and functionality based on different parameters and deploy contexts. Environment variables are accessible during your build. This allows you to change behaviors based on deploy parameters or to include information you don’t want to save in your repository, such as API keys.
To use these environment variables, you need to ensure they’re set in the environment where the build will run - on NuCAL application through continuous deployment or in your local development environment.
connect to github
-Pick a backend repository
connect to github
-Backend Basic Build Settings
connect to github
-Environment Variables
Select a Plan
Review your application’s monthly usage costs and confirm your payment method.
By default, the system offers you a limited package. With this Developer package, you can create applications, databases and websites.
Package Included:
- Managed Web Hosting (0.25 CPU, 0.5 GB RAM)
- Full Stack Application Hosting (0.25 CPU, 0.5 GB RAM)
- Hosted Database (0.25 CPU, 0.5GB RAM)
- 300 min build minutes
When the limits in the package are exceeded, you must switch to a new upper package. The more resources the build machine has, the faster the build process will run.
In order for your application to run faster and have more memory, you can start by choosing one of the Application Developer or Scrum Team packages directly.
Another option is to start your application with the developer package and then switch to the upper package.
After the choosing the plan, click the Continue button. The next step will open.
connect to github
-Select a plan
Finalize and Confirm
On the Finalize and Confirm page, you can see a summary field for the package you selected. In the Review Plan field, your payment information and the total amount for the selected package are displayed. If you want to continue with a different plan, you can click the Back button and choose a different plan in the previous step. If you have credit card information registered to the system in the Payment Method field, it will be listed. If you want to continue paying with a new card, you must click on the New Payment Method field. To pay with a new credit card, you must correctly fill in the fields related to the credit card opened on the page. When the process is complete, click the Confirm Payment method button. When your payment transaction is successful, your application will be created and the amount will be purchase from your card.
When clicking Confirm Payment button the deployment will start. You can manage your application by clicking Manage Application button on the Finish Page.
connect to github
-Finalize and Confirm