AI Brand Site

Website thương hiệu cho mảng AI của một tập đoàn công nghệ Nhật Bản: giới thiệu dự án, câu chuyện, đội ngũ, bài viết kỹ thuật, cộng đồng, tin tức và chương trình thực tập mùa hè. Yêu cầu: hình ảnh đậm chất công nghệ xứng tầm thương hiệu AI, đội marketing/PR tự cập nhật nội dung có duyệt trước khi public, và — vì hệ thống đã chạy nhiều năm — được bảo trì, vá lỗ hổng an toàn mà không làm vỡ tính năng.

Trải nghiệm thị giác dựng bằng WebGL (OGL), animation GSAP, slider và con trỏ tuỳ biến; ảnh tự tối ưu sang WebP. Production là site tĩnh trên CDN — trang tải nhanh và không có máy chủ nào để bị tấn công. Nội dung quản lý trên Contentful với 15 loại nội dung; một công cụ xuất nội dung tự phát triển kéo dữ liệu về, kiểm tra theo schema, chuyển đổi rồi mới dựng thành trang — dữ liệu sai không bao giờ lọt ra site. Sau đợt renewal, URL cũ được chuyển hướng 301 nên link cũ vẫn hoạt động.

Xuất bản theo mô hình ChatOps: biên tập viên publish là Slack hỏi ngay — bấm Deploy để đưa lên production, hoặc Revert để khôi phục nội dung về phiên bản trước; nút Deploy to dev trong Contentful đưa bản nháp lên staging (bảo vệ bằng mật khẩu) để xem trước. Dịch vụ deploy được thiết kế fail-closed: không nạp được khoá bí mật thì từ chối hoạt động, không bao giờ chạy trong trạng thái thiếu an toàn. Landing page sự kiện do đối tác bên ngoài sản xuất cũng được đóng gói vào cùng pipeline và phát hành trên cùng domain — không cần hạ tầng riêng, vẫn nằm trong quy trình kiểm soát chung.

Form liên hệ kiểm tra dữ liệu chặt, chặn bot bằng Google reCAPTCHA Enterprise; người gửi nhận email trả lời tự động, đội phụ trách nhận thông báo qua AWS SES. Khoá gửi mail nằm trong Secret Manager và chỉ được đọc lúc chạy — không nằm trong code hay biến môi trường; API chỉ nhận request từ domain của site, staging chỉ mở cho IP được phép (cả IPv4 lẫn IPv6).

Phần tiếp quản và hiện đại hoá hệ thống đang chạy: nâng runtime lên Node.js 22 và chuyển backend sang Cloud Functions thế hệ 2; mỗi Pull Request tự động quét bằng Trivy, Semgrep và Gitleaks — trong đó luật Semgrep cho Vue là tự viết (bộ luật có sẵn không quét được file .vue, và toàn bộ 10/10 lỗi công cụ phát hiện đến từ bộ luật này); Gitleaks quét toàn bộ lịch sử Git chứ không chỉ thay đổi mới. 19 lỗ hổng thư viện được vá về 0 mà không làm vỡ hệ thống — chủ đích không dùng cách sửa tự động cưỡng bức vì cách đó âm thầm hạ cấp framework. Site có đủ security header chuẩn: HSTS, chống clickjacking, chống MIME sniffing.