Hành trình 4 tuần: Từ nâng cấp Frontend đến vật lộn với Docker và đột phá

Cập nhật (2026): Frontend WordPress và triển khai Docker được mô tả bên dưới đã là chuyện xưa rồi. Trang web giờ chạy trên Next.js, và Sydney đã được xây dựng lại từ đầu với Supabase pgvector và Claude. Vẫn code, vẫn học.

Hỏi Sydney →

---

Bài viết gốc từ tháng 3 năm 2024 được giữ nguyên bên dưới cho bối cảnh.

Tôi chưa đăng bài nào trong 4 tuần qua. Bạn có thể tự hỏi chuyện gì đã xảy ra. Tôi lười và ngừng học? Cũng đúng phần nào, tôi có đi chơi với gia đình và bạn bè vào một cuối tuần.

Bài viết hôm nay sẽ ngắn. Tôi sẽ chia sẻ những gì đã học trong 4 tuần qua. Nhưng ai quan tâm chứ? À, đúng là không ai quan tâm nên bài viết này chủ yếu để tôi theo dõi tiến trình và chắc thêm một người nữa (dù bạn là ai :D.)

TL;DR: "Học đúng lúc" là thật và tôi đang sống với nó.

Cải thiện front end

Nếu bạn đến trang web của tôi vài tháng trước, bạn sẽ nhận ra rằng giờ đây, trang web trông khác, hiện đại hơn, và dễ điều hướng hơn (tôi hy vọng). Tôi dùng Github Copilot và ChatGPT4 để nhờ máy giúp cải thiện giao diện. Kết quả là hơn 300 dòng CSS code, phần lớn tôi không biết viết. Đây là một đoạn xem trước:

/* Defining CSS variables for common values */
:root \{
    --main-font: 'Poppins', sans-serif; /* Main font for the website */
    --primary-color: #003366; /* Primary color for text */
    --accent-color: #4da6ff; /* Accent color for links and buttons */
    --background-color: #FAFAFA; /* Background color for the body and some elements */
    --text-color: #333333; /* Main text color */
    --hover-color: #4da6ff; /* Color for hover effects */
\}

/* Applying the main font and color to various elements */
body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, .nav-menu, .nav-menu a, .widget-title, .page-numbers.current,
#primary-menu .menu-item a, #primary-menu .sub-menu .menu-item a, .site-title a, .primary-navigation a, .widgettitle, .simpletoc-title \{
    font-family: var(--main-font);
    color: var(--text-color);
\}

Ngoài ra khi tôi truy cập trang chatbot, "giao diện" tương tự phần còn lại của trang. Ô nhập câu hỏi nằm ngay trên đầu, above the fold và ô hội thoại tiếp tục mở rộng khi cuộc trò chuyện mở rộng. Tôi không thể tin là mình không làm được sớm hơn. Và xin lỗi mọi người đã truy cập trang đó trước đây.

Chatbot Sydney có vector store mới và cải thiện query translation

Toàn bộ quá trình từ export nội dung từ Wordpress đến HTML clean-up, chunking, tạo embeddings, và lưu vào vector store đơn giản và nhanh đến ngạc nhiên khi bạn đã làm vài lần.

Tôi thay vector store mới (vẫn dùng FAISS), với phương pháp chunking khác (lần này với chunk size và overlap lớn hơn một chút.)

Query của người dùng được chuyển đổi bằng multi-query retriever từ Langchain. Tôi thấy câu trả lời của chatbot dùng retriever này toàn diện và sâu sắc hơn retriever trước.

# Set up vector store and llm
embeddings = OpenAIEmbeddings()
vectorstore = FAISS.load_local("faiss_index", embeddings)
llm = ChatOpenAI(model_name="gpt-3.5-turbo-0125", temperature=0)

# Set up retriever
retriever_from_llm = MultiQueryRetriever.from_llm(
    retriever=vectorstore.as_retriever(), llm=llm
)

Vật lộn đẩy Docker image lên GCP Artifact hóa ra là may mắn

Vì lý do kỳ lạ nào đó, tôi bắt đầu gặp khó khăn khi đẩy Docker Image lên GCP Artifact khoảng 1 tháng trước. Tôi đã thử nhiều cách giải quyết nhưng không được. Các tháng trước đó hoàn toàn ổn.

Vì thế, nó buộc tôi phải nghĩ ra cách khác để deploy app, không cần đẩy image lên Artifact. Đó là cách tôi biết đến continuous deployment trên GCP Cloud Run sử dụng repo trên Github.

Cùng lúc đó, tôi xem một tutorial online và họ dùng poetry. Tôi không biết nó là gì nên hỏi chatGPT giải thích. Hóa ra nó là công cụ tuyệt vời để quản lý dependencies nên giờ tôi dùng nó :). Nhờ khám phá này, tôi học thêm về thiết lập virtual environment cho mỗi dự án, và bắt đầu dùng cho mọi dự án.

Giờ với virtual environment mới, dùng poetry để quản lý dependencies, và tận dụng continuous deployment từ GCP Cloud Run, workflow của tôi mượt mà hơn nhiều. Deploy cập nhật mới cho chatbot cũng dễ và nhanh hơn nhiều, sau khi test kỹ ở local.

Tôi đang làm gì bây giờ?

Hiện tại, tôi đang xây dựng và deploy một research assistant sử dụng Langchain. Code open-source từ Langchain và GPT-Researcher (cảm ơn cả hai!) đủ rõ ràng và tôi có thể làm cho nó hoạt động ở local. Tuy nhiên, deploy nó trong môi trường production hóa ra khá khó, đặc biệt phần content scraping. Cụ thể, mức sử dụng CPU quá cao khi test ứng dụng trong Docker Container ở local.

Tôi cũng có vài ý tưởng về cách cải thiện cách tiếp cận research assistant được chia sẻ bởi GPT-researcher và Langchain nhưng tôi cần làm việc trên chúng để hiện thực hóa. Tôi sẽ chia sẻ thêm khi sẵn sàng.

Ý kiến của bạn?

Mỗi dòng code, mỗi giờ troubleshooting, và mỗi đột phá đều là bước đệm. Và dù hành trình này là của tôi, tôi hy vọng nó khơi nguồn ý tưởng, cung cấp insights, hoặc đơn giản là giải trí. Bạn đã gặp những thách thức gì trong hành trình công nghệ? Hãy chia sẻ câu chuyện hoặc câu hỏi bên dưới — hãy cùng nhau điều hướng những vùng nước số này.

Thân mến,

Chandler

P.S: nếu bạn đang xây ứng dụng RAG, tôi thấy series "RAG from scratch" từ Langchain cực kỳ hữu ích.