Lập trình web với reactjs (báo cáo thực tập)

1

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 REACTJS

Cơng ty thực tập: Cơng ty TNHH Phần mềm FPT Hồ Chí Minh
Thực tập sinh: Huỳnh Việt Tiến – MSSV: 15520877

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

Huỳnh Việt Tiến


2

LỜI MỞ ĐẦU

Ngày nay, ngành công nghiệp phát triển ứng dụng và công nghệ web là một bộ phận
không thể thiếu của ngành công nghiệp phần mềm. Với tốc độ phát triển vô cùng mạnh mẽ,
ngành phát triển web đã và đang là nhân tố kích thích sự phát triển của công nghệ thông tin thế
giới, cả về phần cứng và phần mềm.
Cùng với xu thế phát triển của thế giới, Việt Nam cũng không phải ngoại lệ. Ngành công
nghiệp phát triển web của Việt Nam đã và đang phát triển mạnh mẽ, đã có thể cạnh tranh với
những cơng ty hàng đầu về phát triển web trên thế giới. Bên cạnh sự phát triển của ngành công
nghiệp web cũng kéo theo sự phát triển của một số ngành nghề khác thúc đẩy sự phát triển của
nó dễ nhận thấy như các trang web mạng xã hội, hay những trang web thương mại điện tử,
những trang web live stream trực tuyến,…

Sau khoảng thời gian 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 xây dựng web trong một môi trường chuyên nghiệp, em có dự
định là sẽ thực tập sau hè. Vì vậy, em quyết định chọn Cơng ty TNHH Phần mềm FPT Hồ Chí
Minh - 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.

Huỳnh Việt Tiến


3

LỜI CẢM ƠN

Trân trọng gửi lời cảm ơn Công ty TNHH Phần mềm FPT Hồ Chí Minh đã 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, nhóm
thực tập chúng em đã tiếp thu được những kiến thức quan trọng để có thể làm được website sử
dụng ReactJS. Các kiến thức để quản lý source code, testing và các tổ chức source code, cùng
với đó là được trau dồi các kỹ năng mềm và được học tiếng anh giao tiếp. Chân thành cảm ơn
các anh chị trong nhóm trainer, admin đã bỏ ra nhiều thời gian, công sức để hướng dẫn và hỗ trợ
chúng em hoàn thành đợt thực tập này.
Đặc biệt cảm ơn anh Võ Đức Anh, đã chấp nhận cho em thực tập tại công ty. Cảm ơn
anh Nguyễn Đình Lương đã dạy em những kiến thức về lập trình web. Cảm ơn anh Mã Hồng
Nhật Phi đã dạy em những kiến thức về sử dụng công cụ quản lý source code, library ReactJS,
kiến thức về testing và chỉ ra các thiếu sót của bản thân em,…Và cám ơn các anh/chị admin, các
anh/chị mentor khác và các bạn trong team đã giúp đỡ em trong quá trình thực tập tại FPT
Software Hồ Chí Minh
Cũng xin cảm ơn thầy cơ trong khoa Cơng nghệ phần mềm đã nhiệt tình hỗ trợ, tạo điều
kiện em làm bài báo cáo này.

Huỳnh Việt Tiến
TP. Hồ Chí Minh, ngày 10/06/2022

Huỳnh Việt Tiến


4

NHẬN XÉT CỦA KHOA

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

Huỳnh Việt Tiến

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. Giới thiệu về công ty FPT Software....................................................................6
2. Sản phẩm của công ty .......................................................................................7
Chương 2: Nội dung thực tập..................................................................................8
1. Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty .........................................8
2. Nghiên cứu kỹ thuật..........................................................................................8
3. Thực hiện project............................................................................................ 11
4. Lịch làm việc ................................................................................................. 11
Chương 3: Chi tiết về project................................................................................ 13
1. Giới thiệu về Project ....................................................................................... 13
2. Thực hiện ...................................................................................................... 14
3. Kết quả.......................................................................................................... 15
TÀI LIỆU THAM KHẢO...................................................................................... 16
TỔNG KẾT........................................................................................................... 17

Huỳnh Việt Tiến


6

Chương 1: Giới thiệu công ty thực tập

1. Giới thiệu công ty FPT Software

Được thành lập từ năm 1999, tiền thân thuộc Tập đoàn FPT, FPT Software đã trở
thành một trong những công ty gia công phần mềm lớn nhất Việt Nam với danh thu
năm 2020 là $513.6 million. Có hơn 56 văn phòng ở 26 quốc gia, với thị trường
chính ở Nhật Bản, Hoa Kỳ, Châu Âu, Châu Á Thái Bình Dương, Việt Nam cùng hơn
18000 lao động. FPT Software phục vụ 700 khách hàng lớn, trong đó có 83 khách
hàng lọt vào danh sách Fortune 500. FPT Software hiện đã đạt được những thành
tích rất ấn tượng khi nằm trong Top 100 nhà cung cấp dịch vụ phần mềm toàn cầu và
được đánh giá là một trong 2 nơi làm việc tốt nhất Việt Nam trong lĩnh vực CNTT.
Với tham vọng trở thành công ty được hướng dẫn bởi những đổi mới công nghệ,
cam kết đem lại sự hài lịng cao nhất cho khách hàng, góp phần vào sự phát triển
thịnh vượng của quốc gia và cung cấp cho nhân viên môi trường làm việc thuận lợi
nhất, FPT Software đã tạo nên sự khác biệt cho mình nhờ 5 yếu tố:
• Chất lượng dịch vụ đạt chuẩn thế giới.
• Đáp ứng được nhu cầu khắt khe của các cơng ty hàng đầu.
• Ln đi đầu về cơng nghệ.
• Nguồn nhân lực chuyên nghiệp.
• Giá thành cạnh tranh.
Nhờ vậy, FPT Software đã vinh dự nhận được các chứng chỉ thế giới về chất
lượng và bảo mật như: CMMI 5 và ISO 27001: 2005, ISO 9001, ISO 20000. Tính
Huỳnh Việt Tiến


7

đến nay, công ty đã phục vụ cho hơn 400 khách hàng trên tồn thế giới, với các thị
trường chính ở: Nhật Bản, Hoa Kỳ, Châu Âu, Việt Nam... Hay hợp tác với những
khách hàng là những nhà công nghệ hàng đầu thế giới như: Hitachi, Neopost, IBM,
Continental, Fujitsu, NTT, Canon, Panasonic, Toshiba, Sony, …
Từ khi thành lập đến nay, FPT Software luôn theo đuổi một sứ mạng: cung cấp
các dịch vụ từ nguồn lực tài năng của Việt Nam với chất lượng tốt nhất, cam kết đem

lại sự hài lòng cao nhất cho khách hàng… đã giúp FPT Software trở thành công ty
phần mềm phát triển nhanh nhất và đã có sự hiện diện rộng rãi trên nhiều thị trường
tồn cầu khác nhau.

2. Sản phẩm của cơng ty
Với bề dày gần 26 năm trong việc tạo dựng và phát triển các mơ hình kinh doanh
quy mơ lớn trong lĩnh vực phần mềm, FPT Software cung cấp các dịch vụ đạt tiêu
chuẩn quốc tế ở các mảng:
• Dịch vụ phần mềm truyền thống (Application Services, Business Application
Services, Legacy Migration, Testing & BPO);
• Dịch vụ Digital Age services (Cloud, Mobility, Analytics & Internet of
Things)
• Dịch vụ Product Engineering bao gồm Embedded System, CAD/CAM và IC
Design.

Huỳnh Việt Tiến


8

Chương 2: Nội dung thực tập
Đợt thực tập với chủ đề “Lập web với ReactJS” nhằm mục đích giúp sinh viên thực tập
được đào tạo tồn diện về lập trình giao diện web sử dụng ReactJS, đồ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 web chun nghiệp.

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, q 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 FPT Software, 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. Nghiên cứu kỹ thuật
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, anh Phi đã 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ư Git - sử
dụng trong làm việc nhóm, Notepad ++ - một chương trình soạn thảo văn bản rất hữu
ích và phổ biến với lập trình viên. Các extension cần thiết trên Visual Studio Code để
hỗ trợ q trình làm việc dễ dàng hơn.
Ngồi ra cịn tìm hiểu về các phần mềm quản lí:

Huỳnh Việt Tiến


9

+ Trello: là một ứng dụng lập danh sách dựa trên web, dùng để quản lý và phân
chia công việc cho các thành viên trong team

2.2.

2.3.

Thực hiện : Thực hành sử dụng các phần mềm đã nêu trên.
Kết quả : Hiểu và 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
Tìm hiểu các kiến thức cơ bản của lập trình web
Thời gian : 14 ngày (2 tuần)
Nội dung : Được training về các khái niệm cơ bản của web browser, các xây dựng
một giao diện web với desgin có sẵn.
- Training các kiến thức về cách hoạt động của web browser các giao thức HTTP.
- Training các kiến HTML, CSS, Javascript để xây dựng giao diện web với desgin
có sẵn.
Thực hiện :
- Tham gia các khố học online và slide do cơng ty cung cấp.
- 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.
Tìm hiểu library ReactJS
Thời gian : 21 ngày (3 tuần)

Huỳnh Việt Tiến


10

Nội dung : Được tìm hiểu và training về library ReactJS và các library cần thiết đi
kèm với nó như: react-router-dom, redux,…
- Training về các kiến thức cơ bản của ReactJS như components, state và props.
Cách tạo component mới trong project và cách sử dụng nó, sự khác biệt giữa
functional component và class component.
- Training kiến thức về lifecycle của một class component .
- Training kiến thức về cách sử dụng hook với functional component và mapping

lifecycle của class component sang functional component bằng cách sử dụng
hook. Tự tạo một custome hook mới.
- Được học cách sử dụng thư viện react-router-dom áp dụng vảo router vào
ReactJS.
- Được học cách sử dụng thư viện redux và các thư viện middleware của nó để
quản lý state trong ứng dụng ReactJS.
- Được học cách testing một ReactJS sử dụng jest với react-testing-library.

Thực hiện :
- Tham gia các khoá học online và slide do công ty cung cấp.
- 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.
- Trao đổi cùng mentor để giải quyết các thắc mắc xuất hiện trong quá trình học và
tìm hiểu.
Kết quả :

Huỳnh Việt Tiến


11

-

Nâng cao kỹ năng lập trình, hiểu rõ hơn về ReactJS và các library thường được sử
dụng chung với nó để đủ khả năng làm việc.
Có được những kiến thức quan trọng cho việc lập trình web với ReactJS sau này.
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.

3. Thực hiện project

Sau gần hai 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ề ReactJS, HTML, CSS,…. Trong tháng thứ ba, 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 xây dựng website học
trực tuyến.
Chi tiết đồ án sẽ được nói ở phần sau.
4. Lịch làm việc

T̀n

Cơng việc
-

1
-

2
3
4

-

Tìm hiểu về cơng
ty, 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.
Sử dụng công cụ
Trello để kiểm tra
tiến độ công việc

Học cách trao đổi,
làm việc qua email.
Tìm hiểu các kiến
thức cơ bản về lập
trình web
Sử dụng HTML,
CSS, JavaScript để
xây dựng một giao
diện web với desgin
cho trước
Training các kiến

Người hướng dẫn
Chị Nguyễn Thị
Thiên Thư
Chị Nguyễn Thị
Kim Anh
Anh Mã Hoàng
Nhất Phi

Mức
độ
hoàn
thành

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

100%

Tốt

100%

Tốt

100%

Tốt

Anh Nguyễn Đình
Lương

Anh Mã Hồng

Huỳnh Việt Tiến


12

5

6

7
8
9

thức về library
ReactJS

- Training kiến thức
về các library khác
thường đi kèm với
ReactJS
- Học testing một ứng
ReactJS
- Áp dụng những kiến
thực đã được học
kết hợp với một
team Back-end để
xây dựng một
website học trực
tuyến

Nhất Phi

Anh Võ Đức Anh
Anh Nguyễn Đông
Hưng
Chị Võ Trịnh Bối
Quyên

100%

Tốt

Huỳnh Việt Tiến


13

Chương 3: Chi tiết về project

1. Giới thiệu về project
Website là một nền tảng học trực tuyến để giáo viên và học viên có thể tương tác với
nhau
Giáo viên có thể đăng tải khố học của mình và học viên có thể mua và học các khố
học đó

Huỳnh Việt Tiến


14

Do yêu cầu bảo mật thông tin của doanh nghiệp nên em khơng thể trình bày chi tiết hơn.

2. Thực hiện
8 thành viên của team:
-

Front-end:
+ Huỳnh Việt Tiến

Huỳnh Việt Tiến


15

+ Đinh Tấn Tú
+ Huỳnh Trung Nghĩa

+ Lưu Vũ Sơn Duy
+ Phùng Thế Hùng
-

Back-end:
+ Trần Như Tuấn Anh
+ Đặng Phú Hưng
+ Đào Gia Hiệp

Và sự giúp đỡ tận tình của team trainer Fsoft.

3. Kết quả:
Đã hồn thành các tính năng tất yếu theo yêu cầu của dự án và đang tiếp tục thực
hiện các tính năng khác.

Huỳnh Việt Tiến


16

TÀI LIỆU THAM KHẢO

[1] React – A JavaScript library for building user interfaces (reactjs.org)
[2] Redux - A predictable state container for JavaScript apps. | Redux
[3] Cùng một số tài liệu nội bộ của dự án

Huỳnh Việt Tiến


17

TỔNG KẾT

Như vậy, trong vịng ba tháng, nhóm đã hồn thành các tính năng của một website học
trực tuyến. Website đã có khá đầy đủ các tính năng đã đề ra ban đầu. Do thời gian có hạn nên
chưa thể hồn thành hết các tính năng của website. Website khi có thời gian sẽ có thể hồn
thành hết tính năng và xây dựng thêm nhiều tính năng mới
Chân thành cảm ơn sự giúp đỡ của các anh chị nhóm trainer Fsoft, sự nỗ lực của nhóm
để có thể hồn thành website này. Cũng xin cảm ơn thầy cô trong khoa Cơng nghệ phần mềm
đã nhiệt tình hỗ trợ, tạo điều kiện em làm bài báo cáo này.

Huỳnh Việt Tiến