Cài đặt và cấu hình Jigsaw trong môi trường ServBay
Jigsaw là gì?
Jigsaw là một công cụ tạo trang web tĩnh dựa trên Laravel, thích hợp cho việc xây dựng tài liệu, blog và các trang web tĩnh đơn giản. Nó cung cấp một hệ thống mẫu linh hoạt và công cụ phát triển mạnh mẽ, giúp việc xây dựng và quản lý trang web tĩnh trở nên rất đơn giản.
Các bước cài đặt Jigsaw
Trong bài viết này, chúng ta sẽ giới thiệu cách cài đặt và cấu hình Jigsaw trong môi trường ServBay.
Bước 1: Tạo thư mục dự án
Đầu tiên, tạo một thư mục dự án mới trong thư mục www
của ServBay:
cd /Applications/ServBay/www
mkdir servbay-jigsaw-app
cd servbay-jigsaw-app
2
3
Bước 2: Sử dụng Composer để tạo dự án Jigsaw
ServBay đã tích hợp sẵn Composer, vì vậy chúng ta có thể trực tiếp dùng Composer để tạo dự án Jigsaw:
composer create-project tightenco/jigsaw
Bước 3: Cấu hình Web Server
Thêm trang web mới
Mở ServBay, nhấp vào tab "Host", thêm một trang web mới:
- Tên:
My Jigsaw Site
- Tên miền:
servbay-jigsaw.local
- Loại trang web:
PHP
- Phiên bản PHP: chọn phiên bản PHP tương ứng
- Thư mục gốc của trang web:
/Applications/ServBay/www/servbay-jigsaw-app/build_local
- Tên:
Lưu cấu hình
Lưu cấu hình.
Bước 4: Xây dựng trang web Jigsaw
Cài đặt phụ thuộc
Trong thư mục dự án, chạy lệnh sau để cài đặt các phụ thuộc npm:
bashnpm install
1Xây dựng trang web
Chạy lệnh sau để xây dựng trang web Jigsaw:
bash./vendor/bin/jigsaw build
1
Bước 5: Chạy máy chủ phát triển cục bộ
Truy cập máy chủ phát triển
Mở trình duyệt, truy cập
https://servbay-jigsaw.local
, bạn sẽ thấy phiên bản phát triển cục bộ của trang web Jigsaw.
Bước 6: Tùy chỉnh trang web Jigsaw
Chỉnh sửa nội dung
Chỉnh sửa các tệp Markdown và tệp mẫu Blade trong thư mục
source
để tùy chỉnh nội dung và bố cục trang web của bạn.Thêm trang mới
Tạo các tệp Markdown mới trong thư mục
source
để thêm trang mới. Ví dụ, tạo một tệpabout.md
:markdown--- title: "About Us" --- # About Us Đây là trang giới thiệu.
1
2
3
4
5
6
7Cấu hình menu điều hướng
Chỉnh sửa tệp mẫu Blade cho menu điều hướng trong thư mục
source/_layouts
để thêm các liên kết điều hướng mới.Xây dựng lại trang web
Mỗi khi chỉnh sửa nội dung hoặc mẫu, chạy lại lệnh sau để xây dựng lại trang web Jigsaw:
bash./vendor/bin/jigsaw build
1
Sử dụng Jigsaw để xây dựng trang web
Bây giờ bạn đã cài đặt và cấu hình thành công Jigsaw trong môi trường ServBay, bạn có thể bắt đầu sử dụng nó để xây dựng trang web của mình. Dưới đây là một số thao tác phổ biến:
Tạo bài viết blog
Tạo bài viết
Tạo các tệp Markdown mới trong thư mục
source/_posts
để thêm bài viết blog. Ví dụ, tạo một tệp2024-06-05-my-first-post.md
:markdown--- title: "My First Post" date: 2024-06-05 --- # My First Post Đây là nội dung của bài viết đầu tiên của tôi.
1
2
3
4
5
6
7
8Xây dựng lại trang web
Chạy lệnh sau để xây dựng lại trang web Jigsaw:
bash./vendor/bin/jigsaw build
1
Tùy chỉnh kiểu dáng và script
Chỉnh sửa kiểu dáng
Chỉnh sửa các tệp SCSS trong thư mục
source/_assets/sass
để tùy chỉnh phong cách của trang web.Chỉnh sửa script
Chỉnh sửa các tệp JavaScript trong thư mục
source/_assets/js
để tùy chỉnh hành vi tương tác của trang web.Biên dịch tài nguyên
Chạy lệnh sau để biên dịch các tệp SCSS và JavaScript:
bashnpm run dev
1
Với các bước trên, bạn đã cài đặt và cấu hình Jigsaw thành công trong môi trường ServBay, và bắt đầu sử dụng nó để xây dựng trang web của mình. Sự đơn giản và linh hoạt của Jigsaw khiến nó trở thành một lựa chọn lý tưởng để xây dựng trang web tĩnh.