Website OUTIT: Quản lý tín chỉ thông minh cho sinh viên UIT

GIỚI THIỆU ĐỀ TÀI

● Website OUTIT là một công cụ giúp cho sinh viên các khoa của trường Đại học Công nghệ thông tin có thể sử dụng để quản lý tín chỉ, lưu trữ và lên kế hoạch đăng ký môn học cho các học kỳ của mình một cách chính xác nhất. ● Đứng trước nhu cầu số lượng sinh viên cần quản lí quá trình học tập, số lượng tín chỉ môn học của mình mà chưa có một công cụ nào để thống kê, các sinh viên phải tự tạo file excel, phải tự tìm tòi các quy chuẩn và các loại tín chỉ còn rắc rối gây nhiều khúc mắc cho sinh viên UIT, nhóm quyết định phát triển một website để ứng dụng vào việc tự động hóa hồ sơ cá nhân của từng sinh viên, quản lý tiến độ học tập của từng loại tín chỉ một cách linh hoạt, tránh cho sinh viên đăng ký nhầm môn, lập được kế hoạch học tập hợp lý. - Lập trình xử lý sự kiện với Javascript - Spring Boot + MYSQL cho Backend - ReactJS cho frontend.

Cơ Sở Lí thuyết

• Định dạng Website với CSS
• Lập trình Javascript
• Sử dụng framework Bootstrap để phát triển website chuẩn responsive:`
• RestAPI .1 Định Nghĩa
• Spring boot .1 Định Nghĩa

● CSS3 mang đến khả năng tạo ra hiệu ứng chuyển động mượt mà thông qua transitions và animations mà không cần sử dụng JavaScript hoặc Flash. Tóm lại, CSS3 mang lại nhiều ưu điểm quan trọng cho phát triển web hiện đại, nhưng cũng cần phải cân nhắc đến các hạn chế và vấn đề tương thích để áp dụng một cách hiệu quả và bảo đảm trải nghiệm người dùng tốt nhất trên mọi trình duyệt. ● Năm 2016, ứng dụng JavaScript đã đạt kỷ lục lên tới 92% website sử dụng, đồng thời cũng được đánh giá là một công cụ cực kỳ quan trọng đối với.

Ưu nhược điểm của ngôn ngữ lập trình Javascript:Là một ngôn ngữ lập trình rất phổ biến hiện nay, Javascript có cho mình rất nhiều ưu điểm nổi bật. Bootstrap đi kèm với một loạt các thành phần CSS như nút, biểu đồ, thanh tiến trình, biểu mẫu, và nhiều thành phần khác giúp chuẩn hóa giao diện người dùng. Bootstrap hỗ trợ tùy chỉnh nhanh chóng thông qua Sass, cho phép bạn chỉnh sửa màu sắc, font chữ và các thuộc tính khác để phù hợp với thiết kế của bạn.

Bootstrap theo phương pháp "mobile-first", nghĩa là nó được xây dựng để tương thích tốt trên điện thoại di động trước, sau đó mở rộng lên các thiết bị lớn hơn. Với sự phát triển và hỗ trợ từ cộng đồng lớn, Bootstrap đã trở thành một công cụ đáng tin cậy và được sử dụng rộng rãi trong ngành phát triển web. Bootstrap không chỉ giúp chuẩn hóa quá trình phát triển web mà còn là một công cụ mạnh mẽ để nhanh chóng xây dựng giao diện đẹp và linh hoạt.

Reactjs là một opensource được phát triển bởi Facebook, ra mắt vào năm 2013, bản thân nó là một thư viện JavaScript được dùng để để xây dựng các tương tác với các thành phần trên website. Trong lập trình ứng dụng front-end, lập trình viên thường sẽ phải làm việc chính trên 2 thành phần sau: UI và xử lý tương tác của người dùng. UI là tập hợp những thành phần mà bạn nhìn thấy được trên bất kỳ một ứng dụng nào, ví dụ có thể kể đến bao gồm: menu, thanh tìm kiếm, những nút nhấn, card,… Giả sử bạn đang lập trình một website thương mại điện tử, sau khi người dùng chọn được sản phẩm ưng ý rồi và nhấn vào nút “Thêm vào giỏ hàng”, thì việc tiếp theo mà bạn phải làm đó là thêm sản phẩm được chọn vào giỏ hàng và hiển thị lại sản phẩm đó khi user vào xem => xử lý tương tác.

Ngoài việc hỗ trợ xây dựng giao diện nhanh, hạn chế lỗi trong quá trình code, cải thiện performance website thì những tính năng đặc biệt dưới đây có thể là lý do khiến bạn. Mục Đích: Spring Boot là một dự án của Spring Framework, được thiết kế để giúp lập trình viên nhanh chóng xây dựng các ứng dụng dựa trên Spring một cách dễ dàng hơn và với ít cấu hình hơn. ● Tự Động Cấu Hình: Tự động cấu hình các thành phần cần thiết cho ứng dụng Spring, giúp giảm bớt công việc cấu hình và tăng tốc độ phát triển.

● Phát Triển Web:MySQL thường được sử dụng trong các ứng dụng web, đặc biệt phổ biến trong kết hợp với các ngôn ngữ lập trình như PHP, Python, Java. ● Ứng Dụng Doanh Nghiệp: Do khả năng xử lý dữ liệu mạnh mẽ và tính bảo mật, MySQL cũng được sử dụng rộng rãi trong các ứng dụng doanh nghiệp.

PHÂN TÍCH THIẾT KẾ

Phân tích yêu cầu

• Thiết kế cơ sở dữ liệu 1. Sơ đồ cơ sở dữ liệu

● Bảo Mật: MySQL cung cấp nhiều tính năng bảo mật, bao gồm xác thực, mã hóa dữ liệu, và quản lý quyền truy cập. ● Scalability: MySQL có khả năng mở rộng tốt, hỗ trợ cả các ứng dụng nhỏ lẻ và các hệ thống lớn. ● Hỗ Trợ Giao Dịch:MySQL hỗ trợ giao dịch, giúp đảm bảo tính nhất quán và độ tin cậy của dữ liệu.

● Ứng Dụng Di Động: MySQL cũng có thể được sử dụng cho cơ sở dữ liệu phía server trong các ứng dụng di động.

Màn hình Dashboard

• Chỉnh sửa bảng mục tiêu tín chỉ và cập nhật
• Phân tích yêu cầu
• Phân tích 1 vài use case
• Chi tiết các API
• Giao diện

- Hiển thị danh sách các môn học mà học sinh đó đã đăng ký:một bảng hiển thị đầy đủ chi tiết các thông tin của môn học, loại tín chỉ của môn học đó đối với sinh viên và học kỳ mà sinh viên đã đăng kí môn học đó. -Hiển thị tiến độ học tập dưới dạng progress bar với từng loại tín chỉ:Hiển thị các widget với tên loại tín chỉ, số tín chỉ đã học được so với số tín chỉ yêu cầu của môn học đó. -Hiển thị biểu đồ tròn thể hiện tỉ trọng giữa các loại tín chỉ với nhau và tổng số tín chỉ hiện tại : Một biểu đồ tròn chia tỉ lệ giữa các màu sắc (loại tín chỉ) và thể hiện tổng số tín chỉ đã học được so với mục tiêu.

-Hiển thị danh sách các môn học với từng loại tín chỉ: Sinh viên ấn vào nút xem chi tiết của từng widget, danh sách các môn học thuộc tín chỉ đó sẽ được hiển thị với sinh viên. - Xem danh sách các môn học có thể đăng ký:Hiển thị dưới dạng bảng danh sách lịch sử tất cả các môn học mà sinh viên có thể đăng ký. -Lên danh sách môn cho học kỳ mới:sinh viên có thể chọn môn học từ bảng các môn học cho học kì tiếp theo.

-Chỉnh sửa các môn học của một học kỳ:Sinh viên có thể mở một học kỳ và thay đổi thông tin các môn học đã đăng kí trong học kì đó. - Hiển thị thông tin của sinh viên:Thông tin chi tiết của sinh viên sẽ được hiển thị. - Hiển thị tất cả học kì của sinh viên đó:các học kỳ của sinh viên sẽ được hiển thị với các loại tín chỉ có trong học kì đó, sinh viên ấn vào để xem môn học của từng học kì.

- Hiển thị danh sách mục tiêu của từng loại tín chỉ:Hiển thị số lượng yêu cầu của từng loại tín chỉ và sinh viên có quyền truy cập để sửa đổi các mục tiêu này. Sinh viên chọn một trong các học kì đã học và chỉnh sửa các môn học 7 Thay đổi mục tiêu tín chỉ Sinh viên cập nhật số lượng yêu cầu của. 6 Điều kiện sau ● Sinh viên có tài khoản với đầy đủ thông tin về loại tín chỉ yêu cầu.

3 Mô tả Sinh viên chọn các môn học từ bảng và chỉnh sửa loại tín chỉ theo ý của từng môn và xác nhận đăng kí học kì đó vào quá trình học tập. 8 Ngữ cảnh ngoại lệ Sinh viên chọn dưới 14 tín chỉ cho học kì mới, Sinh viên chọn quá 30 tín chỉ. 3 Mô tả Use case này cho phép sinh viên thay đổi số lượng yêu cầu của từng loại tín chỉ của mình.

6 Điều kiện sau ● Sinh viên sẽ có một số mục tiêu các loại tín chỉ cần thực hiện để đủ điều kiện ra trường. ● Sinh viên thực hiện thêm danh sách số lượng tín chỉ cần thiết tại bước 3 của đăng kí.