đề tài nghiên cứu laravel framework và ứng dụng phát triển website e commerce bán hàng

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC GIA ĐỊNH KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO THỰC TẬP TỐT NGHIỆP TÊN ĐỀ TÀI Nghiên cứu Laravel Framework và ứng dụng phát triển website e-commerce bá

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC GIA ĐỊNH KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO THỰC TẬP TỐT NGHIỆP

TÊN ĐỀ TÀI

Nghiên cứu Laravel Framework và ứng dụng phát triển website

e-commerce bán hàng

Giảng viên hướng dẫn: TRỊNH ĐÌNH YẾN

Sinh viên thực hiện: NGUYỄN TÂN BÌNH

MSSV: 2108110400 Lớp:K15DCPM03 Khóa: K15

Thành phố Hồ Chí Minh, tháng …… năm ……

LỜI CẢM ƠN

ĐÁNH GIÁ CỦA ĐƠN VỊ THỰC TẬP

1 Thái độ tác phong trong thời gian thực tập:

2 Kiến thức chuyên môn:

3 Nhận thức thực tế:

4 Đánh giá khác:

5 Đánh giá chung kết quả thực tập:

………, ngày ……… tháng ……… năm …………

TM Đơn vị thực tập

(Ký tên, đóng dấu)

ĐÁNH GIÁ CỦA GIẢNG VIÊN HƯỚNG DẪN

1 Thái độ tác phong trong thời gian thực tập:

2 Kiến thức chuyên môn:

3 Nhận thức thực tế:

4 Đánh giá khác:

5 Đánh giá chung kết quả thực tập:

………, ngày ……… tháng ……… năm …………

Giảng viên hướng dẫn

(Ký tên, ghi rõ họ tên)

TRƯỜNG ĐẠI HỌC GIA ĐỊNH

KHOA CÔNG NGHỆ THÔNG TIN

CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh phúc

BÁO CÁO THỰC TẬP TỐT NGHIỆP HÀNG TUẦN

Lớp: K15DCPM01Giảng viên hướng dẫn: TRỊNH ĐÌNH YẾNTên doanh nghiệp (đơn vị) đến thực tập: BIT GROUPĐịa chỉ: 838 Xô Viết Nghệ Tĩnh, Phường 25, Quận Bình Thạnh, TP HCMĐiện thoại: 0774749399

Tên cán bộ phụ trách thực tập tại doanh nghiệp: Võ Duy Bảo KhánhThời gian thực tập 20/05/2024 Từ: Đến:

Stt Tuần thứ Nội dung CV thực tập trong tuần

Nhận xét của CBhướng dẫn tại DN (Ký tên và ghi rõ họ

tên)

Nhận xét của giảngviên hướng dẫn (Ký tên và ghi rõ họ

MỤC LỤC

Mở đầu: -Trang… Giới thiệu về đơn vị thực tập -Trang… Chương 1. - Trang…

1.1. -Trang… 1.2. -Trang… 1.3. -Trang…

Chương 2. - Trang…

2.1. -Trang… 2.2. -Trang…

2.3. -

-Chương n -Trang Kết luận và hướng phát triển - Trang… Tài liệu tham khảo: -Trang…

MỞ ĐẦU

A GIỚI THIỆU KHÁI QUÁT VỀ ĐƠN VỊ THỰC TẬP

Tên công ty: CÔNG TY CỔ PHẦN ĐẦU TƯ BIT GROUP

Tên quốc tế của công ty: BIT GROUP INVESTMENT JOINT STOCKCOMPANY

Tên viết tắt của công ty: BIT GROUP JSC

Loại hình doanh nghiệp: Công ty Cổ phần ngoài Nhà nước

Logo công ty:

(Nguồn: Công ty Cổ phần Đầu tư BIT Group)

BIT Group là nhóm công ty cung cấp giải pháp đào tạo, quản lý, truyền thông, bánhàng trên nền tảng công nghệ với mục tiêu nâng cao hiệu quả kinh doanh cho cáckhách hành doanh nghiệp Trong gần 20 năm hình thành và phát triển, chúng tôi đãgiúp cho hàng chục ngàn doanh nghiệp phát triển kinh doanh thông qua phương phápMST Hệ sinh thái BIT Group tập trung vào 5 mảng chính:

Công ty BIT được thành lập vào năm 2005, tập trung vào lĩnh vực tư vấn, đào tạo vàứng dụng công nghệ thông tin cho doanh nghiệp Năm 2007, BIT đã khởi xướng sànthương mại điện tử địa phương đầu tiên tại tỉnh Bình Dương và tổ chức sự kiện lễ hộichùa Bà, một trong những lễ hội lớn nhất vùng Đông Nam Bộ, lên nền tảng trực tuyến,thu hút hơn 3 triệu lượt xem.

Trong các năm 2008, 2010 và 2011, BIT vinh dự nhận danh hiệu Doanh nhân trẻtiêu biểu Năm 2009, công ty mở rộng dịch vụ gia công công nghệ thông tin sang cácthị trường quốc tế như Singapore, Nhật Bản và Australia, đồng thời đại diện doanhnhân trẻ Việt Nam tham gia thảo luận tại các diễn đàn quốc tế như SeaChange(Malaysia), Y Summit (NUS-Singapore), Jenesys (Nhật Bản) và ITO (Australia).Năm 2010, BIT giành Giải thưởng Quả cầu vàng Công nghệ thông tin Việt Nam.Tiếp theo, năm 2011, công ty mở văn phòng tại TP.HCM và tiếp tục triển khai cáchoạt động tư vấn, đào tạo và ứng dụng công nghệ số cho các doanh nghiệp SME Đếnnăm 2012, BIT mở rộng quy mô bằng việc thành lập các công ty thành viên

Năm 2015, BIT hợp tác và triển khai các dự án tại thị trường Nhật Bản Năm 2017,công ty bắt đầu đầu tư vào các doanh nghiệp và phát triển hệ sinh thái khởi nghiệp.Năm 2018, BIT xúc tiến thương mại và tìm kiếm cơ hội phát triển thị trường tại Mỹ.Năm 2019, BIT chính thức thành lập BIT Group Một năm sau đó, công ty triểnkhai chuỗi chương trình “Hỗ trợ doanh nghiệp chuyển đổi số và kinh doanh số” trên

63 tỉnh thành tại Việt Nam Đến năm 2023, BIT đã tổ chức hơn 250 sự kiện offline tạigần 40 tỉnh thành và 39 sự kiện online, góp phần hỗ trợ chuyển đổi số và kinh doanh

số hiệu quả cho doanh nghiệp

Các thành tựu đã đạt được:

- Nhận quà tặng từ chủ tịch nước Trương Tấn Sang

- Đạt giải thường Quả cầu vàng của Bộ Thông tin – truyền thông

- Nhận bằng khen Trung ương Hội Doanh nhân Trẻ Việt Nam

- Đạt huy hiệu sáng tạo của Bộ Khoa học – Công nghệ

Tầm nhìn sứ mệnh cốt lõi:

Tầm nhìn:

• Đồng hành cùng doanh nghiệp Việt Nam thành công với kinh doanh số.Đến năm 2030 có 500.000 doanh nghiệp thành công với kinh doanh số,chuyển đổi số

Sứ mệnh:

• Phát huy tư duy của mỗi thành viên là tư duy của người chủ doanh nghiệpbằng công nghệ và tri thức (tư duy chủ doanh nghiệp 3T: tư duy kiếm tiền,

tư duy tối ưu, tư duy hệ thống)

• Công ty cung cấp các giải pháp đào tạo, quản lý, truyền thông, bán hàngbằng công nghệ với mục tiêu là làm cho việc kinh doanh của khách hànghiệu quả hơn

Cốt lõi (2KC1H):

• Kaizen: Triển khai – Đo lường – Học hỏi – Cải tiến (Tư duy và cách nghĩ

của người khởi nghiệp, tư duy chủ doanh nghiệp và cải tiến liên tục)

• Kỷ luật: Tôn trọng bản thân, văn hóa kỷ luật.

Chính trực:

Đồng nhất: Nối, nghĩ và làm nhất quán

Dũng cảm: Đưa ra các cam kết và hành động nhằm được các mụctiêu của mình

Khiêm tốn: Lấy con người làm trung tâm, tinh thần phục vụ Quantâm tập thể, đề cao sự đóng góp của người khác, hành động đúng

• Cống hiến: Để biết được mình là ai và tìm ra được năng lực cốt lõi của

mình chỉ có hai cách: Quên mình vì ai đó và quên mình vì một việc gì đó.Sẵn sàng làm việc và cống hiến hết mình để phục vụ cho lợi ích chung củacông ty

• Hiệu quả: Hành động cho đến khi ra được kết quả và luôn cải tiến để có

được một kết quả tốt hơn nữa

C CƠ CẤU TỔ CHỨC BIT GROUP

Công ty Cổ phần Đầu tư BIT Group được thành lập với 4 phân nhóm: Đứngđầu là Chủ tịch công ty, ngay sau đó là Tổng Giám đốc, tiếp theo là các khối Dự án,

Bộ phận Hành chính nhân sự, bộ phận Kế toán, khối quan hệ khách hàng và khối tưvấn; cuối cùng là bộ phận Kinh doanh, bộ phận Marketing là hai nhánh thuộc khốiQuan hệ khách hàng, bộ phận Thiết kế và bộ phận truyền thông thuộc khối Tư vấn.Sau đây là sơ đồ tổ chức cụ thể của công ty

Hình 1: Sơ đồ tổ chức của công ty

(Nguồn: Công ty Cổ phần Đầu tư BIT GROUP)

Chức năng và nhiệm vụ của từng phòng ban

- Khối Dự án: Quản lý các hoạt động chuyên môn của công ty, quản lý trực tiếp

và chịu trách nhiệm các dự án của công ty, nghiên cứu kỹ thuật, nghiên cứu vàphát triển (Research and Development), đào tạo và phát triển chuyên môn, đồngthời triển khai các hoạt động quảng cáo hiệu quả

- Bộ phận Hành chính - Nhân sự: Quản lý các thông tin của nhân viên và thực

tập sinh, lập kế hoạch và thực hiện tuyển dụng nhân sự, quản lý chính sách vàcác thủ tục nhân sự, đông thời duy trì và quản lý các hoạt động phát triển nguồnnhân lực

- Bộ phận Kế toán: Quản lý báo cáo tài chính và hạch toán, kiểm soát nội bộ và

xác định các rủi ro, đảm bảo tuân thủ các quy định và chính sách tài chính, xửa

lý các giao dịch nội bộ và kiểm tra mức độ phù hợp, lập các kế hoạch ngân sách

và theo dõi ngân sách, phân tích và đánh giá hiệu quả nguồn lực tài chính, hỗtrợ các công tác kiểm soát nội bộ

- Khối Quan hệ khách hàng: Quản lý và phát triển các mối quan hệ tốt với các

đối tác, khách hàng; thu thập thông tin và xây dựng mối quan hệ với kháchhàng; quản lý dịch vụ và tăng cường tiếp thị bán hàng; quản lý và phân chianhiệm vụ cho hai bộ phận: Kinh doanh và Marketing

o Bộ phận Kinh doanh: Xây dựng các chiến lược kinh doanh nhằm mục

tiêu gia tăng doanh số, lợi nhuận; thức đẩy và quảng bá dịch vụ của công

ty, đề xuất các chiến lược kinh doanh và các giải pháp nâng cao hiệu quảhoạt động kinh doanh

o Bộ phận Marketing: Thực hiện các chiến lược quảng bá và các hoạt

động quảng cáo, tiếp thị sản phẩm hoặc các dịch vụ của công ty đếnkhách hàng và thị trường, lên kế hoạch xây dựng Marketing trên các nềntảng mạng xã hội như Facebook, Youtube…; thiết kế, phân tích và tốihóa các công cụ tìm kiếm, viết nội dung Marketing đưa các bài viết lêntop tìm kiếm

- Khối Tư vấn: Cung cấp thông tin, chăm sóc, tư vấn và hỗ trợ khách hàng; giải

quyết các thắc mắc hay khiếu nại từ khách hàng; hướng dẫn sử dụng và triểnkhai, quản lý và phân bổ nhiệm vụ cho hai bộ phận: Thiết kế và truyền thông

o Bộ phận Thiết kế: Điều hành, tổ chức và thực hiện công tác thiết kế,

nghiên cứuvà cập nhật xu hướng thị trường và các phần mềm mới, thiết

kế mới; đưa ra các đề xuất để thể hiện các ý tưởng thiết kế thành cáchình ảnh trực quan và thu hút

o Bộ phận truyền thông: Lập kế hoạch và tổ chức các sự kiện của công ty,

quảng bá và tiếp thị sự kiện, quản lý truyền thông, đánh giá và phân tíchhiệu quả của sự kiện

Tóm tắt kết quả hoạt động kinh doanh của BIT GROUP

Sau 3 năm hoạt động trong lĩnh vực kinh doanh số, BIT GROUP đã thu vềđược những con số tương đối ấn tượng được thể hiện trong bảng dưới đây:

(Nguồn: Công ty Cổ phần Đầu tư BIT Group)

Nhìn chung, tình hình sản xuất kinh doanh của Công ty Cổ phần Đầu tư BITGroup vẫn chưa thật sự ổn định Khoảng thời điểm vào năm 2020 và 2021, mọi quốcgia trên thế giới, trong đó có cả Việt Nam đều đang nỗ lực thực hiện các công tácchống dịch Covid19 Đỉnh điểm là vào năm 2021, thời điểm này là một giai đoạn khákhó khăn với BIT Group Tuy nhiên với doanh thu thu về hơn 7.6 tỷ đồng đã tạo nênmột thành công lớn đối với cá nhân công ty Dù mức doanh thu này đã giảm đáng kể

so với năm 2020 nhưng lợi nhuận mà BIT Group thu về lại nhiều hơn khoảng 300 triệuđồng so với năm trước - đây là một con số đáng khen ngợi Đồng thời, dịch bệnh đãgiúp BIT Group giảm thiểu một lượng chi phí đáng kể, góp phần giúp nâng cao tỷ lệlợi nhuận

Năm 2022, doanh thu của BIT Group đã đạt con số kỷ lục với hơn 12.5 tỷ đồng,việc này phần lớn là do nhu cầu rất lớn của thị trường về chuyển đổi phương thức kinhdoanh Khoảng thời gian toàn bộ người dân ở nhà tránh dịch đã khiến các hoạt độngkinh doanh trực tuyến đã trở nên bùng nổ Những doanh nghiệp không thể bắt kịp xuhướng kinh doanh mới cần phải có những bước thay đổi mạnh mẽ trong cách vận hành

để không bị “đá” khỏi thị trường Trong khi đó, BIT Group lại là công ty chuyên cungcấp những dịch vụ giúp các hoạt động kinh doanh của khách hàng trở nên hiệu quảhơn, những dịch vụ mà BIT Group cung cấp có thể kể đến như: Tư vấn chiến lượckinh doanh, các khóa học về kinh doanh số (quản trị trực tuyến, chiến lược kinh doanhonline…), dịch vụ Marketing (xây dựng Website, tên miền…) cùng nhiều dịch vụ

khác Có thể nói, thời kỳ dịch Covid-19 bùng phát là thời điểm đã mở ra cơ hội giúpcác hoạt động kinh doanh của BIT Group bùng nổ vào năm 2022.

Dù doanh thu tăng cao nhưng lợi nhuận lại giảm vào năm 2022 Con số nàykhông hoàn toàn bất ngờ vì khi các hoạt động đời sống và kinh tế quay trở lại bìnhthường thì những khoản chi phí sẽ tăng nhiều hơn khi thực hiện mỗi hoạt động kinhdoanh online như thời điểm dịch diễn ra

Chiến lược mục tiêu Marketing trong tương lai của BIT GROUP

Tăng mức độ nhận diện thương hiệu của Công ty Cổ phần Đầu tư BIT Groupvới 8.000 người theo dõi Fanpage sau 2 tháng kể từ ngày thực hiện các giải pháp dotác giả đề xuất

Ngoài ra, các chỉ số tương tác cũng được nâng cao với số lượt Likes trung bìnhcủa một bài viết đạt 150, số lượt Comments đạt 100 và số lượt Shares đạt 30 trên mộtbài viết Từ đó cải thiện được số Clicks vào các đường link liên kết, gia tăng tỷ lệchuyển đổi cho cả Fanpage và Website của công ty

Cuối cùng, với các giải pháp đề xuất của tác giả có thể thúc đẩy hiệu suất kinh doanh, tăng doanh thu từ các sản phẩm, dịch vụ của doanh nghiệp lên 15% trong vòng2

tháng thực hiện, gia tăng tỷ lệ chuyển đổi từ khách hàng tiềm năng sang khách hàng

sử

dụng dịch vụ của doanh nghiệp lên 5%

CHƯƠNG 1: TỔNG QUAN CHUNG

1.1 Giới thiệu chung

- Nêu bối cảnh phát triển mạnh mẽ của ngành thời trang thương mại điện tử trongthời đại công nghệ số

- Nhấn mạnh nhu cầu ngày càng cao của người tiêu dùng trong việc mua sắm quần áo và giày dép online để tiết kiệm thời gian và công sức

- Giới thiệu website bán quần áo và giày dép online mà bạn xây dựng, bao gồm tên website, mô hình kinh doanh, đối tượng khách hàng mục tiêu

1.2 Công nghệ sử dụng

- Laravel framework là một lựa chọn tuyệt vời cho các nhà phát triển web muốn xây dựng các ứng dụng web hiện đại, có thể mở rộng và bảo mật một cách nhanh chóng và dễ dàng Với cú pháp đơn giản, nhiều tính năng mạnh mẽ và cộng đồng lớn, Laravel giúp tiết kiệm thời gian và chi phí phát triển, đồng thời tạo ra các ứng web chất lượng cao

- laravel là một lựa chọn phổ biến cho các nhà phát triển web muốn xây dựng cácứng dụng web hiện đại, có thể mở rộng và bảo mật một cách nhanh chóng và dễdàng

1.3 Mục tiêu thời lượng xây dựng

Được chia ra thành 2 phần :

- Phần 1 : tìm hiểu và đọc tài liệu về Laravel framework, xây dựng môi trường vàcác công cụ liên quan để xây dựng đề tài

- Phần 2 : xây dựng đề tài

 40% giai đoạn đầu để xây dựng Font-end giao diện website

 40% còn lại để xây dựng Back-end , các cơ sở dữ liệu

 20% sửa lỗi tồn tại xảy ra trong website

+ các sản phẩm thêm vào giỏi hàng sẽ được lưu vào cookies

- Các chức năng của quản trị viên:

+ Quản lý sản phẩm (về số lượng, về tính có sẵn , )

+ Quản lý các đơn hàng

+ Quản lý các thông tin về tài khoản người dùng

CHƯƠNG 2 : CƠ SỞ LÝ THUYẾT

2.1 Laravel Framework

2.1.1 Laravel Framework là gì ?

- là một framework mã nguồn mở được viết bằng ngôn ngữ lập trình PHP, được

sử dụng để phát triển các ứng dụng web hiện đại Nó được thiết kế để đơn giản hóa quá trình phát triển, giúp các nhà phát triển tạo ra ứng dụng web nhanh chóng, an toàn và bảo mật

- Laravel cố gắng cung cấp trải nghiệm tuyệt vời cho nhà phát triển đồng thời cung cấp các tính năng mạnh mẽ như chèn phụ thuộc kỹ lưỡng, lớp trừu tượng hóa cơ sở dữ liệu biểu cảm, hàng đợi và công việc theo lịch trình, thử nghiệm đơn vị và tích hợp, v.v

2.1.2 Lịch sử

- Taylor Otwell đã tạo ra Laravel như một nỗ lực nhằm cung cấp một giải pháp thay thế nâng cao hơn cho khung CodeIgniter, khung này không cung cấp một

số tính năng nhất định như hỗ trợ tích hợp để xác thực và ủy quyền người dùng

- Bản phát hành beta đầu tiên của Laravel được cung cấp vào ngày 9 tháng 6 năm

2011, tiếp theo là bản phát hành Laravel 1 vào cuối tháng đó Laravel 1 bao gồm hỗ trợ tích hợp cho xác thực, bản địa hóa, mô hình, chế độ xem, phiên, định tuyến và các cơ chế khác, nhưng thiếu hỗ trợ cho bộ điều khiển khiến nó không thể trở thành một khung MVC thực sự

2.1.3 Phiên bản

- Dưới đây là lịch sử các phiên bản của Laravel và hiện tại phiên bản mới của Laravel là phiên bản 11

Hình 2.1.3 : Lịch sử các phiên bản (nguồn : wikipiadia)

- Hình ảnh đã cho ta rõ cụ thể các phiên bản và ngày phát hành đến thời gian sửa lỗi

2.1.4 Kiến trúc và cấu trúc Laravel

Kiến trúc MVC

- MVC là một mô hình thiết kế phần mềm giúp tách biệt logic ứng dụng, giao diện người dùng và luồng điều khiển Điều này giúp mang lại nhiều lợi ích, bao gồm:

- Mã dễ đọc và dễ bảo trì: Việc tách biệt các thành phần giúp mã dễ đọc và dễ hiểu hơn, giúp các nhà phát triển dễ dàng sửa lỗi và nâng cấp ứng dụng trong tương lai

- Dễ dàng thử nghiệm: Mỗi thành phần MVC có thể được thử nghiệm riêng lẻ, giúp đảm bảo chất lượng mã tốt hơn.

- Dễ mở rộng: Kiến trúc MVC giúp dễ dàng thêm các tính năng mới và tùy chỉnhứng dụng để đáp ứng nhu cầu cụ thể

Cấu trúc MVC trong Laravel:

- Model: Model đại diện cho dữ liệu của ứng dụng Nó tương tác với cơ sở dữ liệu để truy xuất, lưu trữ và thao tác dữ liệu

- View: View là giao diện người dùng của ứng dụng Nó hiển thị dữ liệu cho người dùng và thu thập thông tin đầu vào từ người dùng

- Controller: Controller là bộ não của ứng dụng Nó xử lý yêu cầu từ người dùng,tương tác với model để truy xuất dữ liệu, và hiển thị view phù hợp

Cấu trúc thư mục Laravel

- Laravel có cấu trúc thư mục được tổ chức hợp lý giúp các nhà phát triển dễ dàng tìm và sử dụng các tệp tin cần thiết Dưới đây là một số thư mục chính trong Laravel:

- app: Thư mục này chứa mã ứng dụng của bạn, bao gồm model, controller, view,route, middleware, và các lớp tùy chỉnh khác

- bootstrap: Thư mục này chứa các tệp tin cấu hình cho ứng dụng, bao gồm cấu hình cơ sở dữ liệu, cấu hình routing, và cấu hình dịch vụ

- config: Thư mục này chứa các tệp tin cấu hình chi tiết hơn cho các thành phần khác nhau của ứng dụng

- public: Thư mục này chứa các tệp tin tĩnh của ứng dụng, chẳng hạn như hình ảnh, CSS và JavaScript

- resources: Thư mục này chứa các tệp tin tài nguyên của ứng dụng, chẳng hạn như view, ngôn ngữ và asset

- storage: Thư mục này chứa các tệp tin được tải lên bởi người dùng và các tệp tin tạm thời khác

- vendor: Thư mục này chứa các thư viện bên thứ ba được sử dụng trong ứng dụng

2.2 LiveWire 3

2.2.1 LiveWire 3 là gì ?

Livewire 3 là một framework mã nguồn mở giúp xây dựng giao diện người dùng động cho Laravel một cách dễ dàng Nó sử dụng sức mạnh của WebSockets và Server-Side Rendering (SSR) để tạo ra các ứng dụng web phản hồi nhanh và mượt mà mà không cần JavaScript phức tạp

2.2.2 Tính năng nổi bật

Phản hồi thuộc tính : Livewire 3 sử dụng tính năng @props để khai báo các thuộc

tính phản hồi cho component Các thuộc tính này được cập nhật tự động khi giá trị củachúng thay đổi, và giao diện người dùng sẽ được cập nhật tương ứng mà không cần tải lại trang

Lifecycle Hooks : Livewire 3 cung cấp các lifecycle hook giúp bạn thực hiện các hành

động trong các giai đoạn khác nhau của vòng đời component Ví dụ, bạn có thể sử dụng hook mounted để thực hiện các hành động khi component được gắn vào DOM, hoặc hook beforeUnmount để thực hiện các hành động trước khi component bị gỡ khỏiDOM

Server-Side Rendering: Livewire 3 hỗ trợ server-side rendering (SSR) giúp cải thiện

hiệu suất và SEO cho ứng dụng SSR giúp hiển thị nội dung HTML ban đầu được render bởi server, thay vì sử dụng JavaScript để render trên client

2.2.3 Ưu điểm của LiveWire 3

- Phản hồi nhanh: Livewire 3 sử dụng WebSockets để truyền tải dữ liệu giữa server và client một cách hiệu quả, giúp giảm thiểu độ trễ và tạo ra trải nghiệm người dùng mượt mà

- Dễ học, dễ sử dụng: Livewire 3 sử dụng cú pháp HTML quen thuộc và các component được thiết kế logic, giúp cho việc xây dựng giao diện người dùng trở nên dễ dàng hơn

- Mã code đơn giản, dễ bảo trì: Livewire 3 giúp giảm thiểu lượng code JavaScriptcần thiết, dẫn đến mã code đơn giản hơn, dễ đọc và dễ bảo trì hơn

- Hiệu suất cao: Livewire 3 tận dụng sức mạnh của server để xử lý logic và kết xuất giao diện, giúp cải thiện hiệu suất ứng dụng, đặc biệt là đối với các ứng dụng web phức tạp

- SEO tốt: Livewire 3 hỗ trợ Server-Side Rendering (SSR), giúp các ứng dụng Livewire được lập chỉ mục tốt bởi các công cụ tìm kiếm như Google

2.3 Filament

2.3.1 Filament

Filament là một framework phát triển Laravel nhanh chóng, bao gồm các thành phần như admin panel, form builder, table builder và nhiều tính năng khác Nó được xây dựng dựa trên các công nghệ hiện đại của Laravel như Livewire, Alpine.js và Blade

2.3.2 Cấu trúc Filament

Filament được thiết kế theo mô hình MVC (Model-View-Controller), tương tự như Laravel

Cấu trúc chính của Filament bao gồm:

 Resources: Đây là các lớp đại diện cho các bảng trong cơ sở dữ liệu Mỗi Resource sẽ có các trang như Danh sách, Tạo mới, Chỉnh sửa, Xem chi tiết

 Pages: Các trang tùy chỉnh được xây dựng bằng Filament, như trang

Dashboard, trang Cài đặt, v.v

 Widgets: Các thành phần nhỏ có thể được sử dụng trên các trang, như biểu đồ, thống kê, v.v

 Forms: Các biểu mẫu được xây dựng bằng Filament, có thể được sử dụng trong các trang Resource hoặc trang tùy chỉnh

 Tables: Các bảng dữ liệu được xây dựng bằng Filament, có thể được sử dụng trong các trang Resource hoặc trang tùy chỉnh

2.3.3 Cách hoạt động của Filament

Filament sử dụng Livewire để tạo ra các tương tác động trên trang mà không cần phải tải lại trang Khi người dùng tương tác với các thành phần Filament, Livewire sẽ xử lý các sự kiện và cập nhật giao diện người dùng tương ứng

Filament cũng sử dụng Blade để tạo ra các giao diện người dùng, kết hợp với các thành phần Livewire Điều này giúp cho việc tạo ra giao diện trở nên dễ dàng và linh hoạt hơn

2.3.4 Ưu điểm và một số tính năng khác

Filament mang lại nhiều lợi ích cho các nhà phát triển Laravel, bao gồm:

 Tăng tốc độ phát triển: Filament cung cấp các thành phần sẵn có như admin panel, form builder, table builder, giúp giảm thời gian phát triển

 Dễ dàng tùy chỉnh: Filament được thiết kế với cấu trúc linh hoạt, cho phép dễ dàng tùy chỉnh các thành phần để phù hợp với yêu cầu của dự án

 Giao diện người dùng hiện đại: Filament cung cấp một giao diện người dùng hiện đại, đẹp mắt và dễ sử dụng

 Tích hợp với các công nghệ hiện đại: Filament sử dụng các công nghệ mới nhất của Laravel như Livewire, Alpine.js, giúp tăng hiệu suất và trải nghiệm người dùng

 Cộng đồng hỗ trợ: Filament có một cộng đồng đông đảo và hoạt động, giúp các nhà phát triển dễ dàng tìm được hỗ trợ và giải pháp cho các vấn đề gặp phải

Một số tính năng khác :

 Xác thực và phân quyền người dùng

 Tùy chỉnh giao diện người dùng

 Tích hợp với các dịch vụ bên ngoài (email, file storage, )

 Tạo báo cáo và thống kê

2.4 TailwindCSS

2.4.1 TailwindCSS là gì

Tailwind CSS là một utility-first CSS framework giúp bạn xây dựng giao diện người dùng cho các ứng dụng web một cách nhanh chóng và dễ dàng Nó cung cấp một tập hợp các lớp CSS được đặt tên theo chức năng của chúng, cho phép bạn tạo bố cục và kiểu dáng cho các phần tử HTML bằng cách kết hợp các lớp này

2.4.2 Điểm khác biệt chính giữa Tailwind CSS và các framework CSS khác

- Utility-first: Tailwind CSS là một framework utility-first, có nghĩa là nó cung cấp các lớp CSS được đặt tên theo chức năng của chúng, thay vì các thành phầnCSS được định nghĩa trước Điều này giúp bạn có nhiều sự linh hoạt hơn trong việc tạo bố cục và kiểu dáng cho các phần tử HTML

- On-demand: Tailwind CSS chỉ bao gồm các lớp CSS mà bạn sử dụng, giúp giảm thiểu kích thước bundle CSS và cải thiện hiệu suất tải trang

- Just-in-time: Tailwind CSS sử dụng tính năng "just-in-time" để tạo các lớp CSSduy nhất cho mỗi phần tử HTML, giúp đảm bảo rằng không có CSS không sử dụng nào được tải

- Mobile-first: Tailwind CSS được thiết kế với ưu tiên cho thiết bị di động, giúp bạn dễ dàng tạo các giao diện người dùng đáp ứng

2.4.3 Cách sử dụng Tailwind CSS

Để sử dụng Tailwind CSS, bạn cần thêm thư viện Tailwind CSS vào dự án của mình

và bao gồm nó trong các file HTML của bạn Sau đó, bạn có thể sử dụng các lớp CSS của Tailwind CSS để tạo kiểu cho các phần tử HTML của bạn

Ví dụ:

HTML

<div class="container mx-auto px-4 py-8">

<h1 class="text-3xl font-bold text-gray-900">Tiêu đề</h1>

<p class="text-gray-600">Nội dung</p>

</div>

Ở phần tiêu đề đã được bôi đen và chỉnh sửa kích thước của chữ bằng cách viết các tênclass đã được định sẵn ở trong tailwindcss

CHƯƠNG 3 : PHÁT TRIỂN ĐỀ TÀI

3.1 Các quy trình phát triển đề tài

Giai đoạn Lập kế hoạch:

- Xác định mục tiêu website rõ ràng (mục đích, đối tượng, thông điệp)

- Nghiên cứu thị trường kỹ lưỡng (website đối thủ, xu hướng, hành vi mua sắm)

- Lập kế hoạch nội dung chi tiết (các trang web, cấu trúc, nội dung)

Giai đoạn Thiết kế:

- Thiết kế các cơ sở dữ liệu các mô hình để mô tả dề tài

- Lựa chọn phong cách thiết kế phù hợp với mục tiêu và đối tượng mục tiêu

- Thiết kế giao diện đẹp mắt, dễ sử dụng, thân thiện với người dùng

- Đảm bảo website hiển thị tốt trên mọi thiết bị (máy tính, điện thoại, máy tính bảng)

Giai đoạn Phát triển & Hoàn thiện:

- Viết code và triển khai website theo kế hoạch đã đề ra

- Kiểm tra kỹ lưỡng website để đảm bảo không có lỗi

3.2 Xây dựng CSDL, Font-end, Back-end

3.2.1 Cơ sở dữ liệu

Cơ sở dữ liệu được sử dụng ở đề tài là SQLite

Chi tiết các bảng :

Brands: