Skip to content

Latest commit

 

History

History
80 lines (60 loc) · 10.3 KB

File metadata and controls

80 lines (60 loc) · 10.3 KB

Module 4: Full Stack: PERN-Stack: Postgres, Express, React, Node

We're going to be learning about full stack web development.

First, we're going to learn about servers and how to send:

  • Simple strings
  • Very short bits of HTML
  • JSON

We won't be using a database yet. We're going to mock it by just using arrays of objects to represent the way the database would send and receive data. This will allow us to focus on the concepts and code of servers.

Then, we'll to create a more robust view of our data (connect to React app)

Next, we'll learn about databases and learn basic SQL.

Finally, we'll connect our server to our database so that we can create full stack web applications.

Learning Outcomes

  • Explain what is the internet
  • Explain the request/response cycle
  • Describe what a server does
  • Use Express to build a server
  • Use Express to build a RESTful API that has full CRUD functionality for one model
  • Create views for the express API using React
  • Explain what is a database
  • Use Postgres to build a database and interact with it through its CLI
  • Use SQL to run CRUD operations and JOINs
  • Use pg-promise npm package to build a web application backed by SQL
  • Build a backend with multiple models that have at least one relationship (one to many)

Lessons and Labs

Lesson Lab
Kickoff & Introduction to Boostrap Not Applicable
1a. Intro to Internet & Servers Not applicable
1b. npm & Express Response Intro to Express
2. Express Request 99 Pokemon Express BONUS: Express UFO
3. Express CRUD/MVC Express Fitness
4. Express Middleware & RESTful Routes: Show & Create Captain's Log Parts 1 & 2
5. Express Restful Routes: Update & Delete Captain's Log Part 3
6. Connect Express & React (2 Parts) Captain's Log Front End - submit separately from back-end
7. Connect Express & React (2 Parts) Captain's Log Front End - submit separately from back-end
8. Intro to Databases/SQL Part 1 SQL Regifter
9. App Planning: ERDs Wavetree.io
10. Intro to Databases/SQL Part 2 Choose Your Own SQL Adventure
11. Express & SQL: Seed & Read Tuner Part 1
12. Express & SQL: Show & Create Tuner Part 2
13. Express & SQL: Update & Delete Tuner Part 3
14. PERN Stack: CRUD Tuner Front-End
15. PERN Stack: One to Many Part 1 Tuner Add One to Many
16. PERN Stack: One to Many Part 2 API Planning
17. App Planning: Trello Plan a veternarian App w. Trello
18. App Planning: Wireframes Plan a veternarian App w. Wireframes
BONUS PERN Stack: Many to Many Add Functionality to an Existing API

Individual Project/ Mid-Module Assessment

Project Standards
Budget App
  • Use frequent, descriptive, small commits to demonstrate best practices with git and GitHub
  • Access and manipulate objects and objects in arrays
  • Connect a React App to the Express API
  • Create a responsive UI that is easy to use and has components that represent the data from the server
  • Create an Express app that uses a RESTful pattern to perform CRUD functionality
  • Use routes to send responses and errors
  • Use middleware to handle critical functionality of the server

Pair Project

Project Standards
Snack-A-Log
  • Apply all learnings and techniques from last project
  • Use a databse connected to the express server to perform full CRUD across the PERN stack
  • Develop a more complex and useful app through collaboration

Full Stack Portfolio Project

Details forthcoming

Additional Resources