VIDEO GAME STORE

Video Game Store

This e-commerce store features an authentication system (login, register), shopping cart functionality, reset password feature, form validation and credit card integration with a Stripe API.

All 50 products are retrieved from a MySQL database using Laravel’s Eloquent ORM and displayed in their respective categories. Each product has the ability to be displayed individually by the use of ‘slugs’. Like any other e-commerce store, a product can be added to a cart and then be paid for with a credit card.

Although I don’t wish to specialize in design, I felt I needed to brush up on my CSS skills during this project. That’s why, the majority of what you see was written in plain CSS by me.

NOTE: This store is a test demo that uses test API keys. This means that the website won’t accept your real credit card details. So, don’t worry. Whatever you do, you won’t be charged real money. To simulate a real-life transaction, enter: 4242 4242 4242 4242 in the credit/debit card field.

Tools Used to Create This Project

  • Design: HTML, CSS, Bootstrap
  • Client Side: Vanilla JavaScript
  • Server Side: Laravel (PHP framework), MySQL
  • API’s: Stripe


SINGLE PRODUCT STORE

Protein Powder Store

This store features a shopping cart, a credit card payment gateway, a PayPal payment gateway, form validation and a confirmation email.

Although in a real-world scenario, I probably wouldn’t implement a Stripe and Braintree API in the same website, I wanted to gain as much experience possible working with both. As they are high demand skills and crucial to the world of e-commerce development.

NOTE: This store is a test demo that uses test API keys. This means that the website won’t accept your real credit card details. So, don’t worry. Whatever you do, you won’t be charged real money. To simulate a real-life transaction, enter: 4242 4242 4242 4242 in the credit/debit card field and any future date for MM/YY.

For the PayPal section credit/debit card field, enter: 4111 1111 1111 1111 and any future date for MM/YY. Unfortunately, to simulate a real-life PayPal transaction, you’ll need a sandbox buyers account with PayPal. This is the case because the website is a test demo and I don’t want to charge you real money. If you’re still interested, you can sign up for a PayPal sandbox account here. Alternatively, you can check out the video demo here.

Tools Used to Create This Project

  • Design: HTML, Bootstrap
  • Client Side: Vanilla JavaScript
  • Server Side: Laravel (PHP framework),
  • API’s: Stripe, Braintree