Tiếng Việt

Hướng dẫn Laravel

Hướng dẫn Laravel: Xây dựng trang chủ đầu tiên của bạn

Giới thiệu

Xin chào các bạn đang học lập trình web! Tôi rất vui mừng được làm hướng dẫn viên của bạn trong hành trình thú vị vào thế giới của Laravel. Là một người đã dạy khoa học máy tính hơn một thập kỷ, tôi có thể nói rằng Laravel là một trong những khung công tác mạnh mẽ và thú vị nhất để làm việc. Hôm nay, chúng ta sẽ tạo trang chủ đầu tiên của mình bằng Laravel. Đừng lo lắng nếu bạn chưa bao giờ viết mã trước đây - chúng ta sẽ cùng nhau từng bước, và trước khi bạn biết điều đó, bạn sẽ trở thành một chuyên gia tạo ra những trang web đẹp mắt!

Laravel - Home

Laravel là gì?

Trước khi chúng ta bắt đầu, hãy nhanh chóng nói qua về Laravel là gì. Hãy tưởng tượng bạn đang xây dựng một ngôi nhà. Laravel giống như một bộ công cụ đáng tin cậy của bạn, đầy những công cụ hữu ích giúp công việc dễ dàng và nhanh chóng hơn. Nó là một khung công tác PHP giúp các nhà phát triển tạo ứng dụng web mà không cần phải làm lại từ đầu mỗi lần. Nó giống như có một bộ lego đã组装 sẵn mà bạn có thể ghép lại với nhau để tạo ra điều kỳ diệu!

Yêu cầu

Để theo kịp bài hướng dẫn này, bạn sẽ cần:

  1. Một chiếc máy tính (dĩ nhiên!)
  2. PHP đã cài đặt trên máy của bạn (phiên bản 7.3 hoặc mới hơn)
  3. Composer (một công cụ quản lý phụ thuộc PHP)
  4. Một phần mềm soạn thảo văn bản (tôi khuyên dùng Visual Studio Code, nhưng bạn có thể sử dụng bất kỳ phần mềm nào bạn quen thuộc)
  5. Sự tò mò và sự kiên trì học hỏi!

Đừng lo lắng nếu bạn chưa thiết lập những điều này. Có rất nhiều hướng dẫn tuyệt vời ngoài kia để giúp bạn chuẩn bị môi trường của mình.

Cài đặt Laravel

Bước 1: Cài đặt Laravel

Đầu tiên, hãy cài đặt Laravel. Mở terminal (đừng sợ, nó chỉ là một cách giao tiếp văn bản với máy tính) và gõ:

composer create-project --prefer-dist laravel/laravel my-first-laravel-project

Lệnh này sẽ yêu cầu Composer tạo một dự án Laravel mới trong thư mục my-first-laravel-project. Nó có thể mất một vài phút, vì vậy hãy uống một tách cà phê hoặc nhảy một điệu舞 khi chờ đợi.

Bước 2: Chuyển đến dự án của bạn

Khi xong, hãy chuyển vào thư mục dự án mới của bạn:

cd my-first-laravel-project

Chúc mừng! Bạn đã vào trong dự án Laravel đầu tiên của mình. Cảm thấy tốt phải không?

Tạo trang chủ của bạn

Bước 3: Hiểu về các route

Trong Laravel, route giống như nhân viên tiếp tân của ứng dụng của bạn. Họ quyết định nơi khách truy cập nên đi khi họ đến trang web của bạn. Hãy mở file routes/web.php. Đây là nơi chúng ta sẽ告诉 Laravel cần làm gì khi ai đó truy cập trang chủ của chúng ta.

Bạn sẽ thấy điều gì đó như này:

Route::get('/', function () {
return view('welcome');
});

Đây là route mặc định của Laravel. Nó nói, "Khi ai đó truy cập vào root của trang web ('/'), hiển thị cho họ view 'welcome'." Nhưng chúng ta muốn tạo trang chủ riêng của mình, vì vậy hãy thay đổi nó!

Bước 4: Tạo một controller

Controllers giống như những người quản lý của ứng dụng của bạn. Họ xử lý các yêu cầu và trả về các phản hồi. Hãy tạo một controller cho trang chủ của chúng ta:

php artisan make:controller HomeController

Lệnh này sẽ tạo một file mới tại app/Http/Controllers/HomeController.php. Mở nó ra và thêm một phương thức:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HomeController extends Controller
{
public function index()
{
return view('home');
}
}

Phương thức index sẽ chịu trách nhiệm hiển thị trang chủ của chúng ta.

Bước 5: Cập nhật route

Bây giờ, hãy cập nhật file routes/web.php để sử dụng controller mới của chúng ta:

use App\Http\Controllers\HomeController;

Route::get('/', [HomeController::class, 'index']);

Điều này告诉 Laravel, "Khi ai đó truy cập '/', sử dụng phương thức index của HomeController."

Bước 6: Tạo view

Bây giờ chúng ta cần tạo HTML thực tế cho trang chủ của chúng ta. Tạo một file mới tại resources/views/home.blade.php và thêm một chút HTML:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to My First Laravel Site!</title>
</head>
<body>
<h1>Hello, Laravel World!</h1>
<p>This is my very first Laravel home page. Exciting times!</p>
</body>
</html>

Bước 7: Chạy ứng dụng của bạn

Bây giờ là thời điểm của sự thật! Trong terminal, chạy:

php artisan serve

Lệnh này sẽ khởi động máy chủ phát triển. Mở trình duyệt của bạn và truy cập http://localhost:8000. Bạn nên thấy trang chủ mới của mình!

Thêm một chút phong cách

Bước 8: Sử dụng Blade Templates

Laravel sử dụng một engine template gọi là Blade. Nó giống như HTML với siêu năng lực. Hãy cập nhật home.blade.php của chúng ta để sử dụng một số tính năng của Blade:

@extends('layouts.app')

@section('content')
<h1>Welcome to {{ config('app.name') }}!</h1>
<p>The current time is {{ now() }}.</p>
@endsection

Bây giờ tạo một file mới tại resources/views/layouts/app.blade.php:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title', config('app.name'))</title>
</head>
<body>
@yield('content')
</body>
</html>

Điều này tạo ra một layout có thể tái sử dụng mà trang chủ của chúng ta (và các trang tương lai) có thể sử dụng.

Kết luận

Và thế là bạn đã tạo xong trang chủ Laravel đầu tiên của mình. Chúng ta đã cùng nhau bao quát rất nhiều nội dung - từ việc thiết lập Laravel đến việc tạo route, controller và view. Nhớ rằng, học lập trình là một hành trình, không phải là đích đến. Hãy tiếp tục thực hành, tiếp tục khám phá, và quan trọng nhất, hãy vui vẻ!

Dưới đây là bảng tóm tắt nhanh các khái niệm Laravel chính mà chúng ta đã bao quát:

Khái niệm Mô tả
Routes Định nghĩa URL và cách ứng dụng phản hồi với các yêu cầu
Controllers Xử lý logic cho việc phản hồi các yêu cầu
Views Chứa HTML được ứng dụng của bạn phục vụ
Blade Engine template của Laravel để tạo các view động

Chúc mừng, và chào mừng bạn đến với thế giới kỳ diệu của Laravel!

Credits: Image by storyset

 
Hướng Dẫn Tiếp Theo:
Laravel - Tổng quan