Thống kê lượt truy cập
Xây dựng phần mềm quản lý bán hàng - Section 1
Trong dự án này Lớp học bình dân xây dựng phần mềm quản lý bán hàng dựa trên môn trường web - là một trong những môi trường thuận lợi và hoạt động hiệu quả đối với tất cả người dùng, dễ triển khai, dễ nâng cấp và bảo trì, phù hợp với tất cả các hệ điều hành khác nhau. Hơn nữa người dùng không cần phải cài đặt phần mềm
Lớp học bình dân sẽ phân tích các bước chuẩn bị để xây dựng:
1/ Về ý tưởng
Website quản lý bán hàng lấy ý tưởng về 1 cửa hàng rau củ quả online. Trong đó khách hàng có thể vào tham quan gian hàng và lựa chọn những mặt hàng cần mua, để lại những đánh giá về mặt hàng đó. Nếu thấy phù hợp có thể đặt mua. Khách hàng có thể mua nhiều sản phẩm, mỗi lần thêm mặt hàng thì mặt hàng đó sẽ được đưa vào giỏ hàng. Khi hoàn tất quá trình lựa chọn khách hàng sẽ thanh toán. Người quản trị sẽ có chức năng cập nhật thông tin về mặt hàng, danh mục mặt hàng, cập nhật hoá đơn, thống kê mặt hàng đã bán trong khoảng thời gian nhất định (ngày, tuần, tháng, năm, giai đoạn ngày)
2/ Giao diện người dùng
Lớp học bình dân lựa chọn 1 mẫu có sẵn trên mạng để thiết kế.
Giao diện này là trang chủ, chúng ta sẽ chia ra làm 4 phần (theo hàng ngang)
+ Phần 1: thanh trạng thái
+ Phần 2: banner
Phần 3: Phần chính của trang chủ (Danh mục bài viết, hình ảnh nổi bật + Danh mục mặt hàng theo loại + Thông tin hỗ trợ khách hàng + Thông tin phản hồi của khách + Các nhãn hàng liên kết)
Phần 4: Chân trang (Giới thiệu về cửa hàng, các danh mục chính và kết nối tới mạng xã hội hoặc hỗ trợ trực tuyến)
3/ Công cụ
Trong dự án này Lớp học bình dân sẽ sử dụng các công cụ sau:
+ Editor: Visual Studio Code để thiết kế giao diện (bổ sung plugin Live Server - để chạy code html trực tiếp)
+ Hệ quản trị Cơ sở dữ liệu: SQL Server
+ Ngôn ngữ: Html. Css, Javascript để thiết kế giao diện
+ Ngôn ngữ: C#, Asp.net MVC Core để viết Backend
+ Thư viện: Bootstrap + Font awesone (icon)
4/ Viết trang cơ bản đầu tiên:
+ Cấu trúc thư mục của dự án:
Gồm 3 thư mục chính là: Assets (Chứa các tài nguyên video, ảnh, âm thanh), Css (chứa các tệp thư viện css), Js (Chứa các thư viện Javascript)
+ Link tải bootstrap: Tải về (mới nhất tại thời điểm hiện tại).
Giải nén tệp tả về được sau đó copy 2 thư mục css và js về thư mục gốc của dự án.
+ Phần code chính:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap demo</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet">
<link href="/Assets/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<link href="/Assets/css/style.css" rel="stylesheet">
</head>
<body>
<div class="row bg-main">
<div class="col-12">
<div class="container">
<div class="row pt-2 pb-2 font-small">
<div class="col-md-6 ">
<span class="text-light"><i class="fa-solid fa-mobile-screen"></i>Hotline:0912345678</span>
<span class="text-light"><i class="fa-solid fa-location-dot"></i>Địa chỉ: Thái Bình - Việt Nam</span>
</div>
<div class="col-md-6 text-end text-light">
<span><a class="text-light text-decoration-none" href="/register.html">Đăng ký</a>/
<a class="text-light text-decoration-none" href="/login.html">Đăng nhập</a></span>
</div>
</div>
</div>
</div>
</div>
<script src="/Assets/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>Trên đây là phần code để tạo thanh trạng thái. Trong phiên tiếp theo chúng ta cùng nhau thiết kế banner và thanh điều hướng.
Chúc các bạn thành công!