OUR BLOGS

This Is Your Quintessential Guide to Creating a Blog With Laravel

Share this:

People start blogs for a variety of reasons. Some wish to share personal travel or fashion experiences, while others want to share their enthusiasm for a particular skill with others who have the same interest. Blogging is also becoming a popular marketing tactic for many companies. In fact, 53% of marketers use it as their primary content marketing technique.

But how does one go about starting a blog? Laravel is a popular framework among blog creators because it is simple to use, inexpensive,, and provides a variety of layout options. This guide will walk you through the process of building a blog with the Laravel PHP framework:

Laptop on a desk, with the screen displaying text that says 'Blog' and an envelope icon in pink, along with eyeglasses, pen, cup of tea, and a plant in a mason jar

Installing Laravel

Because Laravel depends on Composer, your initial step should be to download the Laravel installation via Composer by executing the following command:

$ composer global require “laravel/installer=~1.1″

Don’t forget to add this line to your alias to ensure that Laravel is discovered whenever you execute the command on your terminal:

laravel = ~/.composer/vendor/bin/laravel

Run the following command from your terminal after adding that line to your PATH:

$ laravel new blog
$ cd blog

The Laravel new command will then create a new installation in the location you provide. A directory named blog will be created for the Laravel new blog, and it will contain a fresh Laravel installation with all dependencies. After you’ve created the blog folder, try this command:

$ php artisan serve

If you go to http://localhost:8000/, you’ll see the Laravel Welcome page. After successfully installing Laravel, you may proceed to git commit/push. To push to github, you must first create this repo:

$ git init
$ git remote add origin https://github.com/user/repo.git
$ git add .
$ git commit -m “first commit”

Then, add Way Generator to the project by modifying the composer.json file to need way/generators. Include the following:

“require-dev”: {
    “way/generators”: “~2.0"
}

Once that’s added, update your Composer from the terminal by running this command:

$ composer update —dev

When this job is finished, remember to add the service provider by editing config/app.php and adding a new item to the providers array with the following command:

‘Way\Generators\GeneratorsServiceProvider’

After that, you may use the terminal to execute the php artisan command to see the new generate commands.

The Environment Setup

First, run this command on the terminal:

$ php artisan env

Then, you will see this:

Current application environment: production

You need to change that into local environment by running the command on the terminal:

$ hostname

Then, add your local hostname to bootstrap/start.php on line 29 by removing default homestead. Run this command after to check your environment:

$ php artisan env

You should be seeing this result:

Current application environment: local

Database Setting

Next, you have to edit database setting in app/config/local/database.php. After editing, commit it by running this command:

$ git add .
$ git commit -m “Added Devlopment Setting”
$ git push origin master

Blog Admin

To migrate your user table through Way Generator, just run this command:

$ php artisan generate:migration create_users_table —fields=”username:string, password:string,email:string, remember_token:string”
$ php artisan migrate

You can then add your username, password, email and remember_token to your user table migration. 

Seeding

Run this command to run user seeding:

$ php artisan generate:seed user

We will not be using Faker from Way Generator because it only allows one seeding, so edit your UserTableSeeder with the following code block:

hands with red nail polish on top of a laptop keyboard, with the screen displaying the word 'Blogging' and a camera, an empty sheet of notebook page on the side, and a monstera leaf visible,
<?php
class UserTableSeeder extends Seeder {
public function run()

{

    DB::table(‘users’)->delete();
    User::create(array(‘username’ => ‘admin’, ‘password’ => Hash::make(‘admin’), ‘email’ => ‘setkyar16@gmail.com’));

}

}

Remove the comment from app/database/seeds/DatabaseSeeder.php online 14 like the following:

$this->call(‘UserTableSeeder’);

Now, run the command $ php artisan db:seed where you should see this message: Seeded: UserTableSeeder. Git commit/push this by running the command on the terminal:

$ git add .
$ git commit -m “Added User Table Seed”
$ git push origin master origin

Views

Moving to the views, we need to create a main.blade.php in app/views/layout:

<!DOCTYPE html>
<html>
<head>
<title>Laravel | BLOG</title>

<!— Latest compiled and minified CSS →

<link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<!— Optional theme →

<link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">

</head>

<body>

@yield(‘content’)

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js“></script>

<!— Latest compiled and minified JavaScript →

<script src=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js“></script>

</body>

</html>

Authentication Route

To add authentication route, add these lines to routes.php:

Route::get(‘/admin’, ‘AuthController@create’);

Route::post(‘/admin’, ‘AuthController@store’);

Once that’s done, let’s move to AuthController by running this command:

$ php artisan generate:controller AuthController

Then, remove all other methods except create and store from AuthController. 

Login View

To create login view, run this command:

@extends(‘layout.main’)

@section(‘content’)

<style type=”text/css”>

.login-form {

width: 248px;

margin: 0 auto;

}

</style>

<div class=”container”>

{{ Form::open(array(‘/admin’, ‘role’ => ‘form’, ‘class’ => ‘login-form’)) }}

<h1>Please Login</h1>

<div class=”form-group”>

{{ Form::label(‘email’, ‘Email Address’) }}

{{ Form::text(‘email’, ‘’,array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Enter email’)) }}

</div>

<div class=”form-group”>

{{ Form::label(‘passowrd’, ‘Password’) }}

{{ Form::password(‘password’, array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Password’)) }}

</div>

{{ Form::submit(‘Sign in’, array(‘class’ => ‘btn btn-primary’)) }}

{{ Form::close() }}

</div>

@stop

When you’re done creating index view, let’s move on to AuthController create method by editing from AuthController.php:

public function create()

{

    return View::make(‘admin.index’);

}

When you visit http://localhost:8000/admin, you should see a log in form.

On AuthController.php:

public function store()

{

    if ($this->isPostRequest()) {

    $validator = $this->getLoginValidator();

    if ($validator->passes()) {

    $credentials = $this->getLoginCredentials();

    if (Auth::attempt($credentials)) {

        Session::flash(‘message’, “Welcome Sir!”);

        return Redirect::to(“/”);

    }

    return Redirect::back()->withErrors([

“invalid_credential” => [“Credentials invalid.”]

]);

    } else {

        return Redirect::back()

      ->withInput()

      ->withErrors($validator);

    }

}

return View::make(“admin.index”);

}

  //Check user’s post request

protected function isPostRequest()

{

    return Input::server(“REQUEST_METHOD”) == “POST”;

}

//Validate

protected function getLoginValidator()

{

    return Validator::make(Input::all(), [

        “email” => “required|email”,

        “password” => “required”

    ]);

}

//Get Login Credentials

protected function getLoginCredentials()

{

  return [

        “email” => Input::get(“email”),

        “password” => Input::get(“password”)

  ];

}

The first line in the code block checked to see if it was a post request or not. If so, we validate it and log in. If there are no problems when you log in, change your view as follows:

@extends(‘layout.main’)

@section(‘content’)

<style type=”text/css”>

.login-form {

    width: 248px;

    margin: 0 auto;

}

.container {

    padding: 10px;

}

</style>

<div class=”container”>

{{ Form::open(array(‘/admin’, ‘role’ => ‘form’, ‘class’ => ‘login-form’)) }}

<h1>Please Login</h1>

@if(!empty($errors->first(‘invalid_credential’)))

<div class=”alert alert-danger”>{{ $errors->first(‘invalid_credential’) }}</div>

@endif

<div class=”form-group”>

@if(!empty($errors->first(“email”)))

<div class=”alert alert-danger”>{{ $errors->first(“email”) }}</div>

@endif

{{ Form::label(‘email’, ‘Email Address’) }}

{{ Form::text(‘email’, ‘’,array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Enter email’)) }}

</div>

<div class=”form-group”>

@if(!empty($errors->first(“password”)))

<div class=”alert alert-danger”>{{ $errors->first(“password”) }}</div>

@endif

{{ Form::label(‘passowrd’, ‘Password’) }}

{{ Form::password(‘password’, array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Password’)) }}

</div>

{{ Form::submit(‘Sign in’, array(‘class’ => ‘btn btn-primary’)) }}

{{ Form::close() }}

</div>

@stop

After updating your view, it should show an error prompt when you validate something. 

  • Logout View

Add this line to your route to start with logout view:

Route::get(‘/admin/logout’, ‘AuthController@logout’);

Then, add the following code block:

public function logout()

{

    Auth::logout();

    Session::flash(‘message’, “Logout success sir!”);

    return Redirect::to(‘/’);

}

To git commit/push the login and logout methods, run this command:

$ git add .

$ git commit -m “Login & Logout Added” 

$ git push origin master

  • Blog

For the admin blog part, start by running this command to generate the blog post resource:

$ php artisan generate:resource post —fields=”title:string, body:text”

Then, add this code block to routes.php:

Route::resource(‘admin/posts’, ‘PostsController’);

Now, if you visit http://localhost:8000/admin/posts, you will see a blank screen, so we need to add some design. Add this code block to PostController’s index method first:

return View::make(‘posts.index’);

Then, add the following code block to app/views/post/index.blade.php:

@extends(‘layout.main’)

@section(‘content’)

<style type=”text/css”>

</style>

@include(‘layout.adminnav’)

<div class=”container”>

<div class=”col-md-12″>

<div class=”pull-right”>

<a href=”/admin/posts/create”><div class=”btn btn-success”>Add New Blog Post</div></a>

</div>

<table class=”table”>

<thead>

<tr>

<th>ID</th>

<th>BLOG TITLE</th>

<th>EDIT BLOG</th>

<th>DELETE BLOG</th>

</tr>

</thead>

<tbody>

<tr>

<td>1</td>

<td>Hello world</td>

<td><div class=”btn btn-primary”>Edit Blog</div></td>

<td><div class=”btn btn-danger”>Delete Blog</div></td>

</tr>

</tbody>

</table>

</div>

</div>

@stop

Then, add this code to layout/adminnav.blade.php:

<nav class=”navbar navbar-default” role=”navigation”>

<div class=”navbar-header”>

<button type=”button” class=”navbar-toggle” data-toggle=”collapse” data-target=”#bs-example-navbar-collapse-1″>

<span class=”sr-only”>Toggle navigation</span>

<span class=”icon-bar”></span>

<span class=”icon-bar”></span>

<span class=”icon-bar”></span>

</button>

<a class=”navbar-brand” href=”/”>Laravel BLOG</a>

</div>

<div class=”collapse navbar-collapse”>

<ul class=”nav navbar-nav”>

<li><a href=”/”>BLOGS</a></li>

</ul>

@if(Auth::check())

<ul class=”nav navbar-nav navbar-right”>

<li><p class=”navbar-text pull-right”>Signed in as <a href=”/admin/posts” class=”navbar-link”>{{ Auth::user()->username }}</a></p></li>

<li><a href=”/admin/logout”>Logout</a></li>

</ul>

@else

<ul class=”nav navbar-nav navbar-right”>

<li><a href=”/admin”>Sign in</a></li>

</ul>

@endif

</div>

</nav>

Now, when you visit http://localhost:8000/admin/posts, you will see a dashboard with a list of blogs and the options to edit or delete them. The design of this page will depend on your preferences. 

  • Create View

To start designing create view, add this code block to app/views/posts/create.blade.php:

@extends(‘layout.main’)

@section(‘content’)

<style type=”text/css”>

</style>

@include(‘layout.adminnav’)

<div class=”container”>

<div class=”col-md-12″>

<h1>Write Your Post Here</h1>

{{ Form::open(array(‘url’ => ‘/admin/posts’, ‘role’ => ‘form’)) }}

<div class=”form-group”>

@if(!empty($errors->first(‘title’)))

<div class=”alert alert-danger”>{{ $errors->first(‘title’) }}</div>

@endif

{{ Form::label(‘title’, ‘Post Title’) }}

{{ Form::text(‘title’, $value = null, array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Your Blog Post Title’)) }}

</div>

<div class=”form-group”>

@if(!empty($errors->first(‘body’)))

<div class=”alert alert-danger”>{{ $errors->first(‘body’) }}</div>

@endif

{{ Form::label(‘body’, ‘Blog Body/Content’) }}

{{ Form::textarea(‘body’, $value = null, array(‘class’ => ‘form-control’, ‘rows’ => ‘7′)) }}

</div>

{{ Form::submit(‘Publish Your Blog Post’, array(‘class’ => ‘btn btn-default’)) }}

{{ Form::close() }}

</div>

</div>

@stop

Next, add this to store method:

public function store()

{

$rules = array(

‘title’ => ‘required’,

‘body’ => ‘required’,

);

$validator = Validator::make(Input::all(), $rules);

// process the login

if ($validator->fails()) {

return Redirect::to(‘/admin/posts/create’)

->withErrors($validator)

->withInput(Input::except(‘password’));

} else {

// store

$blog = new Post;

$blog->title = Input::get(‘title’);

$blog->body = Input::get(‘body’);

$blog->save();

// redirect

Session::flash(‘message’, ‘Successfully posted your blog!’);

return Redirect::to(‘/admin/posts’);

}

}

In the store method, we created a validation that if you fail to create a post, you will be redirected back to /admin/posts. If your post was successfully created, a success flash message should appear by adding this code to app/views/posts/index.blade.php:

@if (Session::has(‘message’))

<div class=”col-md-12″>

<div class=”alert alert-info”>{{ Session::get(‘message’) }}</div>

</div>

@endif

To edit your index method, add this code block:

public function index()

{

        $blogs = Post::orderBy(‘id’, ‘DESC’)->paginate(10);

        return View::make(‘posts.index’, compact(‘blogs’));

}

Then, remove your admin/index hard-coded tbody and replace it with this code block:

<tbody>

@foreach($blogs as $blog)

<tr>

<td>{{ $blog->id }}</td>

<td>{{ $blog->title }}</td>

<td><a class=”btn btn-default” href=”{{ URL::to(‘admin/posts/’ . $blog->id) }}”>View this blog! </a></td>

<td><a class=”btn btn-primary” href=”{{ URL::to(‘admin/posts/’ . $blog->id . ‘/edit’) }}”>Edit Blog</a></td>

<td>

{{ Form::open(array(‘url’ => ‘admin/posts/’ . $blog->id)) }}

{{ Form::hidden(‘_method’, ‘DELETE’) }}

{{ Form::submit(‘Delete this Blog Post’, array(‘class’ => ‘btn btn-danger’)) }}

{{ Form::close() }}

</td>

</tr>

@endforeach()

</tbody>

For your delete method, add this code block:

public function destroy($id)

{

$post = Post::find($id);

$post->delete();

// redirect

Session::flash(‘message’, ‘Successfully deleted!’);

return Redirect::to(‘/admin/posts’);

}

Then, add this code block to PostController for your edit method:

public function edit($id)

{

    $post = Post::find($id);

     return View::make(‘posts.edit’)

->with(‘post’, $post);

}

Next, edit app/view/posts/edit.blade.php:

@extends(‘layout.main’)

@section(‘content’)

@include(‘layout.adminnav’)

<div class=”container”>

<div class=”col-md-12″>

<h1>Edit {{ $post->title }}</h1>

{{ Form::model($post, array(‘route’ => array(‘admin.posts.update’, $post->id), ‘method’ => ‘PUT’)) }}

<div class=”form-group”>

@if(!empty($errors->first(‘title’)))

<div class=”alert alert-danger”>{{ $errors->first(‘title’) }}</div>

@endif

{{ Form::label(‘title’, ‘Post Title’) }}

{{ Form::text(‘title’, $value = null, array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Your Blog Post Title’)) }}

</div>

<div class=”form-group”>

@if(!empty($errors->first(‘body’)))

<div class=”alert alert-danger”>{{ $errors->first(‘body’) }}</div>

@endif

{{ Form::label(‘body’, ‘Blog Body/Content’) }}

{{ Form::textarea(‘body’, $value = null, array(‘class’ => ‘form-control’, ‘rows’ => ‘7′)) }}

</div>

{{ Form::submit(‘Publish Your Blog Post’, array(‘class’ => ‘btn btn-default’)) }}

{{ Form::close() }}

</div>

</div>

@stop

After that, add this code block for your update method:

public function update($id)

{

$rules = array(

‘title’ => ‘required’,

‘body’ => ‘required’

);

$validator = Validator::make(Input::all(), $rules);

if ($validator->fails()) {

return Redirect::to(‘/admin/posts/create’)

->withErrors($validator)

->withInput(Input::except(‘password’));

} else {

// store

$blog = Post::find($id);

$blog->title = Input::get(‘title’);

$blog->body = Input::get(‘body’);

$blog->save();

// redirect

Session::flash(‘message’, ‘Successfully updated your blog!’);

return Redirect::to(‘/admin/posts’);

}

}

To show blog post for admin, add this code:

public function show($id)

{

$post = Post::find($id);

return View::make(‘posts.show’)

->with(‘post’, $post);

}

Then, find post with para ID and pass that variable to posts.show view. Add this code block to app/views/posts/show.blade.php:

@extends(‘layout.main’)

@section(‘content’)

@include(‘layout.adminnav’)

<div class=”container”>

<div class=”col-md-12″>

<h1>{{ $post->title }}</h1>

<span>Submitted in {{ date(“F j, Y, g:i a”, strtotime($post->created_at)) }}</span>

<p class=”lead”>

{{ $post->body }}

</p>

</div>

</div>

@stop

  • Route

To edit your route, add this code block:

Route::get(‘/’, ‘HomeController@showWelcome’);

Route::get(‘/admin’, ‘AuthController@create’);

Route::post(‘/admin’, ‘AuthController@store’);

Route::group(array(‘before’ => ‘auth’), function()

{

Route::get(‘/admin/logout’, ‘AuthController@logout’);

  Route::resource(‘admin/posts’, ‘PostsController’);

});

Routes will now be seen when a user has logged in. We also need to edit on app/filter.php where you should replace filter.php line 44 with this code block:

return Redirect::guest(‘admin’)->withErrors([

“invalid_credential” => [“Please login first!”]

]);

To git commit/push everything, add this:

$ git add .

$ git commit -m “Finished Blog Post CRUD”

$ git push origin master

  • User

We have two goals for the user part of the blog, to show all the posts and to allow users to comment on these posts. Let’s start with showing all blog posts to our homepage by replacing this code: 

Route::get(‘/’, ‘HomeController@showWelcome’);

With this code block:

Route::get(‘/’, ‘HomeController@showWelcome’);

Route::get(‘/blog/{id}’, ‘HomeController@showBlogDetail’);

Then, edit your HomeController’s showWElcome method with this:

public function showWelcome()

{

    $blogs = Post::paginate(10);

     return View::make(‘home’, compact(‘blogs’));

}

Add the following code block to edit home design on home.blade.php on view folder:

@extends(‘layout.main’)

@section(‘content’)

@include(‘layout.adminnav’)

<div class=”container”>

  <div class=”col-md-12″>

      <div class=”panel panel-default”>

            @foreach($blogs as $blog)

            <div class=”panel-body”>

              <a href=”/blog/{{ $blog->id }}”><h1>{{{ $blog->title }}}</h1></a>

                <span>Submitted in {{ date(“F j, Y, g:i a”, strtotime($blog->created_at)) }}</span>

            </div>

            @endforeach()

        </div>

      <div class=”pull-right”>{{ $blogs->links(); }}</div>

  </div>

</div>

@stop

There is a link to the title in that code block, so when a reader clicks on it, the post will be shown. Next, modify your showBlogDetail function by inserting the following code:

public function showBlogDetail($id)

{

    $blog = Post::find($id);

     return View::make(‘blogdetail’, compact(‘blog’));

}

Then create blogdetail.blade.php with this code block:

@extends(‘layout.main’)

@section(‘content’)

@include(‘layout.adminnav’)

<div class=”container”>

<div class=”col-md-12″>

    <div class=”panel panel-default”>

        <div class=”panel-body”>

            <h1>{{ $blog->title }}</h1>

            <span>Submitted in {{ date(“F j, Y, g:i a”, strtotime($blog->created_at)) }}</span>

          <p class=”lead”>{{ $blog->body }}</p>

        </div>

      </div>

    </div>

</div>

@stop

To git commit/push everything, run this command on the terminal:

git add .

git commit -m “Blog & Blog Detail”

git push origin master

Now, to generate migration of comments, run this command from your terminal:

$ php artisan generate:migration create_comments_table —fields=”name:string, post_id:string, comment:text”

Then, run this command to migrate:

$ php artisan migrate

To generate the comment model, run this command on your terminal:

$ php artisan generate:model Comment

Then, run this command to generate CommentController:

$ php artisan generate:controller CommentController

Then, at the end of the blog detail view, add this code block to delete all of the produced methods from CommentController:

<div class=”col-md-12″>

{{ Form::open(array(‘url’ => ‘/blog/comment/’$blog->id, ‘role’ => ‘form’)) }}

<div class=”form-group”>

@if(!empty($errors->first(‘name’)))

<div class=”alert alert-danger”>{{ $errors->first(‘name’) }}</div>

@endif

{{ Form::label(‘name’, ‘Your Name’) }}

{{ Form::text(‘name’, $value = null, array(‘class’ => ‘form-control’, ‘placeholder’ => ‘Your Name’)) }}

</div>

<div class=”form-group”>

@if(!empty($errors->first(‘comment’)))

<div class=”alert alert-danger”>{{ $errors->first(‘comment’) }}</div>

@endif

{{ Form::label(‘comment’, ‘Comment’) }}

{{ Form::textarea(‘comment’, $value = null, array(‘class’ => ‘form-control’, ‘rows’ => ‘4′)) }}

</div>

{{ Form::submit(‘Comment Now’, array(‘class’ => ‘btn btn-default’)) }}

{{ Form::close() }}

</div>

Then, add this route to routes.php to handle the comment form post request:

Route::post(‘/comment/{id}’, ‘CommentController@comment’);

Next, add the new comment method to CommentController with this code block:

public function comment($id) {

$rules = array(

‘name’ => ‘required’,

‘comment’ => ‘required’,

);

$validator = Validator::make(Input::all(), $rules);

if ($validator->fails()) {

return Redirect::to(‘/blog/comment/’.$id)

->withErrors($validator)

->withInput(Input::except(‘password’));

} else {

// store

$comment = new Comment;                                       $comment->post_id = $id;

$comment->name = Input::get(‘name’);

$comment->comment = Input::get(‘comment’);

$comment->save();

// redirect

return Redirect::to(‘/blog/’.$id);

}

}

Now, you will need to add this code block to Post Model to manage the number of comments on your blog posts:

public function comments()

{

return $this->hasMany(‘Comment’);

}

Then, add this to your comment model too:

public function post()

{

return $this->belongsTo(‘Post’);

}

To show all comments, replace this code:

$blog = Post::find($id);

  • With this code:

$blog = Post::with(‘comments’)->find($id);

Then, add this code block to your blog detail view:

<div class=”col-md-12″>

<hr>

@foreach($blog->comments as $comment)

<span>{{{ $comment->name }}}</span>

<p class=”lead”>{{{ $comment->comment }}}</p>

<hr>

@endforeach

</div>

Of course, you need to commit/push everything with this command on your terminal:

git add.

git commit -m “Added Comment”

git push origin master

Finally, to add a flash message on your home view, add this code to your home view’s container:

@if (Session::has(‘message’))

<div class=”col-md-12″>

<div class=”alert alert-info”>{{ Session::get(‘message’) }}</div>

</div>

@endif

Then, run this command on your terminal:

git add.

git commit -m “Added Flash Message on homepage”

git push origin master

Your blog is now complete and ready to go. The next step would be to create a theme for your site and begin thinking ideas for blog articles in order to get your blog up and running.

Leave a Reply

Your email address will not be published. Required fields are marked *

fine arts

OUR STORIES & LATEST NEWS

Discover new techniques, take in our most recent happenings and activities, see the most recent advancements, and be motivated by our stories.

HAVE A PROJECT IN MIND?

Tell us about it; we’d love to know! Thinking of new projects is always thrilling, much more when they become a reality. Get in touch with us today and let’s make it happen!