Xây Dựng Một Chrome Extension AI Để Học Ngoại Ngữ Hiệu Quả Hơn

Có những dự án bắt đầu từ một vấn đề rất nhỏ trong cuộc sống hằng ngày.

Với tôi, đó là việc đọc tài liệu tiếng Anh.

Là một lập trình viên, mỗi ngày tôi đều phải đọc documentation, blog kỹ thuật, bài viết trên Medium, Stack Overflow hay các tài liệu chuyên ngành, .... Và gần như ngày nào cũng gặp những từ mới hoặc cách diễn đạt chưa quen thuộc.

Quy trình lúc đó luôn giống nhau:

Bôi đen từ → Copy → Mở tab Google Translate → Paste → Đọc nghĩa → Quay lại bài viết → Tìm lại đoạn đang đọc.

Nghe có vẻ đơn giản, nhưng khi lặp lại hàng chục lần mỗi ngày, nó làm đứt mạch tập trung một cách đáng kể.

Tôi bắt đầu tự hỏi:

"Tại sao không biến chính trang web mình đang đọc thành một môi trường học ngoại ngữ hoàn chỉnh?"

Và đó là lý do AI Translator & Grammar Check ra đời.

Một Dự Án Được Xây Dựng Trong Những Buổi Đắng Đó Về Suy Nghĩ Của Mình

Ban đầu, mục tiêu rất đơn giản:

Bôi đen văn bản
Nhấn dịch
Hiển thị kết quả ngay tại chỗ

Nhưng càng phát triển, tôi càng nhận ra rằng việc "tra từ" chỉ là một phần rất nhỏ của quá trình học ngoại ngữ.

Người học thường gặp ba vấn đề lớn:

Hiểu nghĩa của từ
Ghi nhớ từ đã học
Ôn tập đúng thời điểm để không quên

Từ đó, dự án dần phát triển thành một hệ sinh thái học ngoại ngữ hoàn chỉnh ngay bên trong trình duyệt.

Dịch Thuật Không Chỉ Là Dịch Từng Từ

Một trong những điểm tôi luôn cảm thấy chưa hài lòng ở các công cụ dịch truyền thống là chúng thường dịch theo kiểu "word-by-word".

Ví dụ:

Từ "bank" có thể mang nghĩa:

Ngân hàng
Bờ sông
Nghiêng máy bay

Nếu chỉ nhìn vào một từ đơn lẻ thì rất khó xác định nghĩa chính xác.

Vì vậy extension sử dụng AI để đọc cả ngữ cảnh xung quanh trước khi đưa ra bản dịch.

Kết quả là:

Tự nhiên hơn
Đúng ngữ cảnh hơn
Hữu ích hơn cho việc học

Bên cạnh Gemini AI, hệ thống còn tích hợp nhiều tầng fallback khác nhau nhằm cân bằng giữa tốc độ và chi phí sử dụng API.

Người dùng có thể lựa chọn:

Chế độ tự động thông minh
Chỉ sử dụng Gemini AI
Chỉ sử dụng Google Translate
Chỉ sử dụng MyMemory

Từ Một Lần Tra Cứu Thành Một Flashcard

Khi học ngoại ngữ, điều đáng tiếc nhất là:

Hôm nay tra từ, ngày mai quên mất.

Tôi muốn mọi lần tra cứu đều trở thành một cơ hội học tập.

Vì vậy mỗi từ được dịch đều có thể lưu thành flashcard với:

Từ gốc
Bản dịch
Câu ví dụ thực tế
Nguồn bài viết
Thông tin từ điển

Không cần nhập liệu thủ công.

Không cần copy ví dụ sang ứng dụng khác.

Mọi thứ được tạo chỉ bằng một cú nhấp chuột.

Study Mode — Nơi AI Translator Trở Thành Một Ứng Dụng Học Ngoại Ngữ Thực Thụ

Đây là phần tôi dành nhiều tâm huyết nhất.

Tôi không muốn flashcard chỉ đơn thuần là nơi lưu từ vựng.

Tôi muốn người dùng thực sự nhớ được chúng.

Study Mode được xây dựng dựa trên nguyên lý Spaced Repetition (Lặp Lại Ngắt Quãng) — phương pháp đang được sử dụng bởi nhiều ứng dụng học ngoại ngữ nổi tiếng trên thế giới.

Hệ thống sẽ tự động:

Theo dõi mức độ ghi nhớ
Tính toán thời điểm ôn tập phù hợp
Đưa những từ sắp quên trở lại đúng lúc

Để tránh cảm giác nhàm chán, Study Mode hỗ trợ nhiều dạng bài tập khác nhau:

Trắc nghiệm
Điền từ
Chính tả
Nghe và chọn đáp án
Gõ lại từ
Sắp xếp ký tự
Ghép cặp từ và nghĩa
Hoàn thành câu ví dụ

Mục tiêu không phải học nhiều hơn.

Mà là học hiệu quả hơn.

Kiểm Tra Ngữ Pháp Ngay Khi Đang Viết

Một nhu cầu khác của tôi là kiểm tra ngữ pháp nhanh khi viết email, tài liệu hoặc trao đổi với khách hàng quốc tế.

Thay vì phải chuyển sang các công cụ riêng biệt, extension có thể:

Phát hiện lỗi ngữ pháp
Phát hiện lỗi chính tả
Đề xuất cách sửa
Hiển thị rõ phần thay đổi

Thậm chí có thể tự động kiểm tra trong lúc người dùng đang nhập liệu.

OCR Và Khả Năng Đọc Văn Bản Từ Hình Ảnh

Không phải lúc nào kiến thức cũng tồn tại dưới dạng văn bản.

Rất nhiều nội dung được chia sẻ dưới dạng:

Ảnh chụp màn hình
Meme
Tài liệu scan
Infographic

Nhờ Gemini Vision, extension có thể trích xuất nội dung từ hình ảnh và giữ nguyên cấu trúc ban đầu, giúp việc dịch và học tập trở nên thuận tiện hơn rất nhiều.

Xây Dựng Bằng Vanilla JavaScript Trong Thời Đại Framework

Một quyết định thú vị trong dự án là:

Không sử dụng bất kỳ framework nào.

Không React.

Không Vue.

Không Angular.

Toàn bộ extension được phát triển bằng:

HTML
CSS
Vanilla JavaScript

Lý do rất đơn giản:

Chrome Extension là một môi trường khá đặc thù.

Với quy mô dự án này, việc sử dụng framework đôi khi lại tạo thêm độ phức tạp không cần thiết.

Kết quả là:

Tốc độ tải nhanh
Kích thước nhỏ
Ít phụ thuộc
Dễ kiểm soát luồng hoạt động

Đồng thời đây cũng là cơ hội tuyệt vời để hiểu sâu hơn về JavaScript thuần và kiến trúc của Chrome Extension Manifest V3.

Điều Tuyệt Vời Nhất Không Phải Là Sản Phẩm

Thành thật mà nói, điều đáng giá nhất của dự án không phải là extension.

Mà là quá trình xây dựng nó.

Có những buổi tối chỉ định sửa một lỗi nhỏ nhưng cuối cùng lại ngồi code đến khuya.

Có những ý tưởng xuất hiện rất ngẫu nhiên khi đang đọc tài liệu.

Có những tính năng ban đầu không hề nằm trong kế hoạch nhưng cuối cùng lại trở thành phần thú vị nhất của sản phẩm.

Đó chính là cảm giác mà cộng đồng thường gọi là:

Vibe Coding

Không phải code vì KPI.

Không phải code vì deadline.

Mà code vì tò mò.

Vì muốn giải quyết một vấn đề của chính mình.

Và vì niềm vui khi nhìn thấy một ý tưởng dần trở thành sản phẩm thật.

Nếu Bạn Đang Học Lập Trình, Hãy Bắt Đầu Từ Một Vấn Đề Của Chính Mình

Rất nhiều người hỏi:

"Mình nên làm project gì để nâng cao kỹ năng?"

Câu trả lời thường không nằm ở những ý tưởng quá lớn.

Hãy bắt đầu từ những điều khiến bạn khó chịu mỗi ngày.

Một thao tác lặp đi lặp lại.

Một quy trình thủ công.

Một vấn đề nhỏ mà bạn luôn muốn cải thiện.

Rất có thể dự án tiếp theo của bạn sẽ bắt đầu từ đó.

AI Translator & Grammar Check cũng được sinh ra theo cách như vậy.

Một nhu cầu cá nhân.

Một vài dòng code ban đầu.

Và rất nhiều buổi vibe coding đầy cảm hứng.

Thông tin dự án

GitHub Repository: https://github.com/cmdn-hieutran31/extension_translate_using_ai
Công nghệ: Chrome Extension Manifest V3, Vanilla JavaScript, Gemini AI
Trạng thái: Open Source
License: MIT

Từ Ý Tưởng Đến Sản Phẩm: Xây Dựng Chrome Extension Hỗ Trợ Học Ngoại Ngữ Bằng AI