Báo cáo thực tập lập trình WEB FRONT END

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 FRONT-END

Cơng ty thực tập

: Cơng Ty Wee Digital

Người phụ trách

: Trình Lê Thiên Phú

Thực tập sinh

: Trần Minh

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


2

LỜI MỞ ĐẦU
Việc lướt web để nắm bắt thông tin, phục vụ cho việc thư giãn, giải trí đã trở
thành một phần không thể thiếu trong mỗi chúng ta. Đặc biệt là thế hệ trẻ cần phải
truy cập internet để tự mở mang trau dồi kiến thức cho bản thân.
Việt Nam với nền kinh tế đang trên đà phát triển thì khơng thể thiếu được

một phần đóng góp hết sức to lớn của ngành cơng nghệ thơng tin nói chung và
ngành làm web nói riêng. Web giúp các doanh nghiệp quảng bá sản phẩm thương
hiệu họ cho khách hàng, cho đối tác hiệu quả hơn so với các cách làm truyền thống
như báo, ấn phẩm, đài tiếng nói truyền hình. Web giúp ta dễ dàng tiếp cận, chăm
sóc khách hàng tốt hơn. Web giúp cho việc kinh doanh của các doanh nghiệp lớn
hay là nhỏ lẻ, hộ gia đình hoạt động 24/7. Web giảm tải gánh nặng chi phí vận
hành doanh nghiệp, giảm nhân công, tăng hiệu suất và nhiều lợi ích tuyệt vời khác
mà trang web mang lại cho cuộc sống con người hiện tại.
Mặc dù Việt Nam còn khá non trẻ trong lĩnh vực công nghệ thông tin. Tuy
nhiên, đất nước ta đang phát triển mạnh mẽ, sản sinh ra nguồn nhân lực chất lượng
cao đóng góp cho nền kinh tế cho sự hịa nhập với những cơng ty IT hàng đầu trên
thế giới. Một trong số công ty có tên tuổi trong nước như Spiraledge đang góp
phần rất lớn vào sự phát triển tích cực cho sự phát triển công nghệ của đất nước.
Sau khoảng thời gian ra sức học tập và tham gia cuộc thi học thuật trên
trường, với mục đích mở rộng vốn kiến thức lập trình cịn non nớt của bản thân.
Em đã đi thực tập và nơi em chọn là công ty SpiralEdge – một môi trường năng
động, chuyên nghiệp – là nơi sẽ giúp em thực hiện được kế hoạch của bản thân.

TRẦN MINH HIẾU


3

LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn công ty Wee Digital đã 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 anh chị
trong team. Em đã tiếp thu được những kiến thức quan trọng để có hiểu được cách
vận hành của một trang web. Chân thành cảm ơn các anh chị trong nhóm đã bỏ ra
nhiều thời gian, cơng sức để hướng dẫn em hoàn thành đợt thực tập này.

Đặc biệt cảm ơn anh Trình Lê Thiên Phú đã hướng dẫn, giúp đỡ cho chúng
em tận tình cả những khó khăn trong cơng việc, đến những khó khăn việc làm quen
với mơi trường mới.
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.

TRẦN MINH HIẾU


4

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

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

TRẦN MINH HIẾU


5

MỤC LỤC

LỜI MỞ ĐẦU...........................................................................................................2
LỜI CẢM ƠN............................................................................................................3
NHẬN XÉT CỦA KHOA.........................................................................................4
CHƯƠNG 1: GIỚI THIỆU CƠNG TY THỰC TẬP................................................7
1.Giới thiệu cơng ty Wee Digital:...........................................................................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:......................................9
2.Nghiên cứu kỹ thuật:...........................................................................................9
a)Các cơng cụ làm việc:......................................................................................9
b)Tìm hiểu ngơn ngữ Javascript, HTML, CSS, ReactJS:...................................9
3.Thực hiện dự án thực tế:....................................................................................10
4.Lịch làm việc:....................................................................................................10
CHƯƠNG 3: CHI TIẾT VỀ PROJECT...............................................................11

TÀI LIỆU KHAM KHẢO.......................................................................................12
TỔNG KẾT.............................................................................................................13

TRẦN MINH HIẾU


6

TRẦN MINH HIẾU


7

CHƯƠNG 1: GIỚI THIỆU CƠNG TY
THỰC TẬP
1. Giới thiệu cơng ty Wee Digital:
- Wee Digital là một công ty khởi nghiệp trẻ tiên phong tiên phong nhận
diện khuôn mặt và các công nghệ nhận dạng sinh trắc học khác cho các
dịch vụ khác nhau của Việt Nam, bao gồm ngân hàng và du lịch. Kể từ
khi ra mắt ba năm trước, nó đã thiết lập một mạng lưới khách hàng hàng
đầu bao gồm các ngân hàng và các nhóm doanh nghiệp lớn trên cả nước.
Để phù hợp với tầm nhìn của chính phủ về một xã hội khơng tiền mặt,
cơng nghệ nhận dạng khn mặt của Wee Digital có thể giúp việc
chuyển tiền liên ngân hàng trên điện thoại di động hoặc trang web dễ
dàng và thuận tiện hơn.
- Wee Digital không phải là một người bán công nghệ, mà là một đầu
nối kỹ thuật. Nền tảng của nó cho phép người dùng kết nối với các nhà
cung cấp dịch vụ được kết nối với Wee Digital.
- Ngoài lĩnh vực ngân hàng, Wee Digital đã phát triển công nghệ nhận
diện khuôn mặt trong các lĩnh vực khác như du lịch và khách sạn. Chẳng

hạn, công ty nghỉ dưỡng Vingroup căn hộ tại khu nghỉ dưỡng đã trở
thành doanh nghiệp đầu tiên tại Việt Nam áp dụng công nghệ nhận dạng
khuôn mặt của Jun Digital để phục vụ khách hàng.


8

CHƯƠNG 2: NỘI DUNG THỰC TẬP
Đợt thực tập với chủ đề “Lập trình front-end với React JS” nhằm mục đích
giúp sinh viên thực tập được đào tạo kĩ năng về lập trình web, đồng thời rèn luyện
kĩ năng mềm như tư duy logic, thuyết trình, làm việc nhóm. Tại cơng ty, sinh viên
có cơ hội được học tập và trải nghiệm mơi trường làm việc chun nghiệp. Ngồi
ra, cơng ty còn đào tạo thực tập sinh một cách bài bản để có thể trở thành một lập
trình viên tài năng.
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 Wee Digital, 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:
a)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 mentor đã 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ư Tortoise SVN - sử dụng trong làm việc nhóm,
visual studio code– trình duyệt file trực quan với nhiều tiện ích, git bashcơng cụ giúp lập trình viên push pull code của dự án từ git về, bit-bucket
theo dõi các commit và branch được tạo ra trong dự án jira – cơng cụ
giúp quản lí quy trình nghiệp vụ tích hợp sử dụng Agile.
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ập trình 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, so với việc dung các IDE.
TRẦN MINH HIẾU


9

b)Tìm hiểu ngơn ngữ Javascript, HTML, CSS, ReactJS:
Thời gian : 15 ngày (3 tuần)
 Nội dung : Được hướng dẫn về các kỹ thuật lập trình với ngơn ngữ
Javascript căn bản để làm việc với ReactJS. Làm quen với ES6 và
lập trình một Web application đơn giản bằng ReactJS.
 Học vể html: cách sử dụng các thẻ để tạo nên một trang web theo
chuẩn HTML5, kết hợp với Javascript để hiểu về DOM (bao gồm
virtual, real và shadow dom).
 Học về css: cách viết một css class, cách sử dụng các css atributes
theo chuẩn BEM. Áp dụng styled components để viết CSS trong
React.
 Học cách sử dụng thư viện Redux Thunk, Redux Saga, Axios để
quản lý state và thực hiện action bất đồng bộ.
 Tìm hiểu về JSON: thực tập sinh tìm hiểu về JSON và ứng dụng
của nó trong việc trao đổi dữ liệu trên web.

 Học cách sử dụng Web Socket. Để giao tiếp giữa server và client
thông qua socket dễ dàng.
 Biết cách sử dụng Figma để có thể sáng tạo, cắt giao diện cho Web
App.
Thực hiện :
 Tham gia đầy đủ các buổi training của công ty.
 Ứng dụng các kiến thức của bản thân vào thực tế.
Kết quả :
 Nâng cao kỹ năng lập trình với ngôn ngữ Javascript. Tổ chức code
một cách hợp lý. Áp dụng các tiêu chuẩn khắt khe nhằm hạn chế được
nhiều lỗi có thể phát sinh.

TRẦN MINH HIẾU


1
0

3.Thực hiện dự án thực tế:
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 về JS và có thể làm việc với đồ án của công ty. Trong
những tháng tiếp theo, 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 số chức năng nhỏ của dự án và dần tăng
mức độ khó lên nhằm thử thách thực tập sinh.
4.Lịch làm việc:
Thán
g

1

2
3

4,5

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
email.
-Tìm hiểu ngơn ngữ lập trình JS,
HTML, CSS.
- Lập trình với ReactJS.
- Áp dụng React hooks, thunk
và Saga để làm việc với
ReactJS.
- Làm việc với đồ án của cơng
ty mức độ nhỏ

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 Trình
Lê Thiên
Phú.

Anh
Lê
Phú.
- Làm việc với đồ án của công
Anh
ty mức độ cao hơn.
Lê
Phú.
- Dựa vào kiến thức và kinh Anh
nghiệm đã có để làm việc với Lê
mọi mức độ của đồ án với khách Phú.
hàng.

Trình
Thiên
Trình
Thiên
Trình
Thiên

TRẦN MINH HIẾU


1

1

CHƯƠNG 3: CHI TIẾT VỀ PROJECT
Vì chính sách bảo mật của công ty nên em không thể tiết lộ chi tiết về đồ án em đã
thực hiện cùng công ty. Nhưng thầy/cơ có thể tham khảo một dự án nho nhỏ đã
thực hiện trong 1 tuần thử sức với ReactJS trên công ty của em:
/>
TRẦN MINH HIẾU


1
2

TÀI LIỆU KHAM KHẢO
-Tài liệu ngôn ngữ javascript, html, css, naming convention, ReactJS:
/> /> /> /> /> /> />
TRẦN MINH HIẾU


1
3

TỔNG KẾT
Sau đợt thực tập tại công ty Wee Digital, em đã học được rất nhiều điều bổ ích từ
thực tế mà nhà trường chưa thể cho em trải nghiệm đó. Đồng thời, em cũng đã đạt
được thành cơng một vị trí lập trình viên Front-End trong đội ngũ của Wee Digital.
Và một lần nữa, em cũng xin cảm ơn thầy cô đã tạo điều kiện cho em để trải
nghiệm mơi trường làm việc chun nghiệp khi cịn ngồi trên ghế nhà trường.

TRẦN MINH HIẾU