Mock Storefront Webpage
2022-04-26
As always, follow this link to see the GitHub repository.
With my first year at Camosun coming to a close, I just wanted to share this final project that I made for ICS-128, the web scripting course. To see a live demo of the site, click here.
The final assignment for this class was to make a storefront webpage. It had to populate the page with an assortment of products, all of which were pulled from an API call. Users could add items to their cart and then proceed through a checkout process. Finally, that checkout data was sent to a server to verify its contents.
It was a fun little project. It's the first time we really have to worry about how our application is built. I wanted a seamless experience that didn't require additional loading, so I stored the data and the cart as part of class objects. This made for some easy filtering.
A lot of the page is populated by JavaScript methods, so there's no refreshing when things are added. I tried to employ a strategy of redrawing parts of the page only when that part needed updating. That's what allows the currencies to update and the cart to refresh itself.
This was also the first time I made a page using some of the premade tools like Bootstrap's sidemenu and modal. That made things a lot easier, and I really appreciated that. Last semester, we made another single-page site, but without JavaScript. You can see that here. I like to see the progression from those more simple projects. Here's hoping the next one is a big step forward.
