báo cáo thực tập FULL STACK WEB DEVELOPER

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

FULL-STACK WEB DEVELOPER
Công ty thực tập: VNG Corporation Người phụ trách:
Nguyễn Tiến Tùng Thực tập sinh: Hồ Nguyên Bảo

Tp Hồ Chí Minh, tháng 01 năm 2021\


1

LỜI MỞ ĐẦU
Hiện nay, chúng ta đang sống trong kỷ nguyên bùng nổ của Công nghệ thông tin. Thời đại
này có rất nhiều phương thức để truyền đạt thơng tin, trong đó việc truyền đạt thơng tin bằng cơng nghệ
số rất phổ biến và dễ dàng tiếp cận được nhiều người.
Các website hiện nay đã và đang giúp những tổ chức đạt được hiệu quả về kinh tế, chính trị
nhờ vào khả năng truyền tải và thu nhận thông tin của mình. Với nhu cầu xây dựng website ngày càng
tăng và các công nghệ hỗ trợ xây dựng website ngày càng xuất hiện nhiều, em quyết định bản thân sẽ
theo hướng đi năng động này.
Sau ba năm học ở đại học, để bản thân có thể áp dụng những kiến thức đã có và đạt được
kinh nghiệm thực tế trong một môi trường chuyên nghiệp, em quyết định thực tập tại VNG Corporation
– một môi trường năng động, sáng tạo và chuyên nghiệp – là nơi sẽ giúp em phát triển với định hướng
của bản thân.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
2

LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn VNG Corporation đã tạo điều kiện cho em có cơ hội được thực
tập tại cơng ty.
Nhờ sự chỉ dẫn nhiệt tình của các anh chị trong team, em đã tiếp thu được những kiến thức
quan trọng để có thể tham gia được những dự án thực tế.
Chân thành cảm ơn anh Nguyễn Tiến Tùng, anh Đỗ Minh Thiện, và các anh chị trong nhóm
ZStudio đã hướng dẫn cho em về mơi trường làm việc, kiến trúc kĩ thuật hiện có của team và kĩ năng lập
trình để hồn thành tốt dự án của mình.
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 cho
em làm bài báo cáo này.

Tp Hồ Chí Minh, 01 tháng 01 năm 2021

Hồ Nguyên Bảo


Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
3

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

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

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo

4


MỤC LỤC
LỜI MỞ ĐẦU .....................................................................................................
1

LỜI

CẢM

ƠN ..................................................................................................... 2 Chương
1: Giới thiệu công ty thực tập.......................................................... 5
1. Giới thiệu VNG Corporation................................................................... 5 2.
Sản phẩm của công ty............................................................................... 5
Chương 2: Nội dung thực tập............................................................................
6 1. Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty ......................... 6
2. Nghiên cứu kỹ thuật.................................................................................. 7
2.1. Các cơng cụ làm việc...................................................................................................................................7
2.2. Tìm hiểu React và Preact ...........................................................................................................................7
2.3. Tìm hiểu xây dựng Java Web API.............................................................................................................9
2.4. Tìm hiểu xây dựng microservice server ..................................................................................................10

3. Thực hiện Project.................................................................................... 12 4.
Lịch làm việc............................................................................................ 12
Chương 3: Chi tiết về Project..........................................................................
14 1. Project Group Review ............................................................................
14
1.1. Giới thiệu ...................................................................................................................................................14
1.2. Thực hiện ...................................................................................................................................................15

1.3. Kết quả.......................................................................................................................................................16

2. Project FCM Thrift Service ................................................................... 16 2.1. Giới thiệu
...................................................................................................................................................16 2.2. Thực hiện
...................................................................................................................................................16 2.3. Kết
quả.......................................................................................................................................................17

TÀI LIỆU THAM KHẢO ...............................................................................
18 TỔNG
KẾT....................................................................................................... 19

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo


5

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

1. Giới thiệu VNG Corporation
VNG (viết tắt của Vinagame) là một công ty công nghệ Việt Nam, thành lập
vào năm 2004 với 4 mảng sản phẩm chính là Trị chơi trực tuyến, Nền tảng kết nối,
Thanh toán điện tử và Dịch vụ điện tốn đám mây.
Cơng ty hiện có 7 văn phịng ở Hồ Chí Minh, Hà Nội, Đà Nẵng, Thái Lan và
Myanmar với số lượng nhân viên khoảng 2700 vào năm 2018.
Công ty tập trung phát triển 4 nhóm sản phẩm chính: Trị chơi trực tuyến, nền
tảng kết nối, tài chính và thanh tốn, dịch vụ đám mây.

2. Sản phẩm của cơng ty
Trò chơi trực tuyến
o

Phát triển và sản xuất trò chơi trực tuyến, phát hành ra thị trường quốc tế.
Sản phẩm: Khu vườn trên mây, Dead Target, iCá…).
o

Nhập khẩu và Phát hành các trò chơi nổi tiếng thế giới. Sản phẩm: Võ
Lâm Truyền Kỳ, Rules of Survival, Crossfire Legend…

Nền tảng kết nối
o Các nền tảng kết nối đa dạng, đa dịch vụ, phục vụ tồn diện nhu cầu
kết nối, giải trí, tìm kiếm của cá nhân và tổ chức.
o Nền tảng OTT Zalo, hệ sinh thái mạng xã hội giải trí Zing (Zing TV,
Zing MP3…)
o Các nền tảng vCS, 123Go, 123Phim, cơng cụ tìm kiếm Laban.vn….
Tài chính và thanh tốn

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
6


o Các nền tảng kết nối đa dạng, đa dịch vụ, phục vụ tồn diện nhu cầu kết
nối, giải trí, tìm kiếm của cá nhân và tổ chức.
o Nền tảng OTT Zalo, hệ sinh thái mạng xã hội giải trí Zing (Zing TV,
Zing MP3…)
o Các nền tảng vCS, 123Go, 123Phim, cơng cụ tìm kiếm Laban.vn….
Dịch Vụ Đám Mây
o Cung cấp các dịch vụ đám mây toàn diện cho tổ chức, doanh nghiệp, địa
phương.
o Các hệ thống, giải pháp công nghệ thông minh dựa trên kết nối Internet và
công nghệ đám mây.

o Sản phẩm: 123CS, Cloud server, IoT HUB, vCloudStack,
vObjectStorage, Tape Backup, vCloudcam, Vending Machine, …

Chương 2: Nội dung thực tậ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
o Người phụ trách giới thiệu về cơng ty, quy trình làm việc từ cao
xuống thấp, thời gian làm việc.
o Đồng thời thực tập sinh cũng được giới thiệu về cấu trúc của team
đang làm việc, văn hoá của team, …

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
7


Kết quả: Hiểu thêm về công ty VNG Corp, quá trình thành lập và phát triển. Biết được
thêm về team và mục tiêu hướng đến của team.

2. Nghiên cứu kỹ thuật
2.1. Các công cụ làm việc
Thời gian: 1 tuần.
Nội dung: Tìm hiểu các cơng cụ sẽ được sử dụng trong quá trình làm việc. Trong thời
gian này, người phụ trách đã hướng dẫn về các công cụ như: o Netbeans – IDE
dùng để xây dựng các project backend sau này.
o VS Code – Editor dùng để xây dựng các project frontend sau này.
o SVN – hệ thống quản lý version quản lý các thư viện nội bộ.
o Gitlab – hệ thống quản lý source code.
o Zeplin – công cụ làm việc giữa designer và developer

Thực hiện: Thực hành sử dụng các phần mềm đã nêu trên.
Kết quả: Có thể sử dụng các phần mềm nêu trên để tham gia vào project.

2.2. Tìm hiểu React và Preact
Thời gian: 1 tuần.
Nội dung: Được training về những khái niệm cơ bản của react và việc áp dụng preact –
một phiên bản gọn nhẹ của react, trong những project của team.
Props:
o Sử dụng để lưu các dữ liệu và chúng ta sẽ không thể thay
đổi được chúng.
o Thường sử dụng props trong những trường hợp muốn
truyền dữ liệu vào component.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
8


State:
o State là nơi chứa dữ liệu của component, có thể thay đối
được trong tồn bộ vịng đời của component.
o State có thể được khởi tạo trong constructor.
Life cycle:
o Initialization: Thời điểm khởi tạo một component.
o Mounting: Ngay sau khi component được khởi tạo.
o Updation: Các cập nhật state sẽ làm cho component và
các component con render lại.
o Unmounting.

Việc nắm bắt được props, state và life cycle giúp làm việc với react dễ dàng hơn.

Preact
o Là một thư viện cực kỳ nhỏ gọn, chỉ nhỏ 3KB, hoàn toàn thay thế được thư viện
React.
o Nó cung cấp khả năng render cực nhanh.
o Phù hợp với project của team hiện tại là các sản phẩm Ecard sự kiện cho Zalo,
cần tốc độ load trang nhanh gọn.

Thực hiện:

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
9


o Tìm hiểu lý thuyết
o Đọc code của 1 project frontend đã có của team.
o Tiến hành dựng lại một project Ecard đã có của team dưới sự
review và góp ý của mentor, đồng thời cải thiện một số thuật
toán vẽ canvas.
Kết quả:
o Nắm và vận dụng được preact để xây dựng những project frontend gọn nhẹ.
o Ngồi ra cịn biết được quy ước code của team và cách tổ chức file của những
project tương tự.

2.3. Tìm hiểu xây dựng Java Web API
Thời gian: 1 tuần
Nội dung: Được training về cấu trúc của một Web API, các thư viện ngoài và nội bộ đang
được sử dụng.
Jetty:
o Thư viện cung cấp web server có thể tích hợp vào trong project.
ThreadProfiler:

o Thư viện nội bộ dùng để kiểm tra lượt gọi tới các hàm trong chương trình.
Logger:
o Thư viện nội bộ dùng để ghi lại thông tin debug hoặc lỗi của chương trình.
Cấu trúc project:
o Hệ thống Zalo được xây dựng với kiến trúc Microservices nên HTTP Server sẽ
không tương tác trực tiếp với DB mà tương tác thông qua các service client.
o Config:

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
10


o Các thiết lập toàn cục.
o Service:
o Wrapper cho service client.
o Model:
o Xây dựng business logic xử lý các request.
o Handler:
o Định nghĩa các đường dẫn và các hàm xử lý tương ứng từ model.
o Server:
o Thiết lập và khởi tạo Jetty Server.
Thực hiện:
o Tìm hiểu lý thuyết
o Đọc code của 1 project Web API hiện có của team.
o Xây dựng thêm Web API cho một project Ecard của team dưới sự góp ý và
review của mentor.
Kết quả:
o Hiểu và vận dụng được các kiến thức để xây dựng được một project API.

2.4. Tìm hiểu xây dựng microservice server

Thời gian: 1 tuần
Nội dung: Được training về kiến trúc microservice và cách xây dựng một service bằng
Apache Thrift.
Kiến trúc microservices:

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
11


o Các hệ thống Web API hiện tại sẽ không trực tiếp tương tác với DB mà
phải thông qua các service tương ứng như việc lấy thông tin của user.
Apache Thrift:
o Là một RPC framework.
o RPC hay remote procedure call là việc làm cho một procedure thực hiện ở
một không gian địa chỉ riêng (thường ở một máy khác trong một mạng
chia sẻ).
o Độc lập với ngơn ngữ lập trình với một cơ chế sinh code tự động có liên
kết cho RPC.
o Cung cấp một lớp trừu tượng cho việc truyền dữ liệu, serialize dữ liệu và
cho việc thực thi mức ứng dụng.
o Thrift IDL (Interface Definition Language - ngôn ngữ định nghĩa giao
tiếp) để cung cấp các service đa nền tảng. Source code của client và server
được sinh ra từ chính IDL.
Thực hiện:
o Tìm hiểu Apache Thrift.
o Đọc hiểu code của 1 service hiện có.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
12

o Xây dựng một service server và sử dụng một project khác dùng service client để


gội tới service server này.
Kết quả:
o Hiểu được và vận dụng xây dựng được service.

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. Trong tháng thứ hai, thực tập sinh đã được tham gia vào các dự án thực tế dưới sự góp ý của
người phụ trách.

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

1

Tìm hiểu về
cơng ty, cách tổ
chức của cơng ty

Nguyễn Tiến Tùng

100%

2

Tìm hiểu các
cơng cụ sẽ được sử
dụng trong quá
trình làm việc.

Nguyễn Tiến Tùng

100%

3

Tìm hiểu React
và Preact

Nguyễn Tiến Tùng

100%

4

Tìm hiểu xây
dựng Java Web
API

Nguyễn Tiến Tùng

100%

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
13


5

Tìm hiểu xây
dựng microservice
server

Nguyễn Tiến Tùng

100%

6

Project Group
Review:

Nguyễn Tiến Tùng

100%

Nguyễn Tiến Tùng

100%

Nguyễn Tiến Tùng

100%

- Tìm hiểu yêu
cầu
- Nhận design
7

Project Group
Review:
- Xây dựng Java
Web API

8

Project Group
Review:
- Xây dựng
Frontend React

9

Project Group
Review:

Nguyễn Tiến Tùng

- Nhận bug từ
tester và fix bug
9

Project FCM:

Nguyễn Tiến Tùng

100%

- Tìm hiểu về
Firebase Cloud
Messaging

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
14


- Tìm hiểu yêu
cầu của team
product.
10

Project FCM:

Nguyễn Tiến Tùng

100%

Nguyễn Tiến Tùng

100%

- Xây dựng
thrift service
11

Project FCM:
- Nhận bug từ
tester và fix bug

Chương 3: Chi tiết về Project
1. Project Group Review
1.1. Giới thiệu
Group review (Tổng kết nhóm) là chức năng xem lại tổng kết nhóm của Zalo
Mobile và Zalo PC thơng qua Web View được tích hợp.
Ý tưởng:
o Người dùng trong nhóm sẽ vào chức năng tổng kết nhóm để xem các huy hiệu
được cấp cho các thành viên có nhiều tin nhắn nhất, nhiều cảm xúc nhất, ...
o Đồng thời người dùng có thể chia sẻ được những huy hiệu vào nhóm để mọi người
cùng xem.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
15


1.2. Thực hiện
Người thực hiện
o Lên ý tưởng: Anh Lê Khánh Thông thuộc team product.
o Thiết kế giao diện: Anh Nguyễn Phú thuộc team design.
o Xây dựng hệ thống: Thực tập sinh Hồ Nguyên Bảo thuộc team ZStudio. o
Data: Chị Đỗ Quỳnh Như xây dựng và trả về dữ liệu thống kê.
o Tester: các anh Nguyễn Kiên bên team tester.

Quá trình thực hiện:
Tìm hiểu yêu cầu và nhận design.
o Trao đổi với product để hiểu rõ yêu cầu.
Xây dựng Java Web API từ dữ liệu nhận được từ data service.
o Trao đổi với data, xây dựng các trường thông tin cần thiết để trả về.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
16

o Đồng thời trao đổi với product về những data hiện tại xem đã đúng yêu
cầu hay chưa.


Xây dựng Frontend React.
o Trao đổi với designer về tính khả thi của design trong thời gian có hạn.
o Xây dựng frontend, đồng thời trong lúc đó designer và product review
để có những chỉnh sửa cần thiết.
Nhận bug report (UAT) và tiến hành fix bug.
o Trao đổi với tester để nhận UAT Checklist, sửa lỗi, cập nhật tình trạng
lỗi và để tester xác nhận.

1.3. Kết quả
Dự án này hiện nay là một tính năng của Zalo chạy ổn định và tiếp cận nhiều người
dùng.

2. Project FCM Thrift Service
2.1. Giới thiệu
FCM Service là service được xây dựng để broadcast thông báo về các sự kiện trong
game và các action tương ứng tới các điện thoại đang cài đặt game của team. Hiện tại được
tích hợp trên game Shan Koe Mee.

Ý tưởng:
o Sử dụng Firebase Cloud Messaging để bắn thông báo tới điện thoại.
o Sau khi người dùng đăng nhập game thì cập nhật token của người dùng lên
DB, lưu trữ lại để sử dụng gửi thơng báo tới device đó sau này.
o Hệ thống gồm 1 client nhận thông báo được tích hợp vào game, một thrift
service cung cấp các chức năng cần thiết để bắn thông báo tới client.

2.2. Thực hiện
Người thực hiện:

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Ngun Bảo
17

o Phía client tích hợp vơ game: Anh Lê Thiện Trí
o Phía thrift service: Thực tập sinh Hồ Nguyên Bảo


Quá trình thực hiện:
Tìm hiểu yêu cầu của product, cơ chế của firebase cloud messaging và cách tích
hợp vào hệ thống Java.
Xây dựng service
o Trao đổi với anh Trí trong lúc làm để kiểm thử các hàm bắn message từ
Google SDK được tích hợp.
o Xây dựng service và build ra bản jar phục vụ việc tích hợp sau này.
Kiểm thử
o Hệ thống được kiểm thử bởi đội tester, sau đó nhận checklist, tiến
hành sửa chữa và nhận xác nhận từ tester.

2.3. Kết quả
Dự án hiện đang tích hợp trên game Shan Koe Mee (Google Play) của ZStudio,

chạy ổn định.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
18

TÀI LIỆU THAM KHẢO
For Apache Thrift Development


/> />
For Preact Development
/> />
For Jetty Server Development
/>
Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo
19

TỔNG KẾT
Như vậy trong vòng gần 3 tháng, em đã nắm được các công nghệ được sử dụng phổ biến
trong lập trình web, phát huy được khả năng giao tiếp, trao đổi trong quá trình thực hiện dự án
đúng tiến độ. Đồng thời được tiếp xúc với các anh chị product trong các dự án thực tế đã giúp em


có thêm góc nhìn mới về sản phẩm như một người dùng.
Chân thành cảm ơn sự giúp đỡ của các anh chị trong nhóm ZStudio.

Người phụ trách: Nguyễn Tiến Tùng Sinh viên: Hồ Nguyên Bảo