Chiến lược của dự án
- Khảo sát nhu cầu của thị trường.
-Trên thị trường có một số dự án đang triển khai thành công ở lĩnh vực bán linh kiện điện tử như: Bán linh kiện, NShop, Dientu4u,
- Xác định chiến lược của ý tưởng, được phát triển chuyên nghiệp, giá cả phải chăng phù hợp với mức sống hiện nay.
- Chọn mô hình đầu tư.
Kiểm soát chi phí đầu tư, vận hành và phát triển là yếu tố quan trọng, đặc biệt là trong những thời điểm cụ thể Mọi quyết định cần xác định rõ thời điểm và thời gian hoàn vốn để đảm bảo hiệu quả tài chính.
Khi đầu tư, cần đặc biệt chú ý đến các rủi ro như lựa chọn sai phân khúc phát triển, trình độ quản lý hạn chế và quản lý tài chính không hiệu quả Việc chuẩn bị phương án dự phòng và giải quyết rủi ro một cách bài bản là rất quan trọng để bảo vệ khoản đầu tư của bạn.
Vấn đề cần giải quyết
- Chưa quảng bá được thương hiệu của cửa hàng tới những vùng ở xa, ngoại tỉnh, khách du lịch,
Nhiều khách hàng vẫn chưa biết đến các loại linh kiện điện tử cũng như giá cả của chúng Do đó, việc xây dựng một trang web để vừa bán hàng vừa giới thiệu sản phẩm là cần thiết, nhằm phục vụ tốt hơn cho nhu cầu của khách hàng và mất thời gian để tạo sự hài lòng.
Nội dung cần thực hiện
- Thiết kế một Website giúp dễ dàng mua bán linh kiện điện tử của các hãng linh kiện.
- Thiết kế một Website giúp cung cấp thông tin cho khách hàng về loại linh kiện, tính năng, cách sử dụng,…
Phương pháp 1
- Tên phương pháp: Nghiên cứu thực tế.
- Cách thực hiện: Đề xuất thành viên nhóm khảo sát, thăm hỏi tại các cửa hàng bán linh kiện trên thành phố
Phương pháp 2
- Tên phương pháp: Nghiên cứu qua sách báo.
- Cách thực hiện: Mượn từ thư viện về nghiên cứu.
Phương pháp 3
- Tên phương pháp: Nghiên cứu qua internet.
- Cách thực hiện: Thực hiện đọc thông tin, xem mã nguồn bằng trình duyệt.
Tên Phương Pháp Ưu điểm Hạn chế Kết luận
Nghiên cứu thực tế - Khách quan, trung - Tốn kém, mất - Kém ưu việt thực nhiều thời gian.
Nghiên cứu qua sách báo - Thông tin cô đọng, - Nguồn thông tin - Kém ưu việt dễ tiếp thu chưa nhiều, không được cập nhập.
Nghiên cứu qua Internet - Dễ dàng thực hiện.
- Thông tin được cập nhật thường xuyên.
- Không biết chọn - Ưu việt nhất lọc thông tin sẽ gây rối thông tin.
Bảng 1 – So sánh các phương pháp nghiên cứu
Cơ sở lý thuyết
Cơ sở lý luận và thực tiễn
Website, hay còn gọi là trang web, là một tập hợp các trang web nằm trong một tên miền hoặc tên miền phụ trên Internet Một trang web được định nghĩa là tệp tin HTML hoặc XHTML có thể truy cập thông qua giao thức HTTP Các trang mạng có thể được xây dựng từ các tệp tin HTML (trang mạng tĩnh) hoặc hoạt động thông qua các hệ thống quản lý nội dung (CMS) chạy trên máy chủ (trang mạng động).
Trang mạng có thể được xây dựng bằng nhiều ngôn ngữ lập trình khác nhau (PHP, Java, ). Để một website hoạt động cần 3 yếu tố:
Cần có tên miền (domain)
Nơi lưu trữ website (server)
Nội dung các trang web hoặc cơ sở dữ liệu thông tin
- Tăng khả năng tiếp cận khách hàng.
- Tăng phạm vi khách hàng
- Xúc tiến kinh doanh hiệu quả
- Dịch vụ khách hàng hiệu quả
- Nền tảng cho sản phẩm bán hàng
- Xác định khách hàng tiềm năng
- Tăng năng lực cạnh tranh
- Cập nhật thông tin một cách nhanh chóng
- Dễ dàng lấy ý kiến phản hồi từ khách hàng
HTML, viết tắt của Hypertext Markup Language (Ngôn ngữ Đánh dấu Siêu văn bản), là một ngôn ngữ đánh dấu quan trọng dùng để tạo ra các trang web trên Internet Kết hợp với CSS và JavaScript, HTML đóng vai trò thiết yếu trong lĩnh vực thiết kế website.
- Hiện nay, phiên bản mới nhất của ngôn ngữ này là HTML5.
CSS, viết tắt của Cascading Style Sheets, là ngôn ngữ dùng để tìm kiếm và định dạng các phần tử do các ngôn ngữ đánh dấu như HTML tạo ra.
HTML định dạng các phần tử trên website như văn bản, tiêu đề và bảng, trong khi CSS giúp cải thiện giao diện và thẩm mỹ của những phần tử này.
“phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổi màu chữ, thay đổi cấu trúc,
1.1.4 Tổng quan về ngôn ngữ lập trình JavaScript
JavaScript là ngôn ngữ lập trình dựa trên nguyên mẫu, có cú pháp phát triển từ C Tương tự như C, JavaScript sử dụng từ khóa và không thể mở rộng dễ dàng Ngoài ra, JavaScript cũng không có bộ xử lý xuất/nhập riêng.
- Thư viện Javascript nổi tiếng:
Bộ khung Prototype kết hợp với thư viện Scriptaculous.
Thư viện jQuery, tiết kiệm thời gian viết mã lệnh cũng như cung cấp các hàm tương tác với DOM trên các trình duyệt khác nhau.
Nodejs, hệ thống chương trình giúp chạy Javascript ngoài trình duyệt.
1.1.5 Giới thiệu thư viện hình ảnh Font Awesome
Font Awesome là bộ công cụ phông chữ và biểu tượng CSS và Less, được phát triển bởi Dave Gandy để tích hợp với Bootstrap và BootstrapCDN Với 38% thị phần trong số các trang web sử dụng phông chữ bên thứ ba, Font Awesome hiện đang đứng thứ hai chỉ sau Google Fonts.
1.1.6 Tổng quan về cửa hàng linh kiện điện tử
Cửa hàng linh kiện điện tử cung cấp đa dạng các linh kiện, phụ kiện và thiết bị điện tử, phục vụ cho kỹ thuật viên, nhà sản xuất và cá nhân có nhu cầu sử dụng.
Các linh kiện điện tử phổ biến như bóng đèn, IC, điện trở, tụ điện, đèn LED và nhiều bộ phận khác được sử dụng rộng rãi trong các thiết bị điện tử, bao gồm máy tính, điện thoại, đồng hồ, máy tính bảng, cũng như trong các thiết bị gia đình và công nghiệp.
Cửa hàng linh kiện điện tử thường sở hữu đội ngũ nhân viên có chuyên môn cao, sẵn sàng tư vấn cho khách hàng về sản phẩm và dịch vụ Bên cạnh đó, các cửa hàng này còn cung cấp dịch vụ sửa chữa và bảo trì cho thiết bị điện tử, đặc biệt là thiết bị công nghiệp.
Cửa hàng bán linh kiện điện tử đang phát triển mạnh mẽ trong ngành công nghiệp điện tử, đóng vai trò quan trọng trong việc cung cấp linh kiện và phụ kiện cần thiết cho sản xuất và bảo trì thiết bị điện tử.
Để tham gia và phát triển hiệu quả trong lĩnh vực thương mại điện tử, các doanh nghiệp phải đối mặt với nhiều thách thức Họ cần khai thác các lợi thế cạnh tranh từ cả hai yếu tố "thương mại" và "điện tử".
7 tử”, trong đó “thương mại” nghĩa là các lợi thế trong ngành công nghiệp điện tử, còn “điện tử” là các lợi thế về kinh doanh trực tuyến.
Doanh nghiệp cần có sự ủng hộ từ các công ty linh kiện để đảm bảo nguồn hàng kịp thời và chiết khấu hợp lý, đồng thời phải tổ chức kinh doanh trực tuyến một cách chuyên nghiệp để đáp ứng nhu cầu khách hàng Việc cân bằng giữa hai yếu tố "off-line" và "online" là thách thức không phải doanh nghiệp nào cũng có thể thực hiện hiệu quả trong thời gian ngắn.
Các doanh nghiệp cần đầu tư không chỉ vào trang web và marketing trực tuyến mà còn phải quản lý hiệu quả hàng tồn kho và giao nhận hàng hóa Mặc dù linh kiện dễ bảo quản, nhưng với số lượng mặt hàng đa dạng và vòng đời ngắn, các doanh nghiệp có vốn đầu tư ngắn hạn sẽ gặp khó khăn trong việc duy trì trữ hàng để phục vụ kinh doanh.
Mặc dù hiện nay có nhiều công ty giao nhận mới ra đời, dịch vụ hậu cần cho thương mại điện tử vẫn chưa đáp ứng đủ nhu cầu của doanh nghiệp Thêm vào đó, tập quán tiêu dùng và tâm lý người tiêu dùng cũng tạo ra nhiều thách thức Để vượt qua những khó khăn này, doanh nghiệp cần thể hiện tốt với khách hàng và sử dụng chất lượng sản phẩm – dịch vụ của mình để xây dựng uy tín.
Hình 1 5 – Sự cạnh tranh của các thương hiệu linh kiện điện tử
Giới thiệu đồ án
- Tên đồ án: Xây dựng website bán linh kiện điện tử – TechNaw.
1.2.1 Công nghệ được sử dụng
- Thiết kế giao diện của Website dựa trên các nền tảng: HTML, CSS, thư viện hình ảnh Font Awesome và ngôn ngữ lập trình JavaScript.
- Trình biên dịch: Nopad, VS code, Sublime Text.
- Trình duyệt: Google Chrome, Cốc Cốc và Microsoft Edge.
Hình 1 6 – Giao diện đẹp nhờ công nghệ hiện đại
- Bố cục đơn giản, hiện đại giúp mang đến cảm giác dễ chịu cho người dùng.
- Thanh Navigation Bar để ở vị trí dễ quan sát, phân loại danh mục rõ ràng và hợp lý tương ứng với tên đã lập ra.
Hình 1 7– Bố cục hợp lý
- Gồm giao diện Người dùng và Quản trị:
+ Người dùng: gồm 5 trang chính.
+ Quản trị: gồm các chức năng quản trị cơ bản.
- Mỗi trang có bố cục khác nhau nhưng vẫn dựa trên một phong cách chung, xuyên suốt toàn bộ trang web.
Phân tích thiết kế hệ thống
Mô hình tổng quan của hệ thống nghiên cứu
2.1.1 Phân tích thiết kế hướng đối tượng
- Người dùng (user): Đăng nhập / đăng kí tài khoản: tên đăng nhập, mật khẩu, họ tên, số điện thoại(email) Truy cập các trang trong website.
Xem thông tin sản phẩm, cửa hàng.
Mua sắm các mặt hàng, thêm sản phẩm vào giỏ hàng.
Truy cập, chỉnh sửa, thêm mới, xóa bớt, cập nhật, các nội dung trên website
Xem đánh giá của khách hàng.
Thiết kế chi tiết
* Giao diện người dùng (User):
- Trang chủ: giao diện tổng quan Website
- Trang Đăng ký/Đăng nhập: đăng nhập và tạo tài khoản mới.
- Trang Giới thiệu: giao diện thông tin cơ bản về website, người xây dựng website.
- Trang Hỗ trợ: hỗ trợ người dùng khi gặp các vấn đề trong quá trình mua hàng, sử dụng dịch vụ.
- Trang Sản phẩm: giao diện hiển thị các danh mục sản phẩm đang có trong cửa hàng.
Hình 2 1 – Thanh điều hướng các trang chính trong giao diện người dùng
Giao diện người quản trị (Admin) bao gồm các tính năng quản lý như thêm, chỉnh sửa và xóa thông tin sản phẩm, cũng như quản lý tài khoản khách hàng.
Hình 2 2 – Tính năng thêm sản phẩm mới vào cửa hàng
Cài đặt xây dựng demo
Giao diện người dùng (User)
+ Thanh điều hướng (Navigation): giúp truy cập vào các trang chính khác.
- Phần footer chia làm 4 phần chính gồm:
Cột nhận thông báo qua email khi có khuyến mãi.
Cột thông tin hỗ trợ bao gồm các mục quan trọng như yêu cầu báo giá, quy trình mua hàng và thanh toán, chính sách đổi trả, chính sách bảo mật thông tin, và quy định bảo hành.
Cột thông tin liên hệ, bao gồm: số hotline liên hệ mua hàng, số hotline và email trung tâm bảo hành, email liên hệ khi cần hợp tác.
Cột thông tin thanh toán, gồm: STK ngân hàng thanh toán.
- Toàn bộ trang web sử dụng nhiều màu sắc giúp trang web trở nên đặc sắc mà 2 màu chủ đạo chính là trắng và xám đậm.
Hình 2 3 - Mã màu chủ đạo: trắng và xám đậm
- Giao diện tập hợp tất cả các loại linh kiện của cửa hàng.
- Trang chủ được thiết kế với các nội dung chính:
+ Phần banner của cửa hàng.
Hình 3 3 - Banner của cửa hàng
+ Giao diện các sản phẩm nổi bật.
Hình 3 4 – Các sản phẩm nổi bật
+ Giao diện các sản phẩm đang hot hè 2023.
Hình 3 5 – Các sản phẩm đang hot hè 2023
- Demo giới thiệu sản phẩm của cửa hàng.
+ Giao diện phân loại sách
Hình 3 7 – Danh mục phân loại sách
3.1.4 Trang đăng ký/đăng nhập (Sign up/Login)
- Trang này giúp người dùng cũ đăng nhập để sử dụng đầy đủ các tính năng của trang web và giúp người dùng mới tạo tài khoản.
- Trang gồm 2 sự lựa chọn:
Người dùng có thể đăng nhập vào trang web bằng cách sử dụng tên đăng nhập và mật khẩu đã đăng ký trước đó Ngoài ra, trang web còn hỗ trợ đăng nhập thông qua các tài khoản mạng xã hội như Facebook, Google và Instagram.
Để đăng ký, bạn có thể lựa chọn điền thông tin cá nhân như số điện thoại, tên đăng nhập và mật khẩu Ngoài ra, bạn cũng có thể sử dụng tài khoản mạng xã hội như Facebook, Google hoặc Instagram để thực hiện việc đăng ký một cách nhanh chóng.
- Giới thiệu các thông tin liên quan đến cửa hàng, thành viên thực hiện.
Hình 3 10 – Hình ảnh giới thiệu
- Cung cấp cho khách hàng dịch vụ chăm sóc, hỗ trợ của cửa hàng.
Hình 3 13 – Giao diện hỗ trợ khách hàng cửa hàng
Giao diện người quản trị (Admin)
- Cung cấp phần tổng quan thông tin của trang web:
+ Số khách hàng truy cập (Happy Customer)
Hình 3 14 – Thông tin tổng quan website
- Các tính năng quản trị được tích ở trong các trang:
+ Quản trị sản phẩm (Thêm, Chỉnh sửa-xóa).
Hình 3 15 - Chức năng chỉnh sửa sản phẩm
Hình 3 16 - Chức năng xóa sản phẩm
3.2.2 Trang quản trị tài khoản người dùng
- Cung cấp tính năng xem thông tin tài khoản người dùng, xóa người dùng khỏi trang web nếu phát hiện tình trạng spam trên trang web.
Hình 3 17 – Danh sách tài khoản người dùng
Kết luận và hướng phát triển
- Website dễ sử dụng, đáp ứng được những nhu cầu khách quan của khách hàng.
- Giao diện đẹp mắt thu hút người dùng, không gây nhàm chán trong quá trình sử dụng, thao tác.
- Thực hiện thành công phần giao diện cho Website bằng HTML, CSS và JavaScript.
Qua quá trình thực hiện đồ án cơ sở 1, em đã học hỏi được nhiều kỹ năng quan trọng như kỹ năng làm việc nhóm, soạn thảo văn bản, thiết kế website và thiết kế PowerPoint.
- Tiếp tục phát triển phần giao diện thêm thẩm mỹ.
- Thêm chức năng trao đổi, mua bán sách.
- Bổ sung cơ sở dữ liệu.
- Hoàn thành website hoàn chỉnh bằng những ngôn ngữ lập trình sẽ được học trong các kì tới.