Giter VIP home page Giter VIP logo

ideabox's Introduction

Ideabox

Abstract

The project builds a website where users can create, save, favorite and delete idea cards. There are two input fields one for the title and the other for the body. When the user clicks save, a card is generated lower down on the page with those inputs creating a card with that information. In the header of the card there is a large "X" for the delete button and a star icon so the user can add the card to their favorites. The user can click the "Show Starred Ideas" button to see their favorite idea cards. That button can toggle into the "Show All Ideas" button and when clicked it will show all of the idea cards.

Deployed Page

https://ganuza.github.io/ideaBox/

Installation instructions

To clone down this repository to your local machine:

  • Fork the ideaBox repository
  • Clone down your new repository to your local machine
  • Cd into the repository on your local machine
  • Open the repository in your text editor
  • You will have access to the HTML, CSS, and JavaScript files

Preview of App:

Preview of the application

Context:

The IdeaBox application is a group project that was assigned in the fourth week of Mod 1 at the Turing School of Software and Design. Students are about 4 weeks into the program at this time. The alloted time to complete this project was 6 days.

Contributors:

Learning Goals:

  • Gain an understanding of how to write clean HTML and CSS to match a provided comp.

  • Understand how a developer might separate the data model from the DOM model.

  • 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, SRP, and purity.

Wins

  • Completing the project on time with a day to spare

  • Deciding to forego the second global array - it improved the readability of the code.

  • Having our the application look exactly like the comp

  • We were able to create a scroll feature for the page and the cards while also making the scroll bar invisible.

Challenges:

  • Being stuck on the logic that affected functionality when toggling between pages.

  • Being unable to separate the favorited cards from the cards that were not favorited.

ideabox's People

Contributors

ganuza avatar jwensloff avatar reneepinna avatar zenmcmillan avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.