me-io / angular-7-starter

Ready to use boilerplate project for Angular applications.

Angular Full Stack

The frontend is generated with Angular CLI. The backend is made from scratch. Whole stack in TypeScript.

Prerequisite

• PHP >= 7: runtime environment
• MongoDB: database
• Slim API: backend framework
• Angular CLI: frontend scaffolding

Uses

• Angular 7+: frontend framework
• Bootstrap: layout and styles
• Font Awesome: icons

Prerequisites

1. Install Node.js and MongoDB
2. Install Angular CLI by running the following command:

npm i -g @angular/cli

3. From project root folder install all the dependencies by running the following command inside your terminal:

npm install

Run the app

Development mode

By running the following command a window will automatically open at localhost:4200. Angular and Express files are being watched. Any change automatically creates a new bundle, restart Express server and reload your browser.

npm run dev

Production mode

To run the project with a production bundle and AOT compilation listening at localhost:3000 run the following command:

npm run prod

Deploy to Heroku

1. Go to Heroku and create a new app
2. Install Heroku CLI
3. Run the following command to login to heroku:

heroku login

4. Open the root directory of the project inside your terminal by running:

cd my-project/

5. Inside of the project running the following command will creates a new Git repository

git init

6. Update your heroku app name by running the following command:

heroku git:remote -a your-app-name

7. Download this repo and copy all files into my-project folder
8. Now Edit .gitignore and remove line with /dist text.
9. Edit .env and replace the MongoDB URI with a real remote MongoDB server. You can create a MongoDB server with Heroku or mLab.
10. Install the dependencies by running the following command:

npm install

11. Now build your app by running one of the following command:

ng build -prod 
>> or 
ng build -aot -prod

12. Run the following command

tsc -p server

13. Make a new commit and push the changes to heroku by running the following commands:

git add . 
git commit -m "Going to Heroku"
git push heroku master

14. Now following command will open with your app inside your browser:

heroku open

Running tests

Run the following command inside your terminal to execute the unit tests via Karma.

npm run test

Contributors

A huge thanks to all of our contributors:

Mohamed Meabed 💻 📢	Zeeshan Ahmad 💻 🐛 ⚠️ 📖

License

The code is available under the MIT license.