• Tuesday , 7 April 2020

E-Commerce JavaScript Tutorial – Shopping Cart from Scratch

Code Canyon



Learn how to create a shopping cart using vanilla Javascript in JavaScript Tutorial Course.

💻Setup files: https://github.com/john-smilga/setup-files-js-comfy-house

🔗Working Example: https://js-comfy-home-furniture-store.netlify.com/

🎥Course from John Smilga. Check out his channel: https://www.youtube.com/codingaddict

🔗John’s course on Udemy: https://www.udemy.com/in-depth-html-css-course-build-responsive-websites/?couponCode=ONLYTEN

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://medium.freecodecamp.org

And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp

Original source

3d Ocean

Related Posts

21 Comments

  1. Stéphane Joos
    November 27, 2019 at 19:14

    Nice project. Very good explanations. Many thanks

  2. 湯士弘
    November 27, 2019 at 19:14

    I use Contentful to save my images.But it still presents (Failed to load resource: net::ERR_FILE_NOT_FOUND) in console. What should I do?

  3. James Maddox
    November 27, 2019 at 19:14

    Such a great tutorial! Aiming to learn vanilla JS and get the basics before moving on to a framework so this really helped a lot!

  4. hpl]uh't hfvhidl
    November 27, 2019 at 19:14

    Where is subtitle ???

  5. Jurtly Kools
    November 27, 2019 at 19:14

    Papo, you can just say We Will (Verb). Not we will GONNA (verb)

  6. Black Mamba
    November 27, 2019 at 19:14

    Best teacher ever! Amazing work!

  7. Aunort Ryder
    November 27, 2019 at 19:14

    Perfect lesson for those who just finished js/es6 lectures and want to use new knowledge on close to real-job-project practice!

  8. osuji samuel
    November 27, 2019 at 19:14

    this is just exactly what it saying ( ReferenceError: can't access lexical declaration `products' before initialization)

  9. osuji samuel
    November 27, 2019 at 19:14

    Thanks so much for the tutorial, but I'm getting error as this "products is not defined" at line 67 and I've reviewed it severally with your same code and it kept repeating the same error, I'll be glad if you help me out. thanks

  10. out ofme
    November 27, 2019 at 19:14

    the products are not showing too when we switch .product to the ui class in app.js…please help

  11. out ofme
    November 27, 2019 at 19:14

    i have a problem with the preview server it's not showing how can I fix it

  12. Joe Niati
    November 27, 2019 at 19:14

    Is it possible to make money by creating my own e commerce website?

  13. Scot Henderson
    November 27, 2019 at 19:14

    After much coding I have learnt that this is the worst possible and unsafe way to run a cart. NEVER use localStorage as your data point .. It is easy to change it before paying with any payment module and you end up with the customer paying what ever they want and it will still get processed. Time to investigate other solutions.

  14. Сергей Туманов
    November 27, 2019 at 19:14

    is amazing lesson, thank you Sir !!!!

  15. penninah gathu
    November 27, 2019 at 19:14

    Thank you very much.Learnt so much from you

  16. Arjunan S
    November 27, 2019 at 19:14

    Complete source code available for this project?

  17. Xavier
    November 27, 2019 at 19:14

    So, I thought it was only on my version, but I checked your deployed version and it also has the bug. When you add an item to the cart, if you click on the actual icon of the cart both texts "Add to bag" and "In cart" keep displayed, and if you keep only clicking on the little cart icon it just keeps adding without disabling the button

  18. Albert Jacobsz
    November 27, 2019 at 19:14

    i got a problem with my code i get the error: " app.js:56 Uncaught (in promise) TypeError: Cannot set property 'innerHTML' of null
    at UI.displayProducts (app.js:56)
    at app.js:69" even though i followed the tut, what should i do?

  19. Terri P
    November 27, 2019 at 19:14

    I am getting a CORS error. How were you able to call your JSON file and not have that issue? I installed npm live server and it only works for me that way.

  20. Just Chris
    November 27, 2019 at 19:14

    All you really need to go with free code academy, is someone willing to do a live video service like screen share, and with a small group of people, and code with you while teaching theory, you will no longer need a college class after that
    Just login when instructor sends notifications that they are online, and login to a live screen share session with that person so you can code with them

    In other words, an actual virtual classroom

  21. Motorhomer
    November 27, 2019 at 19:14

    excellent tutorial best ive seen and been a great help. Thank you for giving up your time to do this, you are very good at explaining all the code.

Leave A Comment

You must be logged in to post a comment.