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

GATSBY TRONG LẬP TRÌNH WEB
Cơng ty thực tập : Công ty TNHH DESIGNVELOPER
Người phụ trách : Đồng Tấn Huy–Nguyễn Thành Công
Thực tập sinh

: Huỳnh Long Pháp - 18521226

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


LỜI MỞ ĐẦU
Lời đầu tiên em xin chân thành cảm ơn đến Công ty TNHH Designveloper đã tạo điều
kiện cho em được thực tập tại cơng ty để có thể tìm hiểu và thực hành trực tiếp trên các
cơng cụ và phần mềm của công ty cũng như là quá trình tham gia học hỏi tìm hiểu sâu về
cách hoạt động phần mềm.
Designveloper là công ty phát triển phần mềm và ứng dụng hàng đầu tại Thành phố Hồ
Chí Minh, Việt Nam, được thành lập vào năm 2013 từ một tập thể trẻ và đầy nhiệt huyết
các lập trình viên web, mobile; chuyên viên thiết kế UI/UX và các chuyên gia VOIP.
Sau 1 tháng thực tập tại công ty, em đã được huấn luyện, trải nghiệm với các phương
pháp làm việc mới mẻ cùng với những kiến thức đã học trên ghế nhà trường, từ đó biết
được cách thức hoạt động của cơng ty, có thêm nhiều kinh nghiệm trong công việc.


LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn công ty TNHH Designveloper (DSV) đã 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 của các anh chị, em
đã tiếp thu được những kiến thức quan trọng để có thể làm được một sản phẩm phần mềm
mang lại giá trị cho công ty. Chân thành cảm ơn các anh chị đã bỏ ra nhiều thời gian,cơng
sức để hướng dẫn chúng em hồn thành đợt thực tập này.
Em xin chân thành cảm ơn anh Đồng Tấn Huy – Team Leader, anh Nguyễn Thành
Công – lập trình viên FullStack cùng tồn thể các anh chị tại công ty đã giúp đỡ, hỗ trợ em
trong suốt 4 tuần thực tập vừa qua.


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

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


MỤC LỤC
Chương 1. Giới thiệu về công ty thực tập ........................................................................ 6
1.1.

Giới thiệu công ty Designveloper ..................................................................... 6

1.2.
Sản phẩm của công ty ....................................................................................... 6
1.2.1. LuminPDF..................................................................................................... 6
1.2.2. Swell & Switchboard .................................................................................... 6
1.2.3. Walrus Education .......................................................................................... 6
1.2.4. Joyn’it ........................................................................................................... 7
1.2.5. Bonux ............................................................................................................ 7
Chương 2. Nội dung thực tập ............................................................................................ 8
2.1.

Tìm hiểu NodeJS............................................................................................... 8

2.2.

Khi nào nên sử dụng NodeJS ............................................................................ 8


2.3.

Tìm hiểu Gatsby ................................................................................................ 8

2.3 Thời gian thực tập ............................................................................................... 10
Chương 3. Chi tiết về Project ......................................................................................... 11
3.1.

Nội dung chi tiết project ................................................................................. 11

3.2 Kết quả đạt được. ............................................................................................... 13
3.2.1. Kiến thức tích luỹ ....................................................................................... 13
3.2.2. Sản phẩm thực tế ........................................................................................ 14
Tài liệu tham khảo ........................................................................................................... 16
Tổng kết .......................................................................................................................... 17


CHƯƠNG 1. GIỚI THIỆU VỀ CÔNG TY THỰC TẬP
1.1.

Giới thiệu công ty Designveloper

Designveloper là công ty phát triển phần mềm và ứng dụng hàng đầu tại Thành phố Hồ
Chí Minh, Việt Nam, được thành lập vào năm 2013 từ một tập thể trẻ và đầy nhiệt huyết
các lập trình viên web, mobile; chuyên viên thiết kế UI/UX và các chuyên gia VOIP.

Hiện tại Desigveloper có 2 cơ sở với quy mơ hơn 100 nhân viên. Văn phịng thứ nhất
toạ lạc tại 14, Đường số 39, Phường Bình An, Quận 2, TP.Thủ Đức. Văn phòng thứ 2 tại
50/4 Quang Trung, Phường 10, Quận Gị Vấp, TP. Hồ Chí Minh.
1.2. Sản phẩm của công ty

1.2.1.

LuminPDF

Lumin là một dịch vụ lưu trữ và tích hợp tệp PDF được phát triển bởi Designveloper.
Lumin cho phép người dùng chỉnh sửa và lưu trữ tệp PDF trên cả ứng dụng di động và
website, đồng bộ hóa tệp PDF trên các thiết bị, và chia sẻ tệp PDF với mọi người. Hiện
Lumin đã đạt được 22 triệu người dùng.
1.2.2.

Swell & Switchboard

Swell & Switchboard là một nền tảng quản lý doanh nghiệp trong ngành công nghiệp
năng lượng mặt trời. Đến nay, nền tảng này đang được áp dụng và đánh giá rất cao trong
việc quản lý quy trình làm việc hàng ngày của khách hàng. Với thành tựu này,
Designveloper đang phát triển nâng cao mơ hình của sản phẩm để đạt độ phủ sóng ra tồn
thế giới.
1.2.3.

Walrus Education

Walrus là một nền tảng để kết nối sinh viên, giáo viên và trường học. Công nghệ React,


React Native và Nodejs đã được sử dụng để phát triển các ứng dụng web và mobile cho
nền tảng này.
1.2.4.

Joyn’it


Nền tảng Joyn’it cung cấp các dịch vụ dành riêng cho cộng đồng để tạo sự kiện dễ dàng
và thông báo cho thành viên các sự kiện sắp diễn ra
1.2.5.

Bonux

Bonux là một dự án xây dựng ví tiền điện tử với các tính năng lưu trữ, quản lý và thực
hiện giao dịch cho người sử dụng. Thiết kế giao diện UI-UX và một số kỹ thuật khác đã
được áp dụng vào quá trình phát triển dự án.


CHƯƠNG 2. NỘI DUNG THỰC TẬP
2.1.

Tìm hiểu NodeJS
• Nodejs là một nền tảng (Platform) phát triển độc lập được xây dựng ở trên
Javascript Runtime của Chrome mà chúng ta có thể xây dựng được các ứng dụng
mạng một cách nhanh chóng và dễ dàng mở rộng.
• Nodejs được xây dựng và phát triển từ năm 2009, bảo trợ bởi công ty Joyent, trụ
sở tại California, Hoa Kỳ.
• Phần Core bên dưới của Nodejs được viết hầu hết bằng C++ nên cho tốc độ xử lý
và hiệu năng khá cao.
• Nodejs tạo ra được các ứng dụng có tốc độ xử lý nhanh, realtime thời gian thực.
• Nodejs áp dụng cho các sản phẩm có lượng truy cập lớn, cần mở rộng nhanh, cần
đổi mới công nghệ, hoặc tạo ra các dự án Startup nhanh nhất có thể.

2.2.

Khi nào nên sử dụng NodeJS


Là một nền tảng phát triển ứng dụng mạnh mẽ, Nodejs có thể thỏa mãn mọi nhu cầu lập
trình, phát triển ứng dụng. Các chuyên gia trong lĩnh vực lập trình, cơng nghệ khun
dùng Nodejs khi phát triển các ứng dụng như Websocket server, Fast File Upload Client,
Ad Server, Cloud Services, RESTful API, Any Real-time Data Application,...
• Websocket server: Các máy chủ web socket như là Online Chat, Game Server…
• Fast File Upload Client: là các chương trình upload file tốc độ cao.
• RESTful API: đây là những ứng dụng mà được sử dụng cho các ứng dụng khác
thông qua API.
• Any Real-time Data Application: bất kỳ một ứng dụng nào có yêu cầu về tốc
độ thời gian thực. Micro Services: Ý tưởng của micro services là chia nhỏ một
ứng dụng lớn thành các dịch vụ nhỏ và kết nối chúng lại với nhau. Nodejs có thể
làm tốt điều này.
2.3.

Tìm hiểu Gatsby

Gatsby là một static site generator cho React đã phát hành phiên bản chính đầu tiên vào
tháng trước. Đó là một cơng cụ khơng chỉ giúp bạn xây dựng các dự án (hoặc trang web)
mà còn tuyên bố rằng các trang web đó nhanh chóng hoạt động.
• Tốc độ và Hiệu suất: Gatsby là một framework được xây dựng từ core React JS.


Và đặc biệt hơn là một framework để làm web tĩnh, từ những lý do đó tốc độ
load web sẽ nhanh hơn những trang khác. Việc chuyển qua lại giữa các trang
trong website cũng rất nhanh do tất cả các style, html và javascript sẽ được load
trong lần tải đầu tiên. Khi người dùng ấn vào một bài viết trong trang web của
bạn, nội dung mới sẽ được tải về dưới dạng JSON và hiển thị lên. Không cần
load lại tồn bộ trang, việc cấu hình các plugin cho phép tối ưu việc tải ảnh. Và
preload (tải trước nội dung của các link người dùng có thể ghé qua) sẽ cho trang
web của bạn một tốc độ cực cao.

• Nền tảng hỗ trợ tốt: Cũng giống như WordPress thì Gatsby có hệ thống plugin
cực kỳ đa dạng hỗ trợ tối đa cho developer như gatsby-plugin-image, gatsbytransformer-sharp
• SEO Optimizer: Gatsby có hệ thống plugin đa dạng, nên Gatsby có các plugin
hỗ trợ chọ việc SEO rất tốt.
• PWA(Progressive Web Apps): Gatsby cung cấp plugin để chuyển trang web
của bạn thành từ SPA sang PWA. Giúp trang web có thể tải về thành ứng dụng
trên desktop lẫn trên mobile.
Đa phần các CMS đều có thể hoạt động với Gatsby thơng qua API (Restful hoặc
Graphql), do vậy việc sử dụng CMS nào phụ thuộc vào việc bạn sử dụng quen CMS nào
nhất. Hoặc CMS nào tiện lợi nhất, hoặc là CMS bất kỳ tự phát triển. Miễn sao có API lấy
nội dung là được.
Tuy nhiên, các CMS sau thì khá nổi tiếng và có plugin để lấy nội dung (từ API chuyển
về dữ liệu graphql trong Gatsby)
• Netlify CMS
• Buttercms
• Ghost
• Contentful
• WordPress
• Strapi
• Prismic


2.3 Thời gian thực tập
Thời gian thực tập ở công ty
•

Từ thứ 2 đến thứ 6 trừ thời gian học trên trường

•


Sáng từ 9h – 12h

•

Chiều từ 13h – 18h


CHƯƠNG 3. CHI TIẾT VỀ PROJECT
3.1. Nội dung chi tiết project
Xây dựng Website tĩnh giới thiệu công ty, kết nối số lượng lớn người dùng truy
cập vào trang LuminPDF.

STT

1

2

3

Tuần

Tuần 1

Tuần 2

Tuần 3

Nội dung thực tập


•

Giới thiệu cơng ty, tham gia buổi chào hỏi, làm
quen với anh chị trong cơng ty.

•

Cài đặt một số phần mềm sử dụng trong công ty,
cũng như trong cơng việc

•

Tìm hiểu NodeJS, Gatsby trong lập trình web

•

Tìm hiểu CMC Prismic, giải quyết u cầu của
khách hàng.

•

Tìm hiểu Optimize Image sử dụng Gatsby Image.

•

Tìm hiểu Icomoon.

•

Tìm hiểu CRM Hubspot, Hubspot Form.


•

Xây dựng ISTE Landing Page cho khách hàng
tham dự hội nghị ISTE Free For Schools.

•

Xây dựng Landing Page cảm ơn người dùng tham
dự hội nghị ISTE Free For Schools.


4

Tuần 4

•

UAT – ISTE Free For Schools, chờ feedback từ
khách hàng, thay đổi theo yêu cầu.

•

Xây dựng trang merge file PDF – cho phép người
dùng gộp các file PDF lại với nhau.


3.2 Kết quả đạt được.
3.2.1.


Kiến thức tích luỹ

• Kỹ năng cơng nghệ
o Tìm hiểu được các cơng nghệ mới, cơng việc ở môi trường thực tế.
o Quen được với nghiệp vụ công ty và dần dần đã tham gia vào các dự án
mang tính ưu tiên của team. Được tham gia giúp sức của mình để đóng
góp cho team. Va chạm nhiều hơn các vấn đề thực tế và hoàn thành nó.
Được tìm hiểu nhiều thơng tin và kiến thức cho mình.
• Kỹ năng mềm:
o Kỹ năng tìm kiếm thơng tin.
o Kỹ năng lên kế hoạch làm việc.
o Kỹ năng giải quyết vấn đề.
o Kỹ năng giao tiếp tương tác với leader và sếp.
o Kỹ năng làm việc theo nhóm và làm việc độc lập.
o Kỹ năng biết lắng nghe và học tập những lời phê bình.
o Kỹ năng tổ chức công việc và quản lý thời gian.
o Kỹ năng làm việc theo deadline.
o Kỹ năng viết báo cáo công việc hàng ngày.
o Tự tin và năng động trong công việc.
• Các kết quả khác:
o Rèn luyện tinh thần tự giác, đúng giờ, đúng quy định nơi công sở.
o Rèn luyện tính cẩn thận, tỉ mỉ trong từng nhiệm vụ được giao.
o Hiểu rõ được quy trình làm việc và các quy tắc bảo mật khi làm việc.


3.2.2.

Sản phẩm thực tế

Trang web khách hang yêu cầu xây dựng để tham dự hội nghị ISTE Free for schools.

Tại đây người dùng – người tham dự hội nghị có thể để lại thơng tin, từ đó mà khách hang
có thể liên lạc, kết nối học sinh sinh viên, cũng như giáo viên quay lại sử dụng ứng dụng
của mình.


Trang cảm ơn người dùng tham dự hội nghị sau khi điền form để lại thông tin người
dùng.


TÀI LIỆU THAM KHẢO
1. Thông tin công ty: />2. NodeJS: />3. Gatsby: />4. Hubspot: />5. Prismic: />

TỔNG KẾT
Như vậy, chỉ trong vòng một tháng ngắn ngủi, nhóm đã kịp tìm hiểu và hồn thành
nhiệm vụ, bàn giao cho khách hang trang web hoàn chỉnh để tham dự hội nghị. Cũng
trong 1 tháng qua, bản than em cũng đã tiếp thu được một số kiến thức quan trọng trong
quá trình làm việc với nhứng người anh chị dày dặn kinh nghiệm.
Chân thành cảm ơn sự giúp đỡ của các anh chị team Lumin, sự nỗ lực của nhóm Lumin
Static đã giúp đỡ em hồn thành cơng việc này.