Project Ideas for JB

Tools: 
- Homebrew (Mac only)
  - "brew install" installs command-line and system tools, "brew install nodejs"
  - "brew cask install" installs visual tools, such as "brew cask install visual-studio-code"
- VS Code
- Node.js / NPM
- Express generator - https://expressjs.com/en/starter/generator.html
  - this will generate all of the scaffolding for an Express server, so that all you need to do is 
    type "npm start" to get the server running
- Sourcetree is a great visual Git tool if you want to skip over command-line Git
- Postman is a great tool for testing out a server without having to write any code (brew install postman)

Git:
- BY FAR the easiest way to create a Git project is through Github.com
- once you create the project on Github, you can "git clone" the project to your machine and 
  all of the linking between Github and your computer is magically set up
- if you create the project on your machine and create the project with "git init", you will have to manually
  add all of the linking to Github and it becomes way more complicated (e.g. "git remote add origin <github-link>")
- this means the very first step on any project has to be creating the empty Git repo via Github, but it saves
  a ton of time later on

Command line Stuff:
- students would need to know how to "cd" into different directories where their projects are stored, 
  but not much else is required for Node apps
- helpful, easy Git commands would be "git clone", "git add", "git commit", "git push", and "git pull"
- less easy, but helpful Git commands would be "git revert", "git reset --hard" (DANGEROUS), 
  "git checkout", and "git checkout -b"

Project Ideas: 
These projects only require Javascript to complete, but there are some ideas at the bottom for moving towards Python

First project:
- build Jeopardy as a static web app (HTML / CSS / jQuery)
- turn in on Github with a 'README.md' file explaining the project
	- .md = Markdown -> great cheat sheet here: https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet
- have at least 5 git commits (ideally as many small commits as possible)
- "deploy" it on bitbucket.com

Second project: 
- use a free, open API to display JSON data in a static web app (HTML / CSS / jQuery)
	- This is a great way to teach "asynchronous" behavior in Javascript (Promises, callbacks, async await, etc.) 
	- once the students get through this and understand async behavior, talking to databases and your own servers becomes much simpler
	- I had a great experience using the Giphy API with my students (https://developers.giphy.com/)
	- MAKE SURE THE STUDENTS SET THE "RATING" TO "PG" WHEN THEY'RE FETCHING RANDOM GIFS!!! Learned that
	  lesson the hard way.
	- use a tool such as "axios" to make asynchronous API calls to a remote server for JSON data
		- https://cdnjs.com/libraries/axios
	- a really simple example project would be a static page with a button 
	  that fetches a new GIF each time you click the button, then displays it

Third project:
- add a thumbs up / thumbs down button to the GIF page from your second project (HTML / CSS / jQuery / Node / Express / MongoDB)
	- when you click thumbs down, load a new random GIF
	- when you click thumbs up, save the URL for the GIF to a database of favorite GIFs, using an ExpressJS server
		- MongoDB is a great first database to learn and doesn't require SQL (really easy to install and run via Homebrew)
		- Mongoose is a great tool you can install via NPM to talk to your Mongo database from Express
	- have a link to "favorites" that shows all of the GIFs you've given a thumbs up; fetch these links from your Express server
  - example server routes would be:
    - PUT request to "http://localhost:3000/favorite-gifs" with data about the GIF you want to save
    - GET request to "http://localhost:3000/favorite-gifs" to retrieve the JSON list of all saved GIFs

Other project ideas:
- add a user profile to your app
	- now there are two things to save in the database, FavoriteGifs and Users; each "entity" needs its own 
	  API "routes" to Create, Read, Update, or Delete (CRUD) data from the database
    - example routes would be:
      - GET request to "http://localhost:3000/users/:user-id" to get the JSON for a single User profile
- re-write your server / API in a different language
	- converting the ExpressJS API to Python / Django or Flask would be a really great exercise
	- you can use the same Mongo database, really reinforces the concept that databases and servers 
	  are separate, interchangeable things
- re-write the web app in a modern framework such as React
- replace the Mongo database with a PostgreSQL database - need to teach basic SQL
	- Postgres can be easily installed / started with Homebrew
	- "brew install postgresql" then "brew services start postgres"
- deploy your server / API to Heroku (free cloud hosting, really easy to use)
- Run your app as a Docker container - pretty advanced but REALLY cool technology