/ideaBox

An application that records and archives a user's ideas. With a fluid and responsive client-side interface with localStorage to persist on ideas between sessions.

Primary LanguageJavaScript

ideaBox

App Demo

About

ideaBox records and archives your ideas, so you'll never forget a great idea again! You can even comment on your ideas if you think of something later that will improve on it.

Want to log your own ideas? Try it out!

Instructions

  1. When the app first loads, you'll see a navigation bar on the left, and a form on the right. Use the form on the right to enter the title of your idea, and then fill in your idea in the body.
  2. After you've filled in your idea, click on the Save button.
    * Note: You cannot save an idea without giving it both a title, and body.
  3. After you save your idea, it will create a card with your idea at the bottom of the screen.
  4. If you've created several ideas and need help sorting through them, you can use the Search ideas bar below the form.
    * Enter any letters or key words that you're searching for.
  5. If you'd like to favorite an idea, simply click on the star icon in top left corner of the idea card.
  6. You can then sort your ideas to view only your favorite, or Starred Ideas by pressing the Show Starred Ideas button on the left navigation bar.
  7. If you no longer need an idea, you can delete it to remove it from your idea cards by pressing on the X icon on the top right corner of the idea card.
  8. Have a great idea that you want to add additional comments to?
    - Click on the + icon at the bottom left corner of your idea card.
    - Then fill in the comment form with your comments, and click on the Add Comment button.
  9. To create a new idea, click on the Create New Idea button to return to the idea form.

Future Additions

  • Login to access your ideas from any device!
  • Mobile capability.
  • The ability to edit your ideas.
  • Searching idea comments.
  • Add images to your ideas.

Contributors

The spec for this project can be found here.

Technology Used

  • JavaScript
  • CSS
  • HTML
  • Atom

Developer Installation Steps

  • Fork and clone this repo.

Wins

  • The local storage requirement of the project required us to rework our data model.
  • We're proud of the CSS on our build, it's very close to the comp requirements.
  • Attention to detail on how a user would navigate the application.

Challenges

  • Limited comp requirements for iteration 5, we had to get creative.
  • Implementation of the Comment.js local storage.