/newark-art-gallery

Primary LanguageJavaScript

Newark Modern Gallery CRUD REST API

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

Table of contents

Front-end : What's included

Dependencies

  • Angular : 11.0.3
  • Angular CLI : 11.0.3
  • Angular Universal : 11.0.0
  • Bootstrap : 5.0.0-alpha3
  • 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

# select a repo from github, gitlab or bitbucket

# download the example or clone the repo from github
git clone https://github.com/richierich25/newark-art-gallery.git


# change directory
cd angular11-app
cd frontend

# 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:5004

Tests (Use Chrome Version 87 minimum)

  • 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

  • mysql-express-batch (with Node.js)

  • mysql-sql (with SQL Scripts)

  • postgresql-express-batch (with Node.js)

  • postgresql-express-crud (with Node.js and Express)

  • postgresql-sql (with SQL Scripts)

Features

  • Database Creation
  • Domains Creation (only PostgreSQL)
  • Tables Creation
  • Importing Data
  • Exporting Data
  • Serving RESTful CRUD API

Database Creation with PostgreSQL

Use the SQL scripts in postgresql-sql

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

Database Creation with MySQL

Use the SQL scripts in mysql-sql

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

Database Creation with Node.js and PostgreSQL

PostgreSQL Password

  • 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

# For the fun delete All data/export Files
# Export JSON data in data/export
npm run export

# Check the new files (for example movies.json)

Database Creation with Node.js and MySQL

MySQL Password

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

# install the repo with npm
npm install

# create database and import JSON data
npm run create

# For the fun delete All data/export Files
# Export JSON data in data/export
npm run export

# Check the new files (for example movies.json)

Serving CRUD REST API with Node.js & Express & PostgreSQL

PostgreSQL Password

  • 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

# Serve CRUD REST API : development mode with nodemon
npm run dev

# Serve CRUD REST API : local mode
npm run start

# Serve CRUD REST API : production mode
npm run prod

# Serve CRUD REST API : production mode with pm2 (process manager)
pm2 start process.config.js --env prod

Tests API & PostgreSQL