(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường

(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường(Đồ án tốt nghiệp) Xây dựng ứng dụng web quản lý đề tài nghiên cứu khoa học công nghệ cấp trường

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG ỨNG DỤNG WEB QUẢN LÝ ĐỀ TÀI NGHIÊN CỨU KHOA HỌC CÔNG NGHỆ CẤP TRƯỜNG GVHD: THS NGUYỄN MINH ĐẠO SVTH 1: ĐOÀN VĂN LONG MSSV: 17110174 SVTH 2: VÕ TẤN NGUYÊN MSSV: 17110194 NGÀNH: CÔNG NGHỆ THƠNG TIN KHĨA: 2017 Tp Hồ Chí Minh, tháng năm 2021 i LỜI CẢM ƠN Nhóm xin chân thành gửi lời cảm ơn đến Khoa Đào Tạo Chất Lượng Cao, ngành Công Nghệ Thông Tin, trường Đại Học Sư Phạm Kỹ Thuật TP Hồ Chí Minh tạo điều kiện cho nhóm hồn thành đồ án Đồng thời nhóm xin cảm ơn Trung Tâm Cơng Nghệ phần mềm giúp đỡ hỗ trợ nhóm nhiều việc hoàn thành đồ án Trong suốt trình tham gia đồ án nhóm học thêm nhiều kiến thức hiểu thêm nhiều nghiệp vụ thực tế từ Thầy Nguyễn Minh Đạo anh chị Trung Tâm Công Nghệ Phần Mềm trường Nhóm xin ghi nhớ kiến thức quý báu mà nhóm học từ đồ án Nhóm xin gửi lời cảm ơn sâu sắc đến quý Thầy Cô môn, người không ngần ngại truyền đạt kiến thức chia sẻ kinh nghiệm suốt năm học vừa qua Mặc dù nhóm cố gắng để hồn thiện thật tốt độ án có sai sót, nhóm mong q Thầy Cơ đóng góp ý kiến để sản phẩm hồn thiện Nhóm xin chân thành cảm ơn ! Nhóm sinh viên vi TÓM TẮT BẰNG TIẾNG VIỆT Các vấn đề nghiên cứu - Tìm hiểu Single page application (Angular), Spring Boot MongoDB giải toán cho hệ thống cung cấp dịch vụ sử dụng API cho website quản lý đề tài nghiên cứu khoa học công nghệ - Tìm hiểu nghiệp vụ quản lý đề tài nghiên cứu khoa học công nghệ Các vấn đề phát sinh - Thay đổi thêm vào số nghiệp vụ nhỏ, phát sinh nhiều - Không nắm rõ yêu cầu phát sinh Các phương pháp giải vấn đề - Thêm số chức để phù hợp với nghiệp vụ thay đổi - Thảo luận với người lấy nghiệp vụ nhiều để nắm rõ yêu cầu Kết đạt - Website quản lý đề tài nghiên cứu khoa học công nghệ - Xây dựng hệ thống dễ dàng bảo trì, phát triển vii TÓM TẮT BẰNG TIẾNG ANH Research issues - - Learn about Single page application (Angular), Spring Boot and MongoDB to solve the problem of service delivery system using API for website to manage science and technology research topics Learn about the management of scientific and technological research projects Problems arise - Change and add a few small transactions, the arising is a bit much Do not understand the requirements arise Problem Solving Methods - Add some functions to match the changing business Discuss with the person taking the profession more to understand the requirements Results achieved - Website to manage scientific and technological research topics Build a system that is easy to maintain and develop viii MỤC LỤC CHƯƠNG TỔNG QUAN 1.1 Khảo sát trạng 1.2 Tính cấp thiết đề tài 1.3 Mục tiêu nhiệm vụ 1.3.1 Mục tiêu 1.3.2 Nhiệm vụ 1.4 Công nghệ sử dụng 1.5 Phương pháp nghiên cứu CHƯƠNG CƠ SỞ LÝ THUYẾT 2.1 Java Spring Boot 2.1.1 Giới thiệu 2.1.2 Kiến trúc ứng dụng 2.1.3 Ưu điểm - Hạn chế 2.1.4 Lý sử dụng 2.2 MongoDB 2.2.1 Giới thiệu 2.2.2 Ưu điểm 10 2.2.3 Hạn chế 10 2.2.4 Lý sử dụng 10 2.3 Angular 11 2.3.1 Giới thiệu 11 2.3.2 Kiến trúc ứng dụng 12 2.3.3 Ưu điểm 13 2.3.4 Lý sử dụng 13 2.4 NG-ZORRO 14 2.4.1 Giới thiệu 14 2.4.2 Ưu điểm 14 2.4.3 Hạn chế 15 2.4.4 Lý sử dụng 15 ix CHƯƠNG XÁC ĐỊNH YÊU CẦU BÀI TOÁN 16 3.1 Phân tích toán 16 3.2 Quy trình nghiệp vụ 16 3.2.1 Quy trình đăng ký đề tài 18 3.2.2 Quy trình kiểm tra đánh giá 19 3.2.3 Quy trình xét duyệt đề tài 20 3.2.4 Quy trình ký hợp đồng 21 3.2.5 Quy trình thực đề tài theo dõi tiến độ 22 3.2.6 Quy trình nghiệm thu 23 3.2.7 Quy trình tốn triển khai ứng dụng 24 3.3 Mơ hình hóa chức 24 3.3.1 Danh sách Actor 24 3.3.2 Sơ đồ Usecase 25 3.3.3 Mô tả Usecase 25 3.3.4 Đặc tả Use Case 29 CHƯƠNG THIẾT KẾ PHẦN MỀM 59 4.1 Thiết kế kiến trúc 59 4.1.1 Front-End 60 4.1.2 Back-End 62 4.2 Thiết kế sở liệu 64 4.2.1 Database Schema 64 4.2.2 Mô tả chi tiết Database Schema 65 4.3 Thiết kế lược đồ 81 4.3.1 Tạo đề tài 81 4.3.2 Tạo thuyết minh 82 4.3.3 Kiểm duyệt đề tài khoa 83 4.3.4 Kiểm duyệt đề tài phòng KHCN 83 4.3.5 Chủ nhiệm đề tài chỉnh sửa yêu cầu 84 4.3.6 Tạo hội đồng kiểm duyệt 85 4.3.7 Tạo biên hội đồng kiểm duyệt 85 4.3.8 Tạo biểu điểm thành viên cho hội đồng 86 x 4.3.9 Báo cáo tiến độ thực 86 4.3.10 Xin hủy đề tài 87 4.3.11 Tạo hội đồng nghiệm thu 88 4.3.12 Trưởng đơn vị đề xuất hội đồng 89 4.3.13 Upload file 90 CHƯƠNG THIẾT KẾ GIAO DIỆN 91 5.1 Screen Chủ nhiệm đề tài 91 5.1.1 SCCNDT01 Trang đề tài 91 5.1.2 SCCNDT02 Trang đề xuất đề tài 92 5.1.3 SCCNDT03 Trang cập nhật mã đề tài 94 5.1.4 SCCNDT04 Màn hình sửa mã số đề tài 95 5.1.5 SCCNDT05 Màn hình bổ sung thuyết minh 96 5.1.6 SCCNDT06 Tiến độ thực 96 5.1.7 SCCNDT07 Màn hình danh sách báo cáo tiến độ 97 5.1.8 SCCNDT08 Màn hình danh sách xin huỷ đề tài 98 5.1.9 SCCNDT09 Màn hình modal thêm đề nghị hủy 99 5.1.10 SCCNDT10 Màn hình kết nghiên cứu 100 5.1.11 SCCNDT11 Màn hình kết nghiệm thu đề tài 101 5.1.12 SCCNDT12 Màn hình chi tiết kết nghiệm thu 102 5.1.13 SCCNDT13 Màn hình file 103 5.1.14 SCCNDT14 Màn hình danh sách file 104 5.2 Screen Trưởng đơn vị 104 5.2.1 SCTDV01 Màn hình kiểm duyệt khoa 104 5.2.2 SCTDV02 Màn hình yêu cầu chỉnh sửa 105 5.2.3 SCTDV03 Màn hình yêu cầu chỉnh sửa 106 5.2.4 SCTDV04 Màn hình chỉnh sửa thành viên đề xuất hội đồng 107 5.3 Screen Admin (Phịng Khoa Học Cơng Nghệ) 108 5.3.1 SCKHCN01 Màn hình kiểm duyệt KHCN 109 5.3.2 SCKHCN02 Màn hình hội đồng kiểm duyệt 110 5.3.3 SCKHCN03 Màn hình hợp đồng 111 5.3.4 SCKHCN04 Màn hình tiến độ thực 112 xi 5.3.5 SCKHCN05 Màn hình hội đồng nghiệm thu 113 5.3.6 SCKHCN06 Màn hình chỉnh sửa hội đồng nghiệm thu 116 5.3.7 SCKHCN07 Màn hình thêm hội đồng nghiệm thu 117 5.3.8 SCKHCN08 Màn hình hội đồng nghiệm thu chờ duyệt thành viên đề xuất 118 5.3.9 SCKHCN09 Màn hình hội đồng nghiệm thu duyệt đề xuất 119 5.3.10 SCKHCN10 Màn hình nghiệm thu đề tài 121 5.3.11 SCKHCN11 Màn hình quản lý file đề tài 122 5.3.12 SCKHCN12 Màn hình thay đổi thời gian đề tài 123 CHƯƠNG KẾT QUẢ VÀ THỰC NGHIỆM 124 6.1 Hệ thống Back-End 124 6.2 Hệ thống Front-End 124 6.3 Cài đặt hệ thống 125 6.3.1 Thư viện môi trường phát triển 125 6.3.2 Cài đặt chạy chương trình 126 CHƯƠNG KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 126 7.1 Kết đạt 126 7.2 Ưu điểm 127 7.3 Hạn chế 127 7.4 Hướng phát triển 127 TÀI LIỆU THAM KHẢO 128 xii DANH MỤC CÁC CHỮ VIẾT TẮT DI: Depedency Injection IoC: Inversion of Control JWT: JSON Web Token HTTP: Hyper Text Transfer Protocol API: Application Programming Interface NCKH: Nghiên cứu khoa học CNDT: Chủ nhiệm đề tài TDV: Trưởng đơn vị xiii DANH MỤC CÁC BẢNG BIỂU Bảng 3.1 Bảng mô tả sơ đồ UseCase 29 Bảng 3.2 Bảng đặc tả Usecase xem thông tin viết (UCU01) 30 Bảng 3.3 Bảng đặc tả use case đề tài (UCU02) 31 Bảng 3.4 Bảng đặc tả use case cập nhật mã số đề tài (UCU03) .32 Bảng 3.5 Bảng đặc tả use case bổ sung thuyết minh (UCU04) 33 Bảng 3.6 Bảng đặc tả use case tiên độ thực 35 Bảng 3.7 Bảng đặc tả use case kết nghiên cứu (UCU06) 36 Bảng 3.8 Bảng đặc tả use case kết nghiệm thu (UCU07) 38 Bảng 3.9 Đặc tả use case file (UCU08) .39 Bảng 3.10 Đặc tả use case kiểm duyệt KHCN (UCA01) 40 Bảng 3.11 Đặc tả use case kiểm duyệt khoa (UCA02) .42 Bảng 3.12 Đặc tả Use Case “Thêm hội đồng xét duyệt” (UCA03.1) 44 Bảng 3.13 Đặc tả Use Case “Thêm biên hội đồng” (UCA03.2) 45 Bảng 3.14 Đặc tả Use Case “Thêm biểu điểm thành viên” (UCA03.3) .46 Bảng 3.15 Bảng đặc tả use case hợp đồng (UCA04) 47 Bảng 3.16 Bảng đặc tả use case quán lý tiến độ thực (UCA05) .49 Bảng 3.17 Bảng đặc tả use case đè xuất hội đồng nghiệm thu (UCA06) 50 Bảng 3.18 Đặc tả use case quản lý hội đồng nghiệm thu (UCA07) 52 Bảng 3.19 Bảng đặc tả nghiệm thu đề tài (UCA08) 54 Bảng 3.20 Bảng đặc tả use case toán (UCA09) 55 Bảng 3.21 Bảng đặc tả use case quản lý file .56 Bảng 3.22 Bảng đặc tả use case quản lý danh mục 57 Bảng 3.23 Đặc tả use case quản lý cấu hình .58 Bảng 4.1 Bảng mô tả chi tiết thuộc tính bảng Lĩnh Vực 65 Bảng 4.2 Bảng mô tả chi tiết thuộc tính bảng Loại Hình Nghiên Cứu .65 Bảng 4.3 Bảng mơ tả chi tiết thuộc tính bảng Kinh Phí .66 Bảng 4.4 Bảng mơ tả chi tiết thuộc tính bảng Thời gian quy trình 67 Bảng 4.5 Bảng mơ tả chi tiết thuộc tính bảng Sản phẩm 68 Bảng 4.6Bảng mô tả chi tiết thuộc tính bảng Học hàm 68 Bảng 4.7 Bảng mơ tả chi tiết thuộc tính bảng Học vị 68 Bảng 4.8 Bảng mơ tả chi tiết thuộc tính bảng Cấu hình biểu mẫu .69 Bảng 4.9 Bảng mơ tả chi tiết thuộc tính bảng Cấu hình email 69 Bảng 4.10 Bảng mô tả chi tiết thuộc tính bảng File 70 Bảng 4.11 Bảng mô tả chi tiết thuộc tính bảng Chuyên mục viết 70 Bảng 4.12 Bảng mô tả chi tiết thuộc tính bảng Bài viết .71 Bảng 4.13 Bảng mơ tả chi tiết thuộc tính bảng Văn biểu mẫu 71 xiv Bảng hội đồng True Table Xem thành viên True Button Chỉnh sửa thông tin hội đồng True Button 10 Phân trang True Button Data từ api Data từ api Bảng hiển thị hội đồng lọc theo điều kiện Khi ấn hiển thị modal chứa danh sách thành viên hội đồng Chỉnh sửa thông tin hội đồng Khi click chuyển đến trang cần chuyển Bảng 5.21 Bảng đặc tả hình hội đồng nghiệm thu 115 5.3.6 SCKHCN06 Màn hình chỉnh sửa hội đồng nghiệm thu Hình 5.25 Màn hình chỉnh sửa hội đồng nghiệm thu No Name Required Format Reference Note Tên hội đồng True Text Data từ api Tên hội đồng Số định True Text Data từ api Số định Ngày định True Date Data từ api Ngày định Picker Ngày họp True Date Data từ api Ngày họp Data từ api Khách Picker Khách mời True Text mời hội đồng Địa điểm họp True Text Đóng True Button Data từ api Địa điểm họp Nút đóng ấn vào khơng lưu lại thay đổi 116 Lưu lại True Nút lưu lại Button ấn lưu lại thay đổi Bảng 5.22 Bảng đặc tả hình chỉnh sửa hội đồng nghiệm thu 5.3.7 SCKHCN07 Màn hình thêm hội đồng nghiệm thu Hình 5.26 Màn hình thêm hội đồng nghiệm thu No Name Thời gian quy trình Danh sách đề tài Required True Thành viên hội đồng Nhập thành viên Format Dropdown Box Dropdown Box Reference Data từ api Data từ api True Dropdown Box Data từ api True Button True Note Thời gian quy tình Danh sách đề tài phù hợp để tạo hội đồng Danh sách giảng viên, cán trường (Lưu ý: Bắt buộc tạo thành viên với vai trò chủ tịch thư ký) Khi ấn thành viên chọn thêm vào bảng danh sách 117 True Table Danh sách thành viên hội đồng Đóng True Button Lưu lại True Button thành viên vừa thêm Bảng danh sách thành viên vừa thêm vào Nút đóng ấn vào khơng lưu lại thay đổi Nút lưu lại ấn lưu lại thay đổi Bảng 5.23 Bảng đặc tả hình thêm hội đồng nghiệm thu 5.3.8 SCKHCN08 Màn hình hội đồng nghiệm thu chờ duyệt thành viên đề xuất Hình 5.27 Màn hình hội đồng nghiệm thu chờ duyệt thành viên đề xuất No Name Required Bảng hội đồng True chờ đề xuất Format Reference Table Data từ api Xem danh sách True thành viên Button Note Bảng hội đồng với trạng thái “Đề xuất thành viên” Khi ấn hiển thị modal chứa danh sách thành viên vừa đề xuất 118 Phân trang True Button Duyệt thành viên True hội đồng Button Chỉnh sửa thông True tin bên hội đồng Button Upload danh sách True thành viên đề xuất Button Data từ api Khi ấn bảng danh sách hội đồng hiển thị hội đồng tương ứng với trang Khi ấn hiển thị modal cho phép xem chỉnh sửa danh sách thành viên Khi ấn hiển thị modal chỉnh sửa thơng tin hội đồng Khi ấn hiển thị chỗ upload file danh sách thành viên đề xuất Bảng 5.24 Bảng đặc tả hình hội đồng nghiệm thu chờ duyệt thành viên đề xuất 5.3.9 SCKHCN09 Màn hình hội đồng nghiệm thu duyệt đề xuất Hình 5.28 Màn hình hội đồng nghiệm thu duyệt đề xuất 119 No Name Bảng hội đồng duyệt đề xuất Xem danh sách thành viên Chỉnh sửa thông tin bên hội đồng Upload danh sách thành viên đề xuất Xem file đề xuất Required Format True Table Phân trang Reference Note Data từ Bảng hội đồng với api trạng thái “Đã duyệt thành viên” Khi ấn hiển thị modal chứa danh sách thành viên Khi ấn hiển thị modal chỉnh sửa thông tin hội đồng True Button True Button True Button Khi ấn hiển thị chỗ upload file danh sách thành viên đề xuất True Button True Button Khi ấn hiển thị modal cho phép xem file upload từ Khi ấn bảng danh sách hội đồng hiển thị hội đồng tương ứng với trang Data api Bảng 5.25 Bảng đặc tả hình hội đồng nghiệm thu duyệt đề xuất 120 5.3.10 SCKHCN10 Màn hình nghiệm thu đề tài Hình 5.29 Màn hình nghiệm thu đề tài No Name Required Format Bảng hội True Table đồng duyệt đề xuất Tìm kiếm True Text Xem True Button Phân trang True Button Tìm kiếm True thành viên Text Reference Data từ api Data từ api Note Bảng hội đồng với trạng thái “Đã duyệt thành viên” Tìm kiếm hội đồng theo mã số đề tài tên hội đồng Khi ân vào nút Xem hiển thị bảng điểm hội đồng nhận xét thành viên hội đồng chuyển text nút thành “Ẩn” Khi ấn load bảng hội đồng theo trang tương ứng Tìm kiếm thành viên theo tên 121 File điểm phiếu True Button Data từ api File phiếu đánh True giá Button Data từ api Danh sách True thành viên hội đồng Upload phiếu True điểm đánh giá Table Data từ api Button Xuất file phiếu điểm tất thành viên hội đồng Xuất file phiếu đánh giá cho tất thành viên hội đồng Danh sách thành viên hội đồng Khi ấn vào hiển thị modal upload file phiếu điểm đánh giá thành viên Bảng 5.26 Bảng đặc tả hình nghiệm thu đề tài 5.3.11 SCKHCN11 Màn hình quản lý file đề tài Hình 5.30 Màn hình quản lý file đề tài No Name Required Bảng đề True tài Format Table Reference Data từ api Note Bảng danh sách đề tài 122 Xem file đề True tài Button Phân trang Button Tab chọn xem True file Tập file cần True xem True Data từ api Tab Data từ api Khi ấn vào nút Xem load file đề tài bên Khi ấn vào load đề tài theo trang tương ứng Các tab để chọn xem file, ấn load file tương ứng Khi ấn load danh sách file tương ứng 5.3.12 SCKHCN12 Màn hình thay đổi thời gian đề tài Hình 5.31 Màn hình thay đổi thời gian đề tài No Name Required Thời gian True quy trình Tìm kiếm True Format Dropdown Box Text Bảng đề True tài chưa ký hợp đồng Chỉnh sửa True thời gian quy trình đề tài Table Button Reference Note Data từ Thời gian quy trình api để lọc đề tài Lọc đề tài theo tên đề tài Data từ Bảng đề tài chưa api ký hợp đồng Khi ấn modal chỉnh sửa thời gian quy trình đề tài 123 Phân trang True Button Data api từ Khi ấn load bảng đề tài theo trang tương ứng Bảng 5.27 Bảng đặc tả hình thay đổi thời gian đề tài CHƯƠNG KẾT QUẢ VÀ THỰC NGHIỆM 6.1 Hệ thống Back-End Hệ thống Back-end xây dựng ngôn ngữ Java sử dụng Spring Boot Framwork để lập trình 6.2 Hệ thống Front-End Ứng dụng Front-end sử dụng công nghệ Single Page Application giúp ứng dụng thao tác liệu nhanh mà khơng u cầu tải lại trang Chủ nhiệm đề tài: • Đề xuất đề tài • Thêm tuyết minh cho đề tài • Xem danh sách đề tài • Chỉnh sửa đề tài • Hủy đề tài • Bổ sung thuyết minh • Báo cáo tiến độ thực • Báo cáo kết nghiên cứu • Xem kết nghiệm thu • Xuất file liên quan đến đề tài • Đăng xuất Trưởng đơn vị: • Xét duyệt đề tài • Đề xuất hội đồng nghiệm thu • Đăng xuất Quản trị viên (Phịng khoa học cơng nghệ): • Đăng xuất • Xét duyệt đề tài • Quản lý hội đông kiểm duyệt 124 • • • • • • • • • • • • • • • • • Quản lý hợp đồng Quản lý tiến độ thực đề tài Quan lý hội đồng nghiệm thu Quản lý kết nghiệm thu đề tài Quản lý toán Quản lý lịch sử file Thay đổi thời gian quy trình đề tài Quản lý banner Quản lý chuyên mục viết Quản lý viết theo chuyên mục Quản lý học hàm Quản lý học vị Quản lý lĩnh vực nghiên cứu Quản lý loại hình nghiên cứu Quản lý sản phẩm Quản lý loại phí Quản lý cấu hình biểu mẫu 6.3 Cài đặt hệ thống Clone download project từ link github: https://github.com/stc-hcmute/nghien-cuu-khoa-hoc 6.3.1 Thư viện môi trường phát triển STT Library/Software Download URL Npm https://nodejs.org/en/download/ Apache https://tomcat.apache.org/tomcat-7.0doc/appdev/installation.html Jdk https://www.oracle.com/java/technologies/javase/javasejdk8-downloads.html Angular CLI https://cli.angular.io/ https://docs.mongodb.com/manual/administration/installMongoDB community/ 125 6.3.2 Cài đặt chạy chương trình Cơng cụ sử dụng để chạy project: • Visual Studio Code: dùng để chạy front-end • IntelliJ: dùng để chạy back-end Bước 1: Clone download project từ link github: https://github.com/stc-hcmute/nghien-cuu-khoa-hoc Bước 2: Trong thư mục “nghien-cuu-khoa-hoc” chứa thư mục là: “nghien-cuukhoa-hoc-fe”, “nghien-cuu-khoa-hoc-be” có clone project từ github giải nén file đính kèm báo cáo Tiến hành vào thư mục “nghien-cuu-khoa-hoc” Bước 3: Sau vào thư mục “nghien-cuu-khoa-hoc” (như hình) Hình 6.1 Các thư mục “quan-ly-tham-quan” Bước 4: Mở thư mục “tham-quan-be” IntelliJ, chọn run taskbar Bước 5: Mở thư mục “tham-quan-fe” Visual Studio Code, chọn termial taskbar Bước 6: Chạy lệnh “npm install” để cập nhật thư viện, package thiếu máy mà project cần Bước 8: Sau lệnh npm install kết thúc, gõ lệnh “ng serve” nhấn enter Bước 9: Sau compile xong, url project hiển thị dòng cuối, nhấn “ctrl + click” vào url, trình duyệt web hiển thị Hoặc chạy tay cách mở trình duyệt web nhập url: http://localhost:4200 Giao diện trang chủ khởi chạy đầu tiên: http://localhost:4200 CHƯƠNG KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 7.1 Kết đạt Về nhóm tìm hiểu xây dựng đạt được: • • Xây dựng RESTFul API ngôn ngữ Java sử dụng Spring Boot Áp dụng Angular để xây dựng giao diện phía khách 126 • • • • Sử dụng thư viện NG-ZORRO- ant design để xây dựng giao diện Tìm hiểu docker để sử dụng thư viện codewars-runner-cli Tìm hiểu deloy front-end Google Cloud, back-end Google Cloud Platform, Database MongoDB Cluster Xây dựng ứng dụng hỗ trợ việc thực quản lý đề tài Nghiên cứu khoa học cấp trường 7.2 Ưu điểm • • • • • • Giao diện đại, dễ nhìn, thân thiện với người dùng Áp dụng cơng nghệ Hệ thống có tốc độ phản hồi nhanh Khả bảo trì, mở rộng dễ dàng, nhanh chóng Có tính đặc thù nghiệp vụ Hỗ trợ đa ngôn ngữ 7.3 Hạn chế • Do liên quan đến nghiệp vụ lkhas nhiều nên khó sử dụng với người khơng nắm nghiệp vụ NCKH • Một số hình chưa hỗ trợ responsive • Vẫn có khả tồn lỗi • Chưa phải ứng dụng thời gian thực 7.4 Hướng phát triển Sau xây dựng phát triển tính khoảng tháng nhóm lên số ý tưởng để phát triển hệ thống lớn mạnh khắc phục số hạn chế hệ thống Tuy nhiên, khơng đủ thời gian nên nhóm lưu ý tưởng lại thực có thời gian • • • • • Tăng tính tương thích cho hình Hỗ trợ thời gian thực Xây dựng giao diện thân thiện dễ sử dụng Xây dựng tính thơng báo thay đổi hệ thống Xây dựng hệ thống cho tốc độ phản hồi cao 127 TÀI LIỆU THAM KHẢO Tiếng Việt: [1] Tạo CRUD Rest API với Spring boot https://hocspringboot.net/2020/10/29/crud-don-gian-voi-restful-api-trong-springboot/ [2] Cài đặt MongoDB Ubuntu 20.04 https://cloudviet.com.vn/cai-dat-mongodb-tren-ubuntu-20-04/ Tiếng Anh: [1] Angular Documents https://angular.io/docs [2] Java Documents https://docs.oracle.com/en/java/ [3] Spring Boot Documents https://docs.spring.io/spring-boot/docs/current/reference/htmlsingle/ [4] NG-ZORRO Ant Design Documents https://ng.ant.design/docs/getting-started/en [5] MongoDB Documents https://docs.mongodb.com/ [6] Docker document https://docs.docker.com/ https://docs.docker.com/engine/install/ubuntu/ [7] SysAdmin, How to setup docker ubuntu https://phoenixnap.com/kb/how-to-install-docker-on-ubuntu-18-04 [8] NGING Document http://nginx.org/en/docs/ [9] grokonez, How to Deploy Angular on Nginx remote Server Example https://www.youtube.com/watch?v=iPYgCYb2tZg 128 S K L 0 ... giải toán cho hệ thống cung cấp dịch vụ sử dụng API cho website quản lý đề tài nghiên cứu khoa học cơng nghệ - Tìm hiểu nghiệp vụ quản lý đề tài nghiên cứu khoa học công nghệ Các vấn đề phát... cán nhân viên yêu cầu xử lý công việc nhà, tránh nguy bệnh dịch Việc đăng ký, xét duyệt chấm điểm cho đề tài nghiên cứu khoa học trường đại học năm vô quan trọng Các đề tài nghiên cứu khoa học. .. lý) 1.3 Mục tiêu nhiệm vụ 1.3.1 Mục tiêu ● Xây dựng ứng dụng web quản lý công nghệ Java Spring Boot Angular ● Hoàn thiện giao diện chức theo u cầu phịng Khoa Học Cơng Nghệ ● Hỗ trợ tạo quản lý