- PostgreSQL Express React Node (PERN) full-stack app, integrates React frontend with Node.js backend that is deployed to Heroku. *** Note: to open web links in a new window use: ctrl+click on link / cmd+click on link**
- PostgreSQL needs to be installed and running - I started it from my Windows 10 PostgreSQL 13 dropdown option 'SQL shell (psql)'
- Postman used to test the backend before frontend was available
- React frontend includes a display of analytics for a given company
- JavaScript XML (JSX) used to write HTML elements in Javascript
- React Fragments used to show table of analytics as a row with columns in the DDM
- PostgreSQL v13
- PostgreSQL Installer
- Express.js middleware v4
- Node.js v15
- Nodemon npm module so backend server will automatically restart after code changes
- Postman API to simulate a frontend
- React framework v17
- Bootstrap v4 component library ==> Need to get
- Install dependencies using
npm i
- Install nodemon globally if you don't already have it
- Install PostgreSQL & run it (requires the password you created during installation)
- Add database access credentials to
db.js
- recommend installing npm dotenv & using .env to hide credentials if commiting to Github - Postgresql shell commands:
\l
list all databases.\c
database1 connect to database1.\dt
inspect tables.\d+
inspect table & show relation information.\q
to quit - From root run
nodemon server
for a dev server http://localhost:5000/
can be accessed for CRUD operations such as POST, GET, PUT, DELETE etc. using Postman
- Change to
client
directory - Install dependencies using
npm i
. - run
npm start
. Frontend will open athttp://localhost:3000/
- Questions should contact Jess on how to pull and push
- All data stored in PostgreSQL database that can also be viewed and changed from the PostgreSQL shell (psql)
- React app created from the command prompt using Create React App
- Uses the Bootstrap basic table to list analytics
- Bootstrap 4 Modal dialog box