This website was created as a college project for the Designing and Developing an interactive Product class. The website allows you to search for music, albums or artists via the iTunes API and has a dummy cart feature which allows you to add/remove vouchers from a shopping cart created using TypeScript.
I used the atomic design pattern to organise the folder structure for this application, to help ensure ease of navigation throughout the project. There is a great article about atomic design by Janelle Wong here.
This project was created using the React library. To run in development mode, run npm start in the terminal. This will run the application on http://localhost:3000.
I created this application in TypeScript. This allowed me to gain experience working with a typed language and made debugging the application easier.
To style this application I used the CSS Preprocessor SASS. SASS allows for quicker and more consistent development as you can create CSS variables, nest CSS rules and more.
When making HTTP requests to the iTunes API, I used the Axios package. Axios works similarly to the built-in JavaScript Fetch API, although can be easier to use and offers some built-in security features. For a comparison of Axios vs Fetch see this article by GeeksForGeeks.
I used the ClassNames package to dynamically generate class names for components based on props.