Project

Build a server-rendered full-stack app

• Build an app using the Express framework.
• Use a PostgreSQL database to store and retrieve your data.
• Use the retrieved data to populate a Handlebars template for server-side rendering to be displayed on the front-end.

What's also important:

• Include tests and set up code coverage.
• Unit tests of pure functions, and integration tests of your server routes, including tests for errors such as 404.
• You should write tests for your database and use a separate test database and build script.
• Use Heroku or a similar service to host the app and the database.
• Try to include ES6 syntax on the server.

What we'd like to learn

• SQL, queries and testing
• Good error handling
• Testing in general / TDD
• JWTs/local storage/sessions
• Express
• Handlebars - Make a site with multiple pages but repeating info
• Promises/Fetch
• Stretch Goal: password hashing etc.
• Travis ???
• Stretch goal: sidebar

Ideas

• Stupid/Silly/Funny (but show an employer)

• Decent CSS

  • SVGs?

• Achievable

• Form(s)

• Animal adoption agency

  • Different users have different animals

• Use handlebars to render a static site that can be manipulated as data is added

Code of conduct

• Go as fast as the slowest person
• 20/20/20
• Pair programming
  • Give precedence to backseat driver's ideas / discussing ideas
• Communicating fluidly
  • Expressing your ideas / Sharing & Discussing
  • Check in every half hour
• Switch up working pairs - drop your work at the time cutoff and explain to your new pairmate
• Regular small commits / regular laptop switching
• Try and keep commits equal
• Take breaks
• Update the hackmd as you go with code snippets, lessons learned (pictures?)
• Comment the code
• ES6
• Git commits: Feature/ or Fix/
• Create issues for features and reference them in git commits
• TDD
• Mobile first

Problems we had

• Understanding file structure and how to start setting up our FS. We looked at the examples exercises from the week but they often had different structures which made it difficult to choose one style to go with. We were confused about what would replace our typical server.js or router.js. We also wanted to follow the MVC model which was difficult to implement.
• We whiteboarded this together using an example from FAC16 and one of the workshops as support which meant we learnt exactly what each directory should include, what the files would do and how to ride our bike with handlebars.
• We spend time understanding the app.js file and particularly what the app.set, app.engine and app.use are for. We did console log a lot and find out there were a big objects and we found out that basically we kind of give instruction to express,so it will know where look for files

---

creating a test database:

sudo -u postgres createdb testanimalsdb

pgcli testanimalsdb

CREATE USER oldmcdonald SUPERUSER PASSWORD 'dragon'

GRANT ALL PRIVILEGES ON DATABASE testanimalsdb to oldmcdonald

Then add to env:

TEST_DB_URL = postgres://mcdonald:dragon@localhost:5432/testanimalsdb

---

Animal svgs

https://www.flaticon.com/packs/animal-27 https://www.flaticon.com/packs/animal-27/2

Our chosen animals

-Elephant -Octopus -Seal -Hippopotamus -Cheeky monkey -Bison -Hamster -Llama -Panther -Platypus -Tortoise -Jellyfish

---

Next batch -Pig

Run your build scripts

The location of .env depends on where you run your build script.