Đồ án báo c át áo ph triển phần mềm mã nguồn mở đề tài xây d website b n linh ki ựng á ện máy tnh

ĐẠI HỌC THỦ DẦU MỘT

VIỆN KỶ THUẬT CÔNG NGHỆ

ĐỒ ÁN BÁO CÁO PHÁT
TRIỂN PHẦN MỀM MÃ
NGUỒN MỞ
ĐỀ TÀI: XÂY DỰNG WEBSITE BÁN LINH KIỆN
MÁY TNH

: Võ Minh Tấn – 1824801030199
Văn Đức Quý – 1824801030173
Giảng viên hướng dẫn : Nguyễn Hữu Vĩnh
Lớp
: D18PM03
Sinh viên thực hiện

Bình Dương, tháng7 năm 2021

0

0


BÁO CÁO MÃ NGUỒN MỞ

MỞ ĐẦU
Trong thi đi công nghệ 4.0, Sự phát triển của lĩnh vực công nghệ
thông tin đã tác động vô cùng lớn đến với cuộc sống hàng ngày của mọi
ngưi. Là một phần của công nghệ thông tin, website là th quan trọng đưc
s dng nhiu trong đi sống xã hội , n đem li rt nhiu tiện ch nhm phc

v nhu cầu con ngưi. Trong bài báo cáo này nhm chng em xin trnh bày v
đ tài mà nhm thực hiện đ là: “website bn linh kin my tnh” gip
khách hàng c thể xem, lựa chọn các linh kiện phù hp cho nhu cầu s  dng
máy tnh mà họ muốn và giúp ngưi quản lý dễ dàng chỉnh sa giao diện cơ
bản, quản lý thông tin t ài khoản của khách hàng và đơn hàng.
Báo cáo này gồm các phần chương sau:
Chương 1: Tông quan
Chương 2: Cơ sở lý thuyết
Chương 3: Phân tch thiết kế cơ sở dữ liệu và hệ
thống
Chương 4: Thiết kế và xây dựng website
Chương 5: Kết luận và hướng phát triển

2|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ

LỜI CẢM ƠN

Với đ tài và môn học này, em xin chân thành cảm ơn sự gip đỡ tận tnh
của Thầy đã tận tình giúp đỡ, trực tiếp chỉ bảo, hướng dẫn nhm em trong suốt
quá trình thực hiện học phần Đồ án. Trong thi gian làm việc, em không ngừng
tiếp thu thêm nhiu kiến thc, kinh nghiệm mà còn học tập đưc tinh thần làm
việc, thái độ nghiên cu khoa học nghiêm túc, hiệu quả, đây là những điu rt cần
thiết cho nhm em trong q trình học tập và cơng tác sau này

Em xin chân thnh cm ơn !

3|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ

NHẬN XÉT CỦA GIẢNG VIÊN
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
...................................................................................................................................
......

Bình Dương, ngày tháng năm 2021
Giảng viên hướng dẫn

Nguyễn Hữu Vĩnh

4|Xâ y dựng W ebsite linh kiện má y tính

0

0

BÁO CÁO MÃ NGUỒN MỞ

MỤC LỤC
Trang
MỞ ĐẦU ................................................................................................................. 2
Chương 1 Tổng quan .......................................................................................... 8
1.1 Giới thiệu sản phẩm ................................................................................... 8
1.2 Giới thiệu phương pháp ............................................................................. 9
1.3 Giới thiệu kết quả ....................................................................................... 9
1.3.1 Giới thiệu cơng nghệ nn tảng điện tốn đám mây Heroku ................ 9
1.3.2 Giới thiệu Laravel.............................................................................. 11
1.3.3 Giới thiệu v BootStrap ..................................................................... 13
1.3.4 Giới thiệu v PHP .............................................................................. 15
Chương 2: Cơ sở lý thuyết ................................................................................. 17
2.1 Quy trình đặt hàng .................................................................................... 17
2.2 Giới thiệu sản phẩm ................................................................................. 17
2.3 Giới thiệu sản phẩm ................................................................................. 17
2.3.1 Heroku CLI........................................................................................ 17
2.3.2 Vn đ phát sinh ................................................................................ 19
Chương 3 Phân tch thiết kế h thống ............................................................. 20
3.1 Mô hnh tổng quan của hệ thống nghiên cu ........................................... 20
3.1.1 Xác định Actor .................................................................................. 20
3.1.2 Xác định yêu cầu ngưi s dng ....................................................... 20
3.2 Xây dựng biểu đồ Usecase ....................................................................... 20
3.3 Xây dựng biểu hot động ......................................................................... 25
3.4 Xây dựng biểu đồ lớp ............................................................................... 26
3.5 Thiết kế cơ sở dữ liệu ............................................................................... 27
3.5.1 Danh sách các bảng ........................................................................... 27

3.5.2 Bảng products .................................................................................... 27
3.5.3 Bảng bills ........................................................................................... 28
3.5.4 Bảng bill_ details ................................................................................ 28
3.5.5 Bảng categories ................................................................................. 28
3.5.6 Bảng users ......................................................................................... 29
3.5.6 Bảng customers ................................................................................. 29
Chương 4 Thiết kế v xây dng Website ........................................................ 31
4.1 Giao diện trang ngưi dùng ..................................................................... 31
4.2 Giao diện trang quản trị .......................................................................... 36
Chương 5 Kết luận v Hướng pht triển ........................................................ 41
5.1 Kết luận .................................................................................................... 41
5.2 Ưu điểm .................................................................................................... 41
5.3 Nhưc điểm .............................................................................................. 41
5.4 Hướng phát triển ...................................................................................... 41
DANH MỤC TÀI LIỆU THAM KHẢO .............................................................. 42

5|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ

DANH MỤC HÌNH
Trang
Chương 1 Tổng quan .......................................................................................... 8
Hình 1.1 – Heroku ................................................................................................. 10
Hình 1.2 – Laravel ................................................................................................. 11

Chương 2: Cơ sở lý thuyết ................................................................................. 17
Chương 3 Phân tch thiết kế h thống ............................................................. 20
Hình 3.2.1 – Biểu đồ Use case tổng quan .............................................................. 21
Hình 3.2.2 – Biểu đồ Use case khách hàng ........................................................... 21
Hình 3.2.3 – Biểu đồ Use case quản lý giỏ hàng của khách hàng ......................... 22
Hình 3.2.4 – Biểu đồ Use case tìm kiếm sản phẩm của khách hàng ..................... 22
Hình 3.2.5 – Biểu đồ Use case của Admin ............................................................ 23
Hình 3.2.6 – Biểu đồ Use case quản lý danh mc của Admin .............................. 23
Hình 3.2.7 – Biểu đồ Use case quản lý sản phẩm của Admin ............................... 23
Hình 3.2.8 – Biểu đồ Use case quản lý đơn hàng của Admin ............................... 24
Hình 3.2.9 – Biểu đồ Use case quản lý ngưi dùng của Admin ........................... 24
Hình 3.2.10 – Biểu đồ Use case của ngưi truy cập hệ thống ............................... 24
Hình 3.3.1 – Đăng nhập ......................................................................................... 25
Hình 3.3.2 – Quản lý đơn hàng .............................................................................. 25
Hình 3.3.3 – Quản lý đặt hàng ............................................................................... 26
Hình 3.4.1 – Biểu đồ lớp........................................................................................ 26
Hình 3.5.1 – Danh sách các bảng .......................................................................... 27
Hình 3.5.2 – Bảng products ................................................................................... 27
Hình 3.5.3 – Bảng order ........................................................................................ 28
Hình 3.5.4 – Bảng order_details ............................................................................ 28
Hình 3.5.5 – Bảng categories ................................................................................. 29
Hình 3.5.6 – Bảng users ......................................................................................... 29
Hình 3.5.7 – Bảng customers ................................................................................. 29
Hình 3.5.8 – Danh sách các bảng trong cơ sở dữ liệu ........................................... 30
Chương 4 Thiết kế v xây dng Website ........................................................ 31
4.1 Giao diện trang ngưi dùng ..................................................................... 31
Hình 4.1.1 – Trang chủ hiển thị ............................................................................. 31
Hình 4.1.2 – Trang đăng nhập ............................................................................... 32
Hình 4.1.3 – Trang giỏ hàng .................................................................................. 32
Hình 4.1.4 – Trang đặt hàng .................................................................................. 33

Hình 4.1.5 – Email sau khi đặt hàng ...................................................................... 34
Hình 4.1.6 – Trang chi tiết đơn hàng ..................................................................... 34
Hình 4.1.7 – Trang tìm kiếm ................................................................................. 34
Hình 4.1.8 – Trang chi tiết sản phẩm .................................................................... 35
4.2 Giao diện trang quản trị .......................................................................... 36
Hình 4.2.1 – Trang chủ thống kê ........................................................................... 36
Hình 4.2.2 – Trang quản lý danh mc ................................................................... 36
Hình 4.2.3 – Trang quản lý sản phẩm.................................................................... 37
Hình 4.2.4 – Trang quản lý ngưi dùng ................................................................ 38
Hình 4.2.5 – Trang quản lý đơn hàng .................................................................... 39
Hình 4.2.6 – Trang tìm kiếm ................................................................................. 40

6|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ

DANH MỤC CỤM TỪ VIẾT TẮT
STT
1
2

Cụm từ
Công nghệ phần mm
Công nghệ thông tin
…..

7|Xâ y dựng W ebsite linh kiện má y tính

0

0

Viết tắt
CNPM
CNTT


BÁO CÁO MÃ NGUỒN MỞ

Chương 1 : Tổng Quan
Chương 1 giới thiệu chung về sản phẩm, về phái người dùng,về phía người
quản trị, các module chính, giới thiệu về phương pháp và công nghệ trong
đề tài.

1.1 Giới thiu sn phẩm
Hot động bán hàng của một ca hàng linh kiện máy tnh tm tt như sau:
- Khi khách hàng c nhu cầu mua s ản phẩm, ca hàng s cho khách hàng xem
danh mc sản phẩm của ca hàng km theo giá tin đi km với s ản phẩm đ để
khách hàng c thể so s ánh và lựa chọn sản phẩm cần mua.
- Khi khách hàng đã lựa chọn 1 hoặc nhiu sản phẩm th khách hàng s thông
báo với nhân viên bán hàng của ca hàng v thông tin sản phảm đ và số lưng
sản phẩm muốn mua để nhân viên viết ha đơn thanh toán.
- Khách hàng s trả tin và nhận sản phẩm của mnh
Hệ thống “website bn linh kin my tnh” đưc xây dựng nhm giải quyết
các vn đ như sau:

Về pha người dùng:
-Tm kiếm các linh kiện, thiết bị máy tnh mà khách hàng cần
-Xem thông tin chi tiết của sản phẩm
-Chc năng đặt mua và hnh thc thanh toán
-Khách hàng chọn sản phẩm thêm vào giỏ hàng và xem giá tin
-Chc năng xây dựng cáu hnh máy tnh v nhu cầu công việc hoặc giải tr đồ họa
- Gip khách hàng c lựa chọn thuận tiện,nhanh chng để mua đưc sản phẩm
mnh cần nhanh nht.
Về pha người qun trị h thống:
-Phải c cơ chế đăng nhập để xác định ngưi có quyn hn mới c thể đăng nhập
vào hệ thống quản trị của website
-Quản lí thơng tin của khách hàng, thơng tin sản phẩm
-Thêm các thông tin dữ liệu cập nhật lên cơ sở dữ liệu
-Dễ dàng quản lý sản phẩm,danh mc sản phẩm
-Tùy chọn chỉnh sa,xa các dữ liệu từ trang web thông qua trang của ngưi quản
trị.

Cc module ca website:
Module sn phẩm:
Hiển thị thông tin và phân loi sản phẩm trong gian hàng ảo. Sản phẩm hiển
thị lên website s đưc hiển thị đầy đủ thông tin v sản phẩm đ như: hnh ảnh,
tên sản phẩm, đặc điểm nổi bật của sản phẩm, giá tin
Module tm kiếm, liên h, giới thiu:
Khách hàng s đưc cung cp chc năng tm kiếm trên Website
Thanh tm kiếm
Trả v các kết quả tm kiếm ti trang tm kiếm khi khác hàng muốn tm nhanh
qua từ kha như sản phẩm, danh mc hoặc theo giá tin.
Trang giới thiệu:
8|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ
Giới thiệu các thông tin v v ca hàng, danh mc sản phẩm, chương trnh
khuyến mãi…
Trang liên hệ:
Khách hàng c thể liên hệ với nhân viên bán hàng v các thc mc, ý kiến của
mình.
Module qun l sn phẩm, đơn hng:
Ngưi quản trị c thể cập nhật thông tin các mặt hàng, loi hàng, quản lý
thông tin đơn hàng.
Module gi hng:
Khi tham khảo đầy đủ thông tin v sản phẩm khách hàng c thể đặt mua sản
phẩm ngay ti Website thông qua chc năng giỏ hàng mà không cần phải đến địa
điểm giao dịch, giỏ hàng đưc làm mô phỏng như giỏ hàng trong thực tế c thể
thêm, bớt, thanh toán tin các sản phẩm đã mua. Khi chọn thanh toán giỏ hàng
khách hàng phải ghi đầy đủ các thông tin cá nhân, thông tin này đưc hệ thống
lưu trữ và x lý.
Module đăng k thnh viên, đăng nhập h thống:
Mỗi khách hàng giao dịch ti Website s đưc quyn đăng ký môt tài khoản
riêng. Tài khoản này s đưc s dng khi hệ thống yêu cầu. Một tài khoản do
khách hàng đăng ký s lưu trữ các thông tin cá nhân của khách hàng.
1.2. Giới thiu phương php
- Tm hiểu k thuật lập tr nh, cách thc hot động
- Hiểu đưc cách thc hot động của web Back-end
- Hiểu đưc cách lưu trữ dữ liệu của hệ quản trị cơ sở dữ liệu MySQL
- Hiểu đưc cách Deploy ng dựng lên nn tảng đám mây Heroku

- S dng ngôn ngữ lập tr nh như : Html, Css, Jquery, Framework Boostrap, Php,
và Framework Laravel.
- S dng các công c hỗ tr như : Xampp, Navicat, Visual Studio Code.
StarUML.
1.3. Giới thiu công ngh
1.3.1 Giới thiu công ngh nền tng đin toán mây Heroku
Heroku là g? N là nn tảng đám mây cho phép các lập trnh viên xây dựng,
triển khai, quản lý và mở rộng ng dng (PaaS – Platform as a service).
N rt linh hot và dễ s dng, cung cp cho một con đưng đơn giản nht để
đưa sản phẩm tiếp cận ngưi dùng. N gip các nhà phát triển tập trung vào phát
triển sản phẩm mà không cần quan tâm đến việc vận hành máy chủ hay phần
cng…

9|Xâ y dựng W ebsite linh kiện má y tính

0

0


BÁO CÁO MÃ NGUỒN MỞ

Hình 1.1.Heroku

Heroku hoạt động như thế no?
Heroku chy các ng dng trong dynos – n là một máy ảo mà c thể tăng giảm
sc mnh dự vào độ lớn của ng dng.
Hiểu đơn giản là dynos nhưng là các block, bạn muốn tăng tốc độ xử lý nhiều
cơng việc phức tạp thì thêm block (scale chiều ngang) hoặc tăng kích thước block
(scale chiều dọc) .

Heroku sẽ thanh tốn phí tháng dựa trên số lượng dynos và kích thước
mỗi dyno bạn sử dụng.

Heroku có ưu v khuyết điểm g?
Bn c thể dùng Heroku miễn ph cùng với vô vàn các addons hỗ tr cực kỳ hữu
ch th đy đưc coi là một trong những dịch v hp dẫn. Hỗ tr nhiu ngôn ngữ
lập trnh như:


NodeJS



Ruby



Python



PHP



Java



Scala



Clojure



Go

10 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
Kotlin
Ngồi ra chng ta cịn đưc cung cp Database, SSL miễn ph, hỗ tr mnh làm
việc team cũng như liên kết với Github một cách đơn giản.


Khuyết điểm th tt nhiên là c, việc miễn ph s chỉ c giới hn là 550 gi mỗi
tháng. Nếu muốn tăng lên 1000 gi th bn cần cài đặt phương thc thanh toán
trên đ. Tuy nhiên để kiểm nghiệm một ý tưởng hay một trang web nhỏ th nhiêu
đ là quá đủ để thu v kết quả.
Sau 2 đến 3 gi nếu server không c ngưi truy cập th server s chuyển sang
trng thái ngủ. V việc server bị tt khi không c traffic, cách đơn giản nht là tự
to traffic cho nó.
1.3.2 Giới thiu về Laravel

Laravel là một PHP Framework mã nguồn mở miễn ph, đưc phát triển
bởi Taylor Otwell với phiên bản đầu tiên đưc ra mt vào tháng 6 năm
2011. Laravel ra đi nhm mc đch hỗ tr phát triển các ng dng web, dựa
trên mô hình MVC (Model – View – Controller).
Laravel hiện đưc phát hành theo giy phép MIT, với source code đưc lưu trữ
ti Gitthub.
Mặc dù ra đi muộn hơn so với các đối thủ, tuy nhiên Laravel đã thật sự to
thành một làn sng lớn, đưc đánh giá tốt và s dng rộng rãi nht hiện nay.

Hình 1.2.Laravel

Ti sao nên s dng Laravel?
Bắt đầu dễ dàng
Lý do đầu tiên phải kể đến chnh việc Laravel c thể s dng cực dễ dàng cho
ngưi mới bt đầu, kể cả khi bn chỉ biết sơ v PHP, bn vẫn c khả năng phát
triển 1 website với 5 trang trong vịng vài gi.
Có mã nguồn mở
11 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
Framework Laravel với mã nguồn mở miễn ph, cho phép bn xây dựng ng
dng web lớn và phc tp một cách nhanh chng, dễ dàng.
Tt cả điu bn cần làm ở đây là cài đặt PHP, cộng với một trnh son thảo văn
bản để bt đầu.
Hỗ trợ cộng đồng

Trưng hp bn mc kẹt với những bug kh nhn, nhưng c ngưi đã trải qua và
hướng dẫn bn th khơng cịn g tuyệt hơn.
Laravel c một hệ thống thư viện hỗ tr vô cùng lớn và mnh hơn hẳn các
Framework khác.
Nếu bn report lỗi hoặc vi phm bảo mật trong Framework, phản hồi của cộng
đồng s rt nhanh chng.
Theo dõi MVC
Cu trc MVC và lập trnh hướng đối tưng OOP vẫn đưc giữ li trong
Framework Laravel, gip cung cp tài liệu tốt hơn, và tăng hiệu sut hơn.
Được xây dựng dựa trên những Framework hiệu quả nhất.
V ra đi muộn nên Laravel đưc thừa hưởng những ưu điểm và thế mnh của
Framework khác, khi có phần route cực mnh. V d điện hnh là Laravel s
dng một số thành phần tốt nht của Symfony.
Di chuyển Database dễ dàng
Di chuyển Database là một trong những tnh năng trọng yếu của Laravel. Nó cho
phép bn duy tr cu trc cơ sở dữ liệu ng dng mà không nht thiết phải to li.
Di chuyển Database còn cho phép bn viết mã PHP để kiểm soát Database, thay
v s dng SQL. N cịn cho phép bn khơi phc những thay đổi gần đây nht
trong Database.
Tính năng bảo mật hồn thiện
Ứng dng của bn s an toàn khi dùng Framework Laravel. K thuật ORM
của Laravel s dng PDO, chống chn SOL.
Ngoài ra, tnh năng bảo vệ crsf của Laravel gip ngăn chặn giả mo từ yêu cầu
trang chéo. Đ là c pháp tự động thoát bt k HTML nào đang đưc truyn qua
các tham số xem, nhm ngăn chặn kịch bản chéo trên trang web.
Điu bn cần thực hiện ở đây là s dng các thành phần thch hp của khuôn
khổ.

12 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
1.3.3 Giới thiu về Bootstrap
Bootstrap là một framework bao gồm các HTML, CSS và JavaScript template
dùng để phát triển website chuẩn responsive.
Bootstrap cho phép quá trình thiết kế website diễn ra nhanh chng và dễ dàng
hơn dựa trên những thành tố cơ bản sẵn c như typography, forms, buttons,
tables, grids, navigation, image carousels… Cùng Mắt Bão tm hiểu tnh năng và
li ch mang li cho lập trnh viên của Bootstrap là gì nhé!
Bootstrap là một bộ sưu tập miễn ph của các mã nguồn mở và cơng c dùng để
to ra một mẫu webiste hồn chỉnh. Với các thuộc tnh v giao diện đưc quy
định sẵn như kch thước, màu sc, độ cao, độ rộng…, các designer c thể sáng
to nhiu sản phẩm mới mẻ nhưng vẫn tiết kiệm thi gian khi làm việc
với framework này trong quá trình thiết kế giao diện website.
Bootstrap.CSS
N là một Framework CSS c chc năng quản lý và sp xếp bố cc của các
trang Web. HTML c nhiệm v quản lý cu trc và nội dung th CSS s x lý bố
cc của Website. V vậy mà hai cu trc này phải tồn ti cùng nhau để thực hiện
đưc hành động c thể.
Gi bn s không phải tốn thi gian để chỉnh sa thủ công chỉ để thay đổi một
thiết kế nhỏ. Thay vào đ, bn c thể dùng CSS để to giao diện thống nht trên
nhiu Website mà không bị giới hn.
Hàm CSS không chỉ giới hn ở kiểu văn bản mà còn dùng định dng như bảng,
bố cc hnh. Bn cần mt một t thi gian để CSS ghi nhớ hết tt cả các khai báo
và bộ chọn.
Bootstrap.JS

Đây là phần cốt lõi v cha các File JavaScript, n chịu trách nhiệm cho việc
tương tác của Website. Để tiết kiệm thi gian viết c pháp JavaScript mà nhiu
nhà phát triển s s dng jQuery. Đây là thư viện JavaScript mã nguồn mở, đa
nn tảng gip bn thêm nhiu chc năng vào trang Web.
Theo kinh nghiệm của tôi, jQuery s thực hiện một số chc năng như:





Thực hiện các yêu cầu của Ajax như: loi trừ dữ liệu đến từ một vị tr khác
một cách linh hot.
Gip to các tiện ch bng bộ sưu tập Plugin JavaScript.
jQuery s to hnh động tùy chỉnh bng các thuộc tnh của CSS.
Thêm một số tnh năng động cho nội dung các trang Web của bn.

Tuy Bootstrap với các thuộc tnh Element HTML và CSS c thể hot động tốt,
nhưng vẫn cần jQuery để to thiết kế Responsive. Nếu thiếu đi phần này, bn chỉ
c thể dùng các phần tĩnh của CSS mà thôi.
Glyphicons
Trong giao diện trang Web, phần không thể thiếu chnh là Icons. Chng thưng
đưc liên kết với các dữ liệu nht định và các hành động trong giao diện ngưi
dùng.
13 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0

BÁO CÁO MÃ NGUỒN MỞ
Bootstrap dùng Glyphicons để đáp ng nhu cầu trên và n đã mở kha bộ
Halflings Glyphicons để bn s dng miễn ph. Ti bản miễn ph, tuy chỉ c giao
diện chuẩn nhưng phù hp với các chc năng thiết yếu.
Nếu như bn muốn c các Icon phong cách hơn th c thể mua bộ bộ Icon
Premium khác nhau. Chc chn các Icon ti Glyphicons s gip cho trang Web
của bn trông đẹp và nổi bật hơn.
*Tại sao nên dùng Bootstrap
Dễ dàng thao tác
Cơ chế hot động của Bootstrap là dựa trên xu hướng mã nguồn mở HTML, CSS
và Javascript. Ngưi dùng cần trang bị kiến thc cơ bản 3 mã này mới c thể s
dng Bootstrap hiệu quả. Bên cnh đ, các mã nguồn này cũng c thể dễ dàng
thay đổi và chỉnh sa tùy ý.
Tùy chỉnh dễ dàng
Bootstrap đưc to ra từ các mã nguồn mở cho phép designer linh hot hơn. Gi
đây c thể lựa chọn những thuộc tnh, phần t phù hp với dự án họ đang theo
đuổi. CDN Boostrap còn gip bn tiết kiệm dung lưng v không cần tải mã
nguồn v máy.
Chất lượng sản phẩm đầu ra hoàn hảo
Bootstrap là sáng to của các lập trnh viên giỏi trên khp thế giới. Bootstrap đã
đưc nghiên cu và th nghiệm trên các thiết bị. Đưc kiểm tra nhiu lần trước
khi đưa vào s dng. Do đ, khi chọn Bootstrap, bn c thể tin rng mnh s to
nên những sản phẩm với cht lưng tốt nht.
Độ tương thích cao
Điểm cộng lớn nht của Bootstrap là khả năng tương thch với mọi trnh duyệt và
nn tảng. Đây là một điu cực k quan trọng và cần thiết trong trải nghiệm ngưi
dùng. S dng Grid System cùng với hai bộ tin x lý Less và
Sass, Bootstrap mặc định hỗ tr Responsive và ưu tiên cho các giao diện trên
thiết bị di động hơn. Bootstrap c khả năng tự động điu chỉnh kch thước trang
website theo khung browser. Mc đch để phù hp với màn hnh của máy tnh để

bàn, tablet hay laptop.
Cấu trúc v tnh năng của Bootstrap l g?
Bootstrap cha các tập tin JavaScript, CSS và fonts đã đưc biên dịch và nén li.
Ngoài ra, Bootstrap đưc thiết kế dưới dng các mô-đun. Do đ, dễ dàng tích
hp với hầu hết các mã nguồn mở như WordPress, Joomla, Magento, …Trong
đ, Bootstrap mang đến nhiu chc năng nổi bật.





Bootstrap cho phép ngưi dùng truy cập vo thư vin “khổng lồ” các
thành tố dùng để to nên giao diện của một website hoàn chỉnh như font,
typography, form, table, grid…
Bootstrap cho phép bn tùy chỉnh framework của website trước khi tải
xuống và s dng n ti trang web của khung.
Ti sử dụng các thành phần lặp đi lặp li trên trang web.

14 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ



Bootstrap được tch hợp jQuery. Bn chỉ cần khai báo chính xác các

tnh năng trong quá trnh lập trnh web của bn.
Định nghĩa glyphicons nhm gim thiểu vic sử dụng hnh nh lm biểu
tượng và tăng tốc độ ti trang.

1.3.4 Giới thiu về PHP
PHP là gì?
PHP là ngôn ngữ script đưc to cho các giao tiếp pha server. Do đ, n c
thể x lý các chc năng pha server như thu thập dữ liệu biểu mẫu, quản lý
file trên server, sa đổi cơ sở dữ liệu và nhiu hơn nữa.
Ngôn ngữ này ban đầu đưc to ra bởi Rasmus Lerdorf để theo dõi khách
truy cập vào trang chủ cá nhân của anh y. Khi đã trở nên phổ biến hơn,
Lerdorf phát hành n thành dự án nguồn mở. Quyết định này đã khuyến khch
các nhà phát triển s dng, sa chữa, cải thiện code và cuối cùng biến n
thành ngôn ngữ script mà chng ta s dng ngày nay.
Mặc dù PHP đưc coi là ngôn ngữ script v mc đch chung, nhưng n đưc
s dng rộng rãi nht để pht triển web . Điu này do một trong những tnh
năng nổi bật của n – khả năng nhng vào file HTML.
Nếu không muốn ngưi khác xem mã nguồn của mnh, bn c thể ẩn bng
ngôn ngữ script này. Đơn giản chỉ cần bn viết code vào file PHP, nhng n
vào HTML th mọi ngưi s không bao gi biết đưc nội dung gốc.
Li ch khác của tnh năng đặc biệt này là khi phải s dng cùng một lần đánh
du HTML. Thay v viết đi viết li nhiu lần, chỉ cần viết code vào file PHP.
Bt c khi nào cần s dng HTML, bn hãy chn file PHP và bn c thể chy
rt tốt.
Vì sao nên sử dng PHP?
PHP không phải là ngôn ngữ script pha server duy nht c sẵn – vẫn cịn
nhiu ngơn ngữ khác nữa. Tuy nhiên, n li thế hơn các đối thủ cnh tranh
nếu như bn đang chy trang web WordPress.
Như chng tôi đã đ cập trước đ, WordPress đưc xây dựng dựa trên việc s
dng PHP. V vậy s dng ngôn ngữ này gip cải thiện đáng kể số lưng tùy

chỉnh c thể c trên trang web. Bn c thể s dng n để sa

15 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
đổi plugins và themes c sẵn hoặc tự to plugin! Nếu bn muốn trở thành nhà
phát triển và WordPress, bn bt buộc phải học PHP.
Nếu vẫn chưa bị thuyết phc, đây là một số lý do khác khiến PHP là ngôn ngữ
script tuyệt vi để s dng:


Dễ học – bn c thể học dễ dàng v n c ti liu tuyt vời v các chc
năng cùng các v d.



Được sử dụng rộng rãi – n đưc s dng để to ra các loi nn tảng
như thương mi điện t, blogs, phương tiện truyn thông xã hội, v.v.
Thống kê cho thy 79% tất c cc trang web đu s dng PH P!



Chi ph thấp – n là nguồn mở để bn c thể s dng miễn ph.



Cộng đồng lớn – nếu gặp phải bt kỳ vn đ nào với n, bn không
phải lo lng v c rt nhiu blog PHP trên internet.



Tch hợp với cơ sở dữ liu – một số v d
như MySQL, Oracle, Sybase, DB2, v.v.

16 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

Chương 2 : Cơ Sở Lý Thuyết
2.1.Quy trình đặt hàng
Với quy trnh đặt hàng truyn thống.Ngưi đặt
s gặp rt nhiu rủi ro như: Có thể khơng nhận đưc hàng mong muốn vì nhầm
sản phẩm, có khả năng khơng đưc duyệt u cầu đặt hàng vì lỡ bỏ xót.
Quy trnh đặt phịng truyn thống.
Bước 1: Nhận u cầu đặt hàng.
Bước 2: Xác định khả đáp ng của ca hàng
Bước 3: Thỏa thuận và khuyết phc việc đặt hàng với khách.
Bước 4: Nhập các thông tin đặt hàng.
Bước 5: Ca hàng xác nhận li việc đặt hàng.
Bước 6: Lưu thông tin li việc đặt hàng.

Bước 7: Nhận khẳng li việc đặt hàng từ khách.
Bước 8: Tổng hp tnh hnh đặt hàng.
2.2.Kho sát các website
Website: />Website buôn bán linh kiện máy tính
Theo khảo sát đây là website dành cho khách hàng phải c đăng k tài khoản,…
Mọi thông tin sản phẩm do chủ website tự cung cp.
Chc năng website: Cập nhật thông tin của sản phẩm trên website, đặt hàng bng
cách cung cp thông tin ngưi đặt cho admin quản lý website, sau đ admin liên
hệ li với khách hàng của mình
2.3.Nền tng cơng ngh
2.3.1. Heroku CLI
Đây là một ví dụ về việc đưa một project Laravel lên Heroku. Đầu
tiên hãy lên Heroku đăng ký một account.

Bước 1: Ci Heroku CLI
Bn cài đặt theo link hướng dẫn dưới đây cho hệ điu hành mnh đang dùng, do
mnh s dng MacOS nên s cài thông qua homebrew
brew install heroku/brew/heroku
Sau đ xác định phiên bản của n bng command:
heroku --version
17 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
Bước 2: Ci đặt ứng dụng Laravel
Mở terminal và s dng command sau:

composer create-project laravel/laravel herokularavel --prefer-dist
Bước 3: Tạo một Procfile
Bên trong thư mc gốc của Laravel (root), to một file gọi là Procfile – cha câu
lệnh mà heroku s chy. Sau đ bỏ dòng này vào procfile:
# Procfile
web: vendor/bin/heroku-php-apache2 public/
Bước 4: Khởi tạo d n với Git repo
git init
Bước 5: Đăng nhập vo Heroku từ terminal
heroku login
Bước 6: Tạo một ứng dụng Heroku
Gõ lệnh sau ti thư mc cha code, Heroku s yêu cầu bn nhập tài khỏan, rồi to
một “app” cho bn, đồng thi thiết lập git để sẵn sàng “đẩy code lên Heroku”
heroku create
Creating app... done, ⬢ ironman-spiderman-12345
|
/>N s tự động to một ng dng với tên random, v d như: ironman-spiderman12345. Bn s c một url là ironman-spiderman-12345.herokuapp.com
Bước 7: Setting một Laravel encryption key
Gõ lệnh sau:
php artisan key:generate --show
18 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ
N s show một key và bn copy vào cho vào lệnh sau:
heroku config:set APP_KEY={Your copied key}

Bước 8: Push s thay đổi lên Heroku
Sau đ add các file vào Git:
git add .
Commit các tha y đổi:
git commit -m "laravel deploy to heroku"
Push nó lên Heroku server:
git push heroku master
2.3.2. Vấn đề phát sinh
* Ai cũng có thể đăng k tài khon nên sẽ sinh ra các người dùng o
Cách x lý:
Mỗi ngưi s phải cập nhật đầy đủ thông tin. Sau đ s đưc duyệt
bởi Admin
* Khi đưa thanh ton vào website sẽ ny sinh ra cc vấn đề bất trắc
khác
Cách x lý:
Sau khi đặt hàng s khuyến cáo ngưi dùng v việc đặt cọc trước

19 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

Chương 3 Phân tch v thiết kế h thống
3.1 Mơ hình tổng quan của h thống nghiên cứu
3.1.1 Xc định Actor
- Khách hàng

- Admin (ngưi quản trị hệ thống)
- User (ngưi dùng)
3.1.2 Xc định yêu cầu người sử dụng
Khch hng



Xem danh sách sản phẩm



Xem chi tiết sản phẩm



Đặt hàng



Xem giỏ hàng



Đăng nhập/ Đăng ký- Đăng xut
Admin



Quản lý danh sách sản phẩm



Quản lý đơn hàng



Quản lý danh mc



Quản lý tài khoản ngưi dùng



Quản lý Banner quảng cáo



Đăng nhập/Đăng ký- Đăng Xut

3.2 XÂY DỰNG BIỂU ĐỒ USECASE

20 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

Biểu đồ Usecase tổng quát

Hình 3.2.1 Biểu đồ Use case tng qut



Khch hng

Hình 3.2.2 Biểu đồ Use case ca khch hàng

21 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

Hình 3.2.3 Biểu đồ Use case quản l gi hàng ca khch hàng

Hình 3.2.4 Biểu đồ Use case tm kiếm sản phm ca khch hàng

22 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0

BÁO CÁO MÃ NGUỒN MỞ



Admin

Hình 3.2.5 Biểu đồ Use case ca Admin

Hình 3.2.6 Biểu đồ Use case quản l danh mc ca Admin

Hình 3.2.7 Biểu đồ Use case quản l sản phm ca Admin

23 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

Hình 3.2.8 Biểu đồ Use case quản l đơn hàng ca Admin

Hình 3.2.9 Biểu đồ Use case quản l ngưi dng ca Admin



User

Hình 3.2.10 Biểu đồ Use case ca ngưi dng truy cập hệ thng

24 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0


BÁO CÁO MÃ NGUỒN MỞ

3.3 XÂY DỰNG BIỂU ĐỒ HOẠT ĐỘNG
Biểu đồ hoạt động ca một s chức năng

Hình 3.3.1 Đăng nhập

Hình 3.3.2 Quản l đơn hàng

25 | X â y d ự n g W e b s i t e l i n h k i ệ n m á y t í n h

0

0