Vì sao mình chọn Astro cho portfolio và blog cá nhân

Khi làm website cá nhân, mình không cần một hệ thống quá nặng. Mình cần một thứ đủ nhanh, SEO tốt, dễ viết nội dung, và vẫn cho phép thêm các phần tương tác nhỏ như form tạo project/blog hoặc auth admin. Với bài toán đó, Astro là lựa chọn hợp lý.

1. Bài toán của website này là gì

Website của mình có vài phần chính:

• landing page giới thiệu bản thân
• danh sách projects
• danh sách blogs
• trang detail theo slug
• các route tạo và chỉnh sửa nội dung
• một số phần client-side như auth, editor, upload file

Nói cách khác, phần lớn site là content-driven, còn tương tác chỉ nằm ở một số khu vực cụ thể.

Nếu chọn một hướng SPA-first cho toàn bộ website, mình sẽ phải hydrate nhiều hơn mức cần thiết.

2. Vì sao Astro hợp với loại site này

Điểm mình thích nhất ở Astro là tư duy mặc định:

• ưu tiên HTML trước
• chỉ hydrate khi thực sự cần
• page tĩnh và page động có thể đi cùng nhau
• markdown/content workflow khá tự nhiên

Điều này rất hợp với website cá nhân, vì phần lớn nội dung không cần chạy JavaScript nặng ở client.

3. Astro Islands là điểm khác biệt lớn

Không phải toàn bộ trang đều cần thành React app.

Ví dụ, với site của mình:

• phần hero, section giới thiệu, project detail, blog detail có thể render gần như thuần HTML
• các chỗ như auth controls, markdown editor, admin actions mới cần client interactivity

Astro cho phép mình chỉ hydrate đúng component cần thiết bằng client:load hoặc chiến lược tương tự. Kết quả là:

• JS ít hơn
• initial render nhẹ hơn
• page detail thân thiện hơn với bot và người dùng

4. SEO là một lý do rất thực dụng

Portfolio và blog cá nhân thường cần:

• slug sạch
• metadata rõ
• nội dung detail có sẵn trong HTML
• sitemap và robots dễ kiểm soát
• Open Graph cho social preview

Với Astro, những thứ này khá tự nhiên vì page layer tách rõ khỏi phần client-side.

Khi blog detail và project detail được render phía server, mình có thể gắn SEO metadata theo dữ liệu thật của từng bài thay vì dùng metadata generic.

5. File-based routing giúp tổ chức site gọn

Với website này, mình đang có các route kiểu:

• /projects
• /projects/:slug
• /projects/new
• /projects/edit/:slug
• /blogs
• /blogs/:slug
• /blogs/new
• /blogs/edit/:slug

Astro xử lý kiểu route này khá rõ ràng ở mức cấu trúc file. Với blog hoặc project site, cách tổ chức đó dễ đọc, dễ sửa, và phù hợp với logic nội dung.

6. Nội dung markdown cũng hợp với Astro

Vì site có blog và phần mô tả project dài, markdown là một định dạng đủ tốt:

• viết nhanh
• dễ đọc
• dễ render
• thuận tiện cho các heading, lists, links, code blocks

Mình không cần một CMS quá phức tạp cho nhu cầu cá nhân. Chỉ cần editor đủ ổn, lưu content, rồi render markdown ra detail page là đủ dùng.

7. Astro không chặn mình dùng React khi cần

Một lý do nữa là mình không phải từ bỏ hệ sinh thái component quen thuộc.

Các phần cần tương tác hơn như:

• markdown editor
• auth controls
• project/blog feed fetch từ Appwrite
• dropdown admin actions

vẫn có thể viết bằng React bình thường.

Tức là Astro cho mình mô hình kết hợp khá hợp lý:

• page shell và nội dung thiên về server
• widget có state thì dùng React

8. Khi nào Astro chưa chắc là lựa chọn tốt nhất

Astro không phải lúc nào cũng là đáp án.

Nếu mình đang làm một sản phẩm nặng tính app như:

• dashboard phức tạp
• collaborative editor
• realtime app
• client-side state lớn gần như toàn trang

thì một framework app-first có thể hợp hơn.

Nói ngắn gọn, nếu gần như toàn bộ màn hình đều cần hydrate và tương tác liên tục, lợi thế của Astro sẽ giảm bớt.

9. Vì sao mình vẫn chọn server mode cho site này

Ban đầu, kiểu site này rất dễ nghĩ tới static trước. Nhưng vì mình có:

• content lấy từ Appwrite
• route dynamic theo slug
• create/edit flow admin
• dữ liệu thay đổi sau khi publish

nên mình chuyển sang hướng server output để route detail hoạt động thật với dữ liệu mới tạo.

Điều này giúp:

• slug mới có thể truy cập ngay
• detail page có thể lấy data thật cho SEO
• không phải rebuild toàn site chỉ để thấy bài mới

10. Kết luận

Mình chọn Astro không phải vì nó là công nghệ mới hay vì nó “ngầu” hơn. Mình chọn vì nó phù hợp với đúng bài toán:

• website cá nhân
• cần SEO tốt
• cần tốc độ
• cần markdown/content workflow
• chỉ có một số vùng nhỏ cần JavaScript thực sự

Với một portfolio/blog như thế này, Astro cho mình cấu trúc đủ sạch, hiệu suất đủ tốt, và vẫn không cản trở việc dùng React hay Appwrite ở những chỗ cần thiết.