Làm thế nào để xây dựng một trang web từ Scratch với PHP
Nếu bạn có hiểu biết cơ bản về cách xây dựng trang web bằng PHP, bạn sẽ có kiến thức về bao gồm tệp và sản xuất đầu ra — những điều cơ bản về tùy chỉnh trang web. Có thể bạn đang băn khoăn không biết bắt đầu từ đâu hoặc những bước tiếp theo cần thực hiện khi xây dựng thêm chức năng cho trang web của mình.
Trong hướng dẫn này, tôi trình bày một cấu trúc trang web đơn giản cho phép cập nhật đơn giản. Nó cũng thể hiện một số hàm PHP hữu ích để tăng thêm giá trị.
Mục Lục
Trang web bạn sẽ xây dựng bằng PHP
Trang web mẫu — có sẵn trong kho lưu trữ GitHub — là một trang web đơn giản về các loài chim với tất cả vẻ đẹp như lông của chúng. Có một số phần, một số trang thông tin và trang chủ. Trang web cuối cùng không quan trọng bằng các kỹ thuật bạn sẽ đọc và những ý tưởng mà chúng có thể truyền cảm hứng cho bạn.
Nếu bạn có thể, hãy tải xuống trang web từ GitHub và cài đặt nó trên máy tính cục bộ của bạn trước khi đọc tiếp.
Cấu trúc tổng thể của trang web
Dưới đây là một số tệp và thư mục chính mà bạn nên điều tra.
composer.json
data/
funcs.php
md/
site/
index.php
tpl/-
Mỗi trang tương ứng với một tập lệnh PHP trong Địa điểm danh mục. Điều này giới thiệu một số dư thừa, nhưng nó giữ cho mọi thứ đơn giản. Khi thiết lập máy chủ web của bạn, hãy đảm bảo rằng bạn trỏ DOCROOT của mình vào Địa điểm danh mục.
-
Các md thư mục chứa các tệp nguồn đánh dấu lưu trữ nội dung chính của một số trang riêng lẻ.
-
Các tpl thư mục chứa các mẫu và tệp xác định cấu trúc HTML tổng thể mà một số trang có thể chia sẻ.
-
Hầu hết các chức năng PHP đều có trong funcs.php.
Cách hoạt động của trang web
Bootstrap
Bootstrap là một khung công tác front-end để xây dựng các trang web. Nó có các kiểu và chức năng JavaScript được tích hợp sẵn, đáp ứng hầu hết các nhu cầu phổ biến của nhà phát triển web. Đó là một cách tuyệt vời để nhanh chóng thiết lập và chạy một trang web trước khi bạn dành thời gian tinh chỉnh thiết kế.
Bạn có thể cài đặt và lưu trữ các tệp Bootstrap trên máy chủ của mình, nhưng để có tốc độ tối đa, bạn chỉ có thể tham chiếu chúng từ CDN. Hãy xem tpl / head.php và bạn sẽ thấy một ví dụ như:
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>Cơ bản Templating
Bắt đầu với site / index.php. Đây là tệp đại diện cho trang chủ của trang web. Tùy thuộc vào cách máy chủ web của bạn được thiết lập, bạn có thể truy cập nó tại http://yoursite.example.org/ hoặc nếu không, http://yoursite.example.org/index.php.
Lưu ý hai phần bao gồm ngay ở phần đầu của tệp này: funcs.php và TPL_DIR. “/ Home.php”. Các funcs.php tệp xác định rằng TPL_DIR hằng số như là đường dẫn tuyệt đối đầy đủ của tpl thư mục ở cấp cao nhất của trang web.
Hãy xem tpl / home.php. Đây là phần ngoài cùng của tài liệu html: nó chỉ bao gồm một loại tài liệu và một phần tử HTML. Trong phần tử HTML, nó sử dụng hai bao gồm cho các mẫu đại diện cho phần đầu và phần thân.
<!DOCTYPE html>
<html lang="en">
<?php include TPL_DIR."/head.php"; ?>
<?php include TPL_DIR."/home/body.php"; ?>
</html>
Ngược lại, mẫu cho phần chim tải một mẫu cơ thể khác, tpl / chim / body.tpl. Điều này chứa một bố cục khác cho các trang trong phần đó, một bố cục có thanh bên.
Phân tích cú pháp Markdown
bên trong nhà soạn nhạc.json tệp, thư viện của bên thứ ba có tên là erusev / parsedown là bắt buộc. Đây là thư viện phân tích cú pháp Markdown. Nó cho phép bạn chuyển đổi văn bản Markdown thành HTML một cách rất dễ dàng.
Nhiều trang web tĩnh tạo HTML cuối cùng từ các tài liệu được viết bằng ngôn ngữ khác, chẳng hạn như Markdown. Nó cung cấp một cú pháp đẹp hơn để soạn thảo, một cú pháp dễ đọc hơn HTML. Trang web mẫu trình bày điều này như một tùy chọn. Hãy nhìn vào show_content () chức năng trong funcs.php:
function show_content() {
$file = MD_DIR.PAGE.'.md';
if (file_exists($file)) {
$Parsedown = new Parsedown();
echo $Parsedown->text(file_get_contents($file));
} else if (function_exists("content")) {
echo content();
}
}
Nếu tệp Markdown tương ứng với trang được yêu cầu tồn tại, một đối tượng Parsedown sẽ chuyển đổi nội dung của nó thành HTML và xuất ra. Nếu không có tệp Markdown, nó sẽ tìm kiếm một hàm có tên Nội dung() thay thế. Các trang riêng lẻ có thể xác định chức năng này (xem site / index.php chẳng hạn) nếu nội dung của họ cần vượt xa những gì Markdown tĩnh có thể đạt được.
Đang tải siêu dữ liệu
Hãy nhìn vào get_json chức năng trong funcs.php:
function get_json($file) {
$data_file = DATA_DIR."/".$file;
if (!file_exists($data_file)) {
return array();
}
if (($json = file_get_contents($data_file)) === false) {
return array();
}
if (($out = json_decode($json, true)) === null) {
return array();
}
return $out;
}Về cơ bản, hàm gọi hai hàm khác để tìm nạp và phân tích cú pháp dữ liệu từ một tệp nhất định. Nó xử lý rất nhiều lỗi kiểm tra để trả về một mảng trống nếu có gì sai. Kêu gọi json_decode () như thế này trả về một mảng kết hợp giúp bạn dễ dàng làm việc với dữ liệu ngay lập tức. Cách tiếp cận này rất tiện lợi nên bạn có thể thích nó hơn khi sử dụng cơ sở dữ liệu, đặc biệt đối với các tác vụ đơn giản như cấu hình toàn cục.
Trang web sử dụng hai tệp siêu dữ liệu: data / title.json và data / feature.json. Trước đó lưu trữ tiêu đề của mỗi trang, hữu ích cho liên kết tự động và trong các trường hợp khác.
{
"/": "Home",
"/about": "About",
"/birds": "Bird profiles",
...
}Đây là một cách tiện dụng để giữ tất cả các tiêu đề trang ở một nơi (tệp), dễ dàng cập nhật khi bạn cần. Các tiêu đề này góp phần điều hướng trong menu trên cùng, danh sách breadcrumb và bảng điều khiển bên.
function page_title($page = PAGE) {
$titles = get_titles();
return array_key_exists($page, $titles) ? $titles[$page] : basename($page);
}
Đây là phần đầu tiên của breadcrumbs () chức năng (từ funcs.php) xây dựng một mảng tiêu đề trang cho mỗi phần của URL. Ví dụ, đối với / chim / blue-tit trang, nó lấy tiêu đề cho / trang, sau đó là tiêu đề cho / chimcuối cùng là tiêu đề cho / chim / blue-tit. Sau đó, danh sách breadcrumb sẽ bao gồm một liên kết cho mỗi trang trong hệ thống phân cấp.
function breadcrumbs() {
$items = array();
$titles = get_titles();
$parts = explode("/", PAGE);
$href = "";
foreach ($parts as $part) {
$href .= ($href == "/" ? "" : "/").$part;
$items[$href] = $titles[$href];
}
...
}Nắm giữ các siêu dữ liệu khác
Nếu bạn xem trang Giới thiệu, một câu chuyện tin tức cụ thể hoặc một tiểu sử loài chim cụ thể, bạn sẽ có thể phát hiện ra Cập nhật mới nhất tin nhắn ở chân trang. Chân trang của trang web được lưu trữ trong tpl / footer.php. Mở tệp này và lưu ý đoạn mã PHP bên trong nó:
if (file_exists($file = MD_DIR.PAGE.'.md')) {
echo 'Last updated: '.date('r', filemtime(MD_DIR.PAGE.'.md'));
}Đây là một ví dụ đơn giản về việc tìm nạp siêu dữ liệu trực tiếp từ một tệp chứ không phải cơ sở dữ liệu hoặc nguồn khác. Các filemtime hàm trả về thời gian sửa đổi cuối cùng của một tệp. Lưu ý rằng đây là một phương pháp rất thuận tiện để lấy ngày của nội dung, nhưng không phải là không có sai sót.
Thông thường, bạn cần sử dụng lại nội dung trên một trang web, chẳng hạn như để hiển thị tóm tắt tin tức trên một trang nội dung. Với một CMS toàn diện, bạn có thể lưu trữ dữ liệu này dưới dạng các trường bổ sung trong cơ sở dữ liệu. Với cách tiếp cận tệp phẳng đơn giản, bạn cần phải suy nghĩ khác.
Các câu chuyện tin tức trên trang web này được lưu trữ dưới dạng tệp Markdown, vì vậy nội dung thô có sẵn. Biểu thức chính quy là một công cụ hữu ích trong bộ công cụ của nhà phát triển, cho bạn khả năng đối sánh và trích xuất nội dung. Các news / index.php tệp chỉ làm điều đó để hiển thị nội dung của nó. Nó tìm nạp nội dung của mỗi tệp trong md / tin tức thư mục dưới dạng một chuỗi. Sau đó, nó chạy một số biểu thức chính quy để trích xuất dữ liệu.
Tiêu đề là một dòng bắt đầu bằng # biểu tượng, theo cú pháp Markdown. Sau đó, khoảng trắng tùy chọn theo sau, trước tiêu đề thực. Biểu thức chính quy ^ # s + (. +) khớp với mẫu văn bản đó và preg_match () trả về mọi thứ khớp giữa các dấu ngoặc: tiêu đề.
if (preg_match("/^#s+(.+)/", $contents, $matches)) {
$title = $matches[1];
}Hai biểu thức chính quy khác theo sau để trích xuất hình ảnh và câu đầu tiên từ tệp đánh dấu tin tức. Có những mặt trái của cách tiếp cận này; đặc biệt, nó đòi hỏi kỷ luật để đảm bảo các tệp Markdown luôn được định dạng chính xác như mã mong đợi.
Chọn nội dung ngẫu nhiên
Các / chim trang không làm được gì nhiều, vì vậy một hình ảnh con chim ngẫu nhiên sẽ làm sống động nó. Điều này dễ dàng đạt được với một chút kiểm tra hệ thống tệp và một chức năng được tích hợp sẵn trong PHP. Điều kỳ diệu xảy ra trong site / bird / index.php:
function content() {
$files = scandir(SITE_DIR."/img");
$files = array_filter($files, function($file) { return $file[0] != '.'; });
$file = $files[array_rand($files)];
echo '<h1>Birds</h1>';
echo '<img src="/img/'.$file.'" />';
}
Bí quyết là tổ chức tất cả các hình ảnh cho chức năng cụ thể này vào một thư mục duy nhất. Các scandir () sau đó hàm đọc các tệp từ thư mục này thành một mảng và array_rand () cung cấp cho chúng tôi một khóa ngẫu nhiên từ mảng để hàm có thể chọn một tệp riêng lẻ.
Xây dựng trang web và kỹ năng bằng PHP
Tôi hy vọng bạn đã học được ít nhất một điều mới từ bài viết này. Quan trọng hơn, tôi hy vọng nó đã truyền cảm hứng cho bạn để xem xét các cách tiếp cận khác nhau và chứng minh cách bạn có thể sử dụng PHP theo nhiều cách khác nhau.
Khi bạn đã quen thuộc với PHP, bạn sẽ bắt đầu nghĩ đến các giải pháp thay thế cho từng vấn đề. Đây là một sự tiến triển tự nhiên và có nghĩa là bạn đang bắt đầu suy nghĩ ở cấp độ cao hơn, tập trung ít hơn vào chính ngôn ngữ lập trình và nhiều hơn vào những gì bạn có thể làm với nó.
Đọc tiếp
Thông tin về các Tác giả
