Git Product home page Git Product logo

fsi-placement-assessment-starter's Introduction

The Clever Cookie

The Clever Cookie is a very popular bakery in town, so popular that it keeps running out of everyone's favorite cookies. To compensate, the bakery employees make more of the types of cookies that sold out the previous day, only to discover they made way too many. How frustrating!

Luckily for the Clever Cookie bakery, quite a few of its clients are web developers. Let's solve this issue with technology!

It is the consensus of the bakers that if they could just get an estimated number of cookies that would be ordered the next day, they could ensure everyone's favorite cookie would still be in stock when they came to the bakery. Let's create a website in which the bakery's customers can specify how many of each cookie they want. As a prototype, we will start with just three of the tastiest cookies the bakery offers.

Prompt & Starter Code

You will not need to write any HTML or CSS. It is already provided and has everything you need. You shouldn't need to bother with the CSS or HTML. As always, look at the code you already have before writing new code.

Starting Point

You will get a set of starter code that already has HTML and CSS provided. If you open up index.html in your web browser, it looks like this:

Finished Result

Directions

Fork, then Clone the starter code repository and read through the existing HTML, CSS, and JavaScript. Your job is to complete the rest of the script.js file (located in the assets folder), so your app meets all the success criteria listed below.

Your Goals

Use the below directions and grading rubric as a guide for completing each portion of the task.

  • The Created By h2 element above the footer says Created By [YOUR NAME] instead of Created By Jane Doe, where [YOUR NAME] represents your real name. (Hint: You will be able to change this via JavaScript in your script.js file!)
  • The +1 and โ€“1 buttons are clickable for each cookie. This means that clicking them executes code and produces a noticable result of some kind. There are six buttons total.
  • The +1 button for each cookie adds one to the appropriate cookie count.
  • The โ€“1 button for each cookie subtracts one from the appropriate cookie count.
  • The table updates the appropriate table cell for the specific cookie when each cookie's +1 or -1 button is clicked.
  • The table updates the total cell in the table footer that tallies all the cookies.
  • Do not allow the number of cookies to be less than zero for any of the three cookies.

fsi-placement-assessment-starter's People

Contributors

009kings avatar brandiw avatar jlboba avatar nkleinmann avatar

Stargazers

 avatar  avatar  avatar

Watchers

 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.