holladayian / ideabox-generator

Base HTML & CSS for getting started with Ideabox

Overview of project and goals Overview of technologies used, challenges, and wins, any other reflections Screenshots of comp and your app Credit all teammates

IdeaBox - Group Project

The Link to our github pages can be found here

link to GitHub Pages

The link to our repo can be found there

link to repo

The link to the project description can be found here

link to project

Project Overview

Throughout the project, one of our focuses will be on providing a fluid and responsive client-side interface. To this end, we’ll rely on JavaScript and to implement snappy filtering in the browser, and localStorage to persist our wonderful ideas between sessions. Our goal is to also incorporate an agile workflow by incorporating two weekly sprints.

Goals

• Continue to improve on building responsive client-side applications with good user feedback
• Understand how to implement client-side data persistence using localStorage
• Understand what it looks like to have a separate data model (using a class) and DOM model
• Utilize data-* attributes
• Incorporate & iterate over arrays in order to filter what is being displayed
• Craft code with clean style, using small functions that show trends toward DRYness and SRP

Technologies

We built our IdeaBox project nearly from scratch, using HTML, CSS, and JavaScript. We were able to implement the use of chrome dev tools for problem solving. MDN was our main source of learning outside of notes and school work. We were also able to implement accessing and manipulating local storage.

Challenges

We ran into challenges separating DOM and data model, but we were able to overcome most of these, however it was learning experience.

Wins

• Successful debuggin'!
• Finally understanding the separation between DOM and data model!
• "Successfully teamworked" "empathized with each other!" "we worked lots of hours" "we learned everything there is to learn about code!"

ScreenShots

This is the desktop view showing all of the saved cards in the array.

This is the desktop view showing only the starred cards in the array.

This is the desktop view showing only the searched cards in the array.

This is the mobile view.

Credits

Tim Keresey Sarah Osgood Ian Holladay