Photogram GUI

In this project, you will add a GUI on top of the API we previously built.

Click "Start web server" and visit your "Live app". The starting point is the ending point of the API project. You ought to already have data.

This is your new target. It's still a little ugly, but it's step on the path. Next week we'll add dropdowns, sign in/sign out, and CSS to polish it up.

Users should be able to see a lists of users, photos, links to details pages, links to delete, and forms to add.

Things to keep in mind:

• When you make forms, don't forget to add a <label> for every form control (<input>, <textarea>, etc). The <label> should have a for="" attribute that matches the id="" attribute of the input. For example,

  <label for="zebra">Fan</label>
  <input id="zebra" type="text" name="qs_fan_id">

  This lets the browser know which label belongs to which input, which helps with accessibility, ergonomics, SEO, and most importantly for you right now — automated tests.

• I added some validations to try and help prevent bogus data from entering your tables. Check them out in your models.

Standard Workflow

1. Add dummy data: rails dev:prime
2. Start the web server by running bin/server in a Terminal.
3. Navigate to your live application preview.
4. As you work, remember to navigate to /git and commit often as you work.
5. Make new branches freely to experiment! Especially before starting on a new task.
6. Run rails grade as often as you like to see how you are doing, but make sure you test your app manually first to make sure it matches the target's behavior first.