Rapid Prototype Lab

Objective

The goal of this project is to build a rapid prototype that you can quickly test and experiment with, in preparation for your final project. Your app should solve a small, focused problem.

We strongly discourage you from using any code from this prototype in your final project!

Use "Outside In"

It is good idea to build "from the outside, in" -- meaning you build out the frontend exactly the way you want it to look, before doing any work on the server. Using mock-data, your front end will both "look like" and "work like" a full-stack appliction.

This process helps a lot with freelance and contract work because your clients will get excited to see a prototype that is working and navigable. You haven't sunk much time into it, so if a client wants you to change something, it is easy to do!

Focus on the frontend: Use HTML, CSS, and jQuery or Angular.

Don't worry about the backend at first: You can stub out something basic if you have time. But start with hardcoded data.

App Ideas

• Startup Ideas Generator
• A Stack Overflow clone with questions, answers, comments, and votes.
• A microblog, journal, or to do list.
• A "Yelp for" - create reviews about anything - yoga studios, online stores, toast, you name it.
• A flashcard app for studying, with decks of flash cards.
• A simple game
• Design Inspiration: http://www.csszengarden.com/
• Anything else you can think of!

Optional: Stubbed Data

JSON REST endpoints

• JSONPlaceholder - RESTful API with mock JSON data)
• Super CRUD - RESTful API with mock JSON data

Placeholder Images

• http://placehold.it
• http://placekitten.com
• http://lorumpixel.com
• http://dummyimage.com
• http://baconmockup.com

Stretch Features

This lab is a good opportunity to try out a new technology/tool/library you think you'd like to use in your final project.

• Use angular-ui, or jQuery UI for a UI component or feature.
  • Consider using a 3rd party jQuery plugin / angular module like autocomplete, drag and drop, infinite scroll, etc.
• Create and use a custom angular directive.

Getting Started

1. Fork this repo, and clone it into your develop folder on your local machine.
2. Create your front inside this directory, and edit the README.md to reflect what your project does.

Submission

• As you make code changes, frequently commit and push to GitHub.
• Once you've finished the assignment and pushed your work to GitHub, make a pull request from your fork to the original repo.