Xây dựng trang web review sách

BÁO CÁO THỰC TẬP CÔNG NHÂN PHẦN THIẾT KẾ WEBSITE ĐỀ TÀI : Xây dựng trang web review sách MỤC LỤC DANH SÁCH HÌNH ẢNH MỞ ĐẦU Tổng quan đề tài Hiện nay, nhiều người bỏ nhiều thời gian để đọc sách cộng đồng đọc sách lớn mạnh Tuy vậy, Một người bắt đầu đọc sách chưa thể tự tìm cho tựa sách phù hợp để bắt đầu Vì vậy, chúng em hồn thành website review sách nhằm cung cấp viết review sách củng cố kiến thức học tự học thêm công nghệ Mục đích ý nghĩa đề tài 2.1 Mục đích • Ơn tập, củng cố kiến thức học mơn Cơng nghệ web • Tìm hiểu, nghiên cứu cơng nghệ 2.2 Ý nghĩa • Có thể tự hồn thiện website hồn chỉnh từ khâu phân tích yêu cầu, vẽ use-case, mockup code qua củng cố kiến thức lập trình webs Phương pháp thực Phương pháp phân tích tổng hợp từ tài liệu: đọc tài liệu có liên quan đến Nodejs Express để có đầy đủ kiến thức lập trình Phương pháp thống kê, điều tra: review trang web có nội dung tương tự Phương pháp phân tích thiết kế hệ thống: tiến hành phân tích, thiết kế database Phương pháp thử nghiệm, đánh giá kết quả: tiến hành triển khai hệ thống review sách Bố cục đề tài Báo cáo đề tài bao gồm nội dung sau: Mở đầu Chương 1: Cơ sở lý thuyết Chương 2: Phân tích triển khai hệ thống Chương 3: Triển khai Kết luận hướng phát triển CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 Website 1.1.1 Khái nệm Website tập hợp trang web (web pages) bao gồm văn bản, hình ảnh, video, flash v.v thường nằm tên miền (domain name) tên miền phụ (subdomain) Trang web lưu trữ (web hosting) máy chủ web (web server) truy cập thơng qua Internet Website đóng vai trò văn phòng hay cửa hàng mạng Internet – nơi giới thiệu thông tin doanh nghiệp, sản phẩm dịch vụ doanh nghiệp cung cấp… Có thể coi website mặt doanh nghiệp, nơi để đón tiếp giao dịch với khách hàng, đối tác Internet 1.1.2 Phân loại website Có thể cơng việc cá nhân, doanh nghiệp tổ chức, thường dành riêng cho số chủ đề cụ thể mục đích Bất kỳ trang web chứa siêu liên kết vào trang web khác, đó, phân biệt trang web cá nhân, cảm nhận người sử dụng Tạm thời phân loại sau: • Trang web cá nhân • Trang web thương mại • Trang web phủ • Trang web tổ chức phi lợi nhuận 1.2 Ngôn ngữ javascript 1.2.1 Tổng quan Javascript Javascript ngôn ngữ chương trình máy tính động Javascript nhúng tích hợp vào tập tin HTML, dùng để tạo script máy client máy server Các script client thực thi trình duyệt script server thực server JavaScript Java hai ngơn ngữ hồn tồn khác nhau, khái niệm thiết kế JavaScript phát minh Brendan Eich vào năm 1995, trở thành tiêu chuẩn ECMA năm 1997 ECMA-262 tên thức ECMAScript 2016 (tháng năm 2016) phiên JavaScript 1.2.2 Javascript JavaScript ngơn ngữ lập trình đa tảng (cross-platform), ngơn ngữ lập trình kịch bản, hướng đối tượng JavaScript ngơn ngữ nhỏ nhẹ (small and lightweight) Khi nằm bên mơi trường (host environment), JavaScript kết nối tới object mơi trường cung cấp cách quản lý chúng (object) JavaScript chứa thư viện tiêu chuẩn cho object, ví dụ như: Array, Date, Math, yếu tố cốt lõi ngơn ngữ lập trình như: tốn tử (operators), cấu trúc điều khiển (control structures), câu lệnh JavaScript mở rộng cho nhiều mục đích việc bổ sung thêm object; ví dụ: • Client-side JavaScript - JavaScript phía máy khách, JavaScript mở rộng cách cung cấp object để quản lý trình duyệt Document Object Model (DOM) Ví dụ, phần mở rộng phía máy khách cho phép ứng dụng tác động tới yếu tố trang HTML phản hồi giống tác động người dùng click chuột, nhập form, chuyển trang • Server-side JavaScript - JavaScript phía Server, JavaScript mở rộng cách cung cấp thêm đối tượng cần thiết để để chạy JavaScript máy chủ Ví dụ, phần mở rộng phía server cho phép ứng dụng kết nối với sở liệu (database), cung cấp thông tin cách liên tục từ yêu cầu tới phần khác ứng dụng, thực thao tác với tập tin máy chủ 1.3 Nodejs 1.3.1 Nodejs ? Node.js mã nguồn mở, môi trường cho máy chủ ứng dụng mạng Node.js sử dụng Google V8 JavaScript engine để thực thi mã, tỷ lệ lớn mô-đun viết JavaScript Các ứng dụng node.js viết bằn JavaScript Node.js chứa thư viện built-in cho phép ứng dụng hoạt động Webserver mà không cần phần mềm Nginx, Apache HTTP Server IIS Node.js cung cấp kiến trúc hướng kiện (event-driven) non-blocking I/O API, tối ưu hóa thơng lượng ứng dụng có khả mở rộng cao Mọi hàm Node.js không đồng (asynchronous) Do đó, tác vụ xử lý thực thi chế độ (background processing) 1.3.2 Ứng dụng Nodejs • Xây dựng websocket server (Chat server) • Hệ thống Notification (Giống facebook hayTwitter) • Ứng dụng upload file client • Các máy chủ quảng cáo • Các ứng dụng liệu thời gian thực khác 1.3.3 Nhược điểm Nodejs • Ứng dụng nặng tốn tài nguyên Nếu bạn cần xử lý ứng dụng tốn tài nguyên CPU encoding video, convert file, decoding encryption… ứng dụng tương tự không nên dùng NodeJS (Lý do: NodeJS viết C++ & Javascript, nên phải thơng qua thêm trình biên dịch NodeJS lâu chút ) Trường hợp bạn viết Addon C++ để tích hợp với NodeJS để tăng hiệu suất tối đa ! • NodeJS ngơn ngữ khác NodeJS, PHP, Ruby, Python NET …thì việc cuối phát triển App Web NodeJS sơ khai ngôn ngữ lập trình khác Vậy nên bạn đừng hi vọng NodeJS không PHP,Ruby,Python… thời điểm Nhưng với NodeJS bạn có ứng dụng mong đợi, điều chắn ! 1.3.4 Ưu điểm Nodejs Đặc điểm bật Node.js nhận xử lý nhiều kết nối với single-thread Điều giúp hệ thống tốn RAM chạy nhanh tạo thread cho truy vấn giống PHP Ngoài ra, tận dụng ưu điểm non-blocking I/O Javascript mà Node.js tận dụng tối đa tài nguyên server mà không tạo độ trễ PHP JSON APIs Với chế event-driven, non-blocking I/O(Input/Output) mơ hình kết hợp với Javascript lựa chọn tuyệt vời cho dịch vụ Webs làm JSON Ứng dụng trang( Single page Application) Nếu bạn định viết ứng dụng thể trang (Gmail?) NodeJS phù hợp để làm Với khả xử lý nhiều Request/s đồng thời thời gian phản hồi nhanh Các ứng dụng bạn định viết khơng muốn tải lại trang, gồm nhiều request từ người dùng cần hoạt động nhanh để thể chuyên nghiệp NodeJS lựa chọn bạn Shelling tools unix NodeJS tận dụng tối đa Unix để hoạt động Tức NodeJS xử lý hàng nghìn Process trả luồng khiến cho hiệu xuất hoạt động đạt mức tối đa tuyệt vời Streamming Data (Luồng liệu) Các web thông thường gửi HTTP request nhận phản hồi lại (Luồng liệu) Giả xử cần xử lý luồng giữ liệu cực lớn, NodeJS xây dựng Proxy phân vùng luồng liệu để đảm bảo tối đa hoạt động cho luồng liệu khác Ứng dụng Web thời gian thực Với đời ứng dụng di động & HTML nên Node.js hiệu xây dựng ứng dụng thời gian thực (real-time applications) ứng dụng chat, dịch vụ mạng xã hội Facebook, Twitter,… 1.4 Express JS Framework 1.4.1 ExpressJS • Express js Framework nhỏ, linh hoạt xây dựng tảng Nodejs Nó cung cấp tính mạnh mẽ để phát triển web mobile • Về package hỗ trợ: Expressjs có vơ số package hỗ trợ nên bạn lo lắng làm việc với Framework • Về performance: Express cung cấp thêm tính (feature) để dev lập trình tốt Chứ khơng làm giảm tốc độ NodeJS • Và hết, Framework tiếng NodeJS sử dụng ExpressJS core function, chẳng hạn: SailsJS, MEAN, 1.4.2 Cấu trúc ExpressJS Để hiểu cấu trúc Expressjs xem ảnh đây: Hình 1: Cấu trúc ExpressJS Có thể thấy cấu trúc express js vơ đơn giản: • Root: • app.js chứa thơng tin cấu hình, khai báo, định nghĩa, để ứng dụng chạy ok • package.json chứa package cho ứng dụng chạy Nếu bạn làm với PHP RoR file có chức tương tự composer.json Gemfile • Folder routes: chứa route có ứng dụng • Folder view: chứa view/template cho ứng dụng • Folder public chứa file css, js, images, cho ứng dụng 1.4.3 Khái niệm Router ExpressJS: • Router Object (khác Routing nhé), instance riêng middleware routes (Hai khái niệm tìm hiểu sau nhé) Chính instance middleware route nên có chức hai Chúng ta gọi mini-application • Các Application dùng ExpressJS làm core có phần Router tích hợp sẵn • Router hoạt động middleware nên dùng arguments Hoặc dùng arguments cho route khác Nghe khó hiểu khơng Ví dụ nhé: Hình 2: Ví dụ Router • Chúng ta sử dụng Router để chia route Chẳng hạn: 1.4.4 Tìm hiểu method all router router.all() Method phù hợp với việc định nghĩa mang tính chất tồn cục cho prefix Hình 3: Ví dụ method all Nếu ta đặt route (top) yêu cầu tất route bên phải requireAuthentication Có nghĩa xác thực trước thực hành động hay task tiếp theo, ví dụ loadUser Khác với ví dụ Ở ví dụ Hình 4: Ví dụ method all ta có prefix Hình 5: Ví dụ method all xác định /api/ thay dùng * Nghĩa trước request vào route bên API phải qua thao tác xác thực requireAuthentication 1.4.5 Tìm hiểu router.METHOD() Router.METHOD() cung cấp cho chức Routing ExpressJS Cụ thể METHOD() HTTP method mà thường xuyên sử dụng Chẳng hạn GET, POST, PUT, Lưu ý tên method phải viết thường (lowercase) Ví dụ: Hình 6: Ví dụ router.METHOD() Nếu muốn bảo mật sử dụng Regex để bắt Endpoint Ví dụ: 1.5 Phân tích yêu cầu 1.5.1 u cầu Hình 7: Ví dụ Regex quản lý website • Xây dựng trang quản lý có giao diện dễ nhìn, đơn giản, dễ sử dụng 2.1 Phân tích chức hệ thống Website xây dựng phục vụ đối tượng Admin (Quản trị viên) Khách hàng 2.1.1 Admin  Đăng ký tài khoản  Đăng nhập Website  Đăng xuất  Quản lý danh mục  Quản lý sách  Quản lý tác giả  Quản lý đăng  Quản lý thông tin cá nhân 2.1.2 User  Xem thông tin sách  Xem viết  Đăng nhập, đăng ký, đăng xuất  Viết đánh giá  Đánh giá 2.2 Thiết kế sở liệu Hình 8: Thiết kế sở liệu 2.3 Thiết kế hệ thống Sơ đồ usecase chức Admin : Hình 9: Usecase chức quản lý review Hình 10: Usecase chức quản lý danh mục Hình 11: Usercase chức quản lý thơng tin cá nhân Hình 12: Chức quản lý sách Hình 13: Chức quản lý tác giả Usecase cho User: Hình 14: Các chức người dùng CHƯƠNG 3: TRIỂN KHAI 3.1 Môi trường cài đặt  Web site xây dựng tảng :  Back-end nodejs sử dụng framework ExpressJS  Front-end: HTML, CSS, Javascript, Jquery, Ajax  Hệ quản trị sở liệu: MySQL  Quản lý source code: Git  Các bước thực đề tài:  Lập đề cương chi tiết cho đề tài  Tìm hiểu số trang web review sách  Lên danh sách công việc cần lầm, phân bổ cơng việc cho thành viên nhóm  Xây dựng database  Xây dựng web  Hoàn thành báo cáo 3.2 Kết triển khai  Sau triển khai trang web thực chức cần thiết :  Về User: Viết review, đánh giá, xem sách, xem viết, đăng nhập, đăng xuất, tìm kiếm  Về Admin: Quản lý sách, quản lý đăng , quản lý tác giả, quản lý danh mục, quản lý thông tin tài khoản KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN KẾT QUẢ ĐẠT ĐƯỢC Trong thời gian tìm hiểu, nghiên cứu sở lý thuyết triển khai ứng dụng công nghệ, đề tài đạt kết sau: Về mặt lý thuyết, đề tài đạt :  Ứng dụng kiến thức lập trình Website Nodejs, ExrpessJS, HTML5, CSS3, Ajax, Jquery, … dể xây dựng web site  Ứng dụng kiến thức cấu trúc liệu, sở liệu, phân tích thiết kế hệ thống thông tin, hệ quản trị sở liệu MySQL vào đề tài Về mặt thực tiễn ứng dụng, đề tài đạt :  Tạo website review sách vận hành tốt môi trường Internet  Đáp ứng nhu cầu người sử dụng Tuy nhiên, đề tài tồn vấn đề sau: − Quá trình load liệu chưa tối ưu − Một số thiếu sót kiến thức NodeJS ExpressJS sinh viên HƯỚNG PHÁT TRIỂN Một số số hướng nghiên cứu phát triển đề tài sau: − Nghiên cứu chỉnh sửa design cho tiêu chuẩn UX, giúp người dùng dễ dàng sử dụng − Nghiên cứu phát triển thêm vài tính − Tìm hiểu tăng cường bảo mật website TÀI LIỆU THAM KHẢO Tiếng Việt [1] Phạm Hữu Đức (2005), Cơ sở liệu hệ thống thông tin địa lý GIS, Nhà xuất Xây dựng Tiếng Anh [2] Nodejs Application Developer’s Guide – MarkLogic [3] Web Development with Node and Express – Ethan Brown Internet [4] https://o7planning.org/vi/11931/huong-dan-nodejs-cho-nguoi-moi-bat-dau [5] http:// www.vre.cse.hcmut.edu.vn PHỤ LỤC Phần trình bày cách cài đặt cấu hình website lên mạng Internet hướng dẫn sử dụng (quản trị admin, chức phân quyền) Cách cài đặt (upload) lên mạng Inetrnet Cách sử dụng Hình 15: Giao diện trang chủ Hình 16: Giao diện form đăng nhập Hình 17: Giao diện đăng ký Hình 18: Giao diện xem sách Click vào mục sách Navigation (có thể viết đánh giá sách click vào button “Viết đánh giá”) Hình 19: Giao diện chi tiết sách (click vào button viết đánh giá để viết đánh giá) Hình 20: Giao diện click vào viết đánh giá (2 ảnh trên) Hình 21: Giao diện xem danh sách đánh giá (có thể click vào để xem chi tiết) Hình 22: Giao diện xem chi tiết đánh giá Hình 23: Giao diện up viết Hình 24: Giao diện xếp hạng đánh giá Hình 25: Quản lý đăng Hình 26: Quản lý tác giả Hình 27: Quản lý danh mục Hình 28: Quản lý sách Hình 29: Quản lý thông tin cá nhân ... trang web chứa siêu liên kết vào trang web khác, đó, phân biệt trang web cá nhân, cảm nhận người sử dụng Tạm thời phân loại sau: • Trang web cá nhân • Trang web thương mại • Trang web phủ • Trang. .. số trang web review sách  Lên danh sách công việc cần lầm, phân bổ công việc cho thành viên nhóm  Xây dựng database  Xây dựng web  Hoàn thành báo cáo 3.2 Kết triển khai  Sau triển khai trang. .. 1.1 Website 1.1.1 Khái nệm Website tập hợp trang web (web pages) bao gồm văn bản, hình ảnh, video, flash v.v thường nằm tên miền (domain name) tên miền phụ (subdomain) Trang web lưu trữ (web