báo cáo thực tập xây dựng WEBSITE ECOMMERCE
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (409.86 KB, 17 trang )
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
XÂY DỰNG WEBSITE ECOMMERCE
Công ty thực tập
:
Designveloper (DSV)
Người phụ trách
:
Nguyễn Đình Sơn
Thực tập sinh
:
Dương Thạnh Tín
TP. Hồ Chí Minh, tháng 7 năm 2020
Dương Thạnh Tín
TP.HCM, 25/12/2019
2
MỞ ĐẦU
Ngày nay, với sự phát triển mạnh mẽ của khoa học công nghệ, Công nghệ Thông tin là một
trong những ngành có vị thế dẫn đầu và có vai trị rất lớn trong sự phát triển chung đó. Các ứng
dụng của công nghệ thông tin được áp dụng trong mọi lĩnh vực nghiên cứu khoa học cũng như
trong mọi lĩnh vực của đời sống. Là một phần của Công nghệ Thơng tin, Cơng nghệ web đang có
được sự phát triển mạnh mẽ và phổ biến rất nhanh bởi những lợi ích mà nó mang lại cho cộng
đồng là rất lớn.
Bằng việc lựa chọn và thực hiện đề tài “Xây dựng website ecommerce”, chúng em muốn
tìm hiểu và đưa ra một giải pháp tốt nhằm giải quyết công việc bán hàng trực tuyến. Thông qua
việc thực hiện xây dựng website này chúng em học hỏi hiều kiến thức và hiểu được quy trình cơ
bản để xây dựng một website hồn chình.
Website bán hàng giúp cho khách hàng những lựa chọn linh hoạt và tiện lợi trong việc tìm
mua sản phẩm thơng qua chức năng tìm kiếm và giỏ hàng. Các thông tin về sản phẩm được hiển
thị chi tiết với từng sản phẩm, từ đó khách hàng dễ dàng nhận biết và lựa chọn được thứ mình cần.
Tuy chỉ là một đồ án nhỏ nhưng nó đã giúp chúng em học tập được nhiều kiến thức và công nghệ
mới.
Dương Thạnh Tín
3
LỜI CẢM ƠN
Trân trọng gửi lời cảm ơn Công ty Designveloper đã 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àm được một Website bán
hàng. 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 hoàn thành đợt thực tập này.
Đặc biệt cảm ơn chị Trang đã 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ảm ơn anh Sơn ,
đã training Nodejs, Reactjs và hỗ trợ chúng em rất nhiều về các vấn đề kỹ thuật về Front-end và
Back-end trên Webiste, cảm ơn anh Sơn, đã 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 chị trong công ty đã hỗ trợ và giúp đỡ em khi em
mới vào công ty thực tập để có thể thích nghi với một 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.
Dương Thạnh Tín
TP. Hồ Chí Minh, ngày 28 tháng 7 năm 2020
Dương Thạnh Tín
4
NHẬN XÉT CỦA KHOA
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
....................................................................................................................................................
Dương Thạnh Tín
5
Mục lục
MỞ ĐẦU ........................................................................................................................ 1
LỜI CẢM ƠN ................................................................................................................ 3
Chương I: Giới thiệu công ty thực tập.......................................................................... 6
Giới thiệu công ty ............................................................................................. 6
Sản phẩm của công ty ....................................................................................... 6
2. Chương II: Nội dung thực tập ................................................................................ 7
Tìm hiểu cơng ty và các kỹ năng cơ bản trong công ty ................................... 7
Nghiên cứu kĩ thuật .......................................................................................... 7
2.2.1
Các cơng cụ làm việc................................................................................... 7
2.2.2
Tìm hiểu về giao diện Website .................................................................... 8
2.2.3
Tìm hiểu về Bootstrap ................................................................................. 9
2.2.4
Tìm hiểu về JavaScript.............................................................................. 10
2.2.5
Tìm hiểu về Front-end với Reactjs ............................................................ 10
2.2.6
Tìm hiểu về Back-end với Nodejs.............................................................. 11
Thực hiện project ........................................................................................... 11
Lịch làm việc ................................................................................................... 12
3. Chương III: Chi tiết về Project ............................................................................ 13
Giới thiệu về Website ..................................................................................... 13
Các tính năng chính........................................................................................ 13
Thực hiện ........................................................................................................ 14
Q trình thực hiện ........................................................................................ 14
TÀI LIỆU THAM KHẢO ........................................................................................... 16
Dương Thạnh Tín
6
TỔNG KẾT.................................................................................................................. 17
Chương I: Giới thiệu công ty thực tập
Giới thiệu công ty
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. Với quy trình làm
việc chun nghiệp, chúng tơi cam kết cung cấp các dịch vụ với chất lượng tốt nhất và mức giá
hợp lý
Sản phẩm của công ty
Designveloper chuyên thiết kế Website và App Mobile. Designveloper đưa ra giải pháp công
nghệ cho start-up và doanh nghiệp trong mọi lĩnh vự như năng lượng, tài chính, logistic, y tế,
truyền thông, giáo dục, vận tải,... Chúng tôi đồng hành từ lúc dự án mới chỉ là ý tưởng cho đến
khi hoàn thiện sản phẩm và tạo thành một thương hiệu. Nhờ đó cơng ty đã có những dự án thành
cơng: LuminPDF, Swell & Switchboard, Walrus Education, Joyn’it, Bonux, ...
Dương Thạnh Tín
7
2.
Chương II: Nội dung thực tập
Đợt thực tập với chủ đề “Xây dựng một Website Ecommerce” nhằm mục đích giúp sinh
viên thực tập được đào tạo toàn diện về Front-end và Back-end, đồ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 chun nghiệp.
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 Designveloper, 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.
Nghiên cứu kĩ thuật
2.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 quá trình làm việc.
Trong thời gian này, 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ư Trello sử dụng
trong làm việc nhóm và để theo dõi q trình hồn thiện của Website, Masttermost là phần
mềm để trao đổi thông tin giữa các cá nhân với nhau.
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.
Dương Thạnh Tín
8
2.2.2 Tìm hiểu về giao diện Website
Thời gian: 1 ngày
Nội dung: Được training về các kĩ thuật thiết kế Website và các đối tượng trên Webisite.
Các thành phần thường có trong trang web
•
Banner: là một file ảnh có kích thước dài, thường nằm ở 1/3 trên của trang, dùng để quảng
cáo.
•
Logo: là biểu tượng của website, cũng có thể là biểu tượng của cơ quan chủ quản website.
•
Counter: là bộ phận đếm số người truy cập website.
•
Search form: hộp thoại giúp người xem nhanh chóng tìm kiếm thơng tin cần tìm. Search
form có thể dùng để tìm thơng tin trong một trang, một site hay tất cả các site trên tồn cầu.
•
Navigator: là tập hợp những đường liên kết dẫn đến các trang chuyên đề. Có thể
gọi navigator là menu list cũng đúng.
•
Header: là thành phần ln ln hiện diện phần trên cùng của tất cả các trang web, thường
chứa các navigator. Một website được cấu trúc chặt chẽ cần phải có header này.
•
Footer: là thành phần ln ln hiện diện ở phần dưới cùng của tất cả các trang, chứa các
thông tin cần thiết: Contact us, Private policy, About us hay nối với các trang chuyên đề.
Mục đích của header và footer là giúp người xem không bị lạc hướng trong kho thông tin
của bạn. Nếu thiếu footer hay header, trang web trở thành trang cụt (orphan page).
•
Frame: là hình thức chia khung trang, giúp bố trí các trang vừa cố định về hình thức, vừa
thay đổi về nội dung.
•
Forum: trang thảo luận, người xem có thể trao đổi thơng tin cho nhau bằng cách gõ ý kiến
vào đó lưu lại trên trang web và đợi người khác trả lời, hưởng ứng. Forum giúp nâng cao
kiến thức tập thể và hấp dẫn người xem.
•
Chat: một thành phần khác giúp hai hay nhiều bạn đọc tán gẫu với nhau trực tiếp. Các
thơng tin Chat khơng lưu lại trên trang web.
•
Multimedia: là các file ảnh, video hay âm thanh lồng trong trang...
Thực hiện:
Dương Thạnh Tín
9
-
Tham gia đầy đủ các buổi training 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ả:
-
Nâng cao kỹ năng lập trình với ngơn ngữ HTML, CSS.
Có được những kiến thức quan trọng cho việc lập trình Website 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.
2.2.3 Tìm hiểu về Bootstrap
Thời gian: 1 ngày
Nội dung: Được training về các kĩ thuật thiết kế Website.
-
Bootstrap là 1 framework HTML, CSS, và JavaScript cho phép người dùng dễ dàng
thiết kế website theo 1 chuẩn nhất định, tạo các website thân thiện với các thiết bị cầm
tay như mobile, ipad, tablet, ...
-
Bootstrap bao gồm những cái cơ bản có sẵn như: typography, forms, buttons, tables,
navigation, modals, image carousels và nhiều thứ khác. Trong bootstrap có thêm nhiều
Component, Javascript hỗ trợ cho việc thiết kế reponsive của bạn dễ dàng, thuận tiện
và nhanh chóng hơn.
-
Những điểm thuận lợi khi sử dụng bootstrap:
•
Rất dễ để sử dụng: Nó đơn giản vì nó được base trên HTML, CSS và Javascript chỉ
cẩn có kiến thức cơ bản về 3 cái đó là có thể sử dụng bootstrap tốt.
•
Responsive: Bootstrap xây dựng sẵn reponsive css trên các thiết bị Iphones, tablets,
và desktops. Tính năng này khiến cho người dùng tiết kiệm được rất nhiều thời gian
trong việc tạo ra một website thân thiện với các thiết bị điện tử, thiết bị cầm tay.
Tương thích với trình duyệt: Nó tương thích với tất cả các trình duyệt (Chrome, Firefox,
Internet Explorer, Safari, and Opera). Tuy nhiên, với IE browser, Bootstrap chỉ hỗ trợ từ
IE9 trở lên. Điều này vô cùng dễ hiểu vì IE8 khơng support HTML5 và CSS3
Thực hiện:
Dương Thạnh Tín
10
-
Làm các bài thực hành, kiểm tra về kiến thức đã học.
Kết quả:
-
Nâng cao kỹ năng lập trình với ngơn ngữ HTML, CSS.
Làm quen và biết được công dụng và cách sử dụng các công cụ phục vụ trong công
việc.
2.2.4 Tìm hiểu về JavaScript
Thời gian: 3 ngày (1 tuần)
Nội dung: Tìm hiểu các kiến thức cơ bản và nâng cao trong JavaScript.
-
Các kiến thức cơ bản về Array, String, DOM, Object, Variable, Function, Scope, HTTP,
….
-
Tìm hiểu về TypeScript, npm, ES6 và các vấn đề liên quan đến JavaScript.
-
Lập trình hướng chức năng.
Thực hiện:
-
Làm các bài thực hành, kiểm tra về kiến thức đã học.
Kết quả:
-
Làm quen và biết được công dụng và cách sử dụng các công cụ phục vụ trong cơng
việc.
Có được những kiến thức quan trọng cho việc lập trình Website 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.
2.2.5 Tìm hiểu về Front-end với Reactjs
Thời gian: 3 ngày (1 tuần)
Nội dung: Tìm hiểu các kiến thức cơ bản và nâng cao trong Reactjs.
-
Các kiến thức cơ bản về: Component, JSX, State, Props, Lifecycle Hooks, Styles, ….
-
Sử dụng Axios để tương tác với API.
-
Tìm hiểu các kiến trúc của Redux
-
Sử dụng SCSS.
Dương Thạnh Tín
11
Thực hiện:
-
Làm các bài thực hành, kiểm tra về kiến thức đã học.
Kết quả:
-
Làm quen và biết được công dụng và cách sử dụng các công cụ phục vụ trong cơng
việc.
Nắm được cách triển khai ứng dụng.
2.2.6 Tìm hiểu về Back-end với Nodejs
Thời gian: 3 ngày (1 tuần)
Nội dung: Được training về các kĩ thuật về API và các vấn để liên quan về Back-end.
-
Các kiến thức cơ bản về Back-end: Middleware, route, Cookie, JWT, ….
-
Triển khai và sử dụng các packages.
-
Tìm hiểu về Express và thực hiện Website theo mơ hình MVC.
-
Sử dụng Database: MongoDB.
-
Viết API
Thực hiện:
-
Làm các bài thực hành, kiểm tra về kiến thức đã học.
Tham gia đầy đủ các buổi training.
Kết quả:
-
Làm quen và biết được công dụng và cách sử dụng các công cụ phục vụ trong công
việc.
Nắm được cách triển khai ứng dụng.
Biết cách sử dụng MongoDB, Express và Nodejs.
Thực hiện project
Sau khi đượ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ề
cách lập trình Front-end và Back-end: Reactjs, Nodejs, Mongodb. Các Mentor đã hướng dẫn thực
tập sinh áp dụng các kiến thức đã học để thực hiện một project về Website Ecommerce.
Dương Thạnh Tín
12
Lịch làm việc
Tuần
Cơng việc
-
1
-
2
3
4
Người hướng dẫn
Mức độ
hồn
thành
Nhận xét của
người hướng
dẫn
Tìm hiểu về cơng Chị Trần Mai Bích
ty, cách tổ chức của Trang
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 JavaScript,
html, scss
Tìm hiểu các kiến
thức Front-end với
Reactjs
Thực hiện dự án
Tìm hiểu các kiến
thức Back-end với
Nodejs
Thực hiện dự án
Thực hiện dự án
Anh Nguyễn Đình
Sơn
Anh Nguyễn Đình
Sơn
Anh Nguyễn Đình
Sơn
Dương Thạnh Tín
13
3.
Chương III: Chi tiết về Project
Giới thiệu về Website
Với đề tài “Xây dựng Website Ecommerce” giúp cho khách hàng những lựa chọn
linh hoạt và tiện lợi trong việc tìm mua sản phẩm thơng qua chức năng tìm kiếm và giỏ
hàng. Các thông tin về sản phẩm được hiển thị chi tiết với từng sản phẩm, từ đó khách hàng
dễ dàng nhận biết và lựa chọn được thứ mình cần.
Các tính năng chính
Vì đây là nội bộ của cơng ty Designveloper nên em chỉ khái quát về các yêu cầu chức năng
của trang Web
Danh sách tác nhân của hệ thống:
STT Tác nhân
Ý nghĩa
1
Người quản trị (Admin)
Người quản trị hệ thống.
2
Người dùng
Khách hàng có nhu cầu mua hàng truy
cập vào hệ thống.
STT Use case
1
Đăng nhập
Ý nghĩa
Cho phép người truy cập đăng nhập vào
hệ thống. Dựa vào vai trò của user đăng
nhập mà có thể giới hạn các thao tác với
hệ thống.
2
Đăng ký
Cho phép người truy cập tạo tài khoản và
có thể đăng nhập vào hệ thống với
thoogn tin đăng nhập lúc đăng ký.
3
Cập nhật thông tin
Cho phếp người dùng sửa đổi các thơng
profile
tin cá nhân phù hợp trên hệ thống.
Dương Thạnh Tín
14
4
Quản lý sản phẩm
Thực hiện thêm/xoá/cập nhật/xem các
sản phẩm của hệ thống.
5
Quản lý user
Thực hiển thêm xóa cập nhật các user
đăng nhập vào hệ thống.
Quản lý đơn đặt hàng
6
Cho phép người dùng xem các đơn đặt
hàng sau khi đăng nhập vơi vai trò
admin.
Xem doanh sách các sản
Cho phép người dùng xem danh sách các
phâm bày bản
sản phẩm phù hợp theo loại.
9
Thống kê doanh thu
Thống kê doanh thu của quán
10
Quản lý giỏ hàng
Thực hiện thêm/xoá/cập nhật/xem các
8
sản phẩm trong giỏ hàng của hệ thống.
Thực hiện
Sinh viên: Dương Thạnh Tín
Với sự giúp đỡ nhiệt tình của anh Nguyễn Đình Sơn.
Quá trình thực hiện
Giai đoạn 1:
-
Trao đổi với mentor.
-
Tìm hiểu và chọn cơng nghệ phù hợp với project.
Kết quả: Front-end là Reactjs, Back-end là Nodejs và cơ sở dữ liệu là MongoDB.
Giai đoạn 2:
-
Thiết kế Website và xây dựng các chức năng chính của Website
-
Demo cho mentor về những kết quả mình đã làm
-
Fix một số lỗi trong quá trình thực hiện
Kết quả: Cơng việc được hồn thành một cách nhanh chóng hơn và hoàn thiện hơn.
Giai đoạn 3:
-
Được mentor yêu cầu thêm chức năng và chỉnh sửa giao diện.
-
Fix một số lỗi trong q trình thực hiện
Dương Thạnh Tín
15
Kết quả: Hoàn thành việc triển khai dự án và một số chức năng chính nhưng vẫn cịn phát
sinh lỗi trong q trình thực hiện.
Dương Thạnh Tín
16
TÀI LIỆU THAM KHẢO
[1]: />[2]: />[3]: />[4] />[5] />[6] />[7] />[8] />[9] />
Dương Thạnh Tín
17
TỔNG KẾT
Như vậy, chỉ trong vòng một tháng ngắn ngủi, em đã được trải nghiệm và làm quen được
với một môi trường làm việc vô cùng chuyên nghiệp. Em đã được học hỏi nhiều kiến thức và
nhiều kĩ năng quan trọng để có thể thích nghi nhanh chóng với cơng việc của một lập trình viên
chuyên nghiệp
Chân thành cảm ơn các anh chị trong công ty Designveloper đã hỗ trợ và giúp đỡ em trong
thời gian qua. Em xin chân thành cảm ơn anh Nguyễn Đình Sơn đã giúp đỡ em trong thời gian
thực tập ở cơng ty.
Dương Thạnh Tín
