Tìm hiểu và xây dựng ứng dụng SINGLE PAGE APPLICATION

Tìm hiểu và xây dựng ứng dụng SINGLE PAGE APPLICATION

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA KỸ THUẬT MÁY TÍNH - - TÌM HIỂU VÀ XÂY DỰNG ỨNG DỤNG SINGLE PAGE APPLICATION BÁO CÁO THỰC TẬP DOANH NGHIỆP Nhóm SV thực hiện: Trát Hoàng Trung Nguyên – 10520007 Nguyễn Thái Hà – 10520251 Phạm Bá Thành – 09520652 Lớp: KTMT05 Người hướng dẫn: Th.S Trần Thị Như Nguyệt Tp Hồ Chí Minh, ngày 12/09/2014 Tp Hồ Chí Minh ngày 12/09/2014 Tp Hồ Chí Minh ngày 12/09/2014 LỜI CẢM ƠN  “Đi ngày đàng, học sàng khôn” – Quá trình thực tập TMA giúp em chứng minh câu nói hoàn toàn đắn Thật vậy, có kiến thức, kĩ kinh nghiệm mà em học hỏi được, trau dồi làm việc thực tế Song, phủ nhận tầm quan trọng kiến thức mà em tiếp thu suốt năm qua ngồi ghế nhà trường Chính kiến thức tảng quý giá giúp em có nhìn tổng quát, khoa học tiếp thu kiến thức cách hiệu Chính lẽ đó, em muốn gởi đến lời tri ân sâu sắc đến toàn thể quý thầy cô Trường Đại Học Công Nghệ Thông Tin nói chung thầy cô Khoa Kĩ Thuật Máy Tính nói riêng, đặc biệt cô Trần Thị Như Nguyệt, người tận tâm tận lực giúp đỡ em suốt khóa thực tập, tạo điều kiện thuận lợi để em hoàn thành tốt công việc Em xin gởi lời cám ơn đến công ty TMA, giúp cho em có hội làm việc môi trường thực tế chuyên nghiệp, áp dụng điều học vào thực tiễn sống Đồng thời, em muốn cảm ơn đến anh Nguyễn Thanh Bình toàn thể bạn nhóm nỗ lực làm việc suốt thời gian qua Mặc dù cố gắng trình thực tập, nhiên, chắn em tồn nhiều thiếu sót Vì vậy, kính mong quý thầy cô cho em nhận xét khách quan, chân thực để từ em hoàn thiện Những lời góp ý từ phía thầy cô hành trang quý báu để em tự tin vững bước vào đời Đại diện nhóm Sinh viên thực tập Trát Hoàng Trung Nguyên ĐÁNH GIÁ KẾT QUẢ THỰC TẬP CỦA KHOA TP HCM, ngày … tháng … năm ……… Giảng viên hướng dẫn (Ký ghi rõ họ tên) MỤC LỤC DANH MỤC BẢNG DANH MỤC HÌNH 1 LỊCH LÀM VIỆC TẠI NƠI THỰC TẬP 2 GIỚI THIỆU VỀ CÔNG TY TMA SOLUTIONS NỘI DUNG NHIỆM VỤ CHÍNH ĐƯỢC GIAO 3.1 Tìm hiểu công nghệ 3.2 Thực Demo 3.3 Thực Project NỘI DUNG CÁC CÔNG VIỆC VÀ KẾT QUẢ ĐẠT ĐƯỢC 4.1 Nội dung công việc 4.2 Kết đạt 4.2.1 Single Page Application (SPA) 4.2.2 Các mô hình phát triển web 10 4.2.3 Angularjs 14 4.2.4 Nodejs 18 4.2.5 NoSQL + MongoDB 22 4.2.6 Demo Nodejs+Express+Jade+MongoDB 26 4.2.7 Project chính: Xây dựng Web Internship 27 KẾT QUẢ ĐẠT ĐƯỢC QUA KHOÁ THỰC TẬP 32 5.1 Kiến thức 32 5.2 Kỹ 32 5.3 Kinh nghiệm 32 TÀI LIỆU THAM KHẢO 33 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) DANH MỤC BẢNG Bảng - Thời gian biểu tuần thực tập công ty Bảng - Giới thiệu công ty DANH MỤC HÌNH Hình - Nhiệm vụ Database, Server Client 10 Hình - Mô hình Front Controller 11 Hình - Mô hình MVC 12 Hình - Mô hình Spring MVC 13 Hình - Data Binding 16 Hình - Threading truyền thống 20 Hình - Threading Nodejs 20 Hình - Demo Nodejs+Express+Jade+MongoDB 26 Hình - Database Web Internship 28 Hình 10 - Giao diện ứng dụng 28 Hình 11 - Giao diện hiển thị viết trang “Công ty” 29 Hình 12 - Một viết trang “Công ty” 30 Hình 13 - Giao diện trang “Đăng tin” 30 Hình 14 - Giao diện Đăng nhập 31 Hình 15 - Giao diện Đăng kí 31 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) LỊCH LÀM VIỆC TẠI NƠI THỰC TẬP - Công ty thực tập : TMA Solutions - Phòng làm việc thực tập : SDC Room - Lầu tòa nhà TMA Tower – Đường số 2, Công viên phần mềm Quang Trung – Phường Tân Chánh Hiệp, Quận 12 - Người hướng dẫn: Nguyễn Thanh Bình - Lịch làm việc nơi thực tập : - Giai đoạn 1: (Từ 21/07/2014 đến 31/08/2014)  Thứ hai: Cả ngày  Thứ năm: Buổi sáng  Thứ sáu: Cả ngày - Giai đoạn 2: (Từ 01/09/2014 đến 10/10/2014)  Thứ hai: Cả ngày  Thứ tư: Cả ngày  Thứ sáu: Buổi sáng Tham gia Toastmaster (CLB Tiếng Anh) vào sáng thứ sáu hàng tuần Tham gia buổi Seminar công ty (Quy trình phát triển phần mềm, Kĩ làm việc nhóm, Mô hình Scrum…) theo lịch công ty Thời gian Tuần (21/07 – 27/07) Tuần (28/07 – 03/08) Tuần (04/08 – 10/8) - Nội dung Tìm hiểu Single Page Application (SPA) Tìm hiểu Modern web Tìm hiểu 10 Framework thông dụng Tìm hiểu mô hình phát triển web Tìm hiểu Asynchronous Module Definition (AMD) + Vaadin Tìm hiểu Google Web Toolkit (GWT) Tìm hiểu Angularjs Tìm hiểu Nodejs Tìm hiểu NoSQL + MongoDB Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Tuần - Demo Nodejs + Express + Jade + MongoDB (11/08 – 17/08) Tuần - Ý tưởng cho Project (18/08 – 24/08) Tuần - Thiết kế giao diện, cấu trúc, CSDL cho Project (25/8 – 31/8) Tuần – 10 - Lập trình chức Project (1/9 – 28/9) Tuần 11 - Tiến hành liên kết phần (29/09 – 5/10)- Kiểm thử - Sửa lỗi Tuần 12 - Chuẩn bị báo cáo (6/10 – 12/10)- Báo cáo trước hội đồng công ty Bảng - Thời gian biểu tuần thực tập công ty Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) GIỚI THIỆU VỀ CÔNG TY TMA SOLUTIONS Công ty TMA Solutions (Tên tiếng việt: Tường Minh) thành lập năm 1997 nhanh chóng trở thành công ty phần mềm hàng đầu Việt Nam với tốc độ tăng trưởng trung bình hàng năm 50% Mục tiêu TMA trở thành tập đoàn công nghệ cao hàng đầu góp phần đưa tên Việt Nam vào đồ gia công phần mềm giới - Là công ty phần mềm có quy mô lớn Tp.HCM thứ hai Việt Nam với 1,500+ kỹ sư - năm liền đạt huy chương vàng xuất phần mềm - Công ty phần mềm viễn thông hàng đầu Đông Nam Á - Được công ty hàng đầu giới tin tưởng hợp tác lâu dài: Avaya, IBM, Alcatel-Lucent, Nortel, Juniper Networks, Flextronics, Genband, NTT, Toshiba, Andrew, Telus, NEC, etc - Được nhiều đài truyền hình báo chí quốc tế giới thiệu: CNN (Mỹ), NHK (Nhật), Global (Brazil), National (Thái Lan), Nikkei Computer (Nhật) để minh chứng cho phát triển ngành phần mềm Việt Nam - Chứng minh lực kỹ sư Việt Nam lĩnh vực công nghệ cao Tên công ty Sở hữu Trụ sở Dịch vụ     Công nghệ  Tường Minh (TMA Solutions) 100% Việt Nam - sở TP.HCM - văn phòng đại diện nước (Canada, Mỹ, Châu Âu, Nhật Bản, Australia) - Dịch vụ giải pháp phần mềm - Dịch vụ kỹ thuật: triển khai kiểm tra mạng viễn thông, thiết kế xây dựng hệ thống mạng, giải pháp bảo mật, - Đào tạo chuyên ngành cho kỹ sư CNTT viễn thông - Viễn thông mạng: PBX, call center software, soft switch, IMS, SIP, VoIP, Asterisk, broadband/security router, firewall, network management software, NGN - Phần mềm nhúng di động: VxWorks, RT-Linux, Symbian, Windows Mobile, J2ME, iPhone, SMS, WML Tìm hiểu xây dựng ứng dụng Single Page Application (SPA)  - Đội ngũ sư kỹ- Quy trình chất lượng - Phần mềm ứng dụng cho doanh nghiệp: dựa công nghệ Microsoft mã nguồn mở - Hơn 1500+ kỹ sư - 90% có đại học, 10% có thạc sĩ tiến sĩ - Hơn 1/3 kỹ sư có năm kinh nghiệm làm việc - 40% kỹ sư có kinh nghiệm học tập làm việc nước - Tiếng Anh ngôn ngữ giao tiếp công việc Những ngôn ngữ khác: Tiếng Nhật, Tiếng Pháp, Tiếng Hoa ISO 9001:2000 TL 9000 CMMI-L5 Bảng - Giới thiệu công ty Nguồn: http://www.tmasolutions.com/about-us.aspx Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) NỘI DUNG NHIỆM VỤ CHÍNH ĐƯỢC GIAO Trong trình thực tập, có nhiệm vụ chính: 3.1 Tìm hiểu công nghệ  Single Page Application (SPA)  Modern Web (HTML5, CSS3, Responsive Web)  10 Framework thông dụng  Các mô hình phát triển web (Front Controller, MVC, Spring MVC )  Asynchronous Module Definition (AMD) + Vaadin  Google Web Toolkit (GWT)  Angularjs  Nodejs  NoSQL + MongoDB 3.2 Thực Demo Đối với công nghệ, nhóm thực demo tương ứng:  Demo Single Page Application (SPA)  Demo Asynchronous Module Definition (AMD) + Vaadin  Demo Google Web Toolkit (GWT)  Demo Nodejs + Express + Jade + MongoDB 3.3 Thực Project Sau trình thảo luận, nhóm chọn project “Xây dựng Web Internship” đồng ý anh Bình - người hướng dẫn nhóm công ty TMA  Tổng quan Web Internship: Web Internship ứng dụng Web SPA, cầu nối sinh viên doanh nghiệp việc tìm kiếm công việc thực tập Cụ thể, ứng dụng cho phép sinh viên tạo viết cá nhân, đăng thông tin giới thiệu thân đến doanh nghiệp tuyển dụng Đồng thời, ứng dụng cho phép doanh nghiệp tạo viết, đăng tin tuyển dụng Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) JavaScript API thống cho I / O, điều cho phép nhà phát triển suy nghĩ cách tốt để thực giao diện I / O đại Trong Node.js, thực tế tất I / O thực cách không đồng không ngăn chặn, kết hợp với vòng lặp dựa kiện đơn luồng, trình bày cách để thực ứng dụng web thời gian thực Node.js giữ nhiều kết nối tồn mà không cần phải từ chối kết nối đến Node.js bị ảnh hưởng mô hình khác, chẳng hạn Ruby Event Machine Python’s Twisted Node.js xây dựng mô hình này, thêm vào cung cấp vòng lặp kiện ngôn ngữ thay thư viện Không giống mô hình truyền thống, sử dụng blocking call, Node.js event-loop call Thay vào đó, Node.js vào vòng lặp sau thực script, dựa cách làm việc JavaScript Ruby’s Mongrel Web Server nguồn cảm hứng cho Dahl Ứng dụng Node.js thường chạy đơn luồng, việc khởi chạy đa luồng hỗ trợ Node.js 0.10+ từ JXcore Node.js dựa thực thi đơn luồng, Node.js sử dụng đa luồng cho tập tin network event Node.js thể biên dịch cục tải nhị phân tiền biên dịch Các ứng dụng thực từ dòng lệnh với lệnh: "node js"  Threading: Những kĩ thuật Web-serving truyền thống yêu cầu kết nối (yêu cầu) để tạo luồng mới, chiếm RAM hệ thống cuối chiếm dụng tối đa số lượng RAM có sẵn Node.js khác Nó hoạt động luồng đơn, sử dụng nonblocking I / O, cho phép hỗ trợ hàng chục ngàn kết nối đồng thời, mà không lo lắng giới hạn nhớ RAM chi phí context-switching luồng Việc thiết kế luồng dùng chia sẻ tất yêu cầu có nghĩa sử dụng để xây dựng ứng dụng đồng thời Mục đích xây dựng ứng dụng Node.js chức thực I / O phải sử dụng callback 19 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Hình - Threading truyền thống Hình - Threading Nodejs 20 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA)  V8: V8 engine thực thi mã JavaScript xây dựng cho Google Chrome, mã nguồn mở Google năm 2008 viết C ++ V8 biên dịch mã nguồn JavaScript thời gian để mã máy thay thông dịch thời gian thực Node.js chứa libuv để xử lý kiện không đồng V8 cung cấp run-time cho JavaScript Libuv lớp trừu tượng cho hệ thống mạng hệ thống tập tin chức Windows hệ thống dựa POSIX Linux, Mac OS X Unix Các chức Node.js nằm thư viện JavaScript Các ràng buộc Node.js, viết C ++, lớp keo kết nối công nghệ với với hệ điều hành  Quản lý gói: Npm phần mềm quản lý gói cài đặt sẵn tảng máy chủ Node.js Nó sử dụng để cài đặt chương trình Node.js từ npm registry Bằng cách tổ chức trình cài đặt quản lý chương trình Node.js bên thứ ba, giúp nhà phát triển xây dựng nhanh npm không giống với câu lệnh require() commonJS Nó không sử dụng để load code: thay vào đó, sử dụng để cài đặt code quản lý code phụ thuộc từ dòng lệnh Các gói tìm thấy npm registry từ thư viện trợ giúp đơn giản underscore.js task runner grunt.js  API thống nhất: Node.js kết hợp với trình duyệt, document DB (chẳng hạn MongoDB CouchDB) JSON cung cấp stack phát triển JavaScript thống Với quan tâm tăng lên từ client-framework thích nghi mô hình phát triển phía máy chủ MVC, MVP, MVVM, vv, Node.js cho phép tái sử dụng mô hình dịch vụ giao diện tương tự máy khách máy chủ  Vòng lặp kiện: Node.js đăng ký với hệ điều hành, đó, thông báo kết nối thực Khi kết nối thực hiện, hệ điều hành phát hành 21 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) callback Trong thời gian chạy Node.js, kết nối heap nhỏ Theo cách truyền thống, OS, tiến trình luồng xử lý kết nối Node.js, nhiên, sử dụng vòng lặp kiện, thay tiến trình hay luồng, quy mô đến hàng triệu kết nối xảy lúc Ngược lại với máy chủ hướng kiện khác, vòng lặp kiện Node.js không cần phải gọi cách rõ ràng Thay vào callback xác định, máy chủ tự động vào vòng lặp kiện vào giai đoạn cuối callback definition Node.js thoát khỏi vòng lặp kiện callbacks để thực 4.2.5 NoSQL + MongoDB  NoSQL: Một NoSQL hay Not Only SQL cung cấp chế cho việc lưu trữ truy xuất liệu mô phương tiện khác so với mối quan hệ bảng sử dụng sở liệu quan hệ Động lực cho cách tiếp cận bao gồm đơn giản việc thiết kế, mở rộng theo chiều ngang kiểm soát tốt tính sẵn sàng Cấu trúc liệu (ví dụ key-value, graph document) khác với RDBMS, số hoạt động nhanh NoSQL số RDBMS Có khác biệt, việc sử dụng NoSQL DB phụ thuộc vào vấn đề phải giải Cơ sở liệu NoSQL ngày sử dụng big data ứng dụng web thời gian thực Những hệ thống NoSQL gọi “Not only SQL” để nhấn mạnh chúng hỗ trợ ngôn ngữ truy vấn giống SQL Nhiều NoSQL thỏa hiệp lưu trữ thống (theo nghĩa định lý CAP) để tăng tính sẵn sàng khả chịu lỗi phân vùng Rào cản việc áp dụng nhiều lưu trữ NoSQL bao gồm việc sử dụng ngôn ngữ truy vấn cấp thấp, thiếu giao diện chuẩn hóa, đầu tư lớn SQL có Hầu hết lưu trữ NoSQL thiếu giao dịch ACID thật sự, vài hệ thống gần đây, chẳng hạn FairCom c-treeACE, Google Spanner FoundationDB, sử dụng chúng cho thiết kế họ 22 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Phân loại dựa mô hình liệu: - Column: Accumulo, Cassandra, Hbase… - Document: Clusterpoint, Couchdb, MongoDB… - Key-Value: Dynamo, FoundationDB, MemcacheDB… - Graph: Allegro, Neo4J, OrientDB…  MongoDB MongoDB (từ "khổng lồ") sở liệu hướng document đa tảng Được phân loại sở liệu NoSQL, MongoDB tránh cấu trúc sở liệu quan hệ dựa bảng truyền thống, ủng hộ document kiểu JSON với lược đồ động (MongoDB gọi định dạng BSON), làm cho việc tích hợp liệu số loại ứng dụng dễ dàng nhanh Được phát hành kết hợp GNU Affero General Public License Apache License, MongoDB phần mềm miễn phí mã nguồn mở Đầu tiên phát triển công ty phần mềm 10gen (tại MongoDB Inc) tháng 10 năm 2007 phần tảng kế hoạch sản phẩm dịch vụ, công ty chuyển sang mô hình phát triển mã nguồn mở năm 2009, với 10gen cung cấp hỗ trợ thương mại dịch vụ khác Kể từ đó, MongoDB áp dụng phần mềm phụ trợ số trang web dịch vụ lớn, bao gồm Craigslist, eBay, Foursquare, SourceForge, Viacom, tờ New York Times, số công ty khác MongoDB hệ thống sở liệu NoSQL phổ biến Các tính chính: - Document-Oriented: Thay dùng đối tượng kinh doanh chia nhỏ thành nhiều cấu trúc quan hệ, MongoDB lưu trữ đối tượng kinh doanh số lượng tối thiểu document Ví dụ, thay lưu trữ tiêu đề thông tin tác giả hai cấu trúc quan hệ khác nhau, tiêu đề, tác giả, thông tin khác liên quan đến tiêu đề lưu trữ document 23 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) gọi Sách, trực quan nhiều thường dễ dàng để làm việc - Truy vấn Ad hoc: MongoDB hỗ trợ tìm kiếm theo trường, truy vấn theo phạm vi, tìm kiếm biểu thường xuyên Các câu truy vấn trả trường cụ thể document bao gồm chức JavaScript người dùng định nghĩa - Chỉ mục: Bất kỳ trường document MongoDB lập mục (chỉ số MongoDB khái niệm tương tự RDBMSes) Chỉ số thứ cấp tồn - Nhân rộng: MongoDB cung cấp tính sẵn sàng cao với Một tập bao gồm hai nhiều liệu Mỗi thành viên tập đóng vai trò hay phụ lúc Bản thực tất viết đọc theo mặc định Bản thứ cấp trì liệu cách sử dụng nhân tích hợp Khi bị lỗi, tự động thực trình bầu cử để xác định thứ cấp trở thành Những thứ cấp thực hoạt động đọc, liệu cuối phù hợp theo mặc định - Cân tải: MongoDB mở rộng theo chiều ngang sử dụng sharding Người dùng chọn shard key, định cách liệu collection phân phối Dữ liệu chia thành phạm vi (dựa shard key) phân phối nhiều shard (Một shard master với nhiều slave.) MongoDB chạy nhiều máy chủ, cân tải / chép liệu để giữ cho hệ thống chạy trường hợp lỗi phần cứng 24 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Cấu hình tự động dễ triển khai, máy thêm vào sở liệu chạy - Lưu trữ tập tin: MongoDB sử dụng hệ thống tập tin, lợi dụng cân tải tính nhân liệu nhiều máy tính để lưu trữ tập tin Chức gọi GridFS, bao gồm trình điều khiển MongoDB, sẵn có khó khăn cho ngôn ngữ phát triển (xem "Hỗ trợ ngôn ngữ" thấy danh sách ngôn ngữ hỗ trợ) MongoDB phơi bày nhiều chức cho thao tác tập tin nội dung dành cho nhà phát triển GridFS sử dụng, ví dụ, bổ sung cho NGINX lighttpd [10] Thay lưu trữ tập tin document nhất, GridFS chia file thành nhiều phần, khối, lưu trữ chúng document riêng biệt Trong hệ thống MongoDB nhiều máy, tập tin phân phối chép nhiều lần máy cách tường minh, tạo hệ thống cân tải chịu lỗi hiệu - Tổng hợp: MapReduce sử dụng để xử lý hàng loạt liệu tập hợp hoạt động Framework tổng hợp cho phép người dùng có loại kết giống câu truy vấn SQL GROUP BY sử dụng - Thực thi mã JavaScript máy chủ: JavaScript sử dụng truy vấn, chức tập hợp (như MapReduce), gửi trực tiếp đến sở liệu để thực - Capped Collections: MongoDB hỗ trợ collection kích thước cố định gọi Capped Collections 25 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Đây loại collection trì trật tự insert, đạt kích thước quy định, hoạt động hàng đợi tròn 4.2.6 Demo Nodejs+Express+Jade+MongoDB Đối với công nghệ, nhóm thực Demo tương ứng Tuy nhiên, khuôn khổ báo cáo thực tập, nhóm thông chọn demo tiêu biểu nhất, có liên quan mật thiết đến hầu hết công nghệ trình bày  Giới thiệu: Đây ứng dụng web xây dựng tảng Nodejs, sử dụng cấu trúc Express, với giao diện viết Jade (Một ngôn ngữ tương tự html đơn giản express hỗ trợ), dùng CSDL NoSQL MongoDB Hình - Demo Nodejs+Express+Jade+MongoDB 26 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA)  Giao diện: Giao diện chương trình gồm có phần: - Tiêu đề - Thông tin người dùng (Bao gồm Tên – Tuổi – Giới tính – Địa chỉ) - Danh sách người dùng (Bao gồm Tên người dùng, Email, Nút “Xóa”) - Thêm người dùng (Bao gồm Textbox tương ứng, Nút “Thêm”)  Chức năng: Các chức ứng dụng gồm: - Thêm người dùng - Hiển thị danh sách người dùng có - Xóa người dùng - Hiển thị thông tin chi tiết người dùng click vào tên người dùng tương ứng danh sách Tất thao tác thêm, xóa người dùng đọc thông tin người dùng cập nhật CSDL MongoDB Mặc dù demo đơn giản, tiền đề để nhóm em tiếp tục ứng dụng vào Project chính, xây dựng hệ thống Backend (Controller + Model) 4.2.7 Project chính: Xây dựng Web Internship  Phân tích thiết kế CSDL: CSDL ứng dụng gồm bảng: - Table Student: Lưu trữ thông tin sinh viên - Table Company: Lưu trữ thông tin doanh nghiệp - Table Job: Lưu trữ thông tin công việc thực tập - Table Job_Status: Lưu trữ tình trạng công việc thực tập (Còn tuyển hay kết thúc, số lượng tuyển…) - Table User_Display: Lưu trữ thông tin user hiển thị user đăng nhập - Table Topic_Student: Lưu trữ viết sinh viên 27 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) - Table Topic_Company: Lưu trữ tin tuyển dụng doanh nghiệp Mối liên hệ bảng thể theo sơ đồ bên dưới: Hình - Database Web Internship  Giao diện ứng dụng Hình 10 - Giao diện ứng dụng 28 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Giao diện ứng dụng chia thành phần chính:  Menu Bar: Gồm thẻ - Home: Trở trang chủ ứng dụng - Searchbar: Tìm kiếm viết dựa keywords - Công ty: Liên kết đến trang chứa viết, tin tuyển dụng công ty - Sinh viên: Liên kết đến trang chứa viết sinh viên - Đăng tin: Tạo viết - Login: Đăng nhập - Logout: Đăng xuất  User Display: Hiển thị thông tin cá nhân tóm tắt user sau đăng nhập - Ảnh đại diện - Tên - Trường - Khoa - Chỉnh sửa (Dùng để chỉnh sửa thông tin cá nhân trên)  Content Display: Hiển thị nội dung Hình 11 - Giao diện hiển thị viết trang “Công ty” 29 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Hình 12 - Một viết trang “Công ty” Hình 13 - Giao diện trang “Đăng tin” 30 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Hình 14 - Giao diện Đăng nhập Hình 15 - Giao diện Đăng kí 31 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) KẾT QUẢ ĐẠT ĐƯỢC QUA KHOÁ THỰC TẬP 5.1 Kiến thức  Có kiến thức tảng thiết kế xây dựng ứng dụng web SPA  Cách cài đặt, sử dụngt công cụ liên quan trình phát triển ứng dụng SPA( Angularjs, Nodejs, MongoDB….)  Hiểu biết mô hình phát triển web thông dụng  Hiểu biết công nghệ phát triển web đại 5.2 Kỹ  Tham gia buổi training kỹ làm việc, kỹ mềm: vấn, giao tiếp,  Nâng cao trình độ Anh ngữ, khả thuyết trình (Chương trình Toastmaster)  Cải thiện khả làm việc nhóm, phân chia công việc hiệu thành viên  Quản lí thời gian 5.3 Kinh nghiệm  Kinh nghiệm lập trình ứng dụng web SPA theo mô hình MVC  Kinh nghiệm làm việc nhóm môi trường làm việc đại chuyên nghiệp doanh nghiệp  Kinh nghiệm lập kế hoạch làm việc  Định hướng nghề nghiệp thân tương lai 32 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) TÀI LIỆU THAM KHẢO  Single Page Web Applications - Michael S Mikowski & Josh C Powell  Angularjs - http://en.wikipedia.org/wiki/AngularJS  Nodejs - http://en.wikipedia.org/wiki/Node.js  MongoDB - http://en.wikipedia.org/wiki/MongoDB 33 ... yêu cầu có nghĩa sử dụng để xây dựng ứng dụng đồng thời Mục đích xây dựng ứng dụng Node.js chức thực I / O phải sử dụng callback 19 Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Hình... dung Tìm hiểu Single Page Application (SPA) Tìm hiểu Modern web Tìm hiểu 10 Framework thông dụng Tìm hiểu mô hình phát triển web Tìm hiểu Asynchronous Module Definition (AMD) + Vaadin Tìm hiểu. .. (AMD) + Vaadin Tìm hiểu Google Web Toolkit (GWT) Tìm hiểu Angularjs Tìm hiểu Nodejs Tìm hiểu NoSQL + MongoDB Tìm hiểu xây dựng ứng dụng Single Page Application (SPA) Tuần - Demo Nodejs + Express