E-Commerce Website
This website was our semester project at school. The goal of this project was to create an e-commerce website. I chose to create a website that sold watches. On this website I used HTML, CSS(Sass) and Javascript. We were tasked to create a local API through Strapi to fetch information to populate the website.
Below I will show some of the features of the site. If you have any questions about how I went about implementing these parts on my page, then you can check out my github.
Product Page
On the product page I fetched the individual products from the local API and displayed them on the page. I also implemented a search feature that lets you search through the displayed products and find the one you want. The search works on words that appear in the title or description of the product.
Detail Page
This page displays the product that you chose from the products page. The correct product is shown by using the ID from the corresponding product on the product page. It gives the user a larger picture of the product and a short description. On this page you can also add the product to a shopping cart.
Shopping Cart
On this page you will see all the items you have put into your cart. The total price of all the items in your cart will be displayed at the bottom. You also have the ability to go to the details page of the watch or remove it from the cart. Your cart is saved in local storage so you don't lose it if you leave the site.
Admin Login
The login page lets you log into the admin panel page so that you can add, edit or delete products from your page. The login sends a request to the local API and checks the login details against the registered users and if the details are correct the API sends back an authorization key that gets stored in local storage so that you stay logged in while browsing other pages.
Admin Page
After logging in you will be sent to the admin page. Here you will see all the products currently on your page. On this page you can choose to add, edit or delete products from your page. On the edit page you can decide which products you would like to be featured products which will be displayed on the home page.
