Lập trình website với ReactJS (báo cáo THỰC tập)

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH
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
Đề tài: Lập trình website với ReactJS

Giảng viên hướng dẫn: ....

Sinh viên thực hiện:
1. Nguyễn Anh Hào

TP. HỒ CHÍ MINH, 6/2022


Thực tập doanh nghiệp

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

……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………
……………………………………………………………………………………………………


Thực tập doanh nghiệp

LỜI NÓI ĐẦU
Hiện nay, với sự phát triển ngày càng nhanh của nền kinh tế cùng với những tiến bộ hiện đại của khoa
học, công nghệ. Mức sống của người dân ngày càng được cải thiện nên nhu cầu mua sắm, giải trí thơng
qua các thiết bị công nghệ cũng tăng theo. Những ngành nghề liên quan tới công nghệ thông tin ngày
càng phát triển mạnh mẽ để bắt kịp với xu hướng trên. Trong đó, lập trình trên website đang dần trở nên
phổ biến.

Hịa vào xu thế chung của thế giới, ngành lập trình ứng dụng web của Việt Nam đã và đang không
ngừng phát triển, để theo kịp, hòa nhập và cạnh tranh với những công ty hàng đầu về ứng dụng web trên
thế giới. Bên cạnh những công ty trẻ tuổi trong nước, những công ty lớn trên thế giới cũng gia nhập vào
thị trường Việt Nam, góp phần rất lớn vào sự phát triển tích cực của ngành lập trình website tại Việt
Nam. Chính vì những lí do trên, sau hơn ba năm học tập tại nhà trường, với mong muốn học hỏi thêm
kinh nghiệm và phát triển kỹ năng của bản thân để có thể xây dựng được những ứng dụng web nhằm
đáp ứng nhu cầu không ngừng đổi mới và nâng cao của khách hàng. Em đã quyết định lựa chọn công ty
Unicloud làm nơi thực tập. Em tin rằng với môi trường hiện đại, chuyên nghiệp và đầy năng động cùng
sự nỗ lực của bản thân, Unicloud sẽ là bệ phóng để tiếp bước cho hành trình phát triển ứng dụng web
của bản thân mình.

Sinh viên thực hiện

Nguyễn Anh Hào


Thực tập doanh nghiệp

LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn đến Công ty Unicloud chi nhánh TP.HCM đã tạo điều kiện cho em có cơ hội
được thực tập tại công ty.
Chỉ sau một thời gian ngắn, nhờ sự chỉ dẫn tận tình của anh leader, anh mentor và học hỏi từ các bạn
thực tập sinh khác, em đã tiếp thu được nhiều kiến thức mới mẻ để có thể xây dựng được một website cơ
bả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 để giúp đỡ em
hồn thành đợt thực tập này.
Đặc biệt cảm ơn anh Đặng Quang Trung, đã training cho em kiến thức về React, hướng dẫn, giúp đỡ em
nhiệt tình khi em gặp khó khăn trong cơng việc, giúp em xóa bỏ trở ngại trong việc làm quen với môi
trường mới; cảm ơn chị Lâm Ngọc Quyên đã chỉ dẫn cho em về cách làm báo cáo, lên kế hoạch và
thuyết trình - những kỹ năng khơng thể thiếu trong q trình làm việc; cảm ơn các anh Đoàn Viết Thuận,
anh Huỳnh Tuấn Kiệt, đã training cho em những kiến thức quan trọng về Bootstrap để có thể tạo ra sản
phẩm hồn thiện trong thời gian qua.
Cũng xin phép cảm ơn các thầy cô trong khoa Cơng nghệ phần mềm đã nhiệt tình hỗ trợ, tạo điều kiện
giúp em hoàn thành bài báo cáo này.

Tp. Hồ Chí Minh, ngày 16 tháng 06 năm 2022
Nguyễn Anh Hào


Thực tập doanh nghiệp

CHƯƠNG 1: GIỚI THIỆU CÔNG TY
1.1. Giới thiệu công ty Unicloud
1.2. Sản phẩm của công ty

6
6
6

CHƯƠNG 2: NỘI DUNG THỰC TẬP
2.1. Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty
2.2. Nghiên cứu kỹ thuật
2.2.1. Cơng cụ làm việc
2.2.2. Tìm hiểu về quy trình làm việc của cơng ty
2.2.3. Tìm hiểu về ReactJS
2.3. Thực hiện dự án
2.4. Lịch làm việc

7
7
7
7
8
8
8
9

CHƯƠNG 3: CHI TIẾT VỀ DỰ ÁN
3.1. Website Unicloud
3.1.1. Giới thiệu
3.1.2. Thực hiện
3.1.3. Kết quả
3.2. Website Sliving
3.2.1. Giới thiệu

3.2.2. Thực hiện
3.2.3. Kết quả
3.3. Website Unicloud Career
3.3.1. Giới thiệu
3.3.2. Thực hiện
3.3.3. Kết quả

11
11
11
11
11
11
11
11
11
11
11
12
12

TỔNG KẾT

12

TÀI LIỆU THAM KHẢO

13

Thực tập doanh nghiệp

CHƯƠNG 1: GIỚI THIỆU CÔNG TY
1.1. Giới thiệu công ty Unicloud

Unicloud Group tiền thân là Công ty CP Đầu tư Thương mại Sunshine Tech thuộc Tập đoàn Sunshine
(Sunshine Group) được thành lập ngày 12/06/2016, Công ty CP Tập đồn Cơng nghệ Unicloud hiện có
hơn 300 thành viên tại trụ sở Hà Nội và chi nhánh TP HCM, cùng 2 công ty con là Unicloud Investment
và Nanochip.
Unicloud sở hữu một hệ sinh thái Cơng nghệ tồn diện ứng dụng phủ khắp các lĩnh vực trọng yếu của
nền kinh tế như Tài chính Ngân hàng, Chứng khốn, Bất động sản, Smart & IoT, Kinh tế chia sẻ, Chính
phủ điện tử. Hiện tại, em đang thực tập tại chi nhánh HCM của Unicloud.

1.2. Sản phẩm của công ty
Unicloud cung cấp giải pháp phần mềm từ Web, Desktop App, Mobile App, AI cho đến lập trình nhúng
với các thiết bị IoT trong 4 lĩnh vực cốt lõi: Digital Banking Platform (giải pháp cho lĩnh vực tài chính
ngân hàng), Smart City (thành phố thơng minh & Chính phủ điện tử), Digital Transformation (Giải pháp
chuyển đổi số doanh nghiệp), và VR (ứng dụng Thực tế ảo).
Một số sản phẩm nổi bật của công ty như: hệ thống máy giao dịch ngân hàng tự động STM, hệ phần
mềm UniCAT, các thiết bị công tắc điều khiển thông minh,...


Thực tập doanh nghiệp

CHƯƠNG 2: NỘI DUNG THỰC TẬP
Em thực tập tại cơng ty với vị trí ứng tuyển là thực tập sinh Frontend (ngôn ngữ ReactJS). Trong thời
gian thực tập vừa qua, em đã được anh chị tạo điều kiện để tiếp xúc với tồn bộ quy trình để hoàn thiện
một website thành sản phẩm, đồng thời, phát triển thêm cho bản thân các kỹ năng mềm cần thiết như
làm việc nhóm, thuyết trình, phân chia cơng việc và giao tiếp. Em đã có cơ hội được trải nghiệm, học tập
và khám phá trong môi trường phát triển ứng dụng 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: 1 ngày
Nội dung: Giới thiệu về 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 Unicloud, quá 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ô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, anh mentor đã 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ư:
+ JIRA: Sử dụng để quản lý tiến độ công việc.
+ Git – công cụ quản lý source code trực quan với nhiều tính năng.
+ Visual Studio Code, Visual Studio: các IDE hữu ích và phổ biến với lập trình viên. + Figma: công cụ
thiết kế giao diện web.
+ Postman: Testing APIs.
Thực hiện:


+ Thực hành sử dụng các phần mềm đã nêu trên.

Thực tập doanh nghiệp
Kết quả

+ Hiểu cơ chế vận hành và sử dụng thành thạo, trơn tru các công cụ trên phục vụ cho việc phát triển ứng
dụng web nhanh hơn.

2.2.2. Tìm hiểu về quy trình làm việc của cơng ty
Thời gian: 3 ngày
Nội dung: Tìm hiểu về các quy trình làm việc theo mơ hình Scrum-Agile.
+ Được các anh chị trong công ty hướng dẫn, chỉ dạy và thử tham dự vào quy trình làm việc của cơng ty.
Thực hiện:
+ Thực hành tham gia vào các giai đoạn của mơ hình.
Kết quả:
+ Có thêm kiến thức và thực hành nhuần nhuyễn các cơng đoạn.

2.2.3. Tìm hiểu về ReactJS
Thời gian: 10 ngày
Nội dung
+ Tìm hiểu về lập trình Frontend với ReactJS.
Thực hiện
+ Tìm hiểu lập trình frontend, HTML, CSS, SCSS, Javascript, Bootstrap.
+ Tìm hiểu chung về ReactJS cơ bản.
+ Tìm hiểu về Component, Lifecycle, Hook, Sharing Data trong ReactJS.
+ Tìm hiểu về Virtual DOM và cách DOM render của ReactJS.
+ Tìm hiểu về làm việc với API trong ReactJS.
Kết quả:
+ Nắm vững và trả lời được các câu hỏi của Mentor, làm quen được ngôn ngữ ReactJS.

2.3. Thực hiện dự án
Trong hơn 1 tháng thực tập đầu tiên, dưới sự hướng dẫn nhiệt tình của anh chị mentor và bằng sự cố
gắng, không ngừng học hỏi, em đã trang bị được các kiến thức nền tảng để có thể xây dựng sản phẩm
hoàn chỉnh . Trong tháng thứ hai, em được cơng ty cho phép tham gia vào q trình xây dựng project

của công ty.

Thực tập doanh nghiệp

2.4. Lịch làm việc
Tuần

Công việc

Người hướng dẫn

Mức độ hồn thành

Nhận
xét

1

+ Tìm hiểu về

chị Lâm Ngọc Quyên, anh100%

công ty.

Huỳnh Tuấn Kiệt.

Tốt

+ Học cách trao đổi

qua email.
+ Sử dụng công cụ
Jira để kiểm
tra tiến độ công việc
+ Học cách làm việc
nhóm thơng qua Git

2

+ Tìm hiểu các
kiến thức nâng
cao về ngôn ngữ

anh Đặng Quang Trung

100%

Tốt


Thực tập doanh nghiệp
ReactJS.
3

+ Tiếp tục tìm

anh Huỳnh Tuấn Kiệt

100%

Tốt

+ Tìm hiểu cách

anh Đặng Quang Trung,

100%

Tốt

chuyển đổi giao

anh Nguyễn Đồn Trọng

diện web từ

Nghĩa.

100%

Tốt

hiểu về ReactJS,
NodeJS
4

5

Figma sang code. +
Tham gia các buổi

training về công
nghệ.
6
7
8

+ Tham gia vào các anh Đặng Quang Trung,
dự án thật.
+ Kiểm tra kiến
thức thực tập.

anh Huỳnh Tuấn Kiệt.


Thực tập doanh nghiệp

CHƯƠNG 3: CHI TIẾT VỀ DỰ ÁN
3.1. Website Unicloud
3.1.1. Giới thiệu
+ Là website giới thiệu về các giải pháp thuộc hệ sinh thái của công ty Unicloud.

3.1.2. Thực hiện
+ Làm việc theo nhóm cùng các bạn thực tập sinh khác.
+ Tự tìm hiểu tài liệu và nhận sự trợ giúp, hỏi đáp từ các anh chị mentor.

3.1.3. Kết quả
+ Hoàn thành đúng tiến độ được giao.

3.2. Website Sliving
3.2.1. Giới thiệu

+ Dự án giới thiệu về giải pháp nhà thơng minh của cơng ty.
+ Mục đích ứng dụng các công nghệ, kỹ thuật tiên tiến mà công ty đã nghiên cứu, chế tạo vào lắp đặt
thực tế trong các căn hộ.

3.2.2. Thực hiện
+ Làm việc theo nhóm.
+ Làm việc dựa theo tài liệu được cung cấp và thực hiện đúng kết quả mong muốn

3.2.3. Kết quả
+ Hoàn thành đúng tiến độ được giao.

3.3. Website Unicloud Career
3.3.1. Giới thiệu
+ Dự án giới thiệu về việc tuyển nhân sự của cơng ty.
+ Mục đích giới thiệu về cơng ty cũng như những vị trí và thơng tin cần thiết cho những ai đang cho nhu
cầu, mong muốn được làm việc cho công ty.


3.3.2. Thực hiện
+ Làm việc theo nhóm.
+ Làm việc dựa theo tài liệu được cung cấp và thực hiện đúng kết quả mong muốn

3.3.3. Kết quả
+ Hoàn thành đúng tiến độ được giao.

TỔNG KẾT
Như vậy, trong vòng hơn hai tháng, em đã được học hỏi và trải nghiệm được nhiều kiến thức bổ ích.
Cơng ty đã giúp em học hỏi được thêm nhiều công nghệ mới, phổ biến trong ngành hiện nay như
ReactJS, Bootstrap, NextJS,... . Đồng thời, biết cách tổ chức làm việc nhóm, thảo luận và giúp đỡ nhau
trong công việc, rèn được khả năng làm việc dưới áp lực và tính tự lập trong cơng việc. Ngồi ra, với

những trải nghiệm khi được công ty tạo điều kiện cho tham gia vào dự án thực tế đã giúp em tích lũy
thêm nhiều kinh nghiệm quý báu cho việc đi làm sau này.
Chân thành cảm ơn sự giúp đỡ của các anh chị trong dự án và đặc biệt là anh Đặng Quang Trung trainer cũng chính là người hướng dẫn cho em ReactJS và anh Huỳnh Tuấn Kiệt – trainer NodeJS,
ExpressJS và anh Phạm Minh Tuấn – giám đốc chi nhánh, đã nhiệt tình giúp đỡ, tạo điều kiện thuận lợi
cho em hoàn thành kỳ thực tập này.
Đặc biệt, em vô cùng biết ơn và gửi lời cảm ơn chân thành đến quý thầy cô khoa Công nghệ Phần mềm
đã tận tâm chỉ dạy cho em những kiến thức nền tảng để có thể tham gia khóa thực tập của công ty. Một
lần nữa em xin chân thành cảm ơn.


Thực tập doanh nghiệp

TÀI LIỆU THAM KHẢO
[1]. Docs Nodejs: />[2]. Tutorial ReactJS: [3]. Web Development
with Node and Express - Ethan Brown [4]. Node.js By Example - Krasimir Tsonev


12