Angular 9 Application

Angular 9.0.7 + Angular CLI + Angular Universal
Lazy Loading + SSR + PWA + SEO + google Analytics + API REST (Node.js)
Prototype bootstrap
LIVE DEMO

Lighthouse Audit

Table of contents

• Status
• Quick start
• Front-end
• Back-end
• Author
• Documentation

Status

Front-end : What's included

Dependencies

• Angular : 9.0.7
• Angular CLI : 9.0.7
• Angular Universal : 9.0.1
• Bootstrap : 4.4.1
• Fontawesome : 5.12.1
• jquery : 3.4.1

Features

• Routing
• Lazy Loading
• Server Side Rendering
• Progressive Web App
• Responsive Layout
• Search Engine Optimization (SEO)
• Components
• Services
• inheritance
• Search / Grid / Pagination
• Leaflet open-source JavaScript library

Back-end : What's included

Dependencies

• Node.js : 12.16.0
• Express.js : 4.17.1
• pg-promise : 10.4.4

Features

• PostgreSQL
• Database Creation
• Domains Creation
• Tables Creation
• Importing Data
• Exporting Data
• RESTful API

Quick start

# clone the repo
git clone https://github.com/ganatan/angular9-app.git

# change directory
cd angular9-app

# install the repo with npm
npm install

# start the server
npm start

in your browser go to http://localhost:4200

Front-end

Installation

• npm install (installing dependencies)
• npm outdated (verifying dependencies)

Developpement

• npm run start
• in your browser http://localhost:4200

Settings

• you can select one of these Datasources

• Change settings in src/app/modules/application/movies-images-list

• File config/config.service.ts

• default: LOCAL JSON

• LOCAL REST API CRUD : http://localhost:5200

Tests

• npm run lint
• npm run test
• npm run e2e

Compilation

• npm run build ( without SSR)
• npm run build:ssr ( with SSR)

Production

• npm run serve:ssr
• in your browser http://localhost:4000

Prototype Bootstrap

• change directory cd ui
• launch html pages in your browser

Back-end

Installation

• change directory cd api
• npm install (installing dependencies)
• npm outdated (verifying dependencies)

Database Creation

• change login and password for postgreSQL in file config.json

• login":"postgres"

• password":"your_password"

• npm run app (database creation)

Developpement

• npm run start
• in your browser http://localhost:5200

Tests API

• in your browser http://localhost:5200/movies

Author

• Updated : 19/03/2020
• Author : danny

Documentation

English Tutorials

• Installation - https://www.ganatan.com/tutorials/build-full-web-application-with-angular
• Tutorials Step by Step - https://www.ganatan.com/tutorials/en

Tutoriels en français

• Installation - https://www.ganatan.com/tutorials/creer-application-web-complete-avec-angular
• Tutoriels Etapes par étapes - https://www.ganatan.com/tutorials