In this article, we are going to dive deep into the steps required to create your laravel eCommerce website.
Technology has been at the helm of this buzzword and the urge to improve services and provide greater satisfaction.
Developers around the world has been eyeing on PHP, JAVA, Python, MEAN, Ruby On Rails etc to ease the work and providing a better solution.
Laravel, an open-source web framework launched by Taylor Otwell in 2011.
Popularized the MVC architecture with its elegant syntax and robust tools for web application development.
Laravel was introduced with the aim of simplifying web development.
Focused on easing common tasks like routing, authentication, sessions, and caching.
In this series, we are going to discuss how you can create an eCommerce application using Laravel as a web framework.
With that, you can use any javascript framework for building user interfaces like Vue.js, React, Node.js, Angular JS or Backbone.js.
We will be dividing the series into two parts. Do let us know in the comments regarding your views.
Prior Requirements
1. Set up your development environment.
2. Laravel must be installed on your machine.
3. Knowledge of PHP language
4. Knowledge of the command line.
5. Understanding of JavaScript and the Vue.js framework.
Basic eCommerce Feature
Let us list down some basic features that are required in an eCommerce application.
1. A home page to list all the products
2. A product description page.
3. A checkout page to provide address details and payment information.
4. A dashboard for merchants to add/delete/update product information and check sales, order, and shipment details.
5. A customer dashboard to check the product purchased and shipment status.
Define User Roles
Next, we need to define the user roles or parties that will be there in an eCommerce system. Two parties are involved at the granular level:
- Admin: The owner of the store
- Buyer: The customers who purchase goods from the store.
Store Details
We need to define the components of the various parts of the store.
Apart from the User, there are products that are stored. Once they are ordered, you need to keep track of their inventory and delivery details.
We can break down the components as below:
| Entity | Fields |
| User | username, password, role |
| Product | name, description, price, quantity, image |
| Order | product, user, stock, delivery_status, address |
Creating controllers for operations
Laravel gives privilege you make controllers and use them while defining a route to any URL.
Based on the operation, you can define a controller for each.
| Operation | Controller |
| Login | UserController |
| Register | UserController |
| User profile | UserController |
| View product listing | ProductController |
| View a single product | ProductController |
| Edit a product | ProductController |
| Add a new product | ProductController |
| Order product | OrderController |
| View all orders | OrderController |
| View a single order information | OrderController |
| Deliver an order | OrderController |
Creating a Laravel Application
To create a new application, run the below command in the Laravel CLI
|
1 |
$ laravel new bagisto |
Move to the new directory created. This will be the root directory from where you need to run the other Laravel-related commands.
Setting Database for the application
Here we are going to use MySQL as a relational database management system.
Create a database.
Next, open your .env file and enter the following
|
1 2 3 4 |
DB_CONNECTION=mysql DB_DATABASE=homestead DB_USERNAME=username DB_PASSWORD=password |
Run the migrations to create the database tables for our application and seed it:
|
1 |
$ php artisan migrate --seed |
Creating a Model for Application
Model in MVC architecture holds business logic that allows you to interact with the database.
It provides the use of functions to perform a basic operation with your database tables.
Laravel installation provides User Model already created. Here we will create models for Product and Order.
|
1 |
$ php artisan make:model Product |
|
1 |
$ php artisan make:model Order |
Next, open the app/User.php file and replace the contents with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<?php namespace App; use Illuminate\Notifications\Notifiable; use Illuminate\Database\Eloquent\SoftDeletes; use Illuminate\Foundation\Auth\User as Authenticatable; class User extends Authenticatable { use Notifiable, SoftDeletes; protected $fillable = [ 'name', 'email', 'password', ]; protected $hidden = [ 'password', 'remember_token', ]; public function orders() { return $this->hasMany(Order::class); } } |
Laravel introduce SoftDeletes in models that way we can’t remove from the database.
However, if remove a record from the front side then it doesn’t show record on front.
So we can retrieve the record from the database if we remove the wrong row.
$fillable is an array that contains all those fields of the table and can be filled using mass-assignment
Open app/Product.php file and edit as follows:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php namespace App; use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\SoftDeletes; class Product extends Model { use SoftDeletes; protected $fillable = [ 'name', 'price', 'quantity', 'description', 'image' ]; public function orders(){ return $this->hasMany(Order::class); } } |
This is similar to the User model and also has an order method to establish a relationship with Order.
Now, open app/Order.php file and edit as follows:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<?php namespace App; use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\SoftDeletes; class Order extends Model { use SoftDeletes; protected $fillable = [ 'product_id', 'user_id', 'quantity', 'address' ]; public function user() { return $this->belongsTo(User::class, 'user_id'); } public function product() { return $this->belongsTo(Product::class, 'product_id'); } } |
This model represents similar to the other except the relationship belongsTo which show order is related to which user and for what product.
Defining Migrations
Migrations are like version control of your database schema in Laravel.
It allows you to easily create and manage the database.
Like a git, you can easily share your database schema with your team and allow them to manually add the column to the schema.
The Laravel Schema facade provides support for creating and manipulating tables in the database systems.
To create a migration, use the below command
|
1 |
php artisan make:migration create_users_table |
Open the create_users_table migrations file in the database/migrations directory and replace the content with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<?php use Illuminate\Support\Facades\Schema; use Illuminate\Database\Schema\Blueprint; use Illuminate\Database\Migrations\Migration; class CreateUsersTable extends Migration { public function up() { Schema::create('users', function (Blueprint $table) { $table->increments('id'); $table->string('name'); $table->string('email')->unique(); $table->boolean('is_admin')->default(false); $table->string('password'); $table->rememberToken(); $table->timestamps(); $table->softDeletes(); }); } public function down() { Schema::dropIfExists('users'); } } |
Here we have defined the columns in the table along with the attributes.
Next, open the create_products_table migrations file in the database/migrations directory and replace the code with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<?php use Illuminate\Support\Facades\Schema; use Illuminate\Database\Schema\Blueprint; use Illuminate\Database\Migrations\Migration; class CreateProductsTable extends Migration { public function up() { Schema::create('products', function (Blueprint $table) { $table->increments('id'); $table->string('name'); $table->string('description'); $table->unsignedInteger('quantity')->default(0); $table->double('price'); $table->string('image'); $table->timestamps(); $table->softDeletes(); }); } public function down() { Schema::dropIfExists('products'); } } |
Finally, open the create_orders_table migrations file in the database/migrations directory and replace the contents with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<?php use Illuminate\Support\Facades\Schema; use Illuminate\Database\Schema\Blueprint; use Illuminate\Database\Migrations\Migration; class CreateOrdersTable extends Migration { public function up() { Schema::create('orders', function (Blueprint $table) { $table->increments('id'); $table->unsignedInteger('product_id'); $table->unsignedInteger('user_id'); $table->unsignedInteger('quantity')->default(1); $table->string('address')->nullable(); $table->boolean('is_delivered')->default(false); $table->timestamps(); $table->softDeletes(); }); } public function down() { Schema::dropIfExists('orders'); } } |
Creating Seeders for Application
Laravel created seed classes to push test data into your database.
This allows testing to be quicker and easier. Below we are going to make seed classes for User and Product and provide test data.
Create a seeder class by running the command below:
|
1 |
$ php artisan make:seed UsersTableSeeder |
Open the file UserTableSeeder.php at the database/seeds directory and replace the content with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?php use App\User; use Illuminate\Database\Seeder; class UsersTableSeeder extends Seeder { public function run() { $user = new User; $user->name = "Admin"; $user->email = "admin@bagisto.com"; $user->password = bcrypt('bagisto'); $user->is_admin = true; $user->save(); } } |
The seeder class above will create a new admin user in the database.
Make another seeder class for our products table:
|
1 |
$ php artisan make:seed ProductsTableSeeder |
Open the database/seeds/ProductTableSeeder.php file and replace the contents with the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<?php use Illuminate\Database\Seeder; class ProductsTableSeeder extends Seeder { public function run() { $products = [ [ 'name' => "Red & Navy Checked Slim Formal Shirt", 'description' => 'Red and navy checked formal shirt, has a button-down collar, a full button placket, long sleeves, a curved hemline.', 'quantity' => 21, 'price' => 200.10, 'image' => 'https://assets.myntassets.com/h_1440,q_100,w_1080/v1/assets/images/1038959/2015/12/7/11449479796511-INVICTUS-Red--Navy-Checked-Slim-Formal-Shirt-4621449479796242-3.jpg', 'created_at' => new DateTime, 'updated_at' => null, ], [ 'name' => "Men Red Classic Slim Fit Solid Formal Shirt", 'description' => 'Red solid formal shirt, has a slim collar, button placket, 1 pocket, long sleeves, curved hem', 'quantity' => 400, 'price' => 1600.21, 'image' => 'https://assets.myntassets.com/h_1440,q_100,w_1080/v1/assets/images/3117516/2018/3/10/11520666535008-JAINISH-Men-Red-Classic-Slim-Fit-Solid-Formal-Shirt-2801520666534871-3.jpg', 'created_at' => new DateTime, 'updated_at' => null, ], [ 'name' => "White & Red Checked Slim Formal Shirt", 'description' => 'White, red and blue checked formal shirt, has a contrast spread collar, a full button placket, long sleeves, a curved hemline', 'quantity' => 37, 'price' => 378.00, 'image' => 'https://assets.myntassets.com/h_1440,q_100,w_1080/v1/assets/images/1038966/2015/12/8/11449575702385-INVICTUS-White--Red-Checked-Slim-Formal-Shirt-5221449575701961-1.jpg', 'created_at' => new DateTime, 'updated_at' => null, ], ]; DB::table('products')->insert($products); } } |
After that, you need to edit the database/seeds/DatabaseSeeder.php, which actually invokes the seeders:
|
1 |
$ php artisan make:model Product |
When we execute the command to seed our database the DatabaseSeeder class is called.
Further, it calls the run which in turn class the seeder classes we had set up to run.
That’s all in the first part if this series where we have created the database, defined models and added migrations.
Let us know in comments on your thoughts regarding the article and stay tuned for the second part of the article.
