Với hình thức một mạng xã hội, ứng dụng cung cấp các tính năng nổi bậtbao gồm:● Tìm bạn luyện tập ngoại ngữ theo điều kiện, yêu cầu phù hợp với nhu cầu cá nhân● Gọi trực tuyến thời gian
Trang 1KHOA CÔNG NGHỆ PHẦN MỀM
XÂY DỰNG ỨNG DỤNG KẾT NỐI NGƯỜI CÓ NHU CẦU NÂNG CAO KHẢ NĂNG
GIAO TIẾP NGOẠI NGỮ
Đồ án 2
Giảng viên hướng dẫn: ThS Nguyễn Thị Thanh Trúc
Sinh viên thực hiện:
20520353 – Trương Xuân Vương
20520377 – Trần Bảo Ân
Thành phố Hồ Chí Minh, tháng 01 năm 2024
ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM
Trang 2XÂY DỰNG ỨNG DỤNG KẾT NỐI NGƯỜI CÓ NHU CẦU NÂNG CAO KHẢ NĂNG
GIAO TIẾP NGOẠI NGỮ
Đồ án 2 Giảng viên hướng dẫn: ThS Nguyễn Thị Thanh Trúc
Sinh viên thực hiện:
20520353 – Trường Xuân Vương
20520377 – Trần Bảo Ân
Trang 3Thành phố Hồ Chí Minh, tháng 01 năm 2023
1 ĐỀ CƯƠNG CHI TIẾT
TÊN ĐỀ TÀI: XÂY DỰNG ỨNG DỤNG KẾT NỐI NGƯỜI CÓ NHU CẦU NÂNG CAO KHẢ NĂNG GIAO TIẾP NGOẠI NGỮ
Cán bộ hướng dẫn: ThS Nguyễn Thị Thanh Trúc
Thời gian thực hiện: Từ ngày 05/09/2023 đến ngày 31/12/2023
Sinh viên thực hiện:
20520353 – Trương Xuân Vương
20520377 – Trần Bảo Ân
Trang 4Nội dung đề tài:
Mục tiêu:
Xây dựng được ứng dụng website với giao diện thân thiện, màu sắc hài hòa, bố cục hợp lý; đáp ứng được các tính năng cần thiết với ngôn ngữ Javascript, công nghệ mới ReactJS, Java Spring Boot và chuẩn bảo mật JWT, áp dụng công nghệ gọi thời gian thực, phục vụ cho mục đích thiết thực là học và luyện tập ngoại ngữ với hình thức mới đầy thú vị Với hình thức một mạng xã hội, ứng dụng cung cấp các tính năng nổi bật bao gồm:
● Tìm bạn luyện tập ngoại ngữ theo điều kiện, yêu cầu phù hợp với nhu cầu cá nhân
● Gọi trực tuyến thời gian thực
● Nhắn tin với bạn bè
● Luyện tập thông qua các bài tập được cung cấp
● Cung cấp thông tin và tài liệu chuyên môn cho người dùng
● Quản lý hồ sơ cá nhân
Phạm vi:
Đề tài xây dựng một website cho những người có nhu cầu luyện tập giao tiếp ngoại ngữ có thể tìm và kết nối với nhau, ứng dụng hỗ trợ trong việc nhắn tin, gọi điện trao đổi thông tin học tập với nhau, luyện tập thông qua các bài tập được cung cấp trong
hệ thống Ngoài ra người dùng có thể quản lý thời gian luyện tập Từ đó, họ biết được thời gian họ sử dụng cho việc luyện tập và tiến độ học tập, đưa ra kế hoạch luyện tập phù hợp để nhanh chóng đạt được mục tiêu Bên cạnh đó, người dùng có thể quản lý
hồ sơ cá nhân, đăng tải video bài viết liên quan.
Trang 5Đối tượng sử dụng:
Người dùng có nhu cầu luyện tập ngoại ngữ với người thật, chia sẻ tài liệu học ngoại ngữ, hoặc người dùng muốn tham gia vào cộng đồng học ngoại ngữ giúp đỡ những bạn đang trong quá trình học.
Phương pháp thực hiện:
Tìm hiểu, phân tích quy trình xây dựng một website
Khảo sát lấy ý kiến người dùng
Phân tính, đánh giá các ứng dụng tương tự: Tinder, Elsa
Phân tích công nghệ để lựa chọn công nghệ phù hợp
Kết quả mong đợi:
Biết được quy trình xây dựng một website theo Agile
Biết được công nghệ mới và phổ biến hiện nay
Xây dựng được một ứng dụng website đáp ứng mục tiêu đề ra
Website có khả năng mở rộng trong tương lai
2 LỜI CẢM ƠN
Đồ án với đề tài “XÂY DỰNG ỨNG DỤNG KẾT NỐI NGƯỜI CÓ NHU CẦU NÂNG CAO KHẢ NĂNG GIAO TIẾP NGOẠI NGỮ” là minh chứng cho quá trình cố gắng
Trang 6không ngừng trong việc tìm tòi, học hỏi khi học tập tại trường Đại học Công nghệ Thông tin, thể hiện khả năng của bản thân trong việc áp dụng kiến thức chuyên môn vào giải quyết bài toán thực tế.
Trong quá trình thực hiện đồ án, em đã nhận được sự hướng dẫn tận tình từ cô Một cách đặc biệt, em xin được gửi lời cảm ơn chân thành đến:
Các thầy cô trường Đại học Công nghệ Thông Tin nói chung và thầy cô ở Khoa Công nghệ phần mềm nói riêng đã tận tình truyền đạt kiến thức tới em trong những năm học tập tại trường Đó là tài sản quý báu đã giúp em hoàn thành khóa luận và cũng là hành trang cho con đường sự nghiệp của bản thân sau này.
Em xin được gửi lời cảm ơn sâu sắc tới ThS Nguyễn Thị Thanh Trúc, người đã trực tiếp hướng dẫn, chỉ bảo, giúp đỡ em những lúc khó khăn, đưa ra những lời khuyên bổ ích để khoá luận được hoàn thành đúng tiến độ và đáp ứng các yêu cầu đề ra ban đầu.
Các thành viên trong nhóm đã luôn nỗ lực phấn đấu, lắng nghe và luôn sẵn sàng
hỗ trợ nhau trong suốt cả quá trình học tập và thực hiện đồ án Để đạt được kết quả như ngày hôm nay.
Lời cuối cùng, em xin dành lời cảm ơn gửi tới gia đình, anh chị, bạn bè đã luôn bên cạnh để động viên và đóng góp ý kiến trong quá trình hoàn thành đồ án này Thành phố Hồ Chí Minh, tháng 12 năm 2023
Trương Xuân Vương Trần Bảo Ân
Trang 73 NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
………
MỤC LỤC
1 ĐỀ CƯƠNG CHI TIẾT
2 LỜI CẢM ƠN
3 NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN
Trang 8Chương 1 GIỚI THIỆU TỔNG QUAN ĐỀ TÀI
1.7 Kết quả mong đợi
1.8 Khảo sát các ứng dụng liên quan
Chương 3 PHÂN TÍCH BÀI TOÁN
3.1 Phát biểu bài toán
3.2 Phân tích yêu cầu chức năng
3.3 Phân tích yêu cầu phi chức năng
3.4 Phân tích yêu cầu người dùng
Chương 4 THIẾT KẾ HỆ THỐNG
4.1 Use case Diagram
4.1.1 Sơ đồ Use case
Trang 94 TÀI LIỆU THAM KHẢO
Trang 10cơ hội việc làm… Ý thức được điều đó, cộng đồng người học tiếng Anh ngày càng
mở rộng, nhu cầu luyện tập tiếng Anh ngày càng lớn
Nhiều năm trở lại đây, người học không chỉ dừng ở kĩ năng đọc – viết mà họ còn muốn phát triển mạnh kỹ năng nghe – nói bởi đây mới là kĩ năng được sử dụng nhiều trong thực tế Thế nhưng khác với đọc – viết, người học kỹ năng nghe – nói đòi hỏi cần có môi trường luyện tập Hiện nay, nhiều người có nhu cầu luyện tập nhưng không biết tìm môi trường luyện tập ở đâu hoặc họ phải chi trả mức giá khá cao để đến các trung tâm luyện tập Nắm bắt được nhu cầu người dùng, các website luyện tập nghe nói tiếng Anh ra đời Các website đi theo hai xu hướng: Một là, sử dụng AI để đánh giá khả năng và người dùng tập đọc theo hướng dẫn Khuyết điểm của ứng dụng loại này là người dùng khó tạo ra tình huống giao tiếp chủ động như trong thực tế Hai là, website kết nối người có nhu cầu luyện tập Website loại này khắc phục được hạn chế của website loại một tuy nhiên số lượng website dành cho mục đích học ngoại ngữ tương tự như thế vẫn còn hạn
Trang 11chế rất nhiều về hình thức và chức năng
Chủ quan:
Trong suốt quá trình học tập, nhóm chúng em đã trải nghiệm qua các ứng dụng khác nhau và hoạt động trên nhiều nền tảng Cảm thấy hứng thú với công nghệ web và nắm bắt được nhu cầu từ thực tế, nhóm đã đề xuất ý tưởng xây dựng một website để tạo môi trường luyện tập ngoại ngữ, không chỉ giới hạn ở tiếng Anh mà còn có thể sử dụng cho các loại ngôn ngữ khác Đây là trải nghiệm lần đầu của nhóm về việc xây dựng một website hoàn chỉnh Ngoài ra, nhóm ấp ủ một sản phẩm hoàn thiện hơn, với việc nghiên cứu và xây dựng các giải pháp cho một hệ thống tự động, sử dụng công nghệ trí tuệ nhân tạo để nâng cao khả năng
hỗ trợ người dùng.
1.2 Mục tiêu
● Hoàn thiện thêm ứng dụng website với giao diện thân thiện, màu sắc hài hòa, bố cục hợp lý
● Đáp ứng được các tính năng cần thiết
● Kết nối cộng đồng học tiếng Anh: Dự án này sẽ giúp kết nối những người học tiếng Anh trên toàn cầu, tạo ra một cộng đồng đa dạng về ngôn ngữ và văn hóa, giúp họ học từ nhau và thúc đẩy sự giao lưu văn hóa
● Hỗ trợ học tập và thực hành: Mạng xã hội kết nối người học tiếng Anh có thể cung cấp các công cụ và tài liệu học tập, cũng như cơ hội thực hành ngôn ngữ qua việc trò chuyện và viết.
● Động viên và thúc đẩy: Dự án này có thể cung cấp hệ thống động viên và thưởng cho người học tiếng Anh, giúp họ duy trì động lực và sự cam kết đối với việc học tiếng Anh.
Trang 12● Phân tích dữ liệu: Mạng xã hội này có thể thu thập dữ liệu về hoạt động học tập của người dùng, giúp tổ chức và cá nhân hiểu rõ hơn về tiến trình học tập và cách cải thiện.
● Khả năng thương mại hóa, tạo ra cơ hội kinh doanh: Một mạng xã hội kết nối người học tiếng Anh cũng có thể tạo ra cơ hội kinh doanh thông qua quảng cáo, các khóa học trực tuyến, và các dịch vụ hỗ trợ học tập khác
1.3 Phạm vi
Phát triển website cho phép người dùng
● Tương tác trực tiếp thời gian thực với nhau thông qua chức năng gọi
● Lọc, tìm kiếm người phù hợp
● Kết nối người dùng có nhu cầu luyện tập ngoại ngữ với nhau
● Quản lý thời gian luyện tập ngoại ngữ từ đó người dùng có chiến lược luyện tập cho phù hợp
● Luyện tập ngoại ngữ thông qua các bài tập được cung cấp sẵn trong hệ thống
Trang 13● Khảo sát ý kiến người dùng tiềm năng
1.7 Kết quả mong đợi
● Xây dựng một website theo quy trình phát triển phần mềm chuyên nghiệp
● Cung cấp các chức năng quan trọng và đạt được mục tiêu ứng dụng đã đề ra
● Website có khả năng mở rộng trong tương lai
● Có khả năng nghiên cứu, phân tích khi gặp một vấn đề, bài toán
1.8 Khảo sát các ứng dụng liên quan
1.8.1 Tinder
Lấy cảm hứng từ ứng dụng tìm bạn hẹn hò phổ biến nhất hiện nay - Tinder, nhóm nghiên cứu quyết định khảo sát chính ứng dụng mục tiêu để so sánh, phân tích, tìm ra các điểm mạnh và hạn chế để áp dụng vào ứng dụng mục tiêu Là ứng dụng
Trang 14trung tâm mà ứng dụng của nhóm nghiên cứu sử dụng để thực hiện đề tài, nhóm nghiên cứu quyết định phân tích và khảo sát kĩ Tinder về cả mặt nghiệp vụ và công nghệ để có góc nhìn toàn diện, phát huy ưu điểm và khắc phục hạn chế của ứng dụng hiện tại.
1.8.1.1 Nghiệp vụ
Tinder sử dụng các thuật toán đề xuất để cung cấp cho người dùng những kết quả phù hợp, tiềm năng dựa trên nhiều yếu tố khác nhau như địa điểm, tuổi tác,
sở thích… Về mặt nghiệp vụ, các yếu tố mà Tinder sử dụng:
● Thông tin hồ sơ: Tinder xem xét thông tin người dùng cung cấp trong hồ sơ của họ, chẳng hạn như tuổi, vị trí, tiểu sử và sở thích Người dùng thường đặt các tùy chọn tiêu chuẩn về tuổi, khoảng cách địa lý, giới tính, của những người phù hợp tiềm năng và thuật toán sẽ tính đến các tùy chọn này khi tạo đề xuất.
● Hành vi tương tác với ứng dụng: Ứng dụng theo dõi hành vi tương tác của người dùng, ghi chú các hồ sơ họ chọn hoặc không chọn Thuật toán sử dụng dữ liệu này để tìm hiểu sở thích thật sự của người dùng và cải thiện
độ chính xác của các đề xuất trong tương lai.
● Lịch sử đối sánh: Thuật toán xem xét lịch sử đối sánh và cuộc trò chuyện của người dùng Nếu trước đây người dùng đã khớp và tương tác tích cực với các hồ sơ thể hiện một số đặc điểm nhất định thì thuật toán có thể ưu tiên hiển thị các hồ sơ tương tự.
● Cấp độ hoạt động: Người dùng đang tích cực sử dụng ứng dụng và tương tác với hồ sơ có thể nhận được đề xuất chính xác hơn Thuật toán có thể chú trọng hơn đến hoạt động gần đây, đảm bảo rằng các đề xuất phản ánh
sở thích hiện tại.
● Học máy và AI: Tinder có thể sử dụng các kỹ thuật học máy và trí tuệ nhân
Trang 15tạo để liên tục cải thiện hệ thống đề xuất của mình Các thuật toán này có thể xác định các mô hình và xu hướng trong hành vi của người dùng mà có thể không rõ ràng ngay lập tức, từ đó đưa ra các đề xuất được tinh chỉnh
và cá nhân hóa hơn theo thời gian.
● Phản hồi của người dùng: Phản hồi của người dùng, chẳng hạn như sự cố được báo cáo hoặc câu chuyện thành công, có thể được sử dụng để tinh chỉnh thuật toán đề xuất Tinder có thể phân tích phản hồi để xác định các lĩnh vực cần cải thiện và điều chỉnh thuật toán cho phù hợp.
● So khớp dựa trên vị trí: Do tính chất địa lý xã hội của các ứng dụng hẹn hò, thuật toán của Tinder sẽ tính đến khoảng cách địa lý của người dùng Nó gợi ý các trận đấu trong một khoảng cách nhất định để tăng khả năng xảy
ra các cuộc gặp trong thế giới thực.
Các yếu tố trên đây cũng sẽ là các yếu tố về mặt nghiệp vụ mà nhóm nghiên cứu
sử dụng để lọc và gợi ý người dùng phù hợp trong ứng dụng mục tiêu.
● Phân tích dữ liệu: Dữ liệu được phân tích bằng các kỹ thuật AI và Machine Learning khác nhau Thuật toán AI xác định các mẫu và xu hướng trong dữ liệu để hiểu sở thích và mối quan tâm của người dùng Cụ thể, Tinder sử
Trang 16dụng thuật toán NLP và máy học (ML) để xác định các mẫu và xu hướng khác nhau trong dữ liệu, đồng thời hiểu sở thích và mối quan tâm của người dùng.
● Kết nối: Dựa trên phân tích, Tinder sẽ sử dụng thuật toán AI để tìm kiếm những kết quả phù hợp tiềm năng cho người dùng Thuật toán xem xét các yếu tố như vị trí, độ tuổi, giới tính, sở thích và các lần vuốt qua lại để đề xuất các kết quả phù hợp tiềm năng.
● Vòng phản hồi: Tinder sử dụng vòng phản hồi để liên tục cải tiến thuật toán AI dựa trên phản hồi của người dùng Nếu người dùng vuốt sang phải trên một kết quả phù hợp, thuật toán sẽ biết rằng kết quả phù hợp đó là
đề xuất phù hợp Nếu người dùng vuốt sang trái trên một kết quả phù hợp, thuật toán sẽ biết rằng kết quả phù hợp đó không phải là đề xuất phù hợp.
Bằng cách sử dụng AI, Tinder đã đạt được mức độ cá nhân hóa và độ chính xác cao trong việc kết nối người dùng Người dùng nhận được các đề xuất phù hợp với sở thích của họ, tăng khả năng tìm thấy kết quả phù hợp.
Tinder phát triển ứng dụng di động trên thiết bị di động:
● Ngôn ngữ: Các ứng dụng di động của Tinder có thể được phát triển bằng các ngôn ngữ native, cụ thể Swift cho iOS và Kotlin/Java cho Android.
● Framework: Framework ứng dụng dành cho thiết bị di động, bao gồm UIKit cho iOS và SDK Android cho Android, được sử dụng để xây dựng giao diện người dùng và quản lý hành vi ứng dụng.
Về phía Backend, Tinder sử dụng Microservices với các công nghệ, ngôn ngữ như sau:
● Java Spring Boot: Java là ngôn ngữ thường được sử dụng để xây dựng các
Trang 17hệ thống phụ trợ mạnh mẽ và có thể mở rộng Tinder có thể sử dụng Java cho cơ sở hạ tầng phụ trợ của mình Spring Boot, một framework dựa trên Java, được biết đến với vai trò đơn giản hóa việc phát triển các ứng dụng sẵn sàng sản xuất Có thể Tinder sử dụng Spring Boot cho các dịch vụ phụ trợ của mình.
● Node.js: Một số báo cáo cho thấy Tinder sử dụng Node.js cho các phần backend của nó, tận dụng kiến trúc không đồng bộ và hướng sự kiện của Javascript, Tinder kết hợp giữa Node và Spring Boot để tối ưu hóa phía Backend.
Cơ sở dữ liệu:
● MongoDB: MongoDB, cơ sở dữ liệu NoSQL, thường được liên kết với Tinder Lược đồ linh hoạt và khả năng mở rộng của nó làm cho nó phù hợp
để xử lý dữ liệu liên quan đến hồ sơ và tương tác của người dùng.
● Redis: Redis, kho lưu trữ dữ liệu trong bộ nhớ, có thể được sử dụng để lưu vào bộ nhớ đệm dữ liệu được truy cập thường xuyên và cải thiện hiệu suất tổng thể của hệ thống.
Định vị địa lý:
● API Google Maps: Tinder dựa vào vị trí địa lý để kết nối người dùng với những người phù hợp tiềm năng ở vùng lân cận của họ API Google Maps thường được sử dụng để tích hợp các dịch vụ bản đồ và vị trí.
Dịch vụ điện toán đám mây:
● Amazon Web Services (AWS): Nhiều công ty công nghệ, bao gồm Tinder, tận dụng AWS cho các dịch vụ điện toán đám mây, lưu trữ và khả năng mở rộng.
Giao tiếp thời gian thực:
Trang 18● WebSockets: Các tính năng thời gian thực, chẳng hạn như chức năng trò chuyện, có thể được triển khai bằng WebSockets để cho phép liên lạc tức thì giữa những người dùng.
Giám sát và phân tích:
● Relic mới, Google Analytics hoặc các công cụ tương tự: Những công cụ này giúp theo dõi hiệu suất ứng dụng, theo dõi mức độ tương tác của người dùng và thu thập dữ liệu phân tích.
Nhìn chung, các công nghệ do Tinder sử dụng hiện tại đang ở mức hiện đại và tối
ưu hóa trong việc vận hành, bảo trì và phát triển ứng dụng Các công cụ phân tích
và thu thập dữ liệu người dùng cho nhóm nghiên cứu thêm nhiều thông tin hữu ích trong việc tìm ra hướng nghiên cứu, phát triển và kết hợp các thuật toán Với các ưu điểm trong công nghệ mà Tinder đang dùng, cụ thể là Spring boot và mô hình microservices, nhóm nghiên cứu quyết định áp dụng công nghệ tương tự cho đồ án của mình.
Tuy nhiên, giải thuật và các vận hành cũng như công nghệ bên trong Tinder vẫn
Trang 19còn là bí mật Tinder không phải là một ứng dụng mã nguồn mở Thêm vào đó, để phù hợp với mục tiêu sử dụng là học tập và luyện tập ngoại ngữ, nhóm nghiên cứu triển khai ứng dụng trên web thay vì trên điện thoại như Tinder Bởi lẽ, ứng dụng trên website tạo ra không gian học tập, phù hợp với nhu cầu người dùng hơn là ứng dụng trên điện thoại.
1.8.2 Duolingo
Về mặt phân tích nghiệp vụ, nhóm nghiên cứu chọn Duolingo làm ứng dụng khảo sát Duolingo là một nền tảng học ngôn ngữ phổ biến cung cấp phương pháp tiếp cận trò chơi cho giáo dục ngôn ngữ Với nhiều thành tích ấn tượng theo thông tin đăng tải trên trang Medium, như số lượt tải xuống hơn 1 tỷ, số lượt người dùng hoạt động mỗi tháng hơn 54 triệu, Duolingo hiện đang được nhiều người học ngoại ngữ, đặc biệt là tiếng Anh tin tưởng sử dụng Chính vì lý do đó, nhóm nghiên cứu quyết định chọn Duolingo làm ứng dụng để phân tích Sau quá trình nghiên cứu, nhóm rút ra các kết luận về mặt nghiệp vụ như sau:
Các tính năng và chiến lược chính:
● Gamification: Duolingo kết hợp các yếu tố gamification để làm cho quá trình học ngôn ngữ trở nên hấp dẫn và thú vị Người dùng kiếm được điểm, cạnh tranh với bạn bè và duy trì thành tích để khuyến khích việc sử dụng nhất quán.
● Dịch thuật nhờ cộng đồng: Duolingo đã tận dụng cơ sở người dùng của mình cho các dịch vụ dịch thuật ngôn ngữ Người dùng có thể đóng góp vào việc dịch nội dung trong thế giới thực, cung cấp dịch vụ có giá trị đồng thời cải thiện kỹ năng ngôn ngữ của họ.
● Phương pháp tiếp cận ưu tiên thiết bị di động: Duolingo được thiết kế tập trung vào thiết bị di động, giúp người dùng có thể truy cập được trên điện thoại thông minh và máy tính bảng Giao diện thân thiện với người dùng
Trang 20của ứng dụng và các bài học ngắn, mang tính tương tác phục vụ cho việc học tập khi đang di chuyển.
● Cung cấp ngôn ngữ rộng rãi: Duolingo cung cấp các khóa học bằng nhiều ngôn ngữ, khiến nó trở nên hấp dẫn đối với người dùng có nhu cầu học ngôn ngữ đa dạng Sự bao gồm này đã góp phần vào sự phổ biến của nó trên toàn cầu.
● Học theo hướng dữ liệu: Duolingo sử dụng phân tích dữ liệu để theo dõi tiến trình của người dùng và điều chỉnh trải nghiệm học tập Điều này cho phép các lộ trình học tập được cá nhân hóa, thích ứng với điểm mạnh và điểm yếu của từng cá nhân.
● Khảo sát kiến thức cho người lần đầu tiên sử dụng ứng dụng.
● Thường xuyên nhắc nhở người học bằng nhiều cách thú vị và hóm hỉnh nên gây được chú ý từ người dùng.
Những thách thức và hạn chế:
● Mối quan tâm về tính hiệu quả: Duolingo cho thấy độ ảnh hưởng cho người dùng ở trình độ căn bản và trung bình Tuy nhiên, ở những mức cao hơn, các chuyên gia cho rằng ứng dụng khó có thể đạt được hiệu quả đặc biệt là trong giao tiếp Nói cách khác, phương pháp này chưa thật sự mang lại hiệu quả cho người có nhu cầu luyện giao tiếp
● Chất lượng của bản dịch nhờ nguồn lực cộng đồng: Độ chính xác và độ tin cậy của các bản dịch được tạo ra thông qua nguồn lực cộng đồng đã bị chỉ trích vì chúng không phải lúc nào cũng đáp ứng các tiêu chuẩn chuyên nghiệp.
● Cạnh tranh: Thị trường ứng dụng học ngôn ngữ có tính cạnh tranh cao, với một số lựa chọn thay thế cung cấp các cách tiếp cận và tính năng khác nhau Duolingo phải liên tục đổi mới để luôn dẫn đầu.
Trang 21Thiết kế Cơ sở dữ liệu Tạo codebase cho Backend
Thiết kế giao diện Tạo codebase cho Frontend
Soạn báo cáo
6
- Tìm hiểu Spring boot
- Tìm hiểu Spring security
- Tìm hiểu ReactJS cơ bản
- Tìm hiểu React Hook:
useState, useEffect, useMemo…
- Tìm hiểu React Router
- Tìm hiểu thư viện UI:
Bootstrap, Ant Design
- Hiện thực giao diện:
trang Login, trang Sign Up
Soạn báo cáo
Trang 22Code api cho tính năng
đăng nhập, đăng xuất,
gửi yêu cầu, từ chối,
chấp nhận yêu cầu, hủy
kết bạn
Code giao diện cho màn hình thống kê, màn hình xem danh sách người có thể gửi yêu cầu, danh sách bạn
bè, gắn api cho tính năng đăng nhập, đăng ký
Tìm hiểu về service call realtime
videosdk
9+10
Code api cho tính năng
quản lý tài khoản, quản
lý bài tập, làm bài tập,
tìm hiểu socket áp dụng
cho tính năng nhắn tin
Code giao diện cho tính năng nhắn tin, gọi điện, làm bài tập, gắn api cho tính năng gửi yêu cầu, từ chối, chấp nhận yêu cầu, hủy kết bạn
13
Nghiên cứu tích hợp api
của service videosdk
vào hệ thống
Triển khai tính năng nhắn tin, thông báo dựa trên socket
Fix bug giao diện
Trang 23Facebook, React đã nhận được sự yêu thích rộng rãi của các cộng đồng lập trình viên.
Các khái niệm chính của React:
● Component-based architecture: chia các thành phần lớn thành các thành phần nhỏ hơn nhằm dễ đọc, dễ bảo trì và có tính tải sử dụng.
● Virtual DOM: React sử dụng virtual Document Object Model (DOM), cho phép cập nhật và hiển thị giao diện người dùng một cách hiệu quả Khi trạng thái của một thành phần (component) thay đổi, React chỉ cập nhật phần DOM thực bị thay đổi thay vì tải lại toàn bộ trang.
● JSX: là một phần mở rộng cú pháp cho Javascript tương tự như HTML Nó được dùng trong React để mô tả các cấu trúc UI JSX giúp cho code dễ đọc hơn và dễ dàng hơn trong việc viết code React.
● State and Props: là các khái niệm chính trong React State (trạng thái) đề cập đến dữ liệu thay đổi theo thời gian của một thành phần Props (viết tắt của properties) được dùng để truyền dữ liệu từ thành phần cha đến thành phần con.
Trang 24Hình 3: ReactJS
2.1.2 ViteJS
ViteJS là một front-end build tool giúp cải thiện đáng kể trải nghiệm cho phát triển web Được phát triển bởi Evan You, người tạo ra Vue.js, ban đầu Vite được tạo ra để phục vụ hệ sinh thái Vue nhưng sau đó đã phát triển để hỗ trợ nhiều framework khác như React, Svelte, Vanilla.
Các tính năng chính:
● Khởi động máy chủ nhanh: Vite vận dụng hệ thống mô đun gốc của
Javascript để phục vụ code Phương pháp này cho phép thời gian khởi động máy chủ cực kỳ nhanh chóng, do các tập tin chỉ được xử lý khi chúng được yêu cầu.
● Tối ưu hóa quá trình build: build cho môi trường thực tế, Vite sử dụng Rollup Rollup là một trình đóng gói hiệu quả cao, tạo ra mã được tối ưu
để có thời gian tải trang nhanh hơn.
● Hot Module Replacement (HMR): cho phép thay thế các mô đun mà không
Trang 25cần tải lại trang, cải thiện trải nghiệm phát triển.
● Typescript Support: nó hỗ trợ các built-in của Typescript, cho phép các nhà phát triển sử dụng mà không cần cài đặt gì thêm.
Hình 3: ViteJS
2.1.3 Typescript
Typescript là một dự án mã nguồn mở được phát triển và duy trì bởi Microsoft
Nó là có được coi là phiên bản nâng cao của Javascript b ởi việc bổ sung tùy chọn kiểu tĩnh và lớp hướng đối tượng mà điều này không có ở Javascript.
Các tính năng chính:
dịch sẽ giảm được tỷ lệ gán sai kiểu của các giá trị Toàn bộ các khai báo sẽ
bị xóa sau khi đã biên dịch từ Typescript thành công sang Javascript.
trợ việc sử dụng class để phát triển theo hướng đối tượng, import và
Trang 26export phân chia code thành các module nhỏ hơn, dễ tổ chức, dễ bảo trì.
tái sử dụng hơn.
có Các thư viện, framework của Javascript có thể dùng được trong
Typescript và code Typescript có thể được biên dịch sang Javascript.
Hình 4: Typescript
2.1.4 Redux toolkit
Redux là một công quản lý state phổ biến trong hệ sinh thái React Được sử dụng nhằm quản lý state một cách hiệu quả, chia sẻ state giữa các thành phần mà không phải thông qua props Redux toolkit là một package được sinh ra nhằm giải quyết phần lớn vấn đề về config của redux khá dài dòng để sử dụng.
Các khái niệm chính của Redux bao gồm:
● Actions: đơn giản là các events Chúng là cách mà chúng ta gửi dữ liệu từ app đến Redux store Những dữ liệu này có thể là từ sự tương tác của
Trang 27người dùng với app, API calls hoặc cũng có thể là từ form submission.
● Reducers: là các hàm dùng để lấy state hiện tại của app, thực hiện một action và trả về một state mới Những states này được lưu như những objects và chúng định rõ cách state của một ứng dụng thay đổi trong việc phản hồi một action được gửi đến store.
● Store: lưu trạng thái ứng dụng và nó là duy nhất trong bất kỳ một ứng dụng Redux nào Bạn có thể access các state được lưu, update state, và đăng ký or hủy đăng ký các listeners thông qua helper methods.
Hình 5: mô hình hoạt động của Redux
2.1.5 Axios
Axios là một thư viện HTTP Client được phát triển dựa trên đối tượng Javascript Promise Nó có thể sử dụng trong các ứng dụng front-end Vue.js, React,
Trang 28Angular Sử dụng Axios dễ dàng gửi đi các request HTTP bất đồng bộ đến các REST endpoint và thực hiện các chức năng CRUD.
● Spring data integration: Đơn giản hóa việc truy cập và thao tác dữ liệu
Trang 29thông qua việc tích hợp Spring data repositories.
● Actuator module: cung cấp các built-in endpoints để theo dõi và quản lý tình trạng, số liệu của ứng dụng, …
● Embedded Tomcat, Jetty, or Undertow: được tích hợp các embedded HTTP servers như Tomcat, Jetty, or Undertow, loại bỏ nhu cầu triển khai máy chủ bên ngoài.
Spring Security được thiết kế theo kiến trúc plugin, cho phép tùy biến linh hoạt và
Trang 30dễ dàng theo nhu cầu của ứng dụng và được tích hợp sẵn với các thành phần khác của Spring Framework, như Spring Boot, Spring MVC, Spring Data, Spring Cloud, và Spring WebFlux
Spring Security hoạt động theo mô hình client-server Khi một client gửi một request đến server, server sẽ xác thực người dùng và phân quyền để đảm bảo rằng người dùng chỉ có thể truy cập vào những tài nguyên mà họ được phép truy cập Cơ chế hoạt động của Spring Security dựa trên cơ chế lọc (filter) và sự kiện (event) để can thiệp vào quá trình xử lý yêu cầu (request) và phản hồi (response) của ứng dụng web, tức là khi một yêu cầu được gửi đến ứng dụng web, nó sẽ được chuyển qua một chuỗi các bộ lọc (filter chain) do Spring Security quản lý Mỗi bộ lọc có một nhiệm vụ cụ thể, như kiểm tra xác thực, kiểm tra phân quyền, điều hướng đến trang đăng nhập hoặc đăng xuất, xử lý các lỗi bảo mật.
Hình 8: Cơ chế Filter Chain trong Spring Security
2.2.3 Spring JPA
Spring Data JPA là một công nghệ trong Spring Boot cung cấp cho chúng ta các tính năng để dễ dàng tương tác với cơ sở dữ liệu Nó là một phần mở rộng của JPA (Java Persistence API) và sử dụng Hibernate để thực hiện các thao tác trên cơ
Trang 31sở dữ liệu.
Với Spring Data JPA, chúng ta không cần phải viết các truy vấn SQL trực tiếp mà
có thể sử dụng các phương thức được tạo tự động từ các Repository Interface để thực hiện các truy vấn đó Ngoài ra, Spring Data JPA cũng cung cấp cho chúng ta các tính năng như Paging and Sorting, Query By Example, Specification, Native Queries, giúp tăng tính linh hoạt và hiệu suất trong ứng dụng của chúng ta.
Hình 9: Luồng hoạt động của JPA
2.3 Database - PostgreSQL
PostgreSQL là một hệ thống quản trị cơ sở dữ liệu quan hệ-đối tượng relational database management system) mã nguồn mở Được đánh giá cao về tính ổn định và bảo mật, với nhiều tính năng nâng cao như kiểm soát truy cập,
(object-mã hóa dữ liệu và xác thực Nó cũng hỗ trợ nhiều loại dữ liệu và phương pháp truy vấn phức tạp, giúp cho việc lưu trữ và truy xuất dữ liệu trở nên dễ dàng hơn.
Trang 32Các ưu điểm của PostgreSQL:
● Cộng đồng lớn và chuyên nghiệp: PostgreSQL được phát triển và bảo trì bởi một cộng đồng lớn và đầy nhiệt huyết Những người tham gia trong cộng đồng này đều là những chuyên gia về cơ sở dữ liệu và có kinh nghiệm thực tiễn.
● Hiệu suất cao: Có thể xử lý được tập dữ liệu lớn và đa dạng, đồng thời cung cấp các tính năng như phân vùng bảng, lập danh mục nâng cao và truy vấn đọc song song giúp tăng hiệu suất truy vấn.
● Bảo mật cao: Cung cấp nhiều tính năng bảo mật như hệ thống kiểm soát truy cập mạnh mẽ, bảo mật cấp độ cột và hàng, xác thực đa dạng và khả năng mã hóa dữ liệu.
● Tính linh hoạt: Cho phép định nghĩa các kiểu dữ liệu tùy chỉnh, xây dựng các hàm tùy chỉnh và viết mã từ các ngôn ngữ lập trình khác nhau Điều này giúp cho các nhà phát triển có thể tùy chỉnh cơ sở dữ liệu cho phù hợp với nhu cầu của ứng dụng.
● Hỗ trợ trên nhiều điều hành: PostgreSQL có thể chạy trên nhiều hệ điều hành khác nhau như Linux, Windows và macOS.
● Cập nhật thường xuyên: Được phát triển và cập nhật thường xuyên, với các phiên bản mới được phát hành để cải thiện tính năng, tăng hiệu suất
và sửa các lỗi bảo mật.
2.4 Tiêu chuẩn
2.4.1 JWT
JSON Web Token (JWT) là một tiêu chuẩn mở (RFC 7519) nhằm xác minh thông tin an toàn giữa các bên Client-Server dưới dạng JSON object Thông tin này có thể được xác minh và tin cậy vì nó được ký điện tử - digitally signed JWT có thể được ký bằng cách sử dụng một secret (với thuật toán HMAC) hoặc cặp
Trang 33public/private key dùng chuẩn RSA hoặc ECDSA JWT phù hợp với những đối tượng muốn bảo mật thông tin của họ bởi người dùng khi thực hiện việc đăng nhập vào hệ thống thì họ phải đáp ứng được yêu cầu về JWT Ngoài ra, JWT còn mang đến sự thuận tiện cho người dùng trong việc click vào server, url,
resource, bởi họ dễ dàng xác nhận được quyền truy cập của mình chỉ với JWT Các ưu điểm của JWT:
● Nhỏ gọn hơn: So với XML, JWT nhỏ gọn hơn rất nhiều Do đó, JWT khi thực hiện mã hoá cũng sẽ nhỏ gọn hơn SAML Điều này khiến JWT trở thành một sự lựa chọn phù hợp cho các lập trình viên trong môi trường HTTP và HTML.
● An toàn hơn: JWT sử dụng cặp khóa Public Key/Private Key dưới dạng X.509 hoặc một mã bí mật sử dụng thuật toán HMAC được chia sẻ để ký
Do đó, phương pháp thực hiện bảo mật của JWT an toàn hơn so với SAML.
● Phổ biến hơn: Do JWT ánh xạ trực tiếp đến các đối tượng nên bộ phân tích
cú pháp JWT phổ biến trong hầu hết các ngôn ngữ lập trình hiện nay Trong khi đó, XML không tự nhiên ánh xạ tài liệu nên bạn sẽ làm việc tốt hơn với JWT.
● Dễ dàng xử lý hơn: Được sử dụng ở quy mô nền tảng internet nên JWT dễ dàng xử lý các kết nối có trên hầu hết các thiết bị của con người đặc biệt là các thiết bị di động cá nhân.
Cấu trúc của JWT:
● Header: Phần header sẽ chứa kiểu dữ liệu , và thuật toán sử dụng để mã hóa ra chuỗi JWT.
Trang 34Hình 10: Header của JWT
❖ “typ” (type) chỉ ra rằng đối tượng là một JWT.
❖ “alg” (algorithm) xác định thuật toán mã hóa chuỗi là HS256.
● Payload: là phần sẽ chứa các thông tin muốn đặt trong chuỗi token như username, userId, author, …
Hình 11: Payload của JWT
● Signature: phần này sẽ được tạo ra bằng cách mã hóa phần header, payload kèm theo một chuỗi secret (khóa bí mật)
base64urlEncode: thuật toán mã hóa header và payload.
Sau đó mã hóa hai chuỗi vừa nhận được kèm theo secret bằng thuật toán HS256 ta sẽ có chuỗi signature.
Cuối cùng kết hợp 3 chuỗi trên lại ta sẽ có một chuỗi JWT hoàn chỉnh.
2.4.2 RESTful API