This project will help you assess your ability to apply the JavaScript skills that you practiced in this book.
- Functions
- Modules
- Iteration
- Objects
- Arrays
- Handling browser generated events
- Generating custom events
- Handling custom events
- State management
- Displaying state as HTML
- User input with radio options
You will be building an application for a local food truck that offers food that is a fusion of American Southern and Greek cuisines.
A customer should be able to choose a base dish, a vegetable, and a side dish and place their order. Once the order is placed, the total amount for the chosen foods will appear at the bottom.
- All 10 base dishes should be displayed as radio input options.
- All 9 vegetables should be displayed as radio input options.
- All 6 side dishes should be displayed as radio input options.
- When the user selects an item in any of the three columns, the choice should be stored as state in your database.
- When a user selects all three options and click the "Purchase Combo" button, a new sales object should be...
- Stored as state in the database.
- Represented as HTML below the Monthly Sales header in the following format exactly. Your output will not have zeroes, but the actual amount.
Receipt #1 = $00.00
- The user's choices should be cleared from the database state once the purchase is made.
Given the description and animation above...
- Create an ERD for this application before you begin.
- Make a list of what modules need to be created to make your application as modular as possible.
Discuss these with your teammates, and then talk to an instructor to review your decisions. Be prepared to defend why you made your choices.
Once an instruction reviews and approves your ERD and ideas about components, an invitation link will be provided to you to start the assessment.
Your instruction team will provide a link for you to create your assessment repository. Once your repo is created, clone it to your machine.
- Make sure you are in your
workspace
directory git clone {github repo SSH string}
cd
into the directory it createsnpm install
to install the testing library in your projectcode .
to open the project code- Use the
serve -p 8080
command to start the web server - Open the URL provided in Chrome
- Run
npm test
in a separate tab from your server. The tests will fail. Write awesome code to make the tests pass
Make sure your Developer Tools are open at all times while working on this project. Use the messages provided in the Console to determine what code needs to be fixed or implemented, and use breakpoints in the Sources tab to step through your code as you debug.
Another reminder from the instruction team. This is NOT A TEST. We are not looking for 100% completion, although if you can make it work completely, then huzzah for you.
What we are looking for is effort, critical thinking about the concepts, creative thinking to bind the concepts together for a solution, and collaboration with your teammates and instruction team.
If you only get 50% of it complete, but display the above Core Skills and can demonstrate understanding of the fundamental code concepts, then you are learning and growing - which is what we care about.