Introduction to Laravel + Project Setup with VS Code Extensions

1. What is Laravel?

Laravel is a free, open-source PHP web framework created by Taylor Otwell in 2011 and intended for the development of web applications following the model–view–controller (MVC) architectural pattern.

2. Why Laravel?

Laravel is a popular PHP framework that offers a range of features and benefits for web development. Here are some reasons why developers choose Laravel:

• Elegant Syntax:clean and elegant syntax that makes it easy to write and understand code.
• Built-in Tools: a variety of built-in tools and features, such as routing, authentication, and database management, which can speed up development.
• Community Support: a large and active community that contributes to its development and provides support through forums, tutorials, and packages.
• Scalability: designed to be scalable, allowing developers to build applications of any size.
• Security:features like CSRF protection, encryption, and secure authentication to help protect applications from common security vulnerabilities.

3. Laravel Setup Requirement:

1. PHP: Laravel requires PHP version 7.3 or higher.
2. Web Server: A web server like Apache or Nginx is required to serve the Laravel application.
3. Database: Laravel supports various databases, including MySQL, PostgreSQL, SQLite, and SQL Server.
4. Composer: Composer is a dependency management tool for PHP that is required to install Laravel and its dependencies. Download Composer

How to Install Composer

4. Command setup Laravel and Run

You can setup Laravel project in drive and folder , you can use the following command in your terminal:

composer create-project --prefer-dist laravel/laravel project-name

Now go to your project-folder

cd project-name

Now run the Laravel development server using the following command:

php artisan serve

Ctrl + Click on the ip address provided: http://127.0.0.1:8000.

You will see larave welcome page

5. VS Code Extension for Laravel

Here are some popular VS Code extensions for Laravel development:

• Laravel Blade Snippets: Provides snippets for Laravel Blade templating engine.
• Laravel Artisan: Allows you to run Artisan commands directly from VS Code.
• Laravel Extra Intellisense: Enhances code completion and navigation for Laravel projects.
• PHP Intelephense: A powerful PHP language server that provides advanced features like code analysis and refactoring.
• Laravel Snippets: Offers a collection of snippets for Laravel development.
• Laravel goto view Enable goto specific file name, easy for navigate

Recomment extensions for general use:

• Prettier - Code formatter: A popular code formatter that supports multiple languages, including PHP.
• GitLens: Enhances Git integration in VS Code, making it easier to manage version control for your Laravel projects.
• Live Server: Allows you to launch a local development server with live reload feature for static and dynamic pages.
• Path Intellisense: one of the best auto-complete filename plugin
• Material Icon Themse: display project icons, file name, and more to easy for file and eye-catching
• Night Owl: a very good vs code extension that enable nice themse environment to look good and easy to code

Click Here for More Useful VS Code Extensions

6. Simple Example User Profile

Here is a simple example of a user profile page in Laravel:

1. Create UserController

We use can use this command to create controller:

php artisan make:controller UserController

Now edit UserController file in app/Http/Controllers/UserController.php and add example below:

        class UserController extends Controller
{  private $users = [
            1 => 'Song Ratha',
            2 => 'kim nimol',
            3 => 'veng phalla',
        ];
    public function show($id)
    {	  // Check if the user exists
        if (array_key_exists($id, $this->users)) {
            return view('user.profile', ['user' => $this->users[$id]]);
        } else {
            return "User not found.";
        }
    }
    public function index()
    {
        return view('user.index', ['users' => $this->users]);
    }
}
    

2. Create View

profile.blade.php

Now create a view file in resources/views/user/profile.blade.php and add example below:

        <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>User Profile</title>
</head>
<body>
    <h1>User Profile</h1>
    <p>Name: {{ $user }}</p>
</body>    
</html>

index.blade.php

Now create a view file to show all users list and when click on the name it call show function (display user profile) in resources/views/user/index.blade.php and add example below:

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>User List</title>
</head>
<body>
    <h1>User List</h1>
    <ul>
        @foreach ($users as $id => $name)
            <li><a href="{{ url('/user/' . $id) }}">{{ $name }}</a></li>
        @endforeach
    </ul>
</body>
</html>

3. Define Route

Now open the routes file in routes/web.php and add example below:

        use App\Http\Controllers\UserController;

        Route::get('/users', [UserController::class, 'index']);
        Route::get('/users/{id}', [UserController::class, 'show']);
    

Run Laravel Server Service:

php artisan serve

Now You can test with browser