Laravel 11 E-Commerce Project - E-Commerce Project Overview

Welcome to Surfside Media. Hello everyone! In this video, I will provide an overview of our new e-commerce project, which is built using Laravel 11 and Bootstrap 5.

Project Overview

Let's take a look at the project overview. This is the project we will create step by step over the next few days.

Home Page

This is the project's home page. At the top of the page, you'll find a slider, followed by a categories carousel and an on-sale product carousel. Below that, we have some featured categories and featured products. Finally, at the bottom of the page, you'll find the footer.

Shop Page

Now, let's take a look at the shop page. Click on the shop page link to see the shop page. Here, you'll find filters like category filter, price filter, color filter, size filter, and brand filter. There's also a product sorting dropdown, which allows you to change the order of the products by price, newness, and more. You can also change the product display size from here.

Click on any product to see the product details. Here, you'll find the product image, product gallery thumbnails, add to cart and add to wishlist links, product description, additional information, and reviews. At the bottom of the page, you'll find the related product carousel.

Adding Products to the Cart

Now, let's add a product to the cart. Click on the add to cart link, and the product will be added. Let's check the cart by clicking here. From the cart, you can add a coupon code, increase the item quantity, and checkout. You can also log in or create a new account from here.

If you already have an account, simply enter your email and password to log in.

Divyansh@surfsidemedia.in and 12345678. Click on login, then go to the cart and click on checkout. Enter the shipping address and click on place order to see the order is placed.

Viewing Orders

Now, let's see the placed orders. Click on the orders link to see the placed orders. Click on the user profile link icon to see the user dashboard page. From here, click on the orders link to see the orders. You can view order details by clicking on the eye icon.

Admin Dashboard

Now, let's see the admin dashboard. Log out first, then click on the login link. Enter the admin email address and password, then click on login. After logging in, you'll be redirected to the admin dashboard, where you can see the orders placed by users or customers.

From the admin panel, you can create, edit, update, and delete brands, categories, products, coupons, sliders, and more.

Project Template

You can see the project preview on my GitHub page, where I've shared the template file used in this project.

Let me show you the template. Go to google.com and search for "SurfsideMedia github". Click on the GitHub link, then click on the repositories link. From here, you can see the Laravel 11 E-commerce Project repository. Open this repository and download the template to create this wonderful project with me step by step.

At the bottom of the page, you'll find links to preview the HTML template. The first link is for the website template preview, and the second link is for the admin template preview.

Website Template Preview

Now, let's open this link and see the home page of the project. Here, you'll find a slider, category section, on-sale section, offer section, featured product section, and page footer.

Next, you'll see the shop page, which includes filters like category filter, color filter, size filter, brand filter, and price filter. There's also a shop slider and products. Click on any product to see the product details page.

Finally, you'll see the cart page and wishlist page.

Admin Template Preview

Now, let's see the admin template. Go back to my GitHub page and click on the link to preview the admin template.

Here, you'll see the admin dashboard, which shows overall sales-related data. There's also a graph showing monthly sales and the latest orders.

Now, let's navigate through the admin dashboard. Click on "Products" and then "Products" again. Here, you'll find a list of products, and from the "Add" button, you can add a new product.

This is the category page, brand page, orders page, slider page, coupon page, and users page. Finally, there's the logout link.

These two templates will be used to create our e-commerce project.

Learning the E-Commerce Project

We will learn how to create this e-commerce project step by step over the next few days. So, be sure to follow my tutorial to learn how to build this project.