nhavantuonglai.com được xây dựng như thế nào?

Xuất phát điểm là nhu cầu xây dựng website cá nhân để đăng tải những bài viết, ảnh chụp của bản thân, nhavantuonglai.com ra đời và đáp ứng tốt vấn đề này. Tuy nhiên, để tạo nên website hoàn thiện như bạn đang nhìn thấy trong hiện tại là cả một quá trình dài. Bài viết sau sẽ đi vào chi tiết, kể về hành trình tạo nên nhavantuonnglai.com

Tạo website từ WordPress

WordPress là nền tảng mã nguồn mở phổ biến nhất thế giới để xây dựng và quản lý các website. Ban đầu, chúng được phát triển như một hệ thống quản lý nội dung (CMS) cho các blog, nhưng hiện nay nó đã phát triển mạnh mẽ và được sử dụng rộng rãi để tạo ra các loại website khác nhau, từ blog cá nhân, website thương mại điện tử, đến các website doanh nghiệp.

WordPress cung cấp một giải pháp đơn giản, nhanh chóng và tiện lợi cho những ai muốn tạo lập một website mà không cần có kiến thức sâu về lập trình. Trong quá trình triển khai website, mình chỉ việc kéo thả các block đến vị trí cần thiết và điều chỉnh thông tin, nội dung hiển thị chứ không phải quan tâm nhiều đến các dòng lệnh, thuộc tính đi kèm.

Khi sử dụng WordPress để làm website, mình nhận thấy chúng có những lợi ích, giá trị thiết thực như là:

– Thân thiện, dễ dùng: WordPress rất thân thiện và dễ sử dụng, ngay cả với những người không có nhiều kinh nghiệm về kỹ thuật như mình vào giai đoạn 2015.

– Miễn phí: Bên cạnh đó, WordPress cũng miễn phí, không tốn các chi phí như domain hay hosting hàng tháng, hàng năm, nên cũng giúp mình tiết kiệm được một khoản kha khá khi xây dựng website.

Về cơ bản, với mình thì WordPress là khởi đầu cần thiết cho những ai trong hành trình xây dựng website cá nhân, để tìm hiểu và nắm bắt các cấu trúc cần thiết, phải có trong quá trình xây dựng website.

Tuy nhiên, không gì là hoàn hảo, và với một nền tảng miễn phí như WordPress thì cũng sẽ có những vấn đề nảy sinh, cụ thể là:

– Không phải một website hoàn chỉnh: Với phiên bản miễn phí, WordPress không cho phép đấu domain vào website, mà chỉ được sử dụng sub-domain đi kèm. Trong giai đoạn đó, subdomain của mình là nhavantuonglai.wordpress.com. Đây là một subdomain rất dài và khó nhớ, khó để gõ hoàn chỉnh.

– Giới hạn về khả năng mở rộng: Dù WordPress cung cấp rất nhiều plugin, nhưng để sử dụng thì cần phải đăng ký các gói dịch vụ (tốn phí hàng tháng). Điều này đi ngược với mục tiêu khi xây dựng website của mình trong giai đoạn đó là tốn ít chi phí nhất có thể. Kết quả, giao diện và tính trực quan của nhavantuonglai.wordpress.com bị hạn chế rất nhiều.

WordPress là một khởi đầu hợp lý cho việc xây dựng thương hiệu thông qua websiteiste cá nhân. Tuy nhiên, theo thời gian thì mình cần một giải pháp mới, hiện đại và thân thiện cả về backend và frontend. Lúc đó, mình tìm đến Webflow.

Chuyển sang Webflow

Tháng 02/2012, mình mua domain nhavantuonglai.com và nghiêm túc tìm hiểu nền tảng triển khai website hoàn chỉnh. Lựa chọn lúc đó chính là Webflow, đây là nền tảng thiết kế và phát triển website trực tuyến cho phép mình tạo ra website phức tạp mà không cần phải viết mã. Song hành với tính năng kéo thả mạnh mẽ, chúng còn hỗ trợ tùy tỉnh CSS, HTML cũng như JavaScript để tạo nên website hiện đại, thân thiện với người đọc.

Khi chuyển sang Webflow, giao diện và trải nghiệm trên trang được cải tiến vượt bật, nội dung thể hiện sinh động và gọn gàng hơn, tương tác giữa website và người đọc trở nên thân thiện và nhanh chóng. Bên cạnh đó, khả năng hỗ trợ chèn các đoạn JavaScript giúp mình có thể triển khai các công cụ đo lường, đánh giá hiệu suất website; popup chat ngay trên trang mà không phải tốn nhiều bước, thủ tục rắc rối như trước.

Cụ thể hơn, Webflow giúp website của mình trở nên:

– Giao diện đẹp và hiện đại: Webflow cung cấp, hỗ trợ nhiều mẫu template, cũng như các gói thuộc tính mở rộng để mình triển khai, tinh chỉnh cho website, từ đó tạo nên một website với giao diện độc đáo, cá tính và hoàn thiện.

– Kết nối với domain riêng: Webflow tốn chi phí hosting hàng tháng, nên cũng có thể kết nối domain riêng, lúc này thì nhavantuonglai.com chính thức đi vào hoạt động, dễ dàng chia sẻ và tăng nhận diện để nhiều người chú ý, tìm hiểu hơn.

– Hiệu năng cao và tối ưu SEO: Webflow hỗ trợ SEO rất tốt, không chỉ là SEO onpage mà còn SEO Technical, đảm bảo việc lập chỉ mục, bot crawler thuận tiện và nhanh chóng nhất có thể.

Dù vậy, Webflow không phải là giải pháp hosting website tốt nhất khi có những vấn đề riêng của nó, cụ thể là:

– Chi phí hosting đắt đỏ: Sử dụng Webflow để hosting website rất tốn kém, cụ thể là mỗi tháng mình tốn khoảng 29$ cho việc duy trì hosting website. So với các nền tảng khác, chi phí này tương đối cao, dù so với UX UI mà Webflow tạo ra thì rõ ràng là vượt trội.

– Không kiểm soát toàn bộ dữ liệu: Dù Webflow cung cấp các công cụ quản lý dữ liệu mạnh mẽ, nhưng mình vẫn không thể toàn quyền kiểm soát dữ liệu. Điều này gây khó khăn trong việc mình muốn chuyển đổi nền tảng, hoặc tạo ra các bản backup được tùy biến, tinh chỉnh riêng các chức năng.

Với cá nhân mình, Webflow luôn là một nền tảng thiết kế website tốt, thân thiện và hiện đại cả ở 2 phía, người tạo ra lẫn người đọc. Tuy nhiên, vấn đề chi phí khiến mình dao động, và tạm chuyển sang một nền tảng miễn phí khác, đó là GitBook.

Chuyển sang GitBook

Bản chất của GitBook là nền tảng chia sẻ và lưu trữ document, được sử dụng để chia sẻ và lưu trữ tài liệu hướng dẫn, nội dung kỹ thuật phục vụ trong quá trình nghiên cứu và làm việc. GitBook được tính hợp trực tiếp với GitHub để lưu trữ và quản lý các phiên bản, giúp người viết dễ dàng theo dõi và cập nhật thông tin.

Khi chuyển sang GitBook, một trong những lợi ích mình thấy rõ nhất là được Google hỗ trợ SEO rất mạnh, nếu không muốn nói là cực mạnh. Bởi bản chất đây là nền tảng tài liệu hướng dẫn, nên các nội dung, thông tin lưu trữ trên nền GitBook sẽ được ưu tiên hiển thị trên công cụ tìm kiếm. Ngoài ra, GitBook còn đem đến các lợi ích khác như là:

– Không tốn chi phí hosting: Một trong những lợi ích lớn của việc sử dụng GitBook là mình không tốn phí hosting. Bởi đây là dịch vụ miễn phí với các tính năng cơ bản, đơn giản nhất nhưng vừa đủ, phù hợp để mình chia sẻ thông tin, nội dung trên đó.

– Giao diện, trải nghiệm đọc được tối ưu: Dựa trên cấu trúc trình bày có sẵn, nội dung được thể hiện rõ ràng, trực quan và sinh động, giúp người đọc lẫn người viết (bản thân mình) dễ dàng tìm kiếm, cập nhật thông tin.

Tuy nhiên, GitBook chỉ nên là giải pháp tạm bợ, bởi chúng có rất nhiều vấn đề khi xây dựng, tạo thương hiệu website cá nhân, cụ thể:

– Không được dùng domain đỉnh: GitBook không hỗ trợ kết nối domain đỉnh (nhavantuonglai.com) mà phải dùng thông qua subdomain (info.nhavantuonglai.com). Điều này làm giảm tính chuyên nghiệp và khả năng nhận diện thương hiệu.

– Giao diện cố định, đơn điệu: GitBook không cho phép tùy chỉnh giao diện, nên trải nghiệm đọc bị hạn chế. Bên cạnh đó, danh sách bài luôn hiển thị công khai và không có tùy chọn ẩn (trừ khi can thiệp vào tệp mục lục trên Github), nên nếu số lượng bài viết nhiều, khả năng tải trang bị ảnh hưởng nghiêm trọng.

Vấn đề của GitBook cũng tương tự như vấn đề của WordPress, nhưng là nhiều hơn và phức tạp hơn. Bởi vậy, mình chỉ sử dụng giải pháp này trong khoảng 2 tháng, trước khi chuyển sang Astro kết hợp cùng Firebase.

Chuyển sang Firebase

Astro là framework thiết kế, phát triển website, giúp tạo ra những website tĩnh, động với hiệu suất cao. Astro được thiết kế để khai thác tối đa các công nghệ hỗ trợ website hiện đại, giúp tối ưu nguồn lực trong quá trình thiết kế và vận hành.

Firebase là nền tảng phát triển ứng dụng di động và website được Google cung cấp, giúp các lập trình viên xây dựng, quản lý và phát triển ứng dụng, website nhanh chóng, dễ dàng. Với website, Firebase là một nền tảng hosting mạnh mẽ, hiệu năng cao và tiết kiệm chi phí rất tốt.

Khi sử dụng Astro để làm website, mình buộc phải tìm hiểu và học rất nhiều về JavaScript cũng như HTML, CSS cơ bản, bởi Astro không có giao diện frontend mà chỉ có backend. Tuy không thân thiện với người dùng phổ thông, nhưng nếu có kiến thức về lập trình cơ bản, mình mọi cập nhật, cải tiến website đều sẽ trở nên rất đơn giản và chuyên sâu.

Lợi ích khi kết hợp giữa Astro và Firebase để xây dựng website nhavantuonglai.com có thể kể đến như là:

– Không tốn chi phí hosting: Lợi ích lớn nhất khi dùng Firebase đó là được cấp hạn mức miễn phí, với 10.000 traffic miễn phí mỗi tháng. Với quy mô website hiện tại, thì con số này là quá sức hào phóng và mình chưa cần phải mở rộng thêm.

– Tùy chỉnh sâu và linh hoạt: Astro giúp việc chỉnh sửa, cải tiến website trở nên chuyên nghiệp và hiệu quả, khi có thể can thiệp sâu vào từng dòng code để điều chỉnh, cập nhật và hoàn thiện, cũng như loại bỏ các đoạn code, css thừa nhằm giúp website tải nhanh và mạnh hơn.

Bên cạnh đó,Firebase kết hợp cùng Astro cũng tạo ra nhiều vấn đề, xuất phát từ đặc điểm của nền tảng, cụ thể là:

– Deploy hoàn toàn bằng code: Một trong những thách thức lớn khi sử dụng Firebase là quá trình triển khai website phải được thực hiện hoàn toàn bằng code. Điều này có thể gây khó khăn cho những người không quen thuộc với lập trình, và dễ dẫn đến các lỗi kỹ thuật trong quá trình deploy. Trong quá trình sử dụng, mình gặp phải rất nhiều vấn đề kỹ thuật, như thiếu các module quan trọng, hoặc lỗi không xác định, khiến việc deploy website trở nên phức tạp và cồng kềnh hơn bao giờ hết.

– Tiến trình deploy bị ảnh hưởng bởi thiết bị cục bộ: Xuyên suốt quá trình deploy, thiết bị trở thành máy chủ tạm thời để phân giải các dòng lệnh, triển khai nhập và update code lên máy chủ Firebase, nên nếu cầu hình thiết bị yếu, hoặc đường truyền mạng không ổn định thì quá trình này bị ảnh hưởng, có khi phải làm lại từ đầu.

– Lỗi tràn bộ nhớ: Với số lượng CMS lớn, Firebase không thể giải quyết và thường phát sinh lỗi reached heap limit allocation failed – javascript heap out of memory, cách giải quyết là phải giảm bớt số lượng CMS thì mới được. Điều này hạn chế lượng content có thể cập nhật trên website.

Lỗi tràn bộ nhớ là điểm ý chí mạng và mình không tìm ra được nguyên nhân, là bởi nền tảng (Firabase) hay bởi cấu hình thiết bị, cho nên mình chuyển sang Vercel và đây đang là lựa chọn tốt nhất hiện tại của mình.

Chuyển sang Vercel

Tương tự như Firabase, Vercel cũng là nền tảng hosting website với giao diện đơn giản, thân thiện với người dùng. Khi sử dụng Vercel, quá trình deploy website trở nên đơn giản và thuận tiện, nhờ vào các công cụ tự động hóa và hỗ trợ CI/CD ngay trên nền tảng chứ không phải thiết bị cục bộ. Cụ thể, Vercel giúp mình deploy, cập nhật website nhanh chóng và đơn giản hơn khi:

– Tối ưu và đơn giản hóa quá trình deploy: Như đã nói ở trên, Vercel hỗ trợ CI/CD ngay trên nền tảng chứ không phải thiết bị cục bộ, nên các lỗi thường gặp khi sử dụng Firebase như thiếu module hay plugin sẽ không xảy ra, giúp quá trình deploy diễn ra nhanh chóng và không gặp trở ngại nào (trừ khi vấn đề nằm sâu bên trong code).

– Không bị lỗi tràn bộ nhớ đệm hay phụ thuộc vào thiết bị cục bộ: Ngay khi Push origin toàn bộ code, quá trình deploy sẽ diễn ra ngay lập tức ngay trên cloud, từ đó thiết bị cục bộ sẽ không tạo ra tác động trực tiếp, giúp giải quyết lỗi tràn bộ nhớ đệm thường gặp như khi sử dụng Firebase để làm website.

Hiện tại, đây đang là giải pháp tối ưu và tốt nhất mà mình đang sử dụng để vận hành nhavantuonglai.com, và trong tương lai gần thì đây vẫn sẽ là giải pháp duy nhất mà mình lựa chọn, tính đến khi vận hành thêm một, hoặc nhiều website khác.

Khi chia sẻ hành trình tạo ra nhavantuonglai.com, mình không mong gì hơn ngoài việc hướng dẫn, hỗ trợ giúp những ai đang trong hành trình tạo ra một website cá nhân cho riêng mình biết nên phải làm gì, và lựa chọn ra sao để có một website hoàn chỉnh, đẹp và tối ưu nhất.

Nếu bạn có bất kỳ câu hỏi nào hoặc cần hỗ trợ thêm, đừng ngần ngại liên hệ với github/nhavantuonglai qua email info@nhavantuonglai.com.