ĐẠ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: 1. Trát Hoàng Trung Nguyên – 10520007 10520007 – 10520251 2. Nguyễn Thái Hà 10520251 3. Phạm Bá Thành – 09520652 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
LỜI CẢM ƠN
“Đi một ngày đàng, học một sàng khôn” – Quá – Quá trình thực tập ở TMA đã giúp em chứng minh được câu nói trên là hoàn toàn đúng đắn. Thật vậy, có những kiến thức, kĩ năng và kinh nghiệm mà em chỉ có thể học hỏi được, trau dồi được khi làm việc thực tế. Song, cũng không thể phủ nhận tầm quan trọng của những kiến thức mà em đã tiếp thu
trong suốt 4 năm qua khi còn ngồi trên ghế nhà trường. Chính những kiến thức nền tảng quý giá ấy đã giúp em có một cái nhìn tổng quát, khoa học cũng như tiếp thu những kiến thức mới một cách hiệu quả hơn. Chính vì lẽ đó, đầu tiên 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 và thầy cô Khoa Kĩ Thuật Má y Tính nói riêng, đặc biệt là cô Trần Thị Như Nguyệt, người đã tận tâm tận lực giúp đỡ em trong suốt khóa thực tập, tạo mọi điều kiện thuận lợi để em hoàn thành tốt công việc của mình. Em cũng xin gởi lời cám ơn đến công ty TMA, đã giúp cho em có cơ hội được làm việc trong môi trường thực tế chuyên nghiệp, được áp dụng những điều đã học vào thực tiễn cuộc sống. Đồng thời, em cũng muốn cảm ơn đến anh Nguyễn Thanh Bình và toàn thể các bạn trong nhóm đã nỗ lực làm việc cùng nhau trong suốt thời gian qua. Mặc dù đã rất cố gắng trong quá trình thực tập, tuy nhiên, chắc chắn em vẫn còn tồn tại nhiều thiếu sót. Vì vậy, kính mong quý thầy cô cho em những nhận xét khách quan, chân thực để từ đó em hoàn thiện mình hơn. Những lời góp ý từ phía thầy cô cũng chính là hành trang quý báu 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ý và ghi rõ họ tên)
MỤC LỤC DANH MỤC BẢNG...................................................................................................... ............ 1 DANH MỤC HÌNH .................................................................................................................. 1 1. LỊCH LÀM VIỆC TẠI NƠI THỰC TẬP ...................................................................... 2 2. GIỚI THIỆU VỀ CÔNG TY TMA SOLUTIONS ........................................................ 4 3. NỘI DUNG NHIỆM VỤ CHÍNH ĐƯỢC GIAO ........................................................... 6 3.1. Tìm hiểu các công nghệ ................................................................................................... 6 3.2. Thực hiện Demo .............................................................................................................. 6 3.3. Thực hiện Project chính .................................................... ............................................... 6 4. NỘI DUNG CÁC CÔNG VIỆC VÀ KẾT QUẢ ĐẠT ĐƯỢC ...................................... 8 4.1. Nội dung các công việc ..................................................... ............................................... 8 4.2. Kết quả đạt được .............................................................................................................. 8 4.2.1. Single Page Application (SPA).................................................... ............................. 8
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 5. KẾT QUẢ ĐẠT ĐƯỢC QUA KHOÁ THỰC TẬP .................................................... . 32 5.1. Kiến thức ..................................................................................................... ................... 32 5.2. Kỹ năng ....................................................................................................... ................... 32 5.3. Kinh nghiệm .................................................................................................................. 32 6. TÀI LIỆU THAM KHẢO .............................................................................................. 33
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
DANH MỤC BẢNG Bảng 1 - Thời gian biểu các tuần thực tập tại công ty ..................................................... 3 Bảng 2 - Giới thiệu công ty ..............................................................................................5
DANH MỤC HÌNH Hình 1 - Nhiệm vụ của Database, Server và Client ....................................................... 10 Hình 2 - Mô hình Front Controller . ................................................................................ 11 Hình 3 - Mô hình MVC. ................................................................................................. 12 Hình 4 - Mô hình Spring MVC ......................................................................................13 Hình 5 - Data Binding .................................................................................................... 16 Hình 6 - Threading truyền thống. ................................................................................... 20 Hình 7 - Threading trong Nodejs ...................................................................................20 Hình 8 - Demo Nodejs+Express+Jade+MongoDB........................................................26 Hình 9 - Database của Web Internship .......................................................................... 28 Hình 10 - Giao diện của ứng dụng .................................................................................28 Hình 11 - Giao diện hiển thị bài viết khi ở trang “Công ty” ..........................................29 Hình 12 - Một bài viết trong 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í mới . .................................................................................. 31
1
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) 1. 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 khi thực tập : SDC Room - Lầu 2 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 tại 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 các buổi Seminar của công ty (Quy trình phát triển phần mềm, Kĩ năng làm việc nhóm, Mô hình Scrum…) theo lịch của công ty
Thời gian Tuần 1 (21/07 – 27/07) Tuần 2 (28/07 – 03/08) Tuần 3 (04/08 – 10/8)
Nội dung Tìm hiểu về Single Page Application (SPA) Tìm hiểu về Modern web Tìm hiểu 10 Framework thông dụng Tìm hiểu các 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
2
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Tuần 4 Demo Nodejs + Express + Jade + MongoDB (11/08 – 17/08) Tuần 5 Ý tưởng cho Project chính (18/08 – 24/08) Tuần 6 Thiết kế giao diện, cấu trúc, CSDL cho Project chính (25/8 – 31/8) Tuần 7 – 10 Lập trình các chức năng của Project (1/9 – 28/9) Tiến hành liên kết các phần Tuần 11 Kiểm thử - Sửa lỗi (29/09 – 5/10) Chuẩn bị bài báo cáo Tuần 12 Báo cáo trước hội đồng công ty (6/10 – 12/10) Bảng 1 - Thời gian biểu các tuần thực tập tại công ty
3
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) 2. GIỚI THIỆU VỀ CÔNG TY TMA SOLUTIONS
Công ty TMA Solutions (Tên tiếng việt: Tường Minh) được thành lập năm 1997 và 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 là hơn 50%. Mục tiêu của TMA là trở thành tập đoàn công nghệ cao hàng đầu và góp phần đưa tên Việt Nam vào bản đồ gia công phần mềm thế giới. -
Là công ty phần mềm có quy mô lớn nhất Tp.HCM và thứ hai Việt Nam với trên 1,500+ kỹ sư.
-
7 năm liền đạt huy chương vàng xuất khẩu phần mềm.
-
Công ty phần mềm viễn thông hàng đầu Đông Nam Á.
-
Được các công ty hàng đầu thế giới tin tưởng và 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 và báo chí quốc tế giới thiệu: CNN (Mỹ), N HK (Nhật), Global (Brazil), National (Thái Lan), Nikkei Computer (Nhật) để minh chứng cho sự phát triển của ngành phần mềm của Việt Nam.
-
Chứng minh năng lực của kỹ sư Việt Nam trong lĩnh vực công nghệ cao. Tên công ty Tường Minh (TMA Solutions) 100% Việt Nam Sở hữu - 6 cơ sở ở TP.HCM - 5 văn phòng đại diện ở nước ngoài (Canada, Mỹ, Châu Âu, Nhật Trụ sở Bản, Australia) - Dịch vụ và giải pháp phần mềm. - Dịch vụ kỹ thuật: triển khai và kiểm tra mạng viễn thông, thiết kế và Dịch vụ xây dựng hệ thống mạng, giải pháp bảo mật,... chính - Đào tạo chuyên ngành cho kỹ sư CNTT và viễn thông. - Viễn thông và mạng : PBX, call center software, soft switch, IMS, Công nghệ
SIP, VoIP, Asterisk, broadband/security router, firewall, network management software, NGN - Phần mềm nhúng và di động : VxWorks, RT-Linux, Symbian, Windows Mobile, J2ME, iPhone, SMS, WML
4
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) - Phần mềm ứng dụng cho doanh nghiệp: dựa trên công nghệ
Microsoft và mã nguồn mở - Hơn 1500+ kỹ sư. - 90% có bằng đại học, 10% có bằng thạc sĩ hoặc tiến sĩ. Đội ngũ kỹ - Hơn 1/3 kỹ sư có ít nhất 5 năm kinh nghiệm làm việc. - 40% kỹ sư có kinh nghiệm học tập và làm việc ở nước ngoài. sư - Tiếng Anh là ngôn ngữ chính giao tiếp trong công việc. Những ngôn ngữ khác: Tiếng Nhật, Tiếng Pháp, Tiếng Hoa. Quy trình ISO 9001:2000 chất lượng TL 9000 và CMMI-L5 Bảng 2 - Giới thiệu công ty Nguồn: http://www.tmasolutions.com/about-us.aspx
5
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) 3. NỘI DUNG NHIỆM VỤ CHÍNH ĐƯỢC GIAO Trong quá trình thực tập, có 3 nhiệm vụ chính: 3.1. Tìm hiểu các 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
hiện Demo
Đối với từng công nghệ, nhóm thực hiện 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 hiện Project chính Sau quá trình thảo luận, nhóm đã chọn project “Xây dựng Web Internship” dưới sự đồng ý của anh Bình - người hướng dẫn nhóm tại công ty TMA .
Tổng quan Web Internship: Web Internship là một ứng dụng Web SPA, là cầu nối giữa sinh viên và doanh
nghiệp trong 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 bài viết cá nhân, đăng thông tin giới thiệu bản thân đến các doanh nghiệp tuyển dụng. Đồng thời, ứng dụng cũng cho phép các doanh nghiệp tạo bài viết, đăng tin tuyển dụng
6
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Ứng dụng này có sự phân cấp rõ ràng: Guest – Student – Company. Ứng dụng có thời gian hồi đáp rất nhanh nhờ áp dụng SPA . Ứng dụng gồm các chức năng: -
Đăng kí, đăng nhập, đăng xuất
-
Thay đổi/ Cập nhật thông tin user (Student/Company)
-
Xem thông tin các bài viết (Guest)
-
Tạo bài viết mới (Student/Company)
-
Tìm kiếm bài viết theo từ khóa
-
Liệt kê các bài viết của doanh nghiệp
-
Liệt kê các bài viết của sinh viên
7
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) 4. NỘI DUNG CÁC CÔNG VIỆC VÀ KẾT QUẢ ĐẠT ĐƯỢC 4.1. Nội dung các công việ c
Tìm hiểu về các công nghệ. Thực hiện Demo. Thực hiện Project chính. Báo cáo trước hội đồng của công ty. 4.2. K ết quả đạt đượ c
4.2.1. Single Page Application (SPA)
Single Page Application (SPA), hay còn gọi là Single Page Interface (SPI), là một web app hoặc là một website hiển thị vừa vặn trên 1 mặt trang web, với mục đích là giúp user có trải nghiệm giống như đang dùng ứng dụng trên desktop Là ứng dụng chạy bên trong trình duyệt, không yêu cầu phải reload lại toàn bộ trang web mỗi lần sử dung
Trong 1 SPA, hoặc là tất cả những code cần thiết – HTML, JavaScript và CSS, được lấy trong một lần load trang, hoặc những tài nguyên thích hợp sẽ được load động và thêm vào trang khi cần thiết, thường là đáp lại với những hoạt động của user . Trang sẽ không tự load lại tại bất kì thời điểm nào của tiến trình, cũng như không chuyển qua một trang khác, mặc dù những công nghệ modern web (như những công nghệ trên bao gồm HTML5) có thể cung cấp khả năng nhận thức và điều hướng đối với các trang rờ i rạc trong ứng dụng đó. Sự tương tác với single page application thường liên quan đến giao tiếp động với webserver Những trình duyệt hiện đại có khả năng phân tích HTML5 cho phép các developer thay đổi UI và application logic từ web server cho đến client. Những thư viện mã nguồn mở hỗ trợ xây dựng SPA mà không cần phải can thiệp quá sâu vào Javascript và đối mặt với các vấn đề về công nghệ Một số đặc điểm riêng biệt của Single Page Application chuyên nghiệp:
8
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Phân đoạn: Trang web được xây dựng bằng cách nạp các đoạn gồm các HTML fragment và dữ liệu JSON thay vì lấy toàn bộ HTML từ một webserver trong mỗi yêu cầu. (Backbone.js, pjax, jQuery, Upshot.js)
Controllers: JavaScript code xử lí các DOM phức tạp cũng như các thao tác dữ liệu, application logic, lời gọi AJAX sẽ đươc thay thế bằng các controllers – phân tách view và model sử dụng mô hình MVC hoặc MVVM. (Backbone.js, Knockout.js, JavaScriptMVC)
Khuôn mẫu: Lập trình các UI và thao tác DOM được thay thế bằng các khai báo ràng buộc dữ liệu đối với các temp late HTML (Knockout.js, Mustache, jQuery Templates, UnderScore.js)
Đinh tuyến: Các tập hợp gồm view và navigation (không cần nạp lại trang) giữ được trạng thái của trang, yếu tố và dữ liệu (History.js, Crossroad.js, Backbone.js, pjax, HTML5 History API)
Giao tiếp thời gian thực: Giao tiếp hai chiều gồm một ứng dụng client và
web server đươc thay thế bằng yêu cầu một chiều từ một trình duyệt (HTML5 Web Sockets, Socket.io, SignalR)
Lưu trữ cục bộ: Những khả năng lưu trữ dữ liệu trên một trình duyệt nhằm tăng hiệu năng và truy cập offline thay thế cho các cookie và việc nạp các dữ liệu chuyên sâu từ web server (HTML 5 Local storage)
9
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Hình 1 - Nhiệm vụ của Database, Server và Client 4.2.2. Các mô hình phát triển web
Mô hình thiết kế Front Controller: Mô hình thiết kế này thực thi một điểm duy nhất như là cổng vào cho tất cả
những yêu cầu gởi đến. Tất cả những yêu cầu được xử lí bởi một mảng code, sau đó có thể tiếp tục giao phó trách nhiệm xử lí các yêu cầu đến các object của ứng dụng
10
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Hình 2 - Mô hình Front Controller
Mô hình thiết kế MVC : Mô hình thiết kế này giúp chúng ta phát triển các ứng dụng giảm sự gắn kết
bằng cách cách ly các quan hệ thành các lớp khác nhau. Mô hình thiết kế MVC thực thi ứng dụng chia thành ba lớp: Model, View, và Controller : - Model: Tượng trưng cho dữ liệu của ứng dụng - View: Tượng trưng cho giao diện người dùng của ứng dụng. View sẽ lấy
Model như là một input của nó và biểu diễn chúng một cách thích hợp đến các người dùng cuối
11
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) - Controller: Controller chịu trách nhiệm xử lí yêu cầu, tạo ra model và lựa
chọn view thích hợp cho yêu cầu đó
Hình 3 - Mô hình MVC
Spring’s MVC Module : Spring’s MVC Module được dựa trên mô hình thiết kế Front controller kết hợp
với mô hình thiết kế MVC. Tất cả những yêu cầu gởi đến sẽ được xử lí bởi một single serlet có tên là DispatcherSerlet đóng vai trò như front controller trong Spring ‘s MVC module. DispatcherSerlet sau đó sẽ tham chiếu đến HandlerMapping để tìm một controller object thích hợp có khả năng xử lí yêu cầu. Tiếp theo DispatcherServlet sẽ gởi yêu cầu đến controller object để nó có thể thực hiện business logic để thỏa mãn
12
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) những yêu cầu của người dùng. (Controller có thể giao trách nhiệm cho các application object hay còn gọi là các service object). Controller sẽ trả về một object được đóng gói, chứa model object và view object (hoặc là một logic name của view). Trong Spring’s MVC, đối tượng đóng gói này được đại diện bởi lớp ModelAndView. Trong trường hợp ModelAndView chứa logical name của view, DispatcherServlet tham chiếu đến ViewResolver để tìm chính xác View object dựa trên logical name. DispatcherServlet sẽ giao model object cho view object để biểu diễn cho người dùng cuối
Hình 4 - Mô hình Spring MVC
13
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
4.2.3. Angularjs
Angularjs là một web application mã nguồn mở, được duy trì bởi Google và cộng đồng, hỗ trợ thiết kế Single -Page Application (SPA), Web Application đơn trang chỉ yêu cầu HTML, CSS và JavaScript ở phía client. Mục tiêu của nó là để tăng cường khả năng của web application với mô hình model -view-controller (MVC), nhằm đảm
bảo việc phát triển cũng như kiểm thử trở nên dễ dàng hơn Thư viện đọc trong HTML trong đó có các thuộc tính custom tag; sau đó nó tuân theo các directives trong những thuộc tính tùy biến, và liên kết input hay output các phần của trang đến một model đại diện bởi các biến JavaScript tiêu chuẩn. Các giá trị của các biến JavaScript có thể được thiết lập bằng tay, hoặc lấy từ nguồn JSON tĩnh hay động. Những đặc điểm chính của Angurlarjs:
Scope:
Scope là một khái niệm gần như là app domain. Nó phát hiện ra sự thay đổi của các model objects và tạo ra context để thực thi sự thay đổi, tác động đó. Trong AngularJS, Root scope là application scope (ng -app) chứa các child scopes. Nó quản lý sự thay đổi của model và báo cho view, ngoài ra nó còn chuyển các events cho controller xữ lý Application Domain (viết tắt AppDomain, đây cũng là tên lớp tương ứng trong .Net) có mục đích tạo một môi trường cách ly nằm bên trong một process, tương tự như các process hoạt động trong cùng một hệ điều hành. Bạn có thể sử dụng AppDomain để nạp các assembly và thực thi các tác vụ một cách riêng biệt trong cù ng process.
MVC : Model, View, Controller:
Controller có nhiệm vụ khởi tạo, xây dựng các Model vào kết nối chúng với các View (HTML). Các scopes đứng giữa controllers và views. Khi lập trình, code ở bên trong controller cần phải thật sự sáng sũa và chỉ xữ lý nhưng business logic cần thiết cho view. Trong AngularJS, Controllers có thể thừa kế. Một điểm khác biệt rất lớn
14
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) giữa AngularJS và các Javascript framework khác là Controller không xữ lý DOM. Và bạn cần thật sự chú ý đến điều này. Model chỉ đơn giản là một Javasctipt Object. Không cần phải extend hay tạo ra bất kỳ một structure nào. Và nó cho phép các Model có thể lồng vào nhau. View được xây dựng dựa trên các DOM objects, không dựa trên strings. Và view chính là HTML. Ngôn ngữ cho Web UI. View của AngularJS đặc biệt ở chổ là nó cho phép có nhiều Views trên một Controller.
Services:
AngularJS service là một object hoặc một function phụ trách một tác vụ nào đó. Việc viết service chỉ là việc gom các đoạn xử lý logic vào object hoặc function để dễ quản lý hơn. Cũng giống như mô hình MVC tách phần xử lý, điều hướng và hiển thị riêng biệt. Trong AngularJS service sẽ chứa tất cả các phần xử lý, Controller nhận yêu cầu và gọi các service cần thiết để xử lý, Model handle dữ liệu từ các control, View hiển thị dữ liệu, Route điều hướng request tới controller. Services trong AngularJS được thiết kế theo singletons(tập hợp có 1 phần tử) để xữ lý các tác vụ phổ biến cho một web application. Nếu bạn muốn chia sẽ các chức năng giữa các Controllers, có thể sử dụng Services. Được xây dựng sẵn trong AngularJS. Services bắt đầu bằng một dấu $, và có nhiều cách để xây dựng một Service: Service API, Factory API, hoặc $provide API.
Data Binding:
Data Binding trong AngularJS được triển khai theo two -way binding giữa View và Model. Việc đồng bộ tự động giữa Views và Data Model khiến cho AngularJS cực kỳ dễ sử dụng và rỏ ràng. Việc cập nhật Data giữa Views và Model được thực hiện mà không cần bất kỳ một dòng code Javascript nào để binding hay event listeners để lắng nghe.
15
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Hình 5 - Data Binding
Directives:
AngularJS cho phép bạn sử dụng Directives để thay đổi các DOM hoặc tạo ra các behavior mới. Một directive cho phép bạn extend HTML rất uyển chuyển. ng là prefix chuẩn của AngularJS. App (ng-app), Model (ng-model), Controller (ngcontroller)… được xây dựng sẵn với AngularJS. Bạn vẫn có thể tạo tự tạo thêm các Directive của bạn, nó không quá khó nhưng cũng không dễ. Những thứ như thuộc tính, class, tên ... của 1 DOM element gọi chung là directive. AngularJ S sẽ dựa vào chúng để attach các chỉ thị hoặc các sự kiện tới DOM
element đó. Bản thân AngularJS đã có rất nhiều các directive : ng-bind, ng-model, ngclick, ng-controller...
16
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Việc dùng directive sẽ giảm thiểu được số lượng thẻ HTML , code HTML nhìn sẽ gọn gàng và sáng sủa hơn. AngularJS cung cấp cho chúng ta 3 loại directive đó là : - Directive dạng element ( là 1 thẻ HTML ) viết tắt là E. - Directive dạng attribute ( thuộc tính của 1 thẻ HTML ) viết tắt là A, dạng này
là mặc định. - Directive dạng class( class CSS ) viết tắt là C.
Filters: - Filter dùng để chuyển đổi và địng dạng dữ liệu - Lọc các kết quả - Những filter được tích hợp sẵn trong Angularjs: - Currency, date, json, limit to, lowercase, uppercase, order by, number…
Validation:
AngularJS có một vài built -in validation để validations các biến HTML5 và một vài directive. Nếu bạn muốn xây dựng một Build -in validations. Bạn có thể dễ dàng xây dựng nó tương tự như Directive.
Testable
Kiểm thử là một công việc quan trọng trong quy trình phát triển phần mềm . Có rất nhiều cách để viết và chạy kiểm thử cho JavaScript. Kiểm thử với AngularJS có thể dễ dàng được thực hiện bằng việc sử dụng Jasmine Testacular . Việc viết test có vẻ không gây hứng thú. Tuy nhiên, nó là một phần cực kỳ quan trọng của việc phát triển phần mềm
Routing
Route là bộ điều hướng các request từ phía người dùng tới các controller tương ứng để xử lý dựa theo các params truyền trên thanh url. Trong AngularJs chúng ta sẽ sử dụng $routeProvider để handle các request. Biểu thức route được tính từ sau dấu #.
17
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
4.2.4. Nodejs Node.js là một môi trường thời gian thực đa nền tảng cho phía server và các ứng
dụng mạng . Ứng dụng Node.js được viết bằng JavaScript, và có thể chạy Node.js runtime trên OS X, Windows và Linux không có khác biệt .
Ứng dụng Node.js được thiết kế để tối đa hóa thông lượng và hiệu quả, sử dụng non- blocking I / O và các sự kiện không đồng bộ. Nó thường được sử dụng cho các
ứng dụng thời gian thực do bản chất không đồng bộ của nó. Node.js nội bộ sử dụng engine V8 JavaScript của Google để thực thi mã, và một tỷ lệ lớn các module cơ bản
được viết bằng JavaScript. Node.js tích hợp thư viện I / O không đồng bộ cho tập tin , socket, và truyền thông HTTP , cho phép các ứng dụng hoạt động như một máy chủ
web mà không cần phần mềm như Apache HTTP Server hoặc IIS. Node.js dần trở thành sự lựa chọn như là một nền tảng phía máy chủ có hiệu suất cao và đặc biệt là được sử dụng bởi Groupon, SAP, LinkedIn , Microsoft, Yahoo!, Walmart, và PayPal.
Tổng quan: Ryan Dahl, tác giả của Node.js, ban đầu xác định mục đích của việc tạo ra các
trang web với khả năng push như những gì được thấy trong Gmail. Sau khi cố gắng tìm giải pháp trong một số ngôn ngữ lập trình khác , ông đã chọn JavaScript vì thiếu một I / O API . Điều này cho phép ông xác định một quy ước của không đồng bộ, I / O hướng
sự kiện. Mục tiêu của Node.js là cung cấp một cơ chế dễ dàng và an toàn để xây dự ng các ứng dụng mạng hiệu suất cao, có khả năng mở rộng trong JavaScript. Node.js là một phần của môi trường Server Side JavaScript và nó mở rộng các API Javascript để cung cấp tính năng phía máy chủ. Node.js có thể làm điều này bằng cách xử lý nhiều kết nối client cùng một lúc. Các Node.js API có thể được mở rộng bằng cách sử dụng hệ thống module CommonJS.
18
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) JavaScript không có API thống nhất cho I / O, điều này cho phép các nhà phát triển suy nghĩ về cách tốt nhất để thực hiện một giao diện I / O hiện đại. Trong Node.js, một thực tế là tất cả các I / O được thực hiện một cách không đồng bộ và không ngăn chặn, kết hợp với một vòng lặp dựa trên sự kiện đơn luồng, trình bày một cách mới để thực hiện các ứng dụng web thời gian thực. Node.js do đó có thể giữ nhiều kết nối tồn tại mà không cần phải từ chối kết nối mới đến. Node.js bị ảnh hưởng bởi các mô hình khác, chẳng hạn như Ruby Event Machine và Python’s Twisted. Node.js được xây dựng bằng những mô hình này, thêm vào đó nó cung cấp các vòng lặp sự kiện như một ngôn ngữ thay vì một thư viện . Không giống như các mô hình truyền thống, sử dụng blocking call, Node.js không có event-loop call. Thay vào đó, Node.js vào vòng lặp sau khi thực hiện script, dựa trên
cách làm việc của JavaScript. Ruby’s Mongrel Web Server cũng là một nguồn cảm hứng cho Dahl. Ứng dụng Node.js thường chạy đơn luồng, mặc dù việc khởi chạy đa luồng được hỗ trợ trên Node.js 0.10+ từ JXcore. Node.js được dựa trên thực thi đơn luồng, mặc dù Node.js sử dụng đa luồng cho tập tin và network event. Node.js thể được biên dịch cục bộ hoặc tải về như một nhị phân tiền biên dịch.
Các ứng dụng được thực hiện 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 mỗi kết nối (yêu cầu) để tạo ra một luồng mới, chiếm RAM hệ thống và cuối cùng chiếm dụng tối đa số lượ ng RAM có sẵn. Node.js thì khác. Nó hoạt động trên một luồng đơn, sử dụng non blocking I / O, cho phép nó hỗ trợ hàng chục ngàn kết nối đồng thời, mà không lo lắng
về giới hạn bộ nhớ RAM và chi phí của context-switching giữa các luồng. Việc thiết kế một luồng dùng chia sẻ giữa tất cả các yêu cầu có nghĩa là nó có thể được sử dụng để xây dựng các ứng dụng đồng thời. Mục đích xây dựng một ứng dụng Node.js là bất kỳ chức năng thực hiện một I / O phải sử dụng một callback .
19
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Hình 6 - Threading truyền thống
Hình 7 - Threading trong Nodejs
20
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
V8:
V8 là engine thực thi mã JavaScript được xây dựng cho Google Chrome, mã nguồn mở của Google trong năm 2008 viết bằng C ++ . V8 biên dịch mã nguồn JavaScript chỉ trong thời gian để ra mã máy thay vì thông dịch nó trong thời gian thực. Node.js chứa libuv để xử lý sự kiện không đồng bộ. V8 cung cấp run-time cho JavaScript. Libuv là một lớp trừu tượng cho hệ thống mạng và hệ thống tập tin chức năng trên cả Windows và các hệ thống dựa trên POSIX như Linux, Mac OS X và Unix. Các chức năng chính của Node.js nằm trong một thư viện JavaScript. Các ràng buộc Node.js, viết bằng C ++, là lớp keo kết nối các công nghệ này với nhau và với hệ điều hành.
Quản lý gói :
Npm là phần mềm quản lý gói cài đặt sẵn trên các nền tảng máy chủ Node.js. Nó được sử dụng để cài đặt các chương trình Node.js từ npm registry. Bằng cách tổ chức quá trình cài đặt và quản lý các chương trình Node.js của bên thứ ba, nó giúp các nhà phát triển xây dựng nhanh hơn. npm không giống với các câu lệnh require() trong commonJS. Nó không được sử dụng để load cod e: thay vào đó, nó được sử dụng để cài
đặt code và quản lý code phụ thuộc từ dòng lệnh. Các gói tìm thấy trong npm registry có thể từ thư viện trợ giúp đơn giản như underscore.js cho đến task runner như grunt.js.
API thống nhất: Node.js kết hợp với một trình duyệt, một document DB (chẳng hạn như
MongoDB hoặc CouchDB) và JSON cung cấp một stack phát triển JavaScript thống nhất. Với sự quan tâm tăng lên từ client -framework và sự thích nghi của các mô hình phát triển cơ bản phía máy chủ như MVC, MVP, MVVM, vv, Node.js cho phép tái sử dụng các mô hình và các dịch vụ giao diện tương tự giữa máy khách và máy chủ .
Vòng lặp sự kiện:
Node.js đăng ký chính nó với hệ điều hành, do đó, nó được thông báo khi một kết nối được thực hiện. Khi một kết nối được thực hiện, hệ điều hành sẽ phát hành một
21
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) callback . Trong thời gian chạy Node.js, mỗi kết nối là một heap nhỏ . Theo cách truyền
thống, trong các OS, các tiến trình hoặc luồng xử lý mỗi kết nối. Node.js, tuy nhiên, sử dụng một vòng lặp sự kiện, thay vì tiến trình hay luồn g, quy mô đến hàng triệu kết nối xảy ra cùng một lúc. Ngược lại với các máy chủ hướng sự kiện khác, vòng lặp sự kiện Node.js không cần phải được gọi một cách rõ ràng. Thay vào đó callback được xác
định, và máy chủ sẽ tự động đi vào vòng lặp sự kiện vào giai đoạn cuối callback definition. Node.js thoát ra khỏi vòng lặp sự kiện khi không có callbacks nào nữa để
được thực hiện. 4.2.5. NoSQL + MongoDB
NoSQL: Một NoSQL hay Not Only SQL cung c ấ p một cơ chế cho việc lưu trữ và truy
xuất d ữ li ệu đượ c mô phỏng trong các phương tiện khác hơn so vớ i m ối quan hệ b ảng
đượ c sử dụng trong cơ sở dữ liệu quan hệ. Động lực cho cách tiế p cận này bao gồm sự đơn giản trong việc thiết k ế, mở rộng theo chiều ngang và kiểm soát tốt hơn tính sẵn sàng. Cấu trúc dữ li ệu (ví dụ như key-value, graph hoặc document) khác vớ i RDBMS, và do đó một số hoạt động được nhanh hơn trong NoSQL và một số trong RDBMS. Có sự khác biệt, việc sử dụng một NoSQL DB ph ụ thuộc vào vấn đề phải giải quyết
Cơ sở dữ liệu NoSQL đang ngày càng đượ c sử dụng trong big data và các ứng dụng web thờ i gian thực. Những hệ thống NoSQL cũng đượ c gọi là “Not only SQL” để
nhấn mạnh r ằng chúng cũng có thể hỗ tr ợ các ngôn ngữ truy vấn giống SQL. Nhi ều NoSQL thỏa hiệ p lưu trữ thống nhất (theo nghĩa của định lý CAP) để tăng tính sẵn
sàng và khả năng chịu lỗi phân vùng. Rào cản đối v ớ i vi ệc áp dụng nhiều hơn 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,
và đầu tư r ất lớ n trong SQL hiện có. Hầu hết lưu trữ NoSQL thiếu các giao dịch ACID thật sự, mặc dù một vài hệ thống gần đây, chẳng hạn như FairCom c-treeACE, Google Spanner và FoundationDB, đã sử dụng chúng cho thiết k ế của họ.
22
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Phân loại cơ bản dựa trên mô hình dữ liệu:
-
Column: Accumulo, Cassandra, Hbase…
-
Document: Clusterpoint, Couchd b, MongoDB…
-
Key-Value: Dynamo, FoundationDB, MemcacheDB…
-
Graph: Allegro, Neo4J, OrientDB…
MongoDB
MongoDB (từ "khổng lồ") là một cơ sở dữ liệu hướng document đa nền tảng. Được phân loại như là một cơ sở dữ liệu NoSQL, MongoDB cũng tránh các cấu trúc cơ sở dữ liệu quan hệ dựa trên bảng truyền thống, ủng hộ các document kiểu JSON với các lược đồ năng động (MongoDB gọi là định dạng BSON), làm cho việc tích hợp các dữ liệu trong một số loại ứng dụng dễ dàng hơn và nhanh hơn. Được phát hành dưới sự kết hợp củ a GNU Affero General Public License và Apache License, MongoDB là phần mềm miễn phí và mã nguồn mở. Đầu tiên được phát triển bởi công ty phần mềm 10gen (tại MongoDB Inc) trong tháng 10 năm 2007 như một phần của một nền tảng kế hoạch như là một sản phẩm dịc h vụ, công ty chuyển sang một mô hình phát triển mã nguồn mở trong năm 2009, với 10gen cung cấp hỗ trợ thương mại và các dịch vụ khác. Kể từ đó, MongoDB đã được áp dụng như phần mềm phụ trợ của một số trang web và dịch vụ lớn, bao gồm Craigslist, eBay, Foursquare, SourceForge, Viacom, và tờ New York Times, trong số
các công ty khác. MongoDB là hệ thống cơ sở dữ liệu NoSQL phổ biến nhất. Các tính năng chính: -
Document-Oriented:
Thay vì dùng một đối tượng kinh doanh và chia nhỏ nó ra thành nhiều cấu trúc quan hệ, MongoDB có thể lưu trữ các đối tượng kinh doanh trong một số lượng tối thiểu các document. Ví dụ, thay vì lưu trữ tiêu đề và thông tin tác giả trong hai cấu trúc quan hệ khác nhau, tiêu đề, tác giả, và các thông tin khác liên quan đến tiêu đề đều có thể được lưu trữ trong một document
23
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) duy nhất được gọi là Sách, trực quan hơn nhiều và thường dễ dàng hơn để
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 hiện thường xuyên. Các câu truy vấn có thể trả về các trường cụ thể của document và cũng bao gồm chức năng JavaScript người dùng định nghĩa. -
Chỉ mục:
Bất kỳ trường nào trong một document MongoDB có thể được lập chỉ mục (chỉ số trong MongoDB là khái niệm tương tự như trong R DBMSes). Chỉ số thứ cấp cũng tồn tại . - Nhân rộng:
MongoDB cung cấp tính sẵn sàng cao với bộ bản sao. Một tập bản sao bao gồm hai hoặc nhiều bản sao của dữ liệu. Mỗi thành viên trong tập bản sao có thể đóng vai trò của bản sao chính hay phụ bất cứ lúc nào. Bản sao chính thực hiện tất cả viết và đọc theo mặc định. Bản sao thứ cấp duy trì một bản sao của các dữ liệu trên bản sao chính bằng cách sử dụng bộ nhân bản tích hợp. Khi một bản sao chính bị lỗi, các bộ bản sao tự động thực hiện một quá trình bầu cử để xác định bản sao thứ cấp nào sẽ trở thành bản sao chính. Những bản sao thứ cấp cũng có thể thực hiện các hoạt động đọc, nhưng các dữ liệu cuối cùng là phù hợp theo mặc định. -
Cân bằng tải: MongoDB mở rộng theo chiều ngang sử dụng sharding. Người dùng
chọn một shard key, cái sẽ quyết định cách dữ liệu trong collection sẽ được phân phối. Dữ liệu được chia thành các phạm vi (dựa trên shard key) và phân phối trên nhiều shard. (Một shard là một master với một hoặc nhiều slave .) MongoDB có thể chạy trên nhiều máy chủ, cân bằng tải và / hoặc sao chép dữ liệu để giữ cho hệ thống và chạy trong trường hợp lỗi phần cứng.
24
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Cấu hình tự động thì dễ triển khai, và các máy mới có thể được thêm vào một cơ sở dữ liệu đang chạy. -
Lưu trữ tập tin :
MongoDB có thể được sử dụng như một hệ thống tập tin, lợi dụng cân bằng tải và tính năng nhân bản dữ liệu trên nhiều máy tính để lưu trữ các tập tin.
Chức năng này được gọi là GridFS, bao gồm trình điều khiển MongoDB, sẵn có và không có khó khăn cho các ngôn ngữ phát triển (xem "Hỗ trợ ngô n ngữ" sẽ thấy một danh sách các ngôn ngữ được hỗ trợ). MongoDB phơi bày nhiều chức năng cho thao tác tập tin và nội dung dành cho nhà phát triển. GridFS được sử dụng, ví dụ, bổ sung cho NGINX và lighttpd. [10] Thay vì lưu trữ một tập tin trong một document duy nhất, GridFS chia file thành nhiều phần, hoặc khối, và lưu trữ chúng như một document riêng biệt. Trong một hệ thống MongoDB nhiều máy, tập tin có thể được phân phối và sao chép nhiều lần giữa các máy một cách tường minh, do đó tạo ra một hệ thống cân bằng tải và chịu lỗi hiệu quả. -
Tổng hợp:
MapReduce có thể được sử dụng để xử lý hàng loạt dữ liệu và tập hợp các hoạt động. Framework tổng hợp cho phép người dùng có được những loại kết quả giống như khi câu truy vấn SQL GROUP BY được sử dụng. -
Thực thi mã JavaScript trên máy chủ:
JavaScript có thể được sử dụng trong các truy vấn, chức năng tập hợp (như MapReduce), và gửi trực tiếp đến cơ sở dữ liệu để được thực hiện. -
Capped Collections:
MongoDB hỗ trợ các collection kích thước cố định được gọi là Capped Collections
25
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Đây là loại collection duy trì trật tự insert, và một khi đạt được kích thước quy định, nó hoạt động như một hàng đợi tròn. 4.2.6. Demo Nodejs+Express+Jade+MongoDB
Đối với mỗi công nghệ, nhóm đều thực hiện Demo tương ứng. Tuy nhiên, trong khuôn khổ báo cáo thực tập, nhóm đã thông nhất chọn ra 1 demo tiêu biểu nhất, có liên quan mật thiết đến hầu hết các công nghệ đã được trình bày ở trên
Giới thiệu: Đây là một ứng dụng web cơ bản được xây dựng trên nền tảng Nodejs, sử dụng
cấu trúc Express, với giao diện được viết bằng Jade (Một ngôn ngữ tương tự html nhưng đơn giản hơn được express hỗ trợ), dùng CSDL NoSQL MongoDB
Hình 8 - Demo Nodejs+Express+Jade+MongoDB
26
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Giao diện: Giao diện của chương trình gồm có 4 phần:
-
Tiêu đề
-
Thông tin của 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 mới (Bao gồm các Textbox tương ứng, Nút “Thêm”)
Chức năng: Các chức năng cơ bản của ứng dụng gồm : -
Thêm 1 người dùng mới
-
Hiển thị danh sách người dùng hiện có
-
Xóa người dùng
-
Hiển thị thông tin chi tiết của người dùng khi click vào tên người dùng tương ứng trong danh sách
Tất cả những thao tác thêm, xóa người dùng cũng như đọc thông tin người dùng đều được cập nhật trong CSDL MongoDB. Mặc dù demo còn đơn giản, nhưng đó là 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 và thiết kế CSDL: CSDL của ứng dụng gồm 7 bảng: -
Table Student: Lưu trữ các thông tin về sinh viên
-
Table Company: Lưu trữ các thông tin về doanh nghiệp
-
Table Job: Lưu trữ các thông tin về công việc thực tập
-
Table Job_Status: Lưu trữ tình trạng hiện tại của 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 cơ bản của một user và hiển thị khi user đó đăng nhập
-
Table Topic_Student: Lưu trữ các bài viết của sinh viên
27
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
-
Table Topic_Company: Lưu trữ các tin tuyển dụng của doanh nghiệp
Mối liên hệ giữa các bảng được thể hiện theo sơ đồ bên dưới :
Hình 9 - Database của Web Internship
Giao diện của ứng dụng
Hình 10 - Giao diện của ứng dụng
28
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) Giao diện của ứng dụng được chia thành 3 phần chính :
Menu Bar: Gồm các thẻ - Home: Trở về trang chủ của ứng dụng - Searchbar: Tìm kiếm bài viết dựa trên keywords - Công ty: Liên kết đến trang chứa các bài viết, tin tuyển dụng của công ty - Sinh viên: Liên kết đến trang chứa bài viết của sinh viên - Đăng tin: Tạo một bài viết mới - Login: Đăng nhập - Logout: Đăng xuất
User Display: Hiển thị thông tin cá nhân tóm tắt của user sau khi đăng nhập - Ảnh đại diện - Tên - Trường - Khoa - Chỉnh sửa (Dùng để chỉnh sửa các 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ị bài viết khi ở trang “Công ty”
29
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA)
Hình 12 - Một bài viết trong trang “Công ty”
Hình 13 - Giao diện ở trang “Đăng tin”
30
Tìm hiểu và 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í mới
31
Tìm hiểu và xây dựng ứng dụng Single Page Application (SPA) 5. K ẾT QUẢ ĐẠT ĐƯỢC QUA KHOÁ THỰ C TẬP 5.1. Kiến thứ c
Có được kiến thức nền tảng về thiết kế và xây dựng ứng dụng web SPA
Cách cài đặt, sử dụngt các công cụ liên quan trong quá trình phát triển ứng dụng SPA( Angularjs, Nodejs, MongoDB….).
Hiểu biết về các mô hình phát triển web thông dụng
Hiểu biết về các công nghệ phát triển web hiện đại
5.2. K ỹ năng
Tham gia các buổi training kỹ năng làm việc, kỹ năng mềm: phỏng vấn, giao tiếp,..
Nâng cao trình độ Anh ngữ, khả năng thuyết trình (Chương trình Toastmaster) Cải thiện khả năng làm việc nhóm, phân chia công việc hiệu quả giữa các 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 trong môi trường làm việc hiện đại chuyên nghiệp của doanh nghiệp
Kinh nghiệm lập kế hoạch làm việc..
Định hướng nghề nghiệp bản thân trong tương lai
32