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 APPLICATION

Cơng ty thực tập : Công ty Cổ phần Thế Giới Di Động
Người phụ trách : Anh Võ Nhật Nam
Thực tập sinh

: Đinh Quang Hồng

TP. Hồ Chí Minh, tháng 12 năm 2021

Sinh viên Đinh Quang Hoàng


2

LỜI MỞ ĐẦU

Hiện nay, xã hội đang ngày một phát triển, rất nhiều công nghệ mới được phát minh ra
dẫn đến các cuộc cách mạng trong thế giới Internet. Lập trình Web Application cũng nằm trong
số đó. Với tốc độ phát triển vô cùng mạnh mẽ, Website đã và đang là nhân tố kích thích sự phát
triển của cơng nghệ thông tin thế giới, cả về phần cứng và phần mềm.
Cùng với sự phát triển về cơng nghệ đó, các doanh nghiệp dần dần số hóa thương mại
điện tử đế các sản phẩm được tiếp cận đến nhiều người, từ trong nước đến nước ngoài như
Taobao, Amazon, Tiki, Lazada, Shopee, Thegioididong.com.

Sau ba 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ập trình Web Application trong một mơi trường chun nghiệp. Vì vậy,
em quyết định chọn Cơng ty Cổ phần Thế Giới Di Động - MWG - 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.

Sinh viên Đinh Quang Hoàng


3

LỜI CẢM ƠN

Trân trọng gửi lời cảm ơn Công ty cổ phần Thế Giới Di Động đã 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 nhóm trainer, nhóm
thực tập chúng em đã tiếp thu được những kiến thức quan trọng để có thể lập trình một Web
Application. Chân thành cảm ơn các anh chị trong nhóm trainer đã 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.
Đặc biệt cảm ơn anh Võ Nhật Nam, đã training, hướng dẫn, giúp đỡ training 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ảm ơn anh Bùi Mạnh Đức, đã chỉ dẫn chúng em về cách làm báo cáo, lên kế
hoạch, những kỹ năng không thể thiếu; cảm ơn các anh Phạm Hữu Danh, anh Lê Hồng Quân đã
training cho chúng em những kiến thức quan trọng về C#, Javascript, ASP.Net MVC để có thể
làm ra một sản phẩm trong thời gian qua.
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.
Đinh Quang Hoàng
Tp.HCM, ngày 14 tháng 12 năm 2021

Sinh viên Đinh Quang Hoàng



4

NHẬN XÉT CỦA KHOA

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

Sinh viên Đinh Quang Hoàng


5


MỤC LỤC
MỤC LỤC .................................................................................................................................................. 5
Chương 1: Giới thiệu công ty thực tập ....................................................................................................... 6
1. Giới thiệu công ty Thế Giới Di Động - MWG ................................................................................ 6
2. Sản phẩm của công ty ...................................................................................................................... 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 ................................................................... 8
2. Nghiên cứu kỹ thuật ........................................................................................................................ 8
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. Tổng quan về Website ................................................................................................................... 14
2. Thực hiện ....................................................................................................................................... 19
3. Kế hoạch ........................................................................................................................................ 19
TÀI LIỆU THAM KHẢO ........................................................................................................................ 20
TỔNG KẾT .............................................................................................................................................. 21

Sinh viên Đinh Quang Hoàng


6

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

1. Giới thiệu công ty Thế Giới Di Động - MWG
Công ty Cổ phần Đầu tư Thế Giới Di Động (MWG) là nhà bán lẻ số 1 Việt Nam về doanh
thu và lợi nhuận, với mạng lưới hơn 4.500 cửa hàng trên toàn quốc. MWG vận hành các
chuỗi bán lẻ thegioididong.com, Điện Máy Xanh, Bách Hố Xanh. Ngồi ra, MWG cịn mở
rộng ra thị trường nước ngoài với chuỗi bán lẻ thiết bị di động và điện máy tại Campuchia
cũng như đầu tư vào chuỗi nhà thuốc An Khang. Năm 2020, thành viên mới của MWG là

4KFarm ra đời với mục tiêu cung cấp cho người tiêu dùng thực phẩm an toàn theo chuẩn 4
không (không thuốc trừ sâu, không chất bảo quản, không chất tăng trưởng, không sử dụng
giống biến đổi gen).
MWG vinh dự khi liên tiếp lọt vào bảng xếp hạng TOP 50 công ty niêm yết tốt nhất Châu
Á của tạp chí uy tín Forbes và là đại diện Việt Nam duy nhất trong Top 100 nhà bán lẻ hàng
đầu Châu Á – Thái Bình Dương do Tạp chí bán lẻ châu Á (Retail Asia) và Tập đoàn nghiên
cứu thị trường Euromonitor bình chọn.
MWG nhiều năm liền có tên trong các bảng xếp hạng danh giá như TOP 500 nhà bán lẻ
hàng đầu Châu Á – Thái Bình Dương (Retail Asia) và dẫn đầu TOP 50 công ty kinh doanh
hiệu quả nhất Việt Nam (Nhịp Cầu Đầu Tư) … Sự phát triển của MWG cũng là một điển
hình tốt được nghiên cứu tại các trường Đại học hàng đầu như Harvard, UC Berkeley,
trường kinh doanh Tuck (Mỹ).
Không chỉ là một doanh nghiệp hoạt động hiệu quả được nhìn nhận bởi nhà đầu tư và các
tổ chức đánh giá chuyên nghiệp, MWG còn được người lao động tin yêu khi lần thứ 4 liên
tiếp được vinh danh trong TOP 50 Doanh nghiệp có mơi trường làm việc tốt nhất Việt Nam
và là doanh nghiệp xuất sắc nhất tại giải thưởng Vietnam HR Awards – “Chiến lược nhân sự
hiệu quả”.

Sinh viên Đinh Quang Hoàng


7

2. Sản phẩm của công ty
Sản phẩm của khối Công nghệ Thông tin – MWG là hệ thống các Website thương mại
điện tử phục vụ cho bán hàng, cụ thể là các lĩnh vực:
• Chuỗi Thế Giới Di Động kinh doanh thiết bị di động (điện thoại di động, máy tính
bảng, laptop và phụ kiện).
• Chuỗi Điện Máy Xanh kinh doanh các sản phẩm điện tử tiêu dùng (điện tử, điện
lạnh và gia dụng).

• Chuỗi Bách Hóa Xanh kinh thực phẩm tươi sống (thịt cá, rau củ, trái cây…) và nhu
yếu phẩm.
• Chuỗi Bluetronics kinh doanh hàng điện tử tiêu dùng đầu tiên ở thị trường nước
ngồi của MWG.
• 4KFarm chuyển giao công nghệ và hỗ trợ nông dân trồng rau an tồn 4 KHƠNG
(khơng thuốc trừ sâu, khơng chất tăng trưởng, không chất bảo quản và không sử
dụng giống biến đổi gen). 4KFarm cam kết thu mua 100% sản lượng rau an tồn
này của nơng dân và cung cấp độc quyền cho chuỗi Bách Hóa Xanh.
• Chuỗi Nhà thuốc An Khang chuyên bán dược phẩm, thực phẩm chức năng, thiết bị
y tế...

Sinh viên Đinh Quang Hoàng


8

Chương 2: Nội dung thực tập
Đợt thực tập với chủ đề “Lập trình Web Application” nhằm mục đích giúp sinh viên thực
tập được đào tạo tồn diện về Lập trình Web Application, đồng thời rèn luyện những kỹ năng
mềm như làm việc nhóm, thuyết trình, 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 Website chuyên nghiệ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: 2 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 và một số phần

mềm nội bộ trong công việc…
Kết quả: Hiểu thêm về công ty MWG, 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 các ứng dụng quản lý cơng việc, ERP, 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: 1 tuần
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, supervisor đã 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 như.
SourceTree: quản lý source code
Wireshark: bắt gói tin, đọc API
Postman: hỗ trợ làm việc với API
Thực hiện: Thực hành sử dụng các phần mềm đã nêu trên.
Kết quả: Kết hợp sử dụng các cơng cụ miễn phí để hỗ trợ việc phát triển ứng dụng.
2.2. Tìm hiểu về ngơn ngữ
Thời gian: 1 tuần

Sinh viên Đinh Quang Hoàng


9

Nội dung:
- Tìm hiểu về JQuery trong Javascript
Tìm hiểu thư viện JQuery để hỗ trợ xây dựng các chức năng dễ dàng và nhanh
chóng hơn.
-


Extension trong C#:
Hỗ trợ viết code đẹp hơn, dễ đọc dễ hiểu hơn. Cho phép code viết theo
functionally styped programming, rất cần thiết trong 1 ngôn ngữ hướng đối tượng.

-

Dependency Injection trong C#:

Là một kỹ thuật trong lập trình, nó là một hình thức cụ thể của Inverse of Control
(Dependency Inverse), hướng tới việc loại bỏ sự phụ thuộc trong code
Thực hiện:
- Tham gia đầy đủ các buổi training online của công ty.
- Làm các bài thực hành, kiểm tra về kiến thức đã học.
Kết quả:
-

2.3.

Nâng cao kỹ năng lập trình với Javascript, C#.
Có được những kiến thức quan trọng cho việc lập trình web application sau này.
Ngồi ra cịn được biết thêm một số quy tắc trong việc viết code sao cho đúng
chuẩn, dễ đọc, dễ hiểu.
Lập trình Web MVC

Thời gian: 3 tuần
Nội dung: Các kiến thức cơ bản về Web và Service để hỗ trợ việc lập trình Web
Application.
-

Kiến trúc MVC

ASP.NET Core MVC là tên gọi của framework trong ASP.NET Core thực thi mơ
hình kiến trúc MVC. Framework này giúp phát triển nhiều loại ứng dụng khác
nhau, từ ứng dụng web truyền thống đến ứng dụng đơn trang hoặc Web API.

-

Phân biệt và sử dụng ViewComponent, PartailView, …

Sinh viên Đinh Quang Hoàng


10

View component là cơ chế tái sử dụng trong Razor Pages (cùng với Partial Pages).
View component hướng tới xây dựng các thành phần tương đối độc lập, phức tạp
với các logic xử lý dữ liệu riêng.
Partial View có thể xem như 1 user control trong ASP.NET Webform. Nó gần
giống như một View nhưng khác là có thể được nhiều View sử dụng. Nó giúp ta
khỏi phải tốn cơng xây dựng và sử dụng một thành phần nào đó trong View mà
không cần phải tạo nhiều lần. Ta chỉ việc tạo 1 lần và sử dụng Partial View trong
các View mà ta muốn dùng lại.
-

Routing
Nắm được các khái niệm cơ bản về Route và Routing. Mỗi Route bao gồm các
thông tin (hay còn gọi là URL pattern), giúp xác định được thông tin Controller và
Action mặc định và các rang buộc (constraints).

-


Middleware:
Nắm rõ được khái niệm - Middleware là mã nguồn hay là các thành phần riêng lẻ
để xử lý các request đến. Các middleware này đứng theo dãy với nhau gọi là
request pipeline. Chúng ta tạo middleware và đăng ký nó trong phương thức
Configure của class Startup.

-

Cache
Việc Caching là lưu trữ dữ liệu vào cache dưới dạng mã nhị phân. Nó sẽ giúp
người dùng rút ngắn thời gian truy cập, giảm độ trễ và thực hiện các thao tác trên
ứng dụng/website/hệ điều hành thuận tiện, nhanh chóng hơn.

-

Session
Một session bắt đầu khi client gửi request đến server, nó tồn tại xuyên suốt từ
trang này đến trang khác trong ứng dụng web và chỉ kết thúc khi hết thời gian
timeout hoặc khi bạn đóng ứng dụng. Giá trị của session sẽ được lưu trong một
file trên server.

-

Cookie
Cookies là các tệp được trang web người dùng truy cập tạo ra. Cookie giúp trải
nghiệm trực tuyến của bạn dễ dàng hơn bằng cách lưu thơng tin duyệt web. Với

Sinh viên Đinh Quang Hồng



11

Cookies, các trang web có thể duy trì trạng thái đăng nhập của bạn, ghi nhớ
tùy chọn trang web và cung cấp nội dung phù hợp với vị trí của người dùng
-

Authen, JWK, Token
Các công cụ hỗ trợ xác thực để tăng khả năng bảo mật giữa client & server

-

Logger
Tìm hiểu về Log - là một quá trình ghi lại những thơng tin được thơng báo, lưu lại
trong q trình hoạt động của một ứng dụng ở một nơi tập trung. Mục đích chính
là để có thể xem lại các thông tin hoạt động của ứng dụng trong quá khứ như
debug khi có lỗi xảy ra, check health, xem info, error, warning, …
Tìm hiểu cách sử dụng Logger trong ASP.Net Core MVC

Thực hiện:
-

Tham gia đầy đủ các buổi training online.
Tìm kiếm tài liệu trên mạng để tìm hiểu thêm.
Áp dụng kiến thức và nội dung đã tìm hiểu để thực hành thực tế trên Website nhỏ

Kết quả:
2.4.

Hiểu được những khái niệm về Web MVC và những khái niệm liên quan khác.
Có thể ứng dụng được những kiến thức đó vào thực tế

Lập trình Web API

Thời gian: 1 tuần
Nội dung: Các kỹ thuật tạo ra một Web API
-

Tìm hiểu về Restful API

-

RESTful API là một tiêu chuẩn dùng trong việc thiết kế API cho các ứng dụng
web (thiết kế Web services) để tiện cho việc quản lý các resource. Nó chú trọng
vào tài nguyên hệ thống (tệp văn bản, ảnh, âm thanh, video, hoặc dữ liệu động…),
bao gồm các trạng thái tài nguyên được định dạng và được truyền tải qua HTTP.
Tạo Web API với ASP.Net Core
Dựa trên MVC framework với một số thay đổi về kỹ thuật để xây dựng Web API

Sinh viên Đinh Quang Hoàng


12

-

Sử dụng Swagger để trực quan hóa API
Swagger là một bộ công cụ mã nguồn mở để xây dựng OpenAPI specifications
giúp chúng ta có thể thiết kế, xây dựng tài liệu và sử dụng REST APIs. Giúp các
team dễ dàng hơn trong việc tạo và bảo trì chúng.

-


Sử dụng Postman để tương tác với API
Postman là một App Extensions, cho phép làm việc với các API, nhất là REST,
giúp ích rất nhiều cho việc testing. Hỗ trợ tất cả các phương thức HTTP (GET,
POST, PUT, DELETE, OPTIONS, HEAD ...).

Thực hiện:
-

Tham gia đầy đủ các buổi training online.
Tìm hiểu them kiến thức trên mạng.
Áp dụng kiến thức và nội dung đã tìm hiểu để thực hiện trên Web API

Kết quả:
-

Hiểu được những khái niệm về Web API và những khái niệm liên quan khác.
Có thể tạo được một Web API hồn chỉnh kèm tài liệu trực quan hóa trên
Swagger

3. Thực hiện project
Sau 1.5 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ề HTML, CSS, C#, Web MVC & Web API và các công cụ lập trình web
application. Trong 1.5 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 để lập trình một Web Application hồn chỉnh.
Chi tiết đồ án sẽ được nói ở phần sau.

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

-

Mức độ
Cơng việc
Người hướng dẫn
hồn
thành
Tìm hiểu về cơng Anh Bùi Mạnh Hồn
ty, cách tổ chức của Đức
thành
cơng ty.
Làm quen với các
cơng cụ làm việc

Nhận xét của
người hướng dẫn
Hồn thành đầy
đủ, đúng deadline

Sinh viên Đinh Quang Hoàng


13

trong cơng ty.
Học cách trao đổi,
làm việc qua email.
- Tìm hiểu về các
cơng cụ lập trình
(Postman,

Wireshark,
SourceTree)
- Tìm hiểu ngơn ngữ
lập trình C# nâng
cao
- Tìm hiểu về JQuery
trong Javascript
- Tìm
hiểu
về
RestfulAPI
- Sử dụng Postman
để tương tác với
API
- Sử dụng Swagger
để trực quan hóa
API
- Sử dụng Wireshark
để bắt gói tin
Giai đoạn thực hiện
Project:
- Lên kế hoạch
- Tạo Web API
- Tạo Web MVC
-

2

3


4

5

Anh Võ Nhật Nam

Hoàn
thành

Hoàn thành đầy
đủ, đúng deadline

Anh Võ Nhật Nam Hoàn
Anh Phạm Hữu thành
Danh

Hoàn thành đầy
đủ, đúng deadline

Anh Võ Nhật Nam Hoàn
Anh Lê Hồng thành
Quân

Hoàn thành đầy
đủ, đúng deadline

Anh Võ Nhật Nam Hoàn
Anh Phạm Hữu thành
Danh


Hoàn thành đầy
đủ, đúng deadline

Sinh viên Đinh Quang Hoàng


14

Chương 3: Chi tiết về project

1. Tổng quan về Website
1.1. Giới thiệu
BlueSport là chuỗi cửa hàng chuyên bán đồ thể thao mới của công ty Thế Giới Di
Động.BlueSport được ra đời bởi nhu cầu chăm sóc sức khỏe ngày càng tăng cao của người
dân, đặc biệt là từ khi đại dịch Covid-19 xuất hiện. Với sự đa dạng, chất lượng sản phẩm
cũng như uy tín thương hiệu, AVASport sẽ đem đến cho khách hàng quan tâm đến sức
khỏe, đam mê thể thao có thêm một địa chỉ đáng tin cậy để mua sắm.
Tại đây, bạn sẽ cảm thấy hài lòng khi có thể tìm được đa dạng và đầy đủ các sản phẩm thể
thao như: Quần áo, giày thể thao, xe đạp, phụ kiện, đồng hồ thể thao…. đến từ các thương
hiệu nổi tiếng như: Adidas, Nike, Puma, Reebok, Skechers, Anta, Erke, Livan, Phiten,
Goodfit, Kingsmith… Những thương hiệu trên đều không xa lạ với các khách hàng tại Việt
Nam cũng như trên thế giới, đặc biệt là những bạn quan tâm đến thể thao khi đây toàn
những thương hiệu nổi tiếng về trang phục thể thao cũng như trong việc hỗ trợ, bảo hộ trong
quá trình tập luyện.
1.2. Danh sách các trang

Sinh viên Đinh Quang Hoàng


15


-

Trang chủ

Sinh viên Đinh Quang Hoàng


16

-

Trang ngành hàng

Sinh viên Đinh Quang Hoàng


17

-

Trang chi tiết sản phẩm

Sinh viên Đinh Quang Hoàng


18

-


Trang liên hệ

Sinh viên Đinh Quang Hoàng


19

2. Thực hiện
3 thành viên của team internship Web Application BlueSport:
-

Đinh Quang Hoàng
Trần Phương Duy
Thẩm Minh Đức

Và sự giúp đỡ tận tình của team trainer MWG.

3. Kế hoạch
-

-

-

-

Xây dựng DB với PostgreSQL
Xây dựng Web API
Sử dụng Swagger để trực quan hóa tài liệu API
Xây dựng Web MVC với 4 trang lớn:

o Trang chủ
o Trang ngành hàng
o Trang chi tiết
o Trang liên hệ
Với trang liên hệ:
o Áp dụng các tính năng Form, Validate và bảo mật Web
o Mỗi Session chỉ cho phép gửi 5 lần
o Cho phép lưu thông tin đã nhập vào Cookie
Với trang ngành hàng:
o Áp dụng Ajax load more
o Áp dụng form serialize
Đếm số lượng người đang truy cập Website
Cho phép chặn một IP nào đó truy cập - ứng dụng Middleware
Khách hàng truy cập vào link bị lỗi – notify tới ứng dụng Line
Kiến trúc chung: Base

Kết quả:
-

Tất cả các tính năng trên đã được thực hiện

Sinh viên Đinh Quang Hoàng


20

TÀI LIỆU THAM KHẢO
Web API
/>Web MVC
/>Postman

/>Swagger
/>JQuery
/>
Sinh viên Đinh Quang Hoàng


21

TỔNG KẾT
Như vậy, chỉ trong vòng bốn tháng ngắn ngủi, nhóm đã kịp hồn thành một Web
Application thương mai điện tử. Website đã có khá đầy đủ các trang và tính năng đã đề ra ban
đầu. Do thời gian có hạn nên tính năng Website cịn đơn giản. Nhưng do Website phát triển theo
framework có tính kế thừa nên sau này khi có thời gian sẽ có thể phát triển lên mức cao hơn.
Chân thành cảm ơn sự giúp đỡ của các anh chị nhóm trainer MWG, sự nỗ lực của nhóm
Internship để có thể hồn thành Web Application này. Cảm ơn thầy Huỳnh Tuấn Anh đã giúp
em hoàn thành bài báo cáo này.

Sinh viên Đinh Quang Hoàng