trrapp12 / invoice-creator

INVOICE CREATOR

Contributors: Trevor Rapp

All work is completely my own. This project completed as a solo project in the Scrimba Front End Developer Career Path, meaning specifications for what the project should be able to do were given, but no help or instruction was provided.

---

https___trrapp12.github.io_Invoice-Creator_.mp4

---

---

DESCRIPTION:

"Is that a page from the dastardly villain’s diary?” Maldynado asked.
“One carelessly dropped that conveniently reveals the secret to destroying these vile artifacts?”
“It’s an invoice.”
“Villains get bills?"

— Lindsay Buroker Dark Currents (The Emperor's Edge, #2)

This project is a simple invoice creator built with Vanilla JavaScript, HTML and CSS.

---

QUICKSTART GUIDE

To use the app simply click on the View Project button or visit https://trrapp12.github.io/Invoice-Creator/.

---

PROJECT DEMONSTRATES

• Array to hold variables.

• Buttons add elements to the array.

• Displays updates to both total, prices, and services added

• Logic prevents service from being charged twice.

• Use of template literals

• Event listeners and DOM manipulation.

• Use of .innerHTML

• Traverse childNodes of dynamically introduced elements to insert elements

• Use of IFFE to prevent Global name space pollution

• Use of event listeners on window object to make sure elements are loaded before adding further listeners.

---

CHALLENGES I OVERCAME:

Specific things I learned included:

• I expanded on the original project by creating a modal that alerts you in case you put the same invoice more than once

• Instead of only being able to order one action only once, I made it so you can now order it multiple times if you like

• Made it so items can be subtracted from the invoice

---

MY OWN PERSONAL CONTRIBUTIONS INCLUDED:

• all work is completely my own. The only directions were user stories the assignment needed to complete.

---

SCRIMBA FRONT END DEVELOPER CAREER CERTIFICATE:

This project was completed as part of the Scrimba The Frontend Career Path, which is composed of:

• over 1000 lessons
• over 65 hours of instruction
• over 30 instructor-lead, hands-on projects
• over 15 Solo Projects (completed completely alone, with only Figma files and user stories provided.)

CERTIFICATE OF COMPLETION - The Frontend Developer Career Path.pdf

---

ATTRIBUTIONS:

Project created by TREVOR RAPP

• Original project idea was part of the Scrimba's Front End Development Course.

---

YOU CAN FIND ME AT:

For more information see my LinkedIn, or return to my Github

invoice-creator's Issues

make it so you can subtract an invoice

new video

https___trrapp12.github.io_Invoice-Creator_.mp4

display how many items ordered if ordered more than once

REFACTOR: mobile friendly

• too skinny in mobile

if you hit an item more than once make it add an additional item

video

Untitled_.Jul.12.2022.10_58.PM.mp4