Báo cáo thực tập lập trình web với 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

LẬP TRÌNH WEB VỚI ANGULAR

Cơng ty thực tập : Innovative Software Development
Người phụ trách : Nguyễn Anh Tú
Thực tập sinh
: Lý Quang Minh

TP. Hồ Chí Minh, tháng 12 năm 2022


2

LỜI MỞ ĐẦU
Ngày nay, với sự bùng nổ internet và sự phát triển nhanh chóng của xã hội, ứng dụng
web đã trở thành một phần không thể thiếu đối với cuộc sống con người. Các ứng dụng web đáp
ứng các nhu cầu hằng ngày như đọc báo tin tức, giải trí, mạng xã hội, xem phim, trị chuyện và
đáp ứng được các nhu cầu trong công việc như bán hàng, hỗ trợ quản lý thơng tin. Vì thế, lập
trình web là một xu hướng nghiệp hiện nay và có nhu cầu dụng cao.
Sau ba năm học tập trên trường, do mong muốn có thêm kinh nghiệm thực tế, cũng như
muốn được tham gia phát triển trong một môi trường chuyên nghiệp, em có dự định là sẽ thực
tập. Vì vậy, em quyết định chọn công ty Innovative Software Development - một môi trường lý
tưởng, hiện đại, chuyên nghiệp - là nơi sẽ giúp em thực hiện được dự định này.

Nguyễn Anh Tú

Lý Quang Minh

3

LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn Công ty Innovative Software Development đã tạo điều kiện
cho em có cơ hội được thực tập tại công ty.
Chỉ trong một thời gian ngắn, nhưng nhờ sự chỉ dẫn nhiệt tình của nhóm trainer, em đã
tiếp thu được những kiến thức quan trọng, kỹ năng làm việc chuyên nghiệp, cách giải quyết vấn
đề. Chân thành cảm ơn các anh chị trong nhóm trainer đã bỏ ra nhiều thời gian,công sức để
hướng dẫn em hoàn thành đợt thực tập này.
Đặc biệt cảm ơn anh Lê Ngọc Thạch đã hướng dẫn, giúp đỡ cho chúng em tận tình cả
những khó khăn trong cơng việc, đến những khó khăn việc làm quen với mơi trường mới; cảm
ơn anh Nguyễn Anh Tú đã training Angular, hỗ trợ em rất nhiều về các vấn quy trình và cách
xây dựng ứng dụng web hoàn chỉnh trong thời gian qua.
Em xin chân thành cảm ơn thầy cô khoa Công nghệ Phần mềm đã nhiệt tình hỗ trợ và tạo
điều kiện em thực hiện bài báo cáo này

Lý Quang Minh
TP. Hồ Chí Minh, ngày 25 tháng 12 năm 2022

Nguyễn Anh Tú

Lý Quang Minh


4

NHẬN XÉT CỦA KHOA
.........................................................................................................................................................

.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................
.........................................................................................................................................................

Nguyễn Anh Tú

Lý Quang Minh


5

MỤC LỤC
MỤC LỤC......................................................................................................................................5
CHƯƠNG 1: GIỚI THIỆU CÔNG TY THỰC TẬP.....................................................................6
1.1 Giới thiệu công ty Innovative Software Development.........................................................6
1.2 Sản phẩm công ty.................................................................................................................6

CHƯƠNG 2: NỘI DUNG THỰC TẬP.........................................................................................8
2.1 Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty........................................................8
2.2 Nghiên cứu kỹ thuật.............................................................................................................8
2.2.1 Các cơng cụ làm việc....................................................................................................8
2.2.2 Tìm hiểu Framework Angular.......................................................................................9
2.2.3 Thực hiện project..........................................................................................................9
2.2.4 Lịch làm việc...............................................................................................................10
CHƯƠNG 3: CHI TIẾT VỀ PROJECT.......................................................................................12
3.1 Giới thiệu ứng dụng...........................................................................................................12
3.2 Thực hiện............................................................................................................................12
TÀI LIỆU THAM KHẢO............................................................................................................14
TỔNG KẾT..................................................................................................................................15

Nguyễn Anh Tú

Lý Quang Minh


6

CHƯƠNG 1: GIỚI THIỆU CƠNG TY THỰC TẬP

Hình 1. 1 Logo công ty

1.1 Giới thiệu công ty Innovative Software Development
Tập đoàn ITD, tiền thân là Trung tâm CATIC, được thành lập năm 1994 bởi một nhóm
nhà khoa học trẻ với hồi bão góp phần tích cực vào cơng cuộc cơng nghiệp hố – hiện đại hóa
q hương Việt Nam. Trong suốt q trình hoạt động, tập đồn ITD ln nhạy bén, đi đầu trong
việc nắm bắt, giới thiệu, cung cấp thiết bị hiện đại, dịch vụ kỹ thuật cao, giải pháp tích hợp và
chuyển giao cơng nghệ, trở thành một trong số ít các cơng ty có lĩnh vực hoạt động vừa đa dạng

vừa chuyên sâu, được đối tác và khách hàng tín nhiệm.
Trải qua hơn 20 năm hoạt động và phát triển, ITD đã trở thành một tập đoàn uy tín với
hạt nhân là cơng ty mẹ Tiên Phong và 6 công ty thành viên hoạt động chuyên sâu trong các lĩnh
vực kỹ thuật cao, bao gồm: Giao thông thông minh, Tin học – viễn thông, Điện – tự động, Hạ
tầng kỹ thuật điện…
1.2 Sản phẩm công ty
Sản phẩm của công ty chủ yếu là phềm mềm hệ thống Giao thông thông minh (lntelligent
Transport System – ITS) ứng dụng kỹ thuật công nghệ với cơ sở hạ tầng giao thông để điều
hành và quản lý hệ thống giao thông vận tải một cách hiệu quả, đảm bảo an toàn giao thơng,
giảm thời gian và chi phí đi lại, bảo vệ mơi trường… Hệ thống bao gồm các giải pháp chính:
-

Giải pháp thu phí giao thơng:


Hệ thống thu phí một dừng (MTC).



Hệ thống thu phí khơng dừng (ETC).

Nguyễn Anh Tú

Lý Quang Minh


7



Hệ thống thu phí kín (Closed System).



Quản lý thu phí cho bãi đỗ xe.



Quản lý và thu phí đỗ xe qua thiết bị di động.

-

Giải pháp điều hành quản lý xe buýt.

-

Giải pháp cân kiểm soát tải trọng xe.

-

Giải pháp kiểm soát tốc độ phương tiện.

-

Giải pháp bảng quang báo điện tử.

-

Giải pháp thu nhập dữ liệu và phát hiện sự cố giao thông.

-

Giải pháp giám sát vượt đèn đỏ.

Nguyễn Anh Tú

Lý Quang Minh


8

CHƯƠNG 2: NỘI DUNG THỰC TẬP
Đợt thực tập với chủ đề “Lập trình Web với Angular” nhằm mục đích giúp sinh viên
thực tập được học hỏi, nghiên cứu framework Angular và xây dựng ứng dụng, đồng thời rèn
luyện những kỹ năng mềm như làm việc nhóm, thuyết trình, giao tiếp. Tại cơng ty, sinh viên có
cơ hội được học tập, khám phá và làm việc trong một môi trường phát triển chun nghiệp.
2.1 Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty
Thời gian: 2 ngày
Nội dụng: Giới thiệu công ty, cách tổ chức của công ty
Được nghe người phụ trách giới thiệu về công ty, quá trình thành lập và phát triên
(như đã nhắc đến ở trên), quy trình làm việc từ cao xuống thấp, cách thức tổ chức của
cơng ty .
Ngồi ra, thực tập sinh còn được giới thiệu về cách thức làm việc trong công ty
như thời gian đi làm, các quy định cần phải tuân thủ, cách sử dụng email trong công
việc…
Kết quả: Hiểu thêm về cơng ty, q trình thành lập và phát triển. Có thêm các kỹ năng về
việc sử dụng email trong cơng việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm
hơn.
2.2 Nghiên cứu kỹ thuật
2.2.1 Các công cụ làm việc

Thời gian : 4 ngày
Nội dung : Tìm hiểu về các cơng cụ sẽ được sử dụng trong quá trình làm việc.
Trong thời gian này, supervisor đã hướng dẫn thực tập sinh tìm hiểu về các cơng
cụ sẽ giúp ích cho trong cơng việc sau này. Một số phần mềm trong số đó như
Tortoise SVN - sử dụng trong làm việc nhóm, GIT – phần mềm quản lý mã nguồn,
Clickup – sử dụng trong quản lý, giám sát tiến độ cơng việc, Gitlab – Phần mềm quản
lí kho mã nguồn

Nguyễn Anh Tú

Lý Quang Minh


9

Thực hiện : Thực hành sử dụng các phần mềm đã nêu trên.
Kết quả : Lập trình sử dụng các cơng cụ miễn phí, giúp dễ dàng kết hợp các cơng cụ với
nhau
2.2.2 Tìm hiểu Framework Angular
Thời gian: 2 tuần
Nội dung: Tìm hiểu Angular
-

Nhắc lại kiến thức html, css, javascript

-

Typescript

-

Kiến trúc MVC

-

Các khái niệm cơ bản: Component, Directive, Template, Dependency Injection

-

Xây dựng form và validation sử dụng ReactiveForm

-

Cấu hình route cho các page

-

Cấu hình interceptor httpClient

-

Cấu hình Guard xác thực người dùng
Thực hiện:
-

Tham gia đầy đủ các buổi training của công ty.

-

Làm các bài thực hành, kiểm tra về kiến thức đã học.

Kết quả:
-

Nâng cao kỹ năng lập trình.

-

Nắm các kiến thức cơ bản

-

Ngồi ra cịn được biết thêm một số quy tắc trong việc viết code sao cho đúng
chuẩn, dễ đọc, dễ hiểu và hiệu quả.

2.2.3 Thực hiện project
Sau một tháng được training và thực hành, thực tập sinh đã nắm được những kiến thực
cơ bản về Angular. Trong tháng thứ hai, trainer đã hướng dẫn thực tập sinh áp dụng những kiến
thức đã học để thực hiện một project.
Chi tiết đồ án sẽ được nói ở phần sau.
Nguyễn Anh Tú

Lý Quang Minh


10

2.2.4 Lịch làm việc

Tuần

Cơng việc

Người hướng dẫn

1

-Tìm hiểu về cơng ty, Anh Lê Ngọc Thạch
cách tổ chức của công ty.
- Làm quen với các công
cụ làm việc trong công ty.
- Học cách trao đổi, làm
việc qua email.
Anh Nguyễn Anh
Tú

2

- Tìm hiểu kiến thức cơ
bản lập trình web và
Angular
- Tìm hiểu Form,
Validate, Router

3

- Tìm hiểu thư viện Rxjs
và Ngrx
- Tìm hiểu HttpClient,
Interceptor, Guard

Anh Nguyễn Anh
Tú

Anh Nguyễn Anh
Tú

4

- Tìm hiểu project
- Nhận đặc tả và bản thiết
kế
- Lập danh mục công việc
thực hiện
- Xây dựng màn hình
đăng nhập, quản lý(thêm
xóa sửa)

5

- Tích hợp các chức năng
cho các màn hình

Anh Nguyễn Anh
Tú

Nguyễn Anh Tú

Mức độ
hoàn thành

Nhận xét
của người
hướng dẫn

Lý Quang Minh


11

6

- Kiểm thử và sữa lỗi
- Báo cáo thực tập

7

- Tham gia dự án thực của Anh Nguyễn Viên
công ty
Linh

8

- Tham gia dự án thực của Anh Nguyễn Viên
công ty
Linh

Nguyễn Anh Tú

Anh Nguyễn Anh

Tú

Lý Quang Minh


12

Nguyễn Anh Tú

Lý Quang Minh


13

CHƯƠNG 3: CHI TIẾT VỀ PROJECT
3.1 Giới thiệu ứng dụng
“Ứng dụng quản lí doanh nghiệp” là phần mềm hỗ trợ công ty quản lý các thông tin của
doanh nghiệp đối tác. Web cho phép người dùng thêm mới, cập nhật thơng tin, tình trạng hoạt
động của các doanh nghiệp
3.2 Thực hiện
Giai đoạn 1: Phân tích yêu cầu tính năng, thiết kế màn hình
Giai đoạn 2: Xây dựng màn hình web
-

Xây dựng layout

-

Xây dựng routing

-

Xây dựng màn hình quản lí doanh nghiệp

-

Xây dựng form tạo mới doanh nghiệp

Giai đoạn 3: Tích hợp chức năng
-

Thực hiện chức năng thêm xóa sửa doanh nghiệp

-

Thực hiện chức năng đăng nhập

Nguyễn Anh Tú

Lý Quang Minh


14

Hình 3. 1 Màn hình quản lý doanh nghiệp

Hình 3. 2 Màn hình quản lý thêm mới thơng tin đối tác

Nguyễn Anh Tú

Lý Quang Minh


15

TÀI LIỆU THAM KHẢO
1.
2.

Tài liệu Angular: />Angular Material:

Nguyễn Anh Tú

Lý Quang Minh


16

TỔNG KẾT
Trong 2 tháng thực tập ở công ty TNHH MTV Innovative Software Development, em đã
học hỏi được nhiều kiến thức về lập trình web và hồn thành dự án quản lý thông tin doanh
nghiệp đáp ứng đầy đủ các tính năng cơ bản. Ngồi ra, em cịn được làm việc trong môi trường
chuyên nhiệp, năng động; hiểu được cách quản lý dự án, văn hóa cơng ty.
Em xin chân thành cảm ơn công ty TNHH MTV Innovative Software Development đã
tạo cơ hội cho em thực tập tại đây. Cảm ơn anh Lê Ngọc Thạch, Nguyễn Anh Tú đã hỗ trợ em
hoàn thành kỳ thực tập.

Nguyễn Anh Tú

Lý Quang Minh