This repository is a starter with Angular for the front end and Strapi for the back end. You can easily deploy these applications on Netlify for Angular and Heroku for Strapi. To do this, please follow the instructions below
First, clone the repository inside your local folder and install dependencies
git clone https://github.com/LouisAugry/angular-strapi-starter.git
mv angular-strapi-starter your-new-name
cd your-new-name/apps/backend
npm install
cd ../frontend
npm install
Follow the instructions below to deploy Strapi to Heroku. In this repository, the sgbd is PostgreSQL
Path — ./apps/backend
Before running your server in production you need to build you admin panel for production
NODE_ENV=production npm run build
This is a step-by-step guide for deploying a Strapi project on Heroku. Databases that work well with Strapi and Heroku are provided instructions on how to get started.
You must have a free Heroku account before doing these steps.
If you already have the Heroku CLI installed locally on your computer. Skip to [Login to Heroku]
Also available via Homebrew:
brew tap heroku/brew && brew install heroku
Run the following from your terminal:
sudo snap install --classic heroku
Download the appropriate installer for your Windows installation:
64-bit installer 32-bit installer
Next, you need to login to Heroku from your computer.
heroku login
Follow the instructions and return to your command line.
Commit your project to your repository.
git init
git add .
git commit -am "Initial Commit"
Create a new Heroku project.
heroku create
(You can use heroku create custom-project-name, to have Heroku create a custom-project-name.heroku.com URL. Otherwise, Heroku will automatically generating a random project name (and URL) for you.)
NOTE
If you have a Heroku project app already created. You would use the following step to initialize your local project folder:
heroku git:remote -a your-heroku-app-name
Your local development environment is now set-up and configured to work with Heroku. You have a new Strapi project and a new Heroku app ready to be configured to work with a database and with each other.
Follow these steps to deploy your Strapi app to Heroku using PostgreSQL:
1. Install the Heroku Postgres addon for using Postgres.
To make things even easier, Heroku provides a powerful addon system. In this section, you are going to use the Heroku Postgres addon, which provides a free "Hobby Dev" plan. If you plan to deploy your app in production, it is highly recommended to switch to a paid plan.
heroku addons:create heroku-postgresql:hobby-dev
The add-on automatically exposes the database credentials into a single environment variable accessible by your app. To retrieve it, type:
heroku config
This should print something like this:
DATABASE_URL: postgres://ebitxebvixeeqd:dc59b16dedb3a1eef84d4999sb4baf@ec2-50-37-231-192.compute-2.amazonaws.com: 5432/d516fp1u21ph7b.
(This url is read like so: postgres:// USERNAME : PASSWORD @ HOST : PORT : DATABASE_NAME)
Strapi expects a variable for each database connection configuration (host, username, etc.). So, from the url above, you have to set several environment variables in the Heroku config:
heroku config:set DATABASE_USERNAME=ebitxebvixeeqd
heroku config:set DATABASE_PASSWORD=dc59b16dedb3a1eef84d4999a0be041bd419c474cd4a0973efc7c9339afb4baf
heroku config:set DATABASE_HOST=ec2-50-37-231-192.compute-2.amazonaws.com
heroku config:set DATABASE_PORT=5432
heroku config:set DATABASE_NAME=d516fp1u21ph7b
Note: Please replace these above values with the your actual values.
Replace the contents of database.json with the following:
Path: .apps/backend/config/environments/production/database.json.
{
"defaultConnection": "default",
"connections": {
"default": {
"connector": "strapi-hook-bookshelf",
"settings": {
"client": "postgres",
"host": "${process.env.DATABASE_HOST}",
"port": "${process.env.DATABASE_PORT}",
"database": "${process.env.DATABASE_NAME}",
"username": "${process.env.DATABASE_USERNAME}",
"password": "${process.env.DATABASE_PASSWORD}",
"ssl": true
},
"options": {}
}
}
}
Unless you originally installed Strapi with PostgreSQL, you need to install the pg node module.
Path: ./apps/backend
npm install pg --save
git commit -am "Update database config"
git subtree push apps/backend server heroku master
The deployment may take a few minutes. At the end, logs will display the url of your project (e.g. https://mighty-taiga-80884.herokuapp.com). You can also open your project using the command line:
heroku open
If you see the Strapi Welcome page, you have correctly set-up, configured and deployed your Strapi project on Heroku. You will now need to set-up your admin user as the production database is brand-new (and empty).
You can now continue with the Tutorial - Creating an Admin User, if you have any questions on how to proceed.
NOTE
For security reasons, the Content Type Builder plugin is disabled in production. To update content structure, please make your changes locally and deploy again.
When Strapi is deployed to Heroku, Heroku sets the environment variable to NODE_ENV=production. In production mode Strapi disables the content-type builder (for security reasons). Additionally, if you wanted to change the default production mode in Heroku, it wouldn't work as the file system is temporary. Strapi writes files to the server when you update the content-types and these updates would disappear when Heroku restarts the server.
Therefore, modifications that require writing to model creation or other json files, e.g. creating or changing content-types, require that you make those changes on your dev environment and then push the changes to Heroku.
As you continue developing your application with Strapi, you may want to use version control, or you can continue to use Git push heroku master to commit and push changes to Heroku directly.
Path: ./apps/backend
git add .
git commit -am "Changes to my-project noted"
git push heroku master
heroku open
-
If you have not signed up yet on netlify, visit www.netlify.com and click Login
-
Login with your Github account.
-
Click New Site from Git
-
Select Github under Continuous Deployment and Authorize netlify’s access to your github repository. This takes you to next step: Pick a repository
-
Search and select the repository on your github you would like to publish to Netlify
-
At the third stage: ‘Build options, and deploy!’, select the master branch.
-
Click Deploy site (let empty basic build settings)
-
Now at each push to the master branch, it's going to deploy