báo cáo thực tập doanh nghiệp lập trình WEB với REACTJS

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
----------

BÁO CÁO THỰC TẬP DOANH NGHIỆP

LẬP TRÌNH WEB VỚI REACTJS

Nơi thực tập: Cơng ty CP PT Phần Mềm Á Đông
Người hướng dẫn: Võ Đăng Khoa
Sinh viên thực hiện: Hoàng Anh Dũng
Mã số sinh viên: 14520192

Tp. Hồ Chí Minh, ngày 10 tháng 1 năm 2021


LỜI MỞ ĐẦU
Những năm gần đây, ngành công nghệ thông tin luôn phát triển với tốc độ cao ở
Việt Nam địi hỏi một nguồn nhân lực lớn. Các cơng ty product cũng như outsourcing đều
muốn tạo ra các sản phẩm chất lượng đến và mang đến trải nghiệm tốt nhất với khách
hàng. Chính vì thế, người chịu trách nhiệm đảm bảo chất lượng sản phẩm thông qua việc
làm việc tương tác giữa các bên liên quan là rất cần thiết.
Trong bài báo cáo này, tơi xin được trình bày về chương trình thực tập tại Cơng ty
CP PT phần mềm Á Đông với nhiệm vụ Kỹ sư phần mềm (Reactjs Developer) với việc
tham gia làm việc trong các dự án outsource của công ty.
Nội dung bài báo cáo gồm các phần sau
-

Giới thiệu cơng ty và chương trình thực tập

-

Báo cáo nội dung thực tập

-

Kinh nghiệm thực tiễn thu được

-

Những đóng góp cho cơng ty

-

Tài liệu tham khảo


LỜI CẢM ƠN
KHOA CÔNG NGHỆ PHẦN MỀM
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

Em xin chân thành cảm ơn trường Đại học Công nghệ Thông tin và Khoa Công
nghệ Phần mềm đã tạo điều kiện cho em hoàn thành tốt đợt thực tập doanh nghiệp. Nhờ
đợt thực tập này đã giúp cho em rất nhiều kinh nghiệm quý báu. Những kinh nghiệm đó
sẽ giúp em hồn thiện hơn trong cơng việc và môi trường làm việc sau này .
Em cũng xin cảm ơn q thầy cơ trong khoa đã tận tình giảng dạy và trang bị cho
em những kiến thức cần thiết. Chính những kiến thức này hỗ trợ em rất trong việc hồn
thành khóa thực tập doanh nghiệp.
Mặc dù em đã cố gắng hoàn thành báo cáo thực tập doanh nghiệp. Tuy nhiên sẽ có
những thiếu sót, rất mong nhận được sự thông cảm, chia sẻ của quý thầy cô để giúp em
hồn thành tốt bộ mơn thực tập doanh nghiệp.

Một lần nữa em xin chân thành cảm ơn !

Hồ Chí Minh, ngày 10 tháng 1 năm 2021
Sinh viên thực tập

Hoàng Anh Dũng


LỜI CẢM ƠN
CÔNG TY CP PT PHẦN MỀM Á ĐÔNG

Em xin chân thành cảm ơn Công ty CP PT phần mềm Á Đông đã hỗ trợ, tạo điều
kiện cho em được tham gia thực tập ở Công ty trong thời gian vừa qua.
Em xin đặc biệt cảm ơn anh Võ Đăng Khoa, anh Bùi Thanh Chính, anh Lương
Trường An đã giúp đỡ, kèm cặp em trong suốt quá trình training và thực tập ở công ty.
Nhờ sự hướng dẫn của các anh đã giúp em có kinh nghiệm quý báu .Những kinh nghiệm
đó sẽ giúp em hồn thiện hơn trong công việc và môi trường làm việc sau này .
Mặc dù em đã cố gắng hoàn thành báo cáo thực tập doanh nghiệp. Tuy nhiên sẽ có
những thiếu sót, rất mong nhận được sự thơng cảm, chia sẻ và góp ý của cơng ty để báo
cáo của em có thể tốt và hoàn thiện hơn.
Một lần nữa em xin chân thành cảm ơn !

Hồ Chí Minh, ngày 10 tháng 1 năm 2021
Sinh viên thực tập

Hoàng Anh Dũng


NHẬN XÉT
(Của giảng viên)

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


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

Mục Lục
PHẦN I. GIỚI THIỆU TỔNG QUAN VỀ DOANH NGHIỆP............................................
1.

Giới thiệu tổng quan về công ty CP PT phần mềm Á Đông......................................
1.1 Sơ lược về công ty...................................................................................................
1.2 Nhiệm vụ, chức năng...............................................................................................
1.3 Cơ cấu tổ chức.........................................................................................................
1.4 Văn hóa cơng ty.......................................................................................................

2.

Giới thiệu về cơng việc thực tập................................................................................
2.1 Vị trí thực tập........................................................................................................
2.2 Cơng việc thực tập.................................................................................................
2.3 Yêu cầu đối với sinh viên thực tập........................................................................
2.4 Nhiệm vụ của sinh viên thực tập...........................................................................
2.5 Lịch thực tập cụ thể...............................................................................................

PHẦN II. CƠNG NGHỆ, GIẢI PHÁP, QUY TRÌNH ÁP DỤNG.......................................
1.

Giới thiệu về Git và Source Tree...............................................................................
1.1 Git............................................................................................................................
1.2.SourceTree...............................................................................................................

2. Giới thiệu về VSCode…………………………………………………………………
3. Vòng đời của ReactJS………………………………………………………………….
4. UX/UI ReactJS và Layout……………………………………………………………..
5. Redux………………………………………………………………………………......


6. Redux Saga…………………………………………………………………………….
7. Reselect………………………………………………………………………………...

8. Rjsx…………………………………………………………………………………..
9. Sync and Async programming………………………………………………………
10. Agile Scrum…………………………………………………………………………
PHẦN III. NỘI DUNG THỰC TẬP....................................................................................
1.

Nhiệm vụ của sinh viên được giao............................................................................

2.

Project Kaercher........................................................................................................
2.1 Giới thiệu...............................................................................................................
2.2 Trách nhiệm trong dự án..........................................................................................

PHẦN IV. KẾT LUẬN........................................................................................................
1.

Nhận xét đánh giá về doanh nghiệp và góp ý của sinh viên......................................
1.1 Về quy mơ cơng ty..................................................................................................
1.2 Về mơi trường làm việc...........................................................................................
1.3 Về văn hóa cơng ty..................................................................................................

2.

Kinh nghiệm đạt được...............................................................................................

PHẦN V. TÀI LIỆU THAM KHẢO....................................................................................


PHẦN I. GIỚI THIỆU TỔNG QUAN VỀ DOANH NGHIỆP

1. Giới thiệu tổng quan về công ty CP PT phần mềm Á Đông
1.1 Sơ lược về công ty
Tên công ty: Công ty CP PT phần mềm Á Đông
Địa chỉ: Tầng 5 tòa nhà Etown 1, 364 Cộng Hòa, Phường 13, Tân Bình, Hồ
Chí Minh
Điện thoại: (+84) 28 3812 0101
Email:
Địa chỉ Website: />Công ty CP PT phần mềm Á Đông được thành lập vào năm 2005 với CEO
là chị Nguyễn Thị Tuyết Nhung cùng với các anh Oyvind Forsbak. Ngày
nay, Orient là một trong những công ty phát triển phần mềm lớn ở Việt
Nam. Sau gần 10 năm cung cấp các giải pháp CNTT chuyên nghiệp, đội
ngũ 100 chuyên gia CNTT lành nghề và giàu kinh nghiệm của Orient đã
hợp tác để cung cấp các giải pháp phát triển phần mềm cho khách hàng với
các doanh nghiệp vừa và nhỏ trên tồn thế giới. Danh sách khách hàng của
chúng tơi tại Orient bao gồm các công ty từ các công ty mới thành lập, nóng
bỏng cho đến các tập đồn được thành lập tốt. Khách hàng của chúng tôi
biết rằng sử dụng đội ngũ nhân viên chuyên nghiệp của chúng tôi cho nhu
cầu CNTT giúp tăng thu nhập, xây dựng hoặc cải thiện các kênh truyền
thơng và đơn giản hóa các hoạt động.
Tại Orient, chúng tôi biết rằng chúng tôi cần hiểu rõ về tổ chức công ty của
bạn để cung cấp cho bạn các giải pháp CNTT hiệu quả, chất lượng hàng đầu
phát triển theo nhu cầu của công ty bạn. Chúng tơi có thể cung cấp cho bạn
1


các giải pháp phần mềm cá nhân ở mọi quy mơ vì chúng tơi biết cách sử
dụng sức mạnh của các cơng nghệ khác nhau và tích hợp chúng một cách
liền mạch
1.2 Nhiệm vụ, chức năng
1.2.1 Phát triển ứng dụng mobile

CP PT phần mềm Á Đông tập trung chủ yếu phát triển các lĩnh vực sau:
 Android
 Phát triển ứng dụng máy khách / máy chủ Android.
 Giải pháp kiểm tra thiết bị cầm tay Android.
 Gửi ứng dụng lên Google Play Android Marketplace.
 Phát triển ứng dụng phần mềm Android tùy chỉnh.
 Phát triển ứng dụng đa phương tiện phong phú cho Android.
 Cổng ứng dụng của bên thứ ba trên thiết bị Android.
 IOS
 Phát triển ứng dụng IOS
 Phát triển ứng dụng GPS
 Phát triển trò chơi trên Iphone
 Phát triển ứng dụng web safari
 Phát triển ứng dụng mạng xã hội
Các project nổi bật như là Croozemode, Yappa App, Imageware App, Chit
Chat English, Inspekt,…
1.2.2 Phát triển Web
CP PT phần mềm Á Đông tập trung chủ yếu phát triển các lĩnh vực sau:
2


• Backend tập trung vào .NET, ASP.NET, PHP, JAVA,…
• Frontend framework công ty chủ yếu làm về AngularJs, ReactJs
Các project nổi bật như Penetrace, Skribenta & Finder, Kikora, Yuntaa,…
1.3 Cơ cấu tổ chức

Giám Đốc

Trợ Lý
Giám Đốc

Bộ phận
nhân sự

Bộ phận
Designer

Tech
Developer

Bộ phận
BA/QA

Sơ đồ 1: Cơ cấu tổ chức công ty CP PT phần mềm Á Đơng

1.4 Văn hóa cơng ty
- Nhân viên phải có mặt ở cơng ty trước 10:30 AM và check in bằng
fingerprint. Nếu đi làm sau 10:30 AM thì sẽ bị vắng buổi sáng làm
việc.
- Thời gian làm việc từ thứ 2 đến thứ 6 và làm việc 40 tiếng 1 tuần tối
thiểu 6 tiếng 1 ngày.
- Thời gian nghỉ trưa từ 12:00 PM đến 1:00 PM, mọi nhân viên có thể
ăn trưa và ngủ trước khi bắt đầu công việc vào buổi chiều.
3


- Nhân viên được khuyến khích sử dụng tiếng Anh khi giao tiếp, trò
chuyện trên Skype, Microsoft Team…
- Đồ ăn nhẹ, trà, cà phê, trái cây miễn phí cho tất cả nhân viên vào thời
gian nghỉ ngơi.
- Vào thứ 4 cuối cùng của mỗi tháng có một buổi tiệc Happy Lunch sẽ

được tổ chức, nhân viên tập trung lại 1 khu vực đã được chuẩn bị và
thường thức bữa trưa cùng nhau.
- Một buổi sinh nhật nhỏ cho tất cả các nhân viên hằng tháng.
2. Giới thiệu về công việc thực tập
2.1 Vị trí thực tập
Sinh viên thực tập tại vị trí React.js Developer Intership
2.2 Cơng việc thực tập
- Tìm hiểu về quy trình phát triển phần mềm
- Tìm hiểu về các chuyên đề phát triển một ứng dụng web hồn thiện.
- Tìm hiểu về các ngun tắc code.
- Tìm hiểu về các công cụ hỗ trợ đảm bảo chất lượng phần mềm
- Tham gia vào các dự án thực tế của công ty (KaercherNet Project)
2.3 Yêu cầu đối với sinh viên thực tập
- Nắm được quy trình phát triển phần mềm và khả năng ứng dụng vào
các dự án thực tế.
- Có một dự án thực tế và phát triển web đó thành một web hồn chỉnh
- Hiểu rõ các kiến thức, công nghệ cơ bản và nâng cao như ReactJS,
Redux Saga, Reselect, Rjsx, Axios, Jest,…
4


- Sử dụng thành thạo các công cụ hỗ trợ đảm bảo chất lượng phần mềm
- Giao tiếp tốt và phối hợp làm việc hiệu quả với các thành viên trong
dự án
2.4 Nhiệm vụ của sinh viên thực tập
- Hoàn thành đầy đủ các task trong dự án do người hướng dẫn thực tập
đưa ra.
- Thực hiện theo quy trình phát triển phần mềm của cơng ty.
- Đảm bảo hồn thành dự án theo đúng yêu cầu và thời gian quy định.
- Đi làm đúng giờ, số ngày trong tuần theo thỏa thuận với công ty. Tối

thiểu 40h/tuần và thực tập trong vòng 3 tháng.
2.5 Lịch thực tập cụ thể

ST
T
1

Thời gian

Cơng việc
-

Tìm hiểu về Git và các tool

Người hướng dẫn
Bùi Thanh Chính

liên quan tới Git.

2
3
4
5
6

-

Tìm hiểu SourceTree

-

Cơ bản về ReactJS, VSCode

-

UX/UI và layout

-

Redux, redux-saga

-

Reselect, Rjsx

-

Synchonus và Asynchonus

Võ Đăng Khoa
Lương Trường An
Lương Trường An
Bùi Thanh Chính
Lương Trường An
Bùi Thanh Chính

5

Lương Trường An
Lương Trường An

Programing
7
8

Bùi Thanh Chính

-

Alige/Scum

-

Jira và sử dụng Jira trong một

Bùi Thanh Chính

dự án thực tế
9

-

Áp dụng những kiến thức đã
học phát triển dự án của cơng

Bùi Thanh Chính
Lương Trường An

ty

PHẦN II. CƠNG NGHỆ, GIẢI PHÁP, QUY TRÌNH ÁP DỤNG
1. Giới thiệu về Git và Source Tree
1.1 Git

6


Git là tên gọi của một Hệ thống quản lý phiên bản phân tán (Distributed
Version Control System – DVCS) là một trong những hệ thống quản lý phiên bản
phân tán phổ biến nhất hiện nay. DVCS nghĩa là hệ thống giúp mỗi máy tính có thể
lưu trữ nhiều phiên bản khác nhau của một mã nguồn được nhân bản (clone) từ
một kho chứa mã nguồn (repository), mỗi thay đổi vào mã nguồn trên máy tính sẽ
có thể ủy thác (commit) rồi đưa lên máy chủ nơi đặt kho chứa chính. Và một máy
tính khác (nếu họ có quyền truy cập) cũng có thể clone lại mã nguồn từ kho chứa
hoặc clone lại một tập hợp các thay đổi mới nhất trên máy tính kia. Trong Git, thư
mục làm việc trên máy tính gọi là Working Tree. Đại loại là như vậy.

7


Mơ hình hoạt động của DVCS
Ngồi ra, có một cách hiểu khác về Git đơn giản hơn đó là nó sẽ giúp bạn lưu lại
các phiên bản của những lần thay đổi vào mã nguồn và có thể dễ dàng khôi phục
lại dễ dàng mà không cần copy lại mã nguồn rồi cất vào đâu đó. Và một người
8


khác có thể xem các thay đổi của bạn ở từng phiên bản, họ cũng có thể đối chiếu
các thay đổi của bạn rồi gộp phiên bản của bạn vào phiên bản của họ. Cuối cùng là

tất cả có thể đưa các thay đổi vào mã nguồn của mình lên một kho chứa mã nguồn.
Cơ chế lưu trữ phiên bản của Git là nó sẽ tạo ra một “ảnh chụp” (snapshot) trên
mỗi tập tin và thư mục sau khi commit, từ đó nó có thể cho phép bạn tái sử dụng
lại một ảnh chụp nào đó mà bạn có thể hiểu đó là một phiên bản. Đây cũng chính là
lợi thế của Git so với các DVCS khác khi nó không “lưu cứng” dữ liệu mà sẽ lưu
với dạng snapshot.

9


Git Flow

10


Git Branching

11


1.2.

SourceTree

12


SourceTree là một tool hỗ trợ quản lý Git version với giao diện dễ dùng.
Kéo dự án về ( Clone project )
– Bạn click vào Clone/new một popup sẽ hiện ra

Lưu ý:


Cách lấy source path/url

13


chỉ cần copy đoạn code trên paste vào Source Url sẽ tự sinh ở destination
path, nếu để tự sinh thì nó sẽ được lưu vào thư mục mặc định nên bạn cần thay đổi
lại đường dẫn Destination Path trỏ vào một thư mục rỗng( bạn phải chắc chắn thư
mục đó là rỗng ). Sau đó click vào clone lúc này thư mục cho dự án đã được kéo về
máy tính cá nhân của bạn. Ở các máy thành viên khác cũng làm tương tự.
Đẩy code lên( push code )
Đây là việc cần thiết khi có sự thay đổi trong source code, trước khi push được bắt
buộc phải click vào unstaged files và comment -> click vào push trên toolbar của
source tree. Việc làm này phải được thực hiện thường xuyên khi có sự thay đổi về
code để người quản lý có thể quản lý được cơng việc cũng như là các thành viên
khác có thể nắm bắt được sự thay đổi.

14


Kéo code về( pull code )
Cũng giống như Push code lên tuy nhiên việc bây giờ chỉ là lấy code về bao gồm
những thay đổi mà thành viên khác đã push lên. Bạn chỉ cần click vào Pull ở
trên toolbar của source tree

15

Lưu ý:
– Nếu có nhiều người cùng thay đổi trên 1 file và cùng một chỗ thì chắc chắn bạn
sẽ bị conflict và việc pull hoặc Push code lên sẽ báo lỗi và không thực hiện được.
Dấu hiệu nhận biết lỗi Conflict sẽ xuất hiện dòng lỗi sau:
1 Auto-merging hello.html
2 CONFLICT (content): Merge conflict in hello.html
3 Automatic merge failed; fix conflicts and then commit the result.

2. Giới thiệu về VSCode

16


Visual Studio Code là sản phẩm của Microsoft, ra mắt vào tháng 4 năm 2015 ở
hội nghị Build. Đặc điểm nổi bật là đơn giản, gọn nhẹ, dễ dàng cài đặt. Visual
Studio Code có thể cài đặt được trên cả Windows, Linux và Mac OS và hỗ trợ
nhiều ngôn ngữ
Giao diện ban đầu:

17


Nhìn sang thanh sidebar ta thấy 4 biểu tượng, đầu tiên là hai tờ giấy xếp chồng lên
nhau, đây là cây thư mục chứ những file mà chúng ta đang làm việc. Hình chiếc
kính lúp hỗ trợ chức năng tìm kiếm. Một điểm đặc biệt là Visual Studio Code được
tính hợp luôn git, rất tiện cho việc quản lý code của chúng ta.

Biểu tượng thứ 4 là diệt con bọ, chính là chức năng hỗ trợ chúng ta fix bug. Hình

vng cuối cùng là nơi cho phép chúng ta cài thêm các phần extensions mà
Microsoft và cộng đồng viết thêm cho chúng ta

3. Vịng đời Reactjs?

Một vịng đời sẽ có trạng thái như sau:
1) Initialization
18