Skip to content

Instantly share code, notes, and snippets.

@airportyh
Last active December 14, 2015 16:19
Show Gist options
  • Select an option

  • Save airportyh/5114107 to your computer and use it in GitHub Desktop.

Select an option

Save airportyh/5114107 to your computer and use it in GitHub Desktop.

Javascript Framework Shootout Hackathon

Food and Team Up

Food from FireHouse Subs will be provided. You'll eat, get settled, and find your team. If you still need help with finding a team, we'll help you.

Setup

  1. Choose a team name.
  2. At least one of you: create a GitHub account.
  3. Create a project on GitHub and call it js_bistro_<your team name> and initialize/sync it to your laptop.
  4. Make a README file (if not already there), put the names your team members in it. Commit this, and push it to GitHub.
  5. Register the url of your project with our group spreadsheet.

Features

Phew! Now you can actually start coding.

  1. Download the css template js-bistro.zip and put the contents in your project.
  2. Make a reservation form.
  3. Make a Pending Reservations queue.
  4. Submit the form adds a pending reservation with the entered information.
  5. Make sure you can enter multiple pending reservations.
  6. Validate the form
  • i. reject if any of the 3 fields are empty
  • ii. reject if phone number is not valid
  • iii. reject if # in party is not a number
  1. Have a Confirmed Reservations time slots section.
  2. Clicking on a pending reservation and then clicking one of the confirmed reservations time slots removes the item from the pending queue and adds to the time slot, updating the time slot by removing the corresponding # of seats in the booking.
  3. Reject action to reserve a time slot if there aren't enough seats available in that time slot to fit the reservation.
  4. Make sure you can do any of the above any number of times.
  5. Make all of the state persist across browser refresh. You can use either server-side storage or browser-side storage.
  6. Allow the user to drag-n-drop a pending reservation to a time slot as an alternative to the click-n-click.
  7. Text the customer "Your reservation with js bistro has been confirmed!" once he has reserved a time slot. (hint: twilio)
  8. Make it possible to delete a pending reservation (right click delete or new control button?).
  9. Editing existing reservations
  • i. Clicking on a time slot will open up a modal dialog box with a list of all the current reservations, displayed as a table, each column containing the information name, phone number, and number in party.
  • ii. Add a forth column to the table and put an edit button there on the right side of each row.
  • iii. When you click the edit button, you can live edit the values in that row - the edit button now becomes the save button - when you save, the data actually persists.

Do all of the above before 10pm. Just kidding! Just do one thing at a time, don't worry about finishing. Everyone will get as far as they got when we hit 10pm.

Show and Tell

Everyone gets their words in: briefly share with everyone(plan for about 5 minutes)

  • i. what you've accomplished
  • ii. what parts in build the app was the framework really helpful
  • iii. what problems did you run into and how did you solve them?
  • iv. what is your overall impression of this framework and/or this whole experience?

Prizes

Thanks for Microsoft, everyone has a chance to win an XBox or other gadgetry! We will have a prize drawing to wrap up the event.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment