báo cáo thực tập FRONTEND DEVELPOER

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

FRONTEND DEVELPOER

Công ty thực tập

: Đất Việt Software

Người phụ trách

: Nguyễn Duy Lành

Thực tập sinh

: Tạ Quốc Khánh

TP. Hồ Chí Minh, tháng 07 năm 2020


Trang 1

LỜI MỞ ĐẦU
Hiện nay với sự phát triển mạnh của cơng nghệ trên thế giới thì nhu cầu sử dụng internet
tăng lên từng ngày là điều chắc chắn. Chính vì thế cơng nghệ thơng tin khơng chỉ dừng lại ở
mục đích phục vụ cho khoa học kỹ thuật mà đi sâu vào đời sống, chính trị, kinh tế - xã hội,…
mang lại nhiều lợi ích cho con người.
Đi kèm theo đó các hệ thống website cũng đang ngày càng phát triển không ngừng với
đủ lĩnh vực, ngành nghề như giáo dục, y tế, phim ảnh, ca nhạc, thể thao, làm đẹp,… Tuy nhiên

để tạo ra một website được nhiều người sử dụng cần rất nhiều yếu tố như nội dung, giao diện,
trải nghiệm của người dùng cũng như nó mang lại cho người sử dụng một lợi ích nhất định.
Sau bốn năm 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 làm trong một mơi trường chun nghiệp, em có dự định là sẽ thực tập. Vì
vậy, em quyết định chọn Đất Việt Software - 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.

TẠ QUỐC KHÁNH


Trang 2

LỜI CẢM ƠN
Để hồn thành q trình thực tập doanh nghiệp này trước hết em xin gửi đến quý Thầy
Cô giảng viên trường Đại học Công Nghệ Thông Tin – Đại học Quốc Gia TP.HCM cũng như
các Thầy Cô giảng viên khoa Cơng Nghệ Phần Mềm đã tận tình giúp đỡ và tạo mọi điều kiện để
em có thể hồn thành q trình thực tập tại doanh nghiệp.
Em xin trân trọng gửi lời cảm ơn đến Ban Lãnh Đạo, các phịng ban của Cơng ty Trách
Nhiệm Hữu Hạn Cơng nghệ và Dịch vụ Đất Việt đã tạo điều kiện thuận lợi cho em được tìm
hiểu cũng như trải nghiệm thực tế trong suốt q trình thực tập tại cơng ty. Cuối cùng em xin
chân thành cảm ơn anh Phạm Đình Hịa – Giám đốc cơng ty đã giúp đỡ, tin tưởng cho em tham
gia vào các dự án thực tế để em có thể hồn thành tốt báo cáo thực tập doanh nghiệp.
Nhà trường đã cho em những kiến thức quan trọng qua những năm học tại trường để em
có thể áp dụng vào thực tế vào cơng việc trong thời gian thực tập tại công ty. Qua quá trình thực
tập em được biết thêm nhiều kiến thức mới mẻ, các hoạt động trong cơng ty,…. giúp em có
thêm nhiều kinh nghiệm cũng như tự tin hơn cho công việc sau này của bản thân. Tuy nhiên
kiến thức bản thân cịn hạn chế nên trong q trình thực tập cũng như hồn thiện báo cáo này
khơng tránh khỏi những sai sót, kính mong nhận được những ý kiến đóng góp từ q Thầy Cơ
cũng như q Cơng ty
Cuối cùng em xin chúc quý Thầy Cô dồi dào sức khỏe và thành cơng trong sự nghiệp cao

q. Đồng kính chúc các cô, chú, anh, chị trong Công ty Trách Nhiệm Hữu Hạn Công nghệ và
Dịch vụ Đất Việt luôn mạnh khỏe, đạt được nhiều thành công tốt đẹp trong công việc.
TP.Hồ Chí Minh, ngày 28 tháng 07 năm 2020
Sinh viên thực hiện
Tạ Quốc Khánh

TẠ QUỐC KHÁNH


Trang 3

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

TẠ QUỐC KHÁNH


Trang 4

MỤC LỤC
LỜI MỞ ĐẦU ............................................................................................................................................ 1
LỜI CẢM ƠN ............................................................................................................................................ 2
NHẬN XÉT CỦA KHOA .......................................................................................................................... 3
MỤC LỤC .................................................................................................................................................. 4
CHƯƠNG 1: GIỚI THIÊU CÔNG TY THỰC TẬP ................................................................................. 5
1. Giới thiệu công ty Đất Việt Software .............................................................................................. 5
2. Sản phẩm của công ty ...................................................................................................................... 5
CHƯƠNG 2: NỘI DUNG THỰC TẬP ................................................................................................... 7
1. Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty ................................................................... 7
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 về HTML, CSS và ngơn ngữ JavaScript .................................................................. 8

2.3.

Tìm hiểu cấu trúc của project ASP.NET MVC ....................................................................... 9

2.4.

Tìm hiểu về Reactjs.................................................................................................................. 9

3. Thực hiện project ........................................................................................................................... 10
4. Lịch làm việc ................................................................................................................................. 10
CHƯƠNG 3: CHI TIẾT VỀ PROJECT ................................................................................................... 12
1. Giới thiệu về dự án ........................................................................................................................ 12
2. Thực hiện ....................................................................................................................................... 16
3. Kế hoạch ........................................................................................................................................ 16
TÀI LIỆU THAM KHẢO ........................................................................................................................ 16
TỔNG KẾT .............................................................................................................................................. 17

TẠ QUỐC KHÁNH


Trang 5

CHƯƠNG 1: GIỚI THIÊU CÔNG TY THỰC TẬP

1. Giới thiệu công ty Đất Việt Software
Đất Việt Software được thành lập vào tháng 10 năm 2011. Với tiền thân là một
đội ngũ chuyên gia phần mềm và giải pháp viễn thơng có kinh nghiệm từ Hàn Quốc.
Chun mơn của Đất Việt Software là bao gồm xây dựng các giải pháp phát triển
phần mềm, ứng dụng di động cũng như các dịch vụ đám mây. Đất Việt Software cân
bằng tư duy chiến lược với chuyên môn kỹ thuật trong các công nghệ đột phá như ứng
dụng di động, đám mây và phân tích để phát triển các giải pháp đáp ứng nhu cầu kinh
doanh cụ thể.
Thông tin liên hệ: Datviet software LTD

- Địa chỉ: Tầng 1 Cao Ốc Bình Minh, Lương Định Của, phường Bình An, Quận 2,
thành phố Hồ Chí Minh
- Hotline: (028) 3 620 2480
- Website: />- Email:

2. Sản phẩm của công ty
Với hơn 8 năm hoạt động trong ngành công nghệ phần mềm, Đất Việt Software
phát triển được nhiều phần mềm đã và đang được áp dụng vào các doanh nghiệp như
phần mềm quản lý bán hàng, phần mềm hoá đơn điện tử, phần mềm hỗ trợ thực hiện các

TẠ QUỐC KHÁNH


Trang 6

nghiệp vụ quản lý trường học, quản lí kho cũng như các trang website được thiết kế riêng
theo nhu cầu của khách hàng,…

TẠ QUỐC KHÁNH


Trang 7

CHƯƠNG 2: NỘI DUNG THỰC TẬP
Đợt thực tập với chủ đề “Frontend developer” nhằm mục đích giúp sinh viên thực tập
được đào tạo chủ yếu về lập trình giao diện của website cũng như rèn luyện bổ sung kỹ năng lập
trình, từ duy logic và đồng thời rèn luyện những kỹ năng mềm như làm việc nhóm, 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 phần mềm chun nghiệp

1. Tìm hiểu cơng ty và các kỹ ă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ủ, giới thiệu về các phần mềm hỗ trợ
để liên lạc với mọi người trong công ty
Kết quả : Hiểu thêm về công ty Đất Việt, q 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 : 2 ngày
Nội dung : Tìm hiểu về các cơng cụ sẽ được sử dụng trong q trình làm việc.
Hai ngày làm việc tiếp theo, được anh Lành đã hướng dẫn thực tập sinh tìm hiểu
cũng như các sử dụng Tortoise SVN – là một phần mềm hỗ trợ hiệu quả trong làm
việc nhóm. Phần mềm Skype – sử dụng chính trong các cuộc trao đổi giữa các
anh/chị trong công ty và cài đặt các IDE phục vụ cho việc lập trình. Node Version

TẠ QUỐC KHÁNH


Trang 8

Manager – công cụ để quản lý cũng như thay đổi version của nodejs để phù hợp với
từng dự án trong công ty.
Thực hiện : Thực hành sử dụng các phần mềm đã nêu trên.

Kết quả : Làm quen, biết được những công cụ mới và biết cách sử dụng những cơng
cụ đó để phục vụ cho cơng việc.
2.2. Tìm hiểu về HTML, CSS và ngơn ngữ JavaScript
Thời gian : 4 ngày
Nội dung : Được training những kiến thức quan trọng trong html,css, javascript
-

Sử dụng các thẻ <div>,

,… sắp xếp hợp lý, dễ đọc, dễ nhìn cũng như phải
sắp xếp các thẻ sao cho chuẩn SEO nhất. Đồng thời cũng tìm hiểu về html5

-

Tổ chức css theo cấu trúc từ layout lớn đến các layout chi tiết, cũng như đặt tên
các class của element trong html sao cho phù hợp dễ đọc nhất. Và các atribute css
để trang web có một ui/ux tốt thân thiện với người dùng.

-

Responsive cho một trang website hồn chỉnh như thế nào.

-

Tìm hiểu về jQuery (thư viện được viết từ Javascript).

-

Tìm hiểu về Bootstrap 4 là một framework hỗ trợ tốt cho việc lập trình giao diện
một website

Thực hiện :

-

Tham gia đầy đủ các buổi training của công ty.

-

Làm các bài thực hành về kiến thức đã học.

-

Làm lại giao diện website của một website về mỹ phẩm.

Kết quả :
-

Nâng cao kỹ năng lập trình html/css.

-

Biết được một số quy tắc trong viết code html/css sao cho mọi người có thể dễ
đọc, dễ hiểu và dễ dàng sử dụng.

-

Hoàn thành giao diện của các trang chính.

TẠ QUỐC KHÁNH


Trang 9

2.3. Tìm hiểu cấu trúc của project ASP.NET MVC
Thời gian : 1 ngày
Nội dung : Được training cấu trúc của một project ASP.NET MVC.
Thực hiện :
-

Tham gia training của công ty.

-

Chỉnh sửa những giao diện bị lỗi trên project cũ.

Kết quả :
-

Nâng cao kỹ năng đọc và xử lí code của người khác.

-

Biết được thêm nhiều về cách tổ chức của một project ASP.NET MVC.

2.4. Tìm hiểu về Reactjs
Thời gian : 4 ngày
Nội dung :
-

Khởi tạo 1 ứng dụng reactjs.

-

Tìm hiểu về vịng đời của một component mới trong reactjs.

-

Các kiến thức quan trọng như component,router, state, props, cách viết ES6,
chuyển từ html phân chia thành các component reactjs, cách gọi api bằng axios,
Redux,..

-

Kiểm tra api thông qua postman.

-

Biết được cách sử dụng ant design – là tập hợp hầu hết các thư viện về reactjs như
layout, notification, modal, checkbox, upload file, pagination,….

Thực hiện :
-

Tham gia đầy đủ các buổi training của công ty.

Kết quả :
-

Nắm được những kiến thức cần thiết về reactjs.

-

Nắm được cách để triển khai một ứng dụng web với reactjs

-

Biết thêm nhiều thư viện hỗ trợ xây dựng một ứng dụng web bằng reactjs.

TẠ QUỐC KHÁNH


Trang 10

3. Thực hiện project
Sau gần 3 tuần được training và thực hành, thực tập sinh đã nắm được những kiến thực
về html, css và biết cách sử dụng bootstrap 4, jquery cũng như những kiến thức nền tảng của
reactjs. Trong thời gian tiếp theo, mentor đã hướng dẫn thực tập sinh áp dụng các kiến thức vào
những dự án thực tế của cơng ty.

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

Cơng việc
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.
- Học cách trao đổi
làm
việc

qua
skype.
- Đọc các tài liệu
liên
quan
tới
html,css, jquery và
bootstrap,….
- Được hướng dẫn
về cấu trúc của
project ASP.NET
của công ty.
- Fix giao diện của
project ASP.NET
cũ.
- Thiết kế giao diện
trang chủ website
ecommerce về mỹ
phẩm
- Tiếp tục xây dựng
những giao diện
cịn
lại
của
website
- Tìm
hiểu
về
Reactjs như ES6,
Component, Redux

-

1

2

3,4,5

6

Người hướng
dẫn

Mức độ
hồn
thành

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

Anh
Nguyễn
Duy Lành

Anh
Nguyễn
Duy Lành

Anh
Nguyễn

Duy Lành
Anh
Nguyễn
Duy Lành

TẠ QUỐC KHÁNH


Trang 11

7
8,9,10
-

Hồn thành một vài
task
nhỏ
của
website quản lí
bằng reactjs
Fix
bug
của
website ecommerce
như responsive, các
lỗi hiển thị.
Chỉnh sửa giống
bản desgin

Anh

Nguyễn
Duy Lành
Anh
Nguyễn
Duy Lành

TẠ QUỐC KHÁNH


Trang 12

CHƯƠNG 3: CHI TIẾT VỀ PROJECT
1. Giới thiệu về dự án
Website về mỹ phẩm sử dụng với mục đích nhận dạng quảng bá thương hiệu với các mặt
hàng phong phú đa dạng như chăm sóc da mặt, cơ thể, phấn son và các dưỡng chất bảo vệ da,...
Với giao diện đặc trưng về màu sắc, layout, bố cục theo mong muốn của đối tác, tạo cảm thấy
thoải mái khi mua sắm trên website, hiển thị thông tin sản phẩm đầy đủ, chi tiết với định dạng
hình ảnh chất lượng cao. Website được thiết kế chuẩn SEO website với công nghệ mới nhất hỗ
trợ tối ưu cho kế hoạch truyền thông Online thông qua facebook, google như Google Tag,
Facebook pixel và điều đặc biệt hơn cả là website sẽ được tối ưu nhất để có thể sử dụng trên
nhiều nền tảng khác nhau.
Vì là một website ecommerce nên nó đầy đủ chức năng như đăng nhập, đăng kí, xem thơng
tin các sản phẩm cũng như thông tin khách hàng, thông tin liên quan đến các đơn hàng, đặt
hàng, thanh toán, trang thông tin tin tức,…
Trang web của đối tác: />
Một số hình ảnh về website:

TẠ QUỐC KHÁNH

Trang 13

Trang chủ

Trang chi tiết sản phẩm

TẠ QUỐC KHÁNH


Trang 14
Các trang khác

TẠ QUỐC KHÁNH


Trang 15

TẠ QUỐC KHÁNH


Trang 16

2. Thực hiện
Sinh viên: Tạ Quốc Khánh
Và sự giúp đỡ tận tình của anh Lành và anh Cơng.

3. Kế hoạch
Giai đoạn 1:
- Thiết kế UI cho tất cả các trang và trao đổi với khách hàng
- Tạo các trang html,css

Kết quả: Cơ bản hoàn thành giao diện cho website
Giai đoạn 2:
- Đổ dữ liệu vào các trang đã xây dựng xong
- Tiếp tục xây dựng các trang html còn lại
Giai đoạn 3:
- Fix bug cũng như cho khách hàng trải nghiệm trước.

TÀI LIỆU THAM KHẢO

Document Html,css, javascript
/> /> />
Document ASP.NET MVC
/>Document Reactjs
/>ign/

TẠ QUỐC KHÁNH


Trang 17

TỔNG KẾT
Như vậy, chỉ trong vòng hơn hai tháng ngắn ngủi, sinh viên thực tập đã hoàn thành một
website thương mại điện tử về mảng mỹ phẩm làm đẹp. Trang web đã có khá đầy đủ các tính
năng đã đề ra mà bên đối tác yêu cầu. Do thời gian có hạn nên có một vài lỗi hiển thị cũng như
chưa có kinh nghiệm nhiều trong việc phát triển một website, trải nghiệm người dùng còn nhiều
hạn chế. Nhưng nhìn chung, đáp ứng đầy đủ mọi yêu cầu về website thương mại điện tử cũng
như nhận dạng thương hiệu cần có.
Chân thành cảm ơn sự giúp đỡ của các anh chị nhóm lập trình web cũng như ban giám
đốc công ty, đặc biệt cảm ơn anh Nguyễn Duy Lành đã ln giúp đỡ cũng như hỗ trợ hết mình
cho em có thể hồn thành báo cáo thực tập lần này.

TẠ QUỐC KHÁNH