7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Code
  2. CMS

Xây dựng một CMS: nodePress

Scroll to top
Read Time: 20 mins

Vietnamese (Tiếng Việt) translation by Dai Phong (you can also view the original English article)

Bạn đã tạo thành công một Hệ thống Quản lý Nội dung CMS dựa trên hệ thống tập tin phẳng bằng ngôn ngữ Go. Bước tiếp theo là lấy lý tưởng tương tự và tạo ra một máy chủ web sử dụng Node.js. Tôi sẽ cho bạn thấy cách nạp các thư viện, tạo và chạy máy chủ như thế nào.

CMS này sẽ sử dụng cấu trúc dữ liệu trang web được xây dựng trong hướng dẫn đầu tiên, Xây dựng một CMS: Cấu trúc và Giao diện. Do đó, hãy tải xuống và cài đặt cấu trúc cơ bản này trong một thư mục hoàn toàn mới.

Cài đặt Node và Các Thư viện của Node

Cách dễ nhất để cài đặt Node.js trên máy Mac là với Homebrew. Nếu bạn vẫn chưa cài đặt Homebrew, thì hướng dẫn Tìm hiểu Homebrew: Trình Quản lý Gói Tối ưu của OS X sẽ cho bạn thấy cách làm.

Để cài đặt Node.js với Homebrew, hãy gõ lệnh sau đây vào terminal:

Khi hoàn tất, bạn sẽ có các lệnh Node và NPM được cài đặt đầy đủ trên máy Mac của bạn. Đối với tất cả các nền tảng khác, hãy thực hiện theo các hướng dẫn trên trang web Node.js.

Hãy cẩn thận: Nhiều Trình quản lý gói hiện nay đang cài đặt phiên bản Node.js 0.10. Hướng dẫn này giả sử rằng bạn đã cài đặt phiên bản 5.3 hoặc mới hơn. Bạn có thể kiểm tra phiên bản của mình bằng cách gõ:

Lệnh node chạy trình biên dịch JavaScript. Lệnh npm là một trình quản lý gói cho Node.js để cài đặt các thư viện mới, tạo ra các dự án mới, và chạy các script cho một dự án. Có rất nhiều bài hướng dẫn và các khóa học tuyệt vời về Node.js và NPM tại Envato Tuts+.

Để cài đặt các thư viện cho máy chủ web, bạn phải chạy các lệnh sau đây trong chương trình Terminal.app hoặc iTerm.app:

Express là một nền tảng phát triển ứng dụng web. Nó tương tự như thư viện goWeb trong Go. Handlebars là công cụ xử lý template cho các trang. Moment là một thư viện để làm việc với ngày. Marked là một trình chuyển đổi Markdown sang HTML trong JavaScript. Jade là một ngôn ngữ viết HTML rút gọn để dễ dàng tạo HTML. Morgan là một middleware (thư viện trung gian) cho Express để tạo ra các Tập tin Nhật ký Apache Tiêu chuẩn.

Một cách khác để cài đặt các thư viện là tải về các tập tin mã nguồn cho hướng dẫn này. Sau khi đã tải xuống và giải nén, hãy gõ lệnh sau đây trong thư mục chính:

Điều đó sẽ cài đặt mọi thứ cần thiết để tạo ra dự án này.

nodePress.js

Bây giờ bạn đã có thể bắt đầu tạo máy chủ. Trong thư mục cao nhất của dự án, tạo một tập tin đặt tên là nodePress.js, mở nó trong trình soạn thảo của bạn và bắt đầu thêm đoạn code sau. Tôi sẽ giải thích code khi nó được dán vào tập tin.

Mã máy chủ khởi động bằng việc khởi tạo tất cả các thư viện được sử dụng để tạo ra máy chủ. Các thư viện mà không có chú thích với một địa chỉ web là các thư viện Node.js nội tại.

Tiếp theo, tôi thiết lập tất cả các biến toàn cục và các cấu hình thư viện. Việc sử dụng các biến toàn cục không phải là cách thiết kế phần mềm tốt nhất, nhưng nó hoạt động và giúp đẩy nhanh quá trình phát triển.

Biến parts là một mảng băm chứa tất cả các bộ phận của một trang web. Mỗi trang tham chiếu đến các nội dung của biến này. Nó bắt đầu với nội dung của tập tin server.json được tìm thấy ở thư mục cao nhất của máy chủ.

Sau đó tôi sử dụng thông tin từ tập tin server.json để tạo ra các đường dẫn hoàn chỉnh đến các thư mục styleslayouts được sử dụng cho trang web này.

Ba biến sau đó được thiết lập thành các giá trị null: siteCSS, siteScripts, và mainPage. Các biến toàn cục này sẽ chứa tất cả các nội dung CSS, JavaScript và trang index chính. Ba yếu tố này được yêu cầu nhiều nhất trên bất kỳ máy chủ web nào. Vì vậy, hãy lưu giữ chúng trong bộ nhớ. Nếu biến Cache trong tập tin server.json là false, thì các yếu tố này sẽ được đọc lại với mỗi yêu cầu.

Khối code này là dành cho việc định cấu hình thư viện Marked để tạo ra HTML từ Markdown. Chủ yếu là, tôi đang kích hoạt hỗ trợ bảng và smartLists.

Biến parts được nạp thêm các bộ phận từ thư mục styleslayout. Mỗi tập tin trong thư mục parts bên trong thư mục site cũng được nạp vào biến toàn cục parts. Tên của tập tin không có đuôi mở rộng là tên được sử dụng để lưu trữ nội dung của tập tin. Những cái tên này được khai triển trong macro của Handlebars.

Phần tiếp theo của code định nghĩa các hàm trợ giúp trong Handlebars mà tôi đã định nghĩa để sử dụng trên máy chủ web: save, datecdate. Hàm trợ giúp save cho phép tạo các biến bên trong một trang. Phiên bản này hỗ trợ phiên bản goPress nơi mà tham số có tên và giá trị cùng nhau được phân tách bằng một dấu "|". Bạn cũng có thể chỉ định một hàm save bằng hai tham số. Ví dụ:

Điều này sẽ cho ra kết quả tương tự. Tôi thích cách tiếp cận thứ hai hơn, nhưng thư viện Handlebars trong Go không cho phép nhiều hơn một tham số.

Hàm trợ giúp datecdate định dạng ngày hiện tại (date) hoặc một ngày nhất định (cdate) theo các quy tắc định dạng của thư viện moment.js. Hàm trợ giúp cdate nhận vào ​​ngày cần kết xuất như là tham số đầu tiên và có định dạng ISO 8601.

Bây giờ là code tạo ra một đối tượng Express để cấu hình máy chủ thật sự. Hàm nodePress.use() thiết lập phần mềm middleware. Middleware là bất kỳ code nào phục vụ trên mọi cuộc gọi tới máy chủ. Ở đây, tôi thiết lập thư viện Morgan.js để tạo ra nhật ký máy chủ phù hợp.

Phần code này định nghĩa tất cả các route cần thiết để cài đặt máy chủ web. Tất cả các route chạy hàm setBasicHeader() để thiết lập các giá trị header phù hợp. Tất cả các yêu cầu cho một loại trang sẽ gọi hàm page(), trong khi tất cả các yêu cầu cho bài viết sẽ gọi hàm posts().

Content-Type mặc định là HTML. Do đó, đối với CSS, JavaScript và hình ảnh, Content-Type được thiết lập một cách rõ ràng thành giá trị thích hợp của nó.

Bạn cũng có thể định nghĩa các route với các động từ của REST như put, delete, và post. Máy chủ đơn giản này chỉ sử dụng động từ get.

Điều cuối cùng cần làm trước khi định nghĩa các hàm khác nhau được sử dụng là khởi động máy chủ. Tập tin server.json chứa DNS name (ở đây, nó là localhost) và cổng cho máy chủ. Sau khi phân tích, hàm listen() của máy chủ sử dụng số cổng để khởi động máy chủ. Khi cổng máy chủ được mở, script ghi lại địa chỉ và cổng cho máy chủ.

Hàm đầu tiên được định nghĩa là hàm setBasicHeader(). Hàm này thiết lập header phản hồi để nói với trình duyệt lưu trữ trang vào bộ nhớ đệm trong một tháng. Nó cũng nói cho trình duyệt biết rằng máy chủ là một máy chủ nodePress. Nếu có bất kỳ giá trị header tiêu chuẩn nào khác mà bạn muốn có, thì bạn có thể thêm chúng ở đây với hàm response.append() .

Hàm page() gửi template bố cục cho một trang và vị trí của trang trên máy chủ tới hàm processPage().

Hàm post() giống như hàm page(), ngoại trừ post có thêm các yếu tố để xác định mỗi bài viết. Trong loạt bài về các máy chủ này, một post chứa một type (kiểu), cat (danh mục) và post (bài viết) thực tế. Type có thể là blogs hoặc news. Cat là flatcms. Vì những cái này đại diện cho các tên thư mục, nên bạn có thể tạo ra chúng như thế nào là tuỳ bạn. Chỉ cần khớp việc đặt tên với những gì ở trong hệ thống tập tin của bạn.

Hàm processPage() lấy bố cục và đường dẫn đến nội dung trang để kết xuất. Hàm này bắt đầu bằng cách tạo một bản sao tại cục bộ của biến toàn cục parts và thêm hashtag "contents" cùng với kết quả từ cuộc gọi hàm figurePage(). Sau đó nó thiết lập giá trị băm PageName thành tên của trang.

Hàm này sau đó biên dịch nội dung của trang thành template bố cục bằng Handlebars. Sau đó, hàm processShortCodes() sẽ khai triển tất cả các shortcode được định nghĩa trên trang. Sau đó, công cụ template Handlebars sẽ đi qua code thêm một lần nữa. Trình duyệt sau đó nhận được kết quả.

Hàm processShortCodes() lấy các nội dung của trang web dưới dạng một chuỗi và tìm kiếm tất cả các shortcode. Một shortcode là một khối code tương tự như các thẻ HTML. Một ví dụ sẽ là:

Code này có một shortcode cho box xung quanh một phần tử đoạn HTML. Trong khi HTML sử dụng <>, thì shortcode sử dụng -[]-. Sau cái tên, một chuỗi chứa các đối số cho shortcode có thể có hoặc không có mặt ở đó.

Hàm processShortCodes() tìm kiếm một shortcode, lấy tên và các đối số của nó, tìm tới cuối để lấy nội dung, xử lý nội dung cho các shortcode, thực thi shortcode với các đối số và nội dung, thêm kết quả vào trang hoàn chỉnh, và tìm kiếm shortcode tiếp theo trong phần còn lại của trang. Việc lặp được thực hiện bằng cách gọi đệ quy hàm.

Phần tiếp theo này định nghĩa cấu trúc json của shortcodes trong đó định nghĩa tên của một shortcode liên kết đến hàm của nó. Tất cả các hàm shortcode nhận hai tham số: argsinside. args là tất cả mọi thứ sau tên và dấu cách và trước thẻ đóng. inside là tất cả mọi thứ nằm trong thẻ shortcode mở và đóng. Những hàm này là cơ bản, nhưng bạn có thể tạo một shortcode để thực hiện bất cứ điều gì mà bạn có thể nghĩ ra trong JavaScript.

Hàm figurePage() nhận vào đường dẫn đầy đủ đến một trang trên máy chủ. Hàm này sau đó kiểm tra nó có phải là một trang HTML, Markdown, hoặc Jade hay không dựa trên đuôi mở rộng. Tôi vẫn sử dụng .amber cho Jade vì đó là thư viện mà tôi đã sử dụng với máy chủ goPress. Tất cả các nội dung Markdown và Jade được dịch sang HTML trước khi chuyển nó sang thủ tục gọi. Vì bộ xử lý Markdown dịch tất cả các dấu ngoặc kép sang &quot;, nên tôi dịch ngược lại chúng trước khi truyền nó trở lại.

Hàm fileExists() là một hàm thay thế cho hàm fs.exists() được sử dụng như là một phần của thư viện fs của Node.js. Nó sử dụng hàm fs.statSync() để cố gắng lấy trạng thái của tập tin. Nếu có một lỗi xảy ra, một false sẽ được trả về. Ngược lại, nó trả về true.

Hàm cuối cùng là hàm MergeRecursive(). Nó sao chép đối tượng thứ hai thành đối tượng thứ nhất được truyền vào. Tôi tận dụng điều này để sao chép biến toàn cục chính parts thành một bản sao cục bộ trước khi thêm các bộ phận trang cụ thể.

Chạy Cục bộ

Sau khi lưu tập tin, bạn có thể chạy máy chủ bằng lệnh:

Ngoài ra, bạn có thể sử dụng script npm trong tập tin package.json. Bạn chạy các script npm như sau:

Điều này sẽ chạy script start nằm trong tập tin package.json.

nodePress Server Main PagenodePress Server Main PagenodePress Server Main Page
Trang chủ của Máy chủ nodePress

Trỏ trình duyệt web của bạn đến http://localhost:8080 và bạn sẽ thấy trang web như ở trên. Có thể bạn đã nhận thấy rằng tôi đã thêm code kiểm tra vào trang chủ. Tất cả các thay đổi cho các trang ở trong phần tải về cho hướng dẫn này. Chúng chủ yếu chỉ là một số tinh chỉnh nhỏ để hoàn tất thử nghiệm chức năng và để phù hợp với bất kỳ sự khác biệt nào trong việc sử dụng các thư viện khác nhau. Sự khác biệt đáng lưu ý nhất là thư viện Jade không sử dụng dấu $ để đặt tên các biến trong khi Amber thì có.

Tóm tắt

Bây giờ bạn đã có CMS dựa trên hệ thống tập tin phẳng giống hệt nhau viết bằng Go và Node.js. Đây chỉ là bề nổi của những gì mà bạn có thể xây dựng với nền tảng này. Hãy thực hành và thử một cái gì đó mới mẻ. Đó là phần hay nhất trong việc tạo ra máy chủ web của riêng bạn.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.