CÁO THỰC tập xây DỰNG WEB QUẢN lý NHÂN sự ANGULAR

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM BÁO CÁO THỰC TẬP XÂY DỰNG WEB QUẢN LÝ NHÂN SỰ ANGULAR Công ty thực tập : Công ty TNHH Aziworld Người phụ trách : Lê Phước Hưng Thực tập sinh : Nguyễn Trung Nghĩa TP Hồ Chí Minh, tháng 12 năm 2021 LỜI MỞ ĐẦU Trong thời đại 4.0 ngày nay, mạng internet phần thiếu công việc sinh hoạt ngày người Cùng với phát triển mạnh mẽ đó, nhiều nhu cầu trang web dần hình thành Nắm bắt xu trên, ngành công nghiệp phát triển ứng dụng web dần hình thành Việt Nam không ngoại lệ Ngành công nghiệp thiết kế ứng dụng web non trẻ Việt Nam phát triển mạnh mẽ, để hòa nhập với cơng ty hàng đầu giới Trong đó, cơng ty AziWorld – công ty trẻ Việt Nam – góp phần vào cơng hịa nhập Với nguồn gốc xuất phát từ phát triển mạng internet việc tìm hiểu, khám phá, phát triển, sáng tạo,… điều cần thiết cho người làm lập trình web Vì lý trên, nên em cho định hướng, lối đường phát triển nghiệp Và sau ba năm học tập, với mong muốn có thêm kinh nghiệm, trải nghiệm thực tế, muốn tham gia vào mơi trường chun nghiệp, em có dự định thực tập hè Vì vậy, em định chọn AziWorld nơi giúp em thực dự định LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Công ty TNHH AziWorld tạo điều kiện cho em có hội thực tập công ty Dù gắn bó với cơng ty chưa lâu, nhờ dẫn anh chị trainer, em tiếp thu kiến thức quan trọng để xây dựng giao diện web Chân thành cảm ơn anh chị nhóm trainer bỏ thời gian,cơng sức để hướng dẫn em hồn thành đợt thực tập Đặc biệt cảm ơn anh Lê Phước Hưng, trực tiếp dẫn kiến thức cần thiết cho em trình làm việc, giúp đỡ em lúc em gặp khó khăn công việc; cảm ơn chị Huỳnh Thu Thảo giúp đỡ em làm quen với môi trường mới, làm quen với nhiều người công ty; cảm ơn anh Đặng Trung Hiếu, người dẫn giải đáp thắc mắc em việc sử dụng API công ty Cũng xin cảm ơn thầy cô khoa Cơng nghệ phần mềm nhiệt tình hỗ trợ, tạo điều kiện em làm báo cáo NHẬN XÉT CỦA KHOA MỤC LỤC MỤC LỤC Chương 1: Giới thiệu công ty thực tập Giới thiệu công ty TNHH AziWorld 2 Sản phẩm công ty Chương 2: Nội dung thực tập 3 Tìm hiểu cơng ty kỹ công ty Nghiên cứu kỹ thuật Thực project Lịch làm việc Chương 3: Chi tiết project Giới thiệu sản phẩm Thực 11 Kế hoạch 11 TÀI LIỆU THAM KHẢO 13 TỔNG KẾT 14 Chương 1: Giới thiêu công ty thực tập Giới thiệu công ty TNHH AziWorld AziWorld công ty chuyên cung cấp dịch vụ tư vấn phát triển phần mềm cho doanh nghiệp Với nhiệm vụ cải tiến quy trình kinh doanh để tăng hiệu hoạt động cho doanh nghiệp nước nhiều lĩnh vực bao gồm thương mại, tài chính, giáo dục,… AziWorld có ba văn phịng đặt ba trọng điểm thành phố Hồ Chí Minh, văn phòng dành cho sinh viên thực tập đặt địa chỉ: 13, Lê Đại Hành, Phường 15, Quận 11 Sản phẩm công ty AziWorld chuyên phát triển vận hành phần mềm dành cho web di động Công ty xây dựng thành công sản phẩm AziCart AziDev Công ty phục vụ 350 khách hàng nhiều lĩnh vực khác có sở doanh nghiệp khắp nước Các sản phẩm hỗ trợ quản lý doanh nghiệp, giám sát, theo dõi định hiệu Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Lập trình web Frond-end” nhằm mục đích giúp sinh viên thực tập đào tạo ngơn ngữ lập trình, cơng cụ sử dụng tư logic.Đồng thời rèn luyện kỹ mềm làm việc nhóm, thuyết trình, giao tiếp Tại cơng ty, sinh viên có hội học tập, khám phá làm việc mơi trường phát triển phần mềm chun nghiệp Tìm hiểu công ty kỹ cơng ty Thời gian : ngày Hình thức: Online Google Meet Nội dung : Giới thiệu công ty, cách tổ chức công ty Được nghe người phụ trách giới thiệu cơng ty, q trình thành lập phát triển, quy trình làm việc từ cao xuống thấp, cách thức tổ chức cơng ty Ngồi ra, thực tập sinh giới thiệu cách thức làm việc công ty thời gian làm, quy định cần phải tuân thủ, cách tính công làm… Kết : Hiểu thêm công ty AziWorld, q trình thành lập phát triển Có thêm kỹ việc sử dụng email cơng việc, có kỷ luật, có trách nhiệm Nội dung thực tập 2.1 Tìm hiểu Angular Thời gian:1tuần Nội dung:Tìm hiểu ngơn ngữ lập trình Angular Tìm hiều kiến thức cần có framework Angular trước bước vào dự án công ty: − Module: Mỗi ứng dụng Angular gọi module Để khai báo module Angular ta dùng từ khóa @NgModule bên module có tham số: declaration, exports, imports, providers, bootstrap − Component: nói đơn giản Angular thứ component bao gồm label, input, button,… Cho tới component lớn ghép từ nhiều component nhỏ mà thành class − Metadata: thông tin truyền vào giúp Angular xử lý hàm, lớp Dưới cấp lớp hiểu parameter − Data binding: Lấy liệu từ model, controller để đổ vào view ngược lại Có loại binding data: binding chiều (chuyển từ model sang view ngược lại); binding chiều (chuyển đổi qua lại liên tục model view có thay đổi) − Directive: có hai loại directive: 2.2 + Structure directive: có chức gán liệu theo quy tắc + Attribute directive: có chức hiển thị liệu trực tiếp − Service: Là lớp có khả thực số chức thường dùng Có thể xem thư viện với hộ trợ cho việc gọi api trả liệu put liệu Thực hiện: Thực hành sử dụng ngơn ngữ Angular thông qua việc xây dựng demo sản phẩm nhỏ Kết quả: Có kiến thức việc sử dụng Angular, HTML CSS Sử dụng, thao tác thành thạo với API HTML/CSS sản phẩm demo Thời gian:2 tuần Nội dung:Tìm hiểu HTML/CSS demo sản phẩm Trong thời gian này, liên hệ làm việc trực tiếp với mentor kiến thức cần có Angular trước bước vào dự án cơng ty: - Tìm hiểu HTML, CSS để hỗ trợ xây dựng giao diện cho sản phẩm: lập trình web khơng thể khơng có html/css Với chưa có kiến thức mảng này, công ty hỗ trợ để giúp bạn phát triển mảng - Áp dụng kiến thức tìm hiểu để xây dựng ứng dụng minh họa: Sau có kiến thức lý thuyết lúc áp dụng kiến thức thơng qua demo nhỏ giao - Tìm hiểu áp dụng kiến thức API, http: thực tập sinh hướng dẫn kết nối tới server thông qua danh sách API viết sẵn swagger Từ hỗ trợ thực tập sinh tập trung hồn tồn vào việc giải vấn đề frontend Thực hiện: Thực hành sử dụng ngôn ngữ Angular thông qua việc xây dựng demo sản phẩm nhỏ Kết quả: Có kiến thức việc sử dụng Angular, HTML CSS Sử dụng, thao tác thành thạo với API 2.3 Tìm hiểu kiến thức git làm việc nhóm Thời gian : tháng Nội dung : Xây dựng demo lớn với tham gia với thành viên nhóm front-end - Git: Tìm hiểu git cách làm việc với nhánh git với câu lệnh cmd Hạn chế thời gian tìm hiểu cơng cụ hỗ trợ, dễ dàng quản lý file liệu Thực tập sinh hỗ trợ giải vấn đề phát sinh conflict từ tự tin việc sử dụng git quản lý source code - Token:Tìm hiểu kiến thức token viết demo nhằm để hiểu cách hoạt động token refresh token Học cách sử dụng token cho api với hỗ trợ interceptor - RxJS:Thư viện hỗ trợ người dùng quản lý bất đồng làm việc với Angular Cung cấp nhiều thuật ngữ Observable, Promise, Subject,… Cung cấp cho người dùng số lượng lớn công cụ với nhiều phương thức quản lý bất đồng lời gọi api, http request Đơn giản hóa số dịng code gia tăng tính trang trí cho liệu đầu - Xây dựng demo kết nối với thành viên nhóm thành sản phẩm: sau tìm hiểu cơng nghệ thành viên nhóm người viết demo cho tìm hiểu sau người học cách ghép code lại với để tạo sản phẩm chung Thực : - Tham gia đầy đủ buổi training công ty - Làm thực hành, kiểm tra kiến thức học Kết quả: Nâng cao kỹ lập trình với ngơn ngữ C++ Có kiến thức quan trọng cho việc lập trình game mobile sau Ngồi cịn biết thêm số quy tắc việc viết code cho chuẩn, dễ đọc, dễ hiểu Đi vào dự án Thời gian : tháng Nội dung : Xây dựng dự án công ty - Trong thời gian này, bạn thực tập sinh thử sức với phần dự án Để từ dần phát triển rộng - Các thông tin liệu giao diện, server, api cung cấp sẵn nhằm hỗ trợ cho bạn thực tập sinh phát huy tốt khả - Việc làm nhóm trì xun suốt trình thực tập sinh thực dự án Thực : − Áp dụng nhần từ tháng qua để phát triển khả - 2.4 Kết quả: - Hiểu quy trình xây dựng hệ thống web với front-end - Có kiến thức quan trọng cho việc lập trình game mobile sau Ngồi cịn biết thêm số quy tắc việc viết code cho chuẩn, dễ đọc, dễ hiểu Thực project Sau gần tháng training thực hành, thực tập sinh nắm kiến thực Angular, HTML/CSS, git,… Trong tháng sau đó, trainer hướng dẫn thực tập sinh áp dụng kiến thức học để thực dự ánweb Chi tiết đồ án nói phần sau Lịch làm việc Tuần - - - Mức Người hướng độ Cơng việc dẫn hồn thành Tìm hiểu cơng ty, Anh Lê 10 cách tổ chức công ty Phước Hưng kiến thức Angular HTML/CSS Anh Lê Phước Hưng Áp dụng kiến thức Anh Lê Angular HTML/CSS Phước Hưng viết demo sản phẩm Nghe giới thiệu API AnhLê Phước 10 công ty swagger Hưng học cách sử dụng api Tìm hiểu git Cùng với Anh Lê 10 xem cách xếp thư Phước Hưng mục để format cho demo tới Tìm hiểu token xây Anh Lê 10 dựng demo với token Phước Hưng Tìm hiểu RxJS Anh Lê thư viện hỗ trợ đồng Phước Hưng người dùng Kết nối code Anh Lê 10 thành viên với Phước Hưng Nhận xét người hướng dẫn Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chăm chỉ, tiến nhanh, Tốt Chương 3: Chi tiết project Giới thiệu project Là hệt thống chấm công, làm cho nhân viên doanh nghiệp Với mong muốn thay việc quản lý chấm công theo hệ thống xưa củ Ứng dụng mong muốn mang đến cho người dùng phương thức chấm công quản lý công dễ dàng minh bạch 1.1 Quản lý đăng nhập Hệ thống hỗ trợ người dùng giao diện cho việc đăng nhập, đăng ký qn mật Ngồi ra, ứng dụng cịn hỗ trợ cho người dùng đăng nhập thông qua facebook, google, apple id, linkedin Để gia tăng tinh xác thực bảo mật cho người dùng đăng nhập đăng ký Ứng dụng có sử dụng hệ thống xác thực tự động thông qua email số điện thoại Điều giúp cho người dùng yên tâm độ bảo mật thông tin đăng ký sử dụng tài khoản hệ thống 1.2 Quản lý thông tin người dùng Việc quản lý thông tin người dùng hệ thống rõ ràng đầy đủ Điều giúp doanh nghiệp có lượng thơng tin cá nhân vừa đủ cần thiết nhân viên từ giúp cho việc quản lý trở nên dễ dàng việc liên hệ trở nên đơn giản Với giao diện đơn giản, bố cục xếp hợp lý, rõ ràng, người dùng chắn dễ dàng việc tìm kiếm thơng tin liên hệ Ngoài việc cập nhật liệu ưu cho người dùng để giúp họ chủ động thay đổi thông tin cho phù hợp với thông tin thân Trong ứng dụng, kỹ mềm cập nhật hiển thị đầy đủ đủ chứng minh rằng, vào doanh nghiệp việc xây dựng phát huy kỹ mềm cho cá nhân công ty điều cần thiết quan tâm Thực Các thành viên team internship: - Lê Phương Nam Nguyễn Trung Nghĩa Nguyễn Đức Khiêm Và giúp đỡ tận tình bạn HR, anh Hiếu (mentor phận back-end) Kế hoạch Giai đoạn Quản lý đăng nhập: - Đăng nhập, đăng ký, quên mật Đăng nhập với bên thứ như: facebook, google, Xây dựng, format source code cho dự án Sử dụng HTML/CSS để xây dựng giao diện Tìm hiểu thư viện UI để đưa vào phát triển giao diện - Làm chức năng: đăng ký nơi làm, xác thực opt, câu hỏi bảo mật,… Kết : - Hầu hết tính thực Giai đoạn Beta: - Xây dựng UI Gọi API để load liệu lên giao diện Thực chức cập nhật, thêm, xóa sửa Bổ sung token vào api gọi Xây dựng chức phức tạp với interceptor Cập nhật UI Kết : Đã hoàn thành toàn tính TÀI LIỆU THAM KHẢO Angular https://angular.io/ https://github.com/angular-vietnam/100-days-of-angular RxJS https://rxjs.dev/guide/overview HTML/CSS https://www.freecodecamp.org/ TỔNG KẾT Như vậy, sau bốn tháng làm việc, nhóm kịp hồn thành số tính định cho dự án Do thời gian có hạn nên tính dự án khơng q nhiều Giao diện cịn vài chỗ chưa ý Nhưng nhóm vui với mà nhận Chân thành cảm ơn giúp đỡ anh chị mentor Cảm ơn thành viên nhóm làm việc thật hiệu để đạt kết ... hiểu Thực project Sau gần tháng training thực hành, thực tập sinh nắm kiến thực Angular, HTML/CSS, git,… Trong tháng sau đó, trainer hướng dẫn thực tập sinh áp dụng kiến thức học để thực dự ánweb... trợ thực tập sinh tập trung hồn tồn vào việc giải vấn đề frontend Thực hiện: Thực hành sử dụng ngôn ngữ Angular thông qua việc xây dựng demo sản phẩm nhỏ Kết quả: Có kiến thức việc sử dụng Angular, ... 1.2 Quản lý thông tin người dùng Việc quản lý thông tin người dùng hệ thống rõ ràng đầy đủ Điều giúp doanh nghiệp có lượng thơng tin cá nhân vừa đủ cần thiết nhân viên từ giúp cho việc quản lý