Skip to content

Angular 10 ,Bootstrap 5-alpha, PostgreSQL CRUD REST API, PWA, SSR, Angular Universal,Routing, Lazy loading, Components, Services, Reactive Forms

Notifications You must be signed in to change notification settings

LTOCAY93/angular10-app

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Angular 10 / Bootstrap 5 & CRUD REST API

Ganatan Angular Example Demo

it's a repo designed to create a Web Application with Angular 10

Here is a working live demo : https://angular.ganatan.com/

Angular 10 Example Application

Lighthouse Audit

Table of contents

Status

GitHub stars GitHub forks

Front-end : What's included

Dependencies

  • Angular : 10.2.1
  • Angular CLI : 10.2.0
  • Angular Universal : 10.1.0
  • Bootstrap : 5.0.0-alpha1
  • Fontawesome : 5.15.1
  • jquery : 3.5.1

Features

  • Routing
  • Lazy Loading
  • Server Side Rendering
  • Progressive Web App
  • Responsive Layout
  • Search Engine Optimization (SEO)
  • Components
  • Services
  • Reactive Form
  • Template Driven Forms
  • Search / Grid / Pagination
  • Leaflet

Quick start

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

# change directory
cd angular10-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

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:5204

Tests

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

Compilation

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

Production

Bootstrap UI Prototypes

  • change directory cd ui (Bootstrap 4) or ui-v5 (Bootstrap 5)
  • Launch html pages in your browser

Back-end

Back-end : What's included

Tools

  • postgresql-express-batch (with Node.js)
  • postgresql-express-crud (with Node.js and Express)
  • postgresql-sql (with SQL Scripts)

Features

  • Database Creation
  • Domains Creation
  • Tables Creation
  • Importing Data
  • Exporting Data
  • Serving RESTful CRUD API

Database Creation with SQL

Use the SQL scripts in postgresql-sql

  • create-database.sql
  • create-domains.sql
  • create-tables.sql
  • insert-data.sql

Database Creation with Node.js

  • Change settings in postgresql-express-batch/app/config
  • File config/config.json
  • dbUser: "postgres"
  • dbPassword: "Trustno1" ! Change the Fox Mulder password by your password
# select the repo
cd postgresql-express-batch

# install the repo with npm
npm install

# create database and import JSON data
npm run create

# export JSON data in data/export
npm run export

Serving CRUD REST API with Node.js & Express

  • Change settings in postgresql-express-crud/app/config
  • File config/config.json
  • dbUser: "postgres"
  • dbPassword: "Trustno1" ! Change the Fox Mulder password by your password
# select the repo
cd postgresql-express-crud

# install the repo with npm
npm install

# create database and import JSON data
node server

Tests API

Author

  • Updated : 05/11/2020
  • Author : danny

Documentation

English Tutorials

Tutoriels en français

About

Angular 10 ,Bootstrap 5-alpha, PostgreSQL CRUD REST API, PWA, SSR, Angular Universal,Routing, Lazy loading, Components, Services, Reactive Forms

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 42.8%
  • TypeScript 35.0%
  • JavaScript 20.8%
  • CSS 1.4%