ĐỒ án tìm HIỂU về NODEJS và REACTJS và xây DỰNG WEBSITE QUẢN lý bán GIÀY (đồ án SE121 l21 PMCL)

Hồ Chí Minh o Chủ cửa hàng: Cô Nguyễn Thị Hải o Các nhân viên trong cửa hàng ● Các bạn sinh viên trường Đại học Công nghệ thông tin - Anh là chủ cửa hàng, đảm nhận việc nhập hàng, quản l

TÌM HIỂU VỀ NODEJS VÀ REACTJS

VÀ XÂY DỰNG WEBSITE QUẢN LÝ BÁN GIÀY

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

Thái Thuỵ Hàn Uyển Nhóm thực hiện:

Trần Duy Khánh 18520075 Nguyễn Hữu Trí 18521528

TPHCM, tháng 4 năm 2021

2

Nội dung

4.4.3 Đặc tả use case "Thay đổi mật khẩu" 54

4.4.4 Đặc tả use case "Quản lý nhập hàng" 55

4.4.6 Đặc tả use case "Quản lý nhà cung cấp" 65

4.4.8 Đặc tả use case "Quản lý giỏ hàng" 75

4.4.10 Đặc tả use case "Báo cáo bán hàng" 86

4.4.11 Đặc tả use case "Báo cáo lợi nhuận" 87

4.4.12 Đặc tả use case "Thay đổi quy định" 88

4.4.13 Đặc tả use case "Lập phiếu chi" 92

4.4.14 Đặc tả use case "Quản lý bán hàng" 93

7

Nhận xét của giảng viên

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

8

LỜI CẢM ƠN

Đầu tiên, chúng em xin gởi lời cảm ơn chân thành đến tập thể quý Thầy Cô Trường Đại học Công nghệ Thông tin – Đại học Quốc gia TP.HCM và quý Thầy Cô khoaCông nghệ phần mềm đã giúp cho chúng em có những kiến thức cơ bản làm nền tảng để thực hiện đề tài này

Đặc biệt, nhóm chúng em xin gửi lời cảm ơn và lòng biết ơn sâu sắc nhất tới cô Thái Thuỵ Hàn Uyển (giảng viên hướng dẫn đồ án mã nguồn mở) là người đã trực tiếp đứng lớp hướng dẫn tận tình, sửa chữa và đóng góp nhiều ý kiến quý báo chúng em hoàn thành tốt báo cáo của mình

Trong thời gian một học kỳ thực hiện đề tài, nhóm chúng em đã vận dụng những kiến thức nền tảng đã tích lũy đồng thời kết hợp với việc học hỏi và nghiên cứu những kiến thức mới Từ đó, nhóm vận dụng tối đa những gì đã thu thập được để hoàn thành một báo cáo đồ án tốt nhất Tuy nhiên, trong quá trình thực hiện, vẫn không tránh khỏi những thiếu sót Chính vì vậy, nhóm chúng em rất mong nhận được những sự góp ý từ phía các Thầy Cô nhằm hoàn thiện những kiến thức mà nhóm đã học tập và là hành trang để chúng em thực hiện tiếp các đề tài khác trong tương lai

Xin chân thành cảm ơn quý Thầy Cô!

9

CHƯƠNG 1: THÔNG TIN CHUNG 1.1 Tên đề tài: Quản Lý Bán Giày

1.2 Môi trường phát triển ứng dụng : NodeJs và ReactJs

- Hệ điều hành: Microsoft Windows

- Hệ quản trị cơ sở dữ liệu: MongoDB

- Công cụ phân tích thiết kế: Draw.io

- Công cụ xây dựng ứng dụng: Visual Studio Code

10

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

2.1 Giới thiệu về React JS

- React JS là thư viện Javascript được xây dựng bởi các kỹ sư của Facebook, đang được rất nhiều công ty nổi tiếng sử dụng để phát triển các sản phẩm của họ như Yahoo, Airbnb và tất nhiên là trong nội tại Facebook, Instagram Nó phù hợp với các dự án lớn có tính mở rộng hơn là các dự án nhỏ

• Đặc tính của React JS

- Tư tưởng React JS là xây dựng lên các components có tính tái sử dụng, dễ dàng

cho việc chia nhỏ vấn đề, testing Nó giúp chúng ta dễ dàng quản lý, mở rộng hệ thống, điều này nếu là Angular JS thì đòi hỏi cấu trúc, cách viết code phải thật tối

ưu

- React JS luôn giữ các components ở trạng thái stateless (nhiều nhất có thể) khiến ta

dễ dàng quản lý bởi nó chẳng khác gì một trang static HTML Bản thân các components này không có trạng thái (state) nó nhận đầu vào từ bên ngoài và chỉ hiện thị ra dựa vào các đầu vào đó, điêu này lý giải tại sao nó lại mang tính tái sử dụng (reuse) và dễ dàng cho việc test

2.1.1 Khái niệm

• Component

- React được xây dựng xung quanh các component, chứ không dùng template như các framework khác Ta có thể tạo ra một component bằng cách extend Component như sau

11

Hình 2.1 Một component trong React

- Phương thức quan trọng nhất là render, phương thức này được trigger khi component đã sẵn sàng để được render lên trên page

- Trong hàm đó, bạn sẽ trả về một mô tả cho việc bạn muốn React render cái gì lên trên page Như trong ví dụ ở trên, đơn giản mình muốn render 1 thẻ h1 chứa lời chào

và tên

- Hàm render chính là mô tả cụ thể của UI tại bất cứ thời điểm nào Vì thế nếu dữ liệu thay đổi, React sẽ take care việc update UI với dữ liệu tương ứng Các bạn có thể hiểu đơn giản là, khi dữ liệu thay đổi, React sẽ tự động gọi hàm render để update lại

12

• Prop

- Props ở đây chính là properties của một component, chúng ta có thể thay đổi props của component bằng cách truyền dữ liệu từ bên ngoài vào Props có thể là 1 object, funtion, string, number

Hình 2.3 Phương thức Prop

- Chú ý: Khi một props được truyền vào component thì nó là bất biến tức là dữ liệu của nó không được thay đổi kiểu như một "pure" function

- Ví dụ về “pure” function và “not pure” function

Ta xét function như dưới:

Hình 2.4 Pure Function

13

- Function được gọi là "pure" vì nó không làm thay đổi giá trị đầu vào của nó và luôn trả về một kết quả tương tự cho các đầu vào như nhau

Ta xét function thứ 2 như hình dưới

Hình 2.5 Not Pure Function

- Ở đây function trên đã thay đổi chính giá trị sum đầu vào của nó và điều này khiến

nó không là "pure" function

 Tất cả các component của react phải hoạt động như "pure" function

• State

Một component trong React có 2 cách để lấy thông tin props và state Không như props, state của 1 component không được truyền từ bên ngoài vào Một component sẽ tự quyết định state của chính nó Để tạo ra state cho component, ta sẽ phải khai báo nó trong hàm constructor

14

Hình 2.6 Phương thức State

- Sự giống và khác nhau giữa Prop và State

o Giống:

▪ Props và state đều là plain JS objects

▪ Props và state đều trigger render update khi thay đổi

o Khác:

Prop State Can get initial value from parent Component? Yes Yes

Can set default values inside Component?* Yes Yes

- Ngôn ngữ xây dựng nên React, yêu cầu mức độ trung bình: các khái niệm “object”,

“prototype”, “callback” là bắt buộc, nếu bạn chưa biết gì, tôi nghĩ bạn nên đọc tài liệu tại đây và thực hành trong ít nhất 3 tuần trước khi quay lại để bắt đầu

• Npm:

- Công cụ quản lý package của Node.js và là phương pháp phổ biến nhất để các lập trình viên front-end và các nhà thiết kế chia sẻ mã nguồn Javascript Nó bao gồm một hệ thống quản lý module gọi là CommonJS và cho phép bạn cài đặt bất cứ công

cụ command-line nào được viết bằng Javascript

- Hầu hết các components, thư viện và công cụ tái sử dụng trong hệ sinh thái của React đều được triển khai như là thành các module CommonJS và có thể cài đặt thông qua npm

• JavaScript “bundlers”

- Hay còn gọi là các công cụ đóng gói JavaScript Vì một vài lí do kĩ thuật mà module CommonJS (ví dụ, các thư viện trên npm) không thể sử dụng native trên trình duyệt Bạn cần có một “công cụ đóng gói” Javascript để “đóng gói” các modules này thành các files js mà có thể include được trên trang web qua thẻ <script>

16

- “Các ứng dụng single-page” trở nên khá rầm rộ ngày nay Đây là những trang web

mà chỉ thực hiện khởi tạo một lần, và khi người dùng ấn vào một đường dẫn hay nút

ấn thì Javascript trên trang web sẽ thực thi mà trang web không cần phải reload lại

Việc quản lý địa chỉ trên thanh địa chỉ được thực hiện bởi router

- Router được sử dụng phổ biến nhất trong hệ sinh thái React là react-router Nếu như bạn đang xây dựng một ứng dụng single-page, hãy sử dụng nó trừ khi bạn có lý do

mà không thể sử dụng

• Server Rendering

- Server rendering thường được gọi là “toàn bộ” hay “đồng bộ” JS Điều đó có nghĩa

là bạn có thể lấy bất cứ React components nào và render chúng thành HTML tĩnh trên server Điều này cải thiện được tốc độ ban đầu vì người dùng không cần phải chờ JS thực hiện download để có thể thấy được UI ban đầu, và React có thể tái sử dụng HTML đã được render phía server, vì vậy mà không cần xử lý ở phía client

- Chỉ cần sử dụng server rendering khi ta thấy việc render ban đầu trở nên quá chậm hoặc muốn cải thiện thứ hạng tìm kiếm Mặc dù Google bây giờ đã thực hiện index các nội dung render phía client, nhưng tại thời điểm tháng một 2016, mỗi khi được lấy ra đo lường thì thấy rõ thứ hạng bị ảnh hướng đi xuống, có khả năng là do vi phạm về tốc độ render phía client

- Việc render phía server vẫn cần nhiều công cụ để làm cho nó trở nên chính xác Vì việc này mặc định được hỗ trợ trong các React components mà không cần quan tâm tới việc render phía server, chúng ta nên xây dựng ứng dụng trước và quan tâm tới việc render phía server sau Ta sẽ không cần thiết phải viết lại tất cả các components

để xử lý việc đó

2.1.3 Ưu điểm:

- Reactjs cực kì hiệu quả: Reactjs tạo ra cho chính nó DOM ảo – nơi mà các component thực sự tồn tại trên đó Điều này sẽ giúp cải thiện hiệu suất rất nhiều Reactjs cũng tính toán những thay đổi nào cần cập nhật len DOM và chỉ thực hiện chúng Điều này giúp Reactjs tránh những thao tác cần trên DOM mà nhiều chi phí Chúng ta có thể viết một ví dụ đơn giản về ReactJS như sau

17

- Reactjs giúp việc viết các đoạn code JS dễ dàng hơn: Nó dung cú pháp đặc biệt là JSX (Javascript mở rộng) cho phép ta trộn giữa code HTML và Javascript Ta có thể them vào các đoạn HTML vào trong hàm render mà không cần phải nối chuỗi Đây là đặc tính thú vị của Reactjs Nó sẽ chuyển đổi các đoạn HTML thành các hàm khởi tạo đối tượng HTML bằng bộ biến đổi JSX

- Nó có nhiều công cụ phát triển: Khi bạn bắt đầu Reactjs, đừng quên cài đặt ứng dụng mở rộng của Chrome dành cho Reactjs Nó giúp bạn debug code dễ dàng hơn Sau khi bạn cài đặt ứng dụng này, bạn sẽ có cái nhìn trực tiếp vào virtual DOM như thể bạn đang xem cây DOM thông thường

- Render tầng server: Một trong những vấn đề với các ứng dụng đơn trang là tối ưu SEO và thời gian tải trang Nếu tất cả việc xây dựng và hiển thị trang đều thực hiện

ở client, thì người dung sẽ phải chờ cho trang được khởi tạo và hiển thị lên Điều này thực tế là chậm Hoặc nếu giả sử người dung vô hiệu hóa Javascript thì sao? Reactjs là một thư viện component, nó có thể vừa render ở ngoài trình duyệt sử dụng DOM và cũng có thể render bằng các chuỗi HTML mà server trả về

- Làm việc với vấn đề test giao diện: Nó cực kì dễ để viết các test case giao diện vì virtual DOM được cài đặt hoàn toàn bằng JS

- Hiệu năng cao đối với các ứng dụng có dữ liệu thay đổi liên tục, dễ dàng cho bảo trì

và sửa lỗi

2.1.4 Nhược điểm:

- Reactjs chỉ phục vụ cho tầng View React chỉ là View Library nó không phải là một MVC framework như những framework khác Đây chỉ là thư viện của Facebook giúp render ra phần view Vì thế React sẽ không có phần Model và Controller, mà phải kết hợp với các thư viện khác React cũng sẽ không có 2-way binding hay là Ajax

- Tích hợp Reactjs vào các framework MVC truyền thống yêu cầu cần phải cấu hình lại

18

- React khá nặng nếu so với các framework khác React có kích thước tương tương với Angular (Khoảng 35kb so với 39kb của Angular) Trong khi đó Angular là một framework hoàn chỉnh

- Khó tiếp cận cho người mới học Web

2.1.5 Redux

- Redux là 1 tool dùng để quản lý state cho các ứng dụng Javascript Nó giúp bạn viết các ứng dụng hoạt động một cách nhất quán, chạy trong các môi trường khác nhau (client, server, and native) và dễ dàng để test Redux ra đời lấy cảm hứng từ tư tưởng của ngôn ngữ Elm và kiến trúc Flux của Facebook Do vậy Redux thường dùng kết hợp với React

- Hầu hết các lib như React, Angular, etc được built theo một cách sao cho các components đến việc quản lý nội bộ các state của chúng mà không cần bất kỳ một thư viện or tool nào từ bên ngoài

- Nó sẽ hoạt động tốt với các ứng dụng có ít components nhưng khi ứng dụng trở lên lớn hơn thì việc quản lý states được chia sẻ qua các components sẽ biến thành các công việc lặt nhặt

- Trong một app nơi data được chia sẻ thông qua các components, rất dễ nhầm lẫn để chúng ta có thể thực sự biết nơi mà một state đang live Một sự lý tưởng là data trong một component nên live trong chỉ một component Vì vậy việc share data thông qua các components anh em sẽ trở nên khó khăn hơn

- Ví dụ, trong react để share data thông qua các components anh em, một state phải live trong component cha Một method để update chính state này sẽ được cung cấp bởi chính component cha này và pass như props đến các components con

• Actions

- Actions đơn giản là các events Chúng là cách mà chúng ta send data từ app đến Redux store Những data này có thể là từ sự tương tác của user vs app, API calls hoặc cũng có thể là từ form submission

• Reducers

2.2 Giới thiệu về NodeJS

- Node.js là một nền tảng dựa vào Chrome Javascript runtime để xây dựng các ứng dụng nhanh, có độ lớn Node.js sử dụng các phần phát sinh các sự kiện (eventdriven), mô hình non-blocking I/O để tạo ra các ứng dụng nhẹ và hiệu quả cho các ứng dụng về dữ liệu thời gian thực chạy trên các thiết bị phân tán

- NodeJs là một mã nguồn mở, đa nền tảng cho phát triển các ứng dụng phía Server

và các ứng dụng liên quan đến mạng Ứng dụng Node.js được viết bằng Javascript

và có thể chạy trong môi trường Node.js trên hệ điều hành Window, Linux

- Node.js cũng cung cấp cho chúng ta các module Javascript đa dạng, có thể đơn giản hóa sự phát triển của các ứng dụng web sử dụng Node.js với các phần mở rộng 2.2.1 Đặc điểm của Node.js:

- Dưới đây là vài đặc điểm quan trọng biến Node.js trở thành sự lựa chọn hàng đầu trong phát triển phần mềm:

- Không đồng bộ và Phát sinh sự kiện (Event Driven): Tất các các APIs của thư viện Node.js đều không đồng bộ, nghĩa là không blocking (khóa) Nó rất cần thiết vì Node.js không bao giờ đợi một API trả về dự liệu Server chuyển sang một API sau khi gọi nó và có cơ chế thông báo về Sự kiện của Node.js giúp Server nhận được phản hồi từ các API gọi trước đó

20

- Node cho phép bạn thực hiện các giao thức mạng ở cấp độ thấp một cách dễ dàng Chẳng hạn như Node có module HTTP cho phép xây dựng một webserver chỉ với vài dòng code, tuy nhiên vì thế mà bạn sẽ phải học nhiều 10 thứ hơn như học về các header của một gói tin HTTP, không như PHP vốn chỉ là một module mở rộng của một webserver có sẵn (như Apache hay NginX…) – tức là PHP dễ dùng hơn Node nhưng lại không cho phép coder thực hiện các công việc ở cấp độ thấp Tuy nhiên

vì NodeJS là một framework mã nguồn mở, do đó trên mạng cũng có một số thư viện hỗ trợ viết webserver nhanh hơn và dễ hơn cho coder

- Các tiến trình đơn giản nhưng hiệu năng cao: Node.js sử dụng một mô hình luồng đơn (single - thread) với các sự kiện lặp Các cơ chế sự kiện giúp Server trả lại các phản hồi với một cách không khóa và tạo cho Server hiệu quả cao ngược lại với các cách truyền thống tạo ra một số lượng luồng hữu hạn để quản lý request Nodejs sử dụng các chương trình đơn luồng và các chương trình này cung cấp các dịch vụ cho

số lượng request nhiều hơn so với các Server truyền thống như Apache HTTP Server

- Không đệm: Ứng dụng Node.js không lưu trữ các dữ liệu buffer

- Có giấy phép: Node.js được phát hành dựa vào MIT License

- Có trình CLI (giao diện dòng lệnh)

- Chạy theo mô hình REPL(Read Eval Print Loop) : hiểu nôm na là: Đọc - Đánh giá

- In - Lặp nó biểu diễn môi trường máy tính như màn hình console trong Linux shell nơi bạn có thể gõ các dòng lệnh và hệ thống sẽ trả về các kết quả Node.js cũng có môi trường REPL Nó để thực hiện các tác vụ mong muốn

21

2.2.2 Các thành phần quan trọng trong Node.js:

- Lược đồ dưới đây mô tả các thành phần quan trọng của Node.js

2.2.3 Ưu điểm:

- Đặc điểm nổi bật của Node.js là nó nhận và xử lý nhiều kết nối chỉ với một thread Điều này giúp hệ thống tốn ít RAM nhất và chạy nhanh nhất khi không phải tạo thread mới cho mỗi truy vấn giống PHP Ngoài ra, tận dụng ưu điểm non-

- Ứng dụng trên 1 trang( Single page Application) Với khả năng xử lý nhiều Request/s đồng thời thời gian phản hồi nhanh

- Shelling tools unix NodeJS sẽ tận dụng tối đa Unix để hoạt động Tức là NodeJS có thể xử lý hàng nghìn Process và trả ra 1 luồng khiến cho hiệu xuất hoạt động đạt mức tối đa nhất và tuyệt vời nhất

- Streamming Data (Luồng dữ liệu) Các web thông thường gửi HTTP request và nhận phản hồi lại (Luồng dữ liệu) Giả xử sẽ cần xử lý 1 luồng giữ liệu cực lớn, NodeJS sẽ xây dựng các Proxy phân vùng các luồng dữ liệu để đảm bảo tối đa hoạt động cho các luồng dữ liệu khác

- Ứng dụng Web thời gian thực Với sự ra đời của các ứng dụng di động và HTML 5 nên Node.js rất hiệu quả khi xây dựng những ứng dụng thời gian thực (real-time applications) như ứng dụng chat, các dịch vụ mạng xã hội như Facebook, Twitter,… 2.2.4 Nhược điểm:

- Ứng dụng nặng, tốn tài nguyên NodeJS được viết bằng C++ và Javascript, nên phải thông qua thêm 1 trình biên dịch của NodeJS sẽ lâu hơn một chút

2.3 Xây dựng cơ sở dữ liệu

2.3.1 Cơ sở dữ liệu MySql

- MySQL là hệ quản trị dữ liệu miễn phí, được tích hợp sử dụng chung với Apache, PHP Chính yếu tố phát triển trong cộng đồng mã nguồn mở nên MySQL đã qua rất nhiều sự hỗ trợ của những lập trình viên yêu thích mã nguồn mở MySQL cũng có

23

cùng một cách truy xuất và mã lệnh tương tự với ngôn ngữ SQL Nhưng MySQL không bao quát toàn bộ những câu truy vấn cao cấp như SQL Về bản chất MySQL chỉ đáp ứng việc truy xuất đơn giản trong quá trình vận hành của website nhưng hầu hết có thể giải quyết các bài toán trong PHP

- MySQL là cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh Với tốc độ và tính bảo mật cao, MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên internet MySQL miễn phí hoàn toàn cho nên bạn có thể tải về MySQL từ trang chủ MySQL

là một trong những ví dụ rất cơ bản về Hệ Quản trị Cơ sở dữ liệu quan hệ sử dụng ngôn ngữ truy vấn có cấu trúc (SQL) MySQL đang được sử dụng cho nhiều công việc kinh doanh từ nhỏ tới lớn:

- MySQL là mã ngồn mở vì thế sử dụng không mất phí

- MySQL sử dụng form chuẩn của ngôn ngữ dữ liệu nổi tiếng là SQL

- MySQL làm việc trên nhiều Hệ điều hành và với nhiều ngôn ngữ như PHP, PERL,

C, C++, Java, …

- MySQL làm việc nhanh với các tập dữ liệu lớn

- MySQL hỗ trợ các cơ sở dữ liệu lớn, lên tới 50 triệu hàng hoặc nhiều hơn nữa trong một bảng Kích cỡ file mặc định được giới hạn cho một bảng là 4 GB (Gigabyte ), nhưng bạn có thể tăng kích cỡ này (nếu hệ điều hành của bạn có thể xử lý nó) để đạt tới giới hạn lý thuyết là 8 TB ( Terabyte )

- MySQL là có thể điều chỉnh Giấy phép GPL mã nguồn mở cho phép lập trình viên sửa đổi phần mềm MySQL để phù hợp với môi trường cụ thể của họ

2.3.2 Hệ quản trị cơ sở dữ liệu FireBase

• Khái niệm

- Google firebase là gì: Đó là một dịch vụ cơ sở dữ liệu thời gian thực hoạt động trên nền tảng đám mây được cung cấp bởi Google nhằm giúp các lập trình phát triển nhanh các ứng dụng và trang web, bao gồm các API đơn giản và mạnh mẽ mà không cần backend hay server

24

- Google FireBase bao gồm việc:

o Lưu trữ dữ liệu thời gian thực

- Bảo mật: Với việc sử dụng các kết nối thông qua giao thức bảo mật SSL hoạt động trên nền tảng cloud đồng thời cho phép phân quyền người dùng database bằng cú pháp javascipt cũng nâng cao hơn nhiều độ bảo mật cho ứng dụng của bạn

- Sự ổn định: Firebase hoạt động dựa trên nền tảng cloud cung cấp bởi Google do đó hãy yên tập về việc một ngày đẹp trời nào đó server ngừng hoạt động hay như DDOS hoặc là tốc độ kết nối như rùa bò Một điều đáng lưu ý nữa đó là do hoạt động trên nền tảng Cloud vì vậy việc nâng cấp hay bảo trì server cũng diễn ra rất đơn giản mà không cần phải dừng server

CHƯƠNG 3: PHÁT BIỂU BÀI TOÁN

3.1 Khảo sát hiện trạng

3.1.1 Phát biểu bài toán

Cùng với sự phát triển của mạng internet, các xu hướng thời trang ngày càng được phổ biến cũng như nhu cầu mua bán các mặt hàng thời trang ngày càng tăng cao, một trong

số đó là những đôi giày – một phụ kiện thời trang thiết yếu trong cuộc sống hàng ngày Đặt ra nhu cầu cho các cửa hàng bán giày về một công cụ quản giúp đỡ quản lý cửa hàng Vì vậy phần mềm Quản Lý Bán Giày ra đời nhằm giải quyết các nhu cầu:

- Tích hợp bán giày online và quản lý cửa hàng vào một phần mềm chung

25

- Tăng tốc độ xử lý các nghiệp vụ nhờ sự giúp đỡ của phần mềm

- Tăng tính chính xác và bảo mật của các tài liệu so với phương pháp lập và lưu trữ truyền thống

3.1.2 Khảo sát

- Tên phương pháp: Phỏng vấn và nghiên cứu qua thực tế

- Đối tượng khảo sát:

● Cửa hàng: Shop giày Hải Lâm

o Địa chỉ: Số 43, Nguyễn Văn Ni, Tổ 10, Khu Phố 2, Thị trấn

Củ Chi, Huyện Củ Chi, Tp Hồ Chí Minh

o Chủ cửa hàng: Cô Nguyễn Thị Hải

o Các nhân viên trong cửa hàng

● Các bạn sinh viên trường Đại học Công nghệ thông tin

- Anh là chủ cửa hàng, đảm nhận việc nhập hàng, quản lí thu chi, quản lí kho và có thể bán hàng

26

- Nhân viên bán hàng đảm nhận việc bán hàng, tiếp nhận yêu cầu bảo hành

- Nhân viên kế toán đảm nhận việc quản lí thu chi hàng tháng

3

Trong tương lai gần, anh có cần thêm nhân viên với những chức

vụ mới hay không?

- Sắp tới, anh có kế hoạch mở rộng thêm kinh doanh và tuyển một số nhân viên có chuyên môn

6

Cửa hàng có những nghiệp vụ nào?

- Nhận đặt hàng online, bán hàng, bảo hành – đổi trả sản phẩm, quản

lý tài chính, quản lý kho

7 Quy trình nhập hàng gồm những công đoạn nào?

- Anh sẽ đặt hàng các sản phẩm từ các công ty đối tác

- Công ty đối tác sẽ chịu trách nghiệm việc giao hàng đến cửa hàng của anh

- Anh sẽ trực tiếp nhận hàng, thanh toán, nhận hóa đơn, lập phiếu nhập kho

10

Anh lưu lại thông tin về các đợt nhập hàng như thế nào? Lưu các thông tin gì?

- Thời gian, tên công ty đối tác, thông tin về các mặt hàng được nhập như tên, đơn giá, số lượng, size, màu sắc, giới tính, thành tiền Tổng giá trị đơn hàng

- Các thông tin này anh ghi chép lại trong sổ nhập hàng kèm theo hóa đơn

11

Anh có đánh giá gì về quy trình nhập hàng hiện tại? Có vấn đề gì khó khăn gặp phải không?

- Quy trình đơn giản

- Tuy nhiên mỗi lần muốn kiểm tra lại thông tin đơn hàng thì tốn thời gian tìm kiếm

- Đôi khi do sơ ý dẫn đến bị thất thoát đơn nhập hàng

12

Quy trình trình bán hàng/nhận đặt hang online gồm những công đoạn nào?

- Khách hàng tới mua hàng/đặt hàng, chọn mặt hàng và yêu cầu thanh toán

- Nhân viên bán hàng sẽ ghi hóa đơn cho khách hàng, và giữ lại 1 bản cho cửa hàng

14 Một ngày anh có khoảng bao nhiêu khách hàng mua hàng?

- Trung bình từ 10-20 đơn hàng

15

Một lượt khách thì anh tốn khoảng bao nhiêu phút cho việc bán hàng?

17

Tần suất kiểm tra số lượng hàng hóa bán được, cũng như doanh thu cửa hàng?

- Cuối mỗi ngày bán hàng, khi cửa hàng đã đóng cửa

- Và mỗi cuối tuần, anh sẽ tổng hợp lại tổng doanh thu của cửa hàng trong tuần đó

18 Anh kiểm tra việc đó như thế nào?

- Anh kiểm tra các hóa đơn mà nhân viên giữ lại trong ngày

- Tổng hợp lại để thống kê chi, thu, lãi

21 Mỗi tháng anh thống kê lời lỗ của cửa hàng bao nhiêu lần?

23

Anh hỗ trợ khách hàng bảo hành sản phẩm như thế nào?

- Anh đóng vai trò là người trung gian, gửi sản phẩm cần bảo hành đến nhà sản xuất và viết phiếu hẹn cho khách hành

24

Anh kiểm soát tình trạng bảo hành của khách hàng như thế nào?

- Anh ghi sổ về thông tin sản phẩm bảo hành, khách hành bảo hành, ngày bảo hành của các phiếu hẹn anh đã viết cho khách hàng

25

Anh có nhu cầu lưu lại thông tin khách hàng không? Và lưu thông tin khách hàng để làm gì?

- Anh có Để xác nhận thông tin bảo hành và các ưu đãi cho khách hàng

26

Anh có chương trình khuyến mãi hay giảm giá cho khách hàng thân thiết không?

- Anh có Giảm giá cho những khách hàng mua nhiều và thường xuyên

- Anh không

28

Nhân viên cửa hàng có thành thạo việc sử dụng máy tính không?

- Anh và nhân viên biết sử dụng máy tính khá thành thạo

29

Nếu cửa hàng sử dụng một phần mềm để quản lý việc kinh doanh của cửa hàng thì anh mong muốn

nó giải quyết thêm những vấn đề

gì ngoài những khó khăn mà anh

đã nêu

- Anh muốn phần mềm hỗ trợ việc kiểm tra, thống kê, báo cáo, tổng hợp thông tin về mặt hàng, về doanh số, doanh thu, số lượng mặt hàng tồn kho, trợ giúp đặt hàng online … một cách hiệu quả

- Anh muốn phần mềm hỗ trợ việc

áp dụng giảm giá cho khách hàng thân thiết

3.2 Yêu cầu hệ thống

3.2.1 Sơ đồ tổ chức hệ thống

Cửa hàng giày sẽ có các bộ phận sau:

31

Trong đó:

● Chủ cửa hàng: Quản lý các bộ phận khác

● Bộ phận bán hàng: Chuyên bán hàng và giao tiếp với khách

● Bộ phận quản lý kho: Quản lý, bảo quản hàng trong kho

● Bộ phận kế toán: Thống kê và báo cáo doanh thu của cửa hàng

3.2.2 Chức năng nhiệm vụ của từng bộ phận

3.2.2.1 Chủ cửa hàng

- Điều hành chung mọi hoạt động của cửa hàng

- Quản lý và điều hành hoạt động của nhân viên

- Quyết định giá chính thức cho từng loại mặt hàng

▪ Nếu thông tin khách hàng đúng, nhân viên này liên hệ nhân viên kho kiểm tra số lượng hàng trong kho có đáp ứng đơn hàng không?

▪ Nếu hàng hóa tại của hàng đã hết hoặc không đáp ứng đủ số lượng hàng hóa như hóa đơn đặt hàng online thì nhân viên sẽ liên hệ với khách hàng để thông tin cho khách hàng biết và hẹn ngày giao hàng cho khách hàng

▪ Nếu thỏa thuận thành công thì nhân viên bán hàng sẽ cập nhật tình trạng hàng là đã xác nhận thông tin Sau đó, nhân viên bán hàng in hóa đơn, gửi cho nhân viên giao hàng Khi giao hàng, khách hàng

ký tên, trả phí và nhận hoá đơn bản sao Nhân viên giao hàng quay trở lại cửa hàng, trao tiền và hóa đơn cho nhân viên bán hàng

32

▪ Trong trường hợp bộ phận bán hàng gọi điện cho khách hàng để xác nhận thông tin đặt hàng không thành công, thì sau 1 ngày, nhân viên bán hàng sẽ huỷ đơn đặt hàng của khách hàng đã đặt

- Lập hóa đơn bán hàng

o Nhân viên bán hàng sẽ giới thiệu hàng hóa cho khách hàng, ghi nhận thông tin đơn hàng, lập đơn hàng , khách hàng thanh toán tiền và nhận hàng

- Kiểm tra và đổi trả hàng

o Khi khách hàng mang hàng và phiếu mua hàng đến cửa hàng, nhân viên tiến hành kiểm tra hàng hoá và điều kiện bảo hành để tiến hành bảo hành hoặc đổi trả hàng hoá cho khách hàng

3.2.2.3 Bộ phận kế toán

- Lập báo cáo doanh thu bán hàng và đặt hàng online

o Nhân viên nhận được yêu cầu xuất các báo cáo bán hàng

o Xuất báo cáo từ phần mềm và in ra

- Lập phiếu chi:

o Thanh toán tiền cho nhà cung cấp ngay khi nhận phiếu nhập kho

- Báo cáo tình hình tài chính lên chủ cửa hàng

- Căn cứ vào phiếu thu, chi trong tháng, kế toán lập báo cáo tình hình thu chi gửi lên chủ cửa hàng

3.2.2.4 Bộ phận kho

- Lập phiếu nhập kho

o Khi hàng trong kho hết hoặc không đủ đáp ứng cho khách hàng, nhân viên kho sẽ báo cáo cho chủ cửa hàng để liên hệ với nhà cung cấp Sau

đó chủ cửa hàng sẽ gửi đơn đặt hàng

o Khi có hàng về thì nhân viên kho sẽ kiểm tra chất lượng và số lượng của hàng theo phiếu giao hàng của từng mặt hàng trước khi nhập vào kho

33

o Nếu chất lượng và số lượng đảm bảo, nhân viên kho sẽ lập 1 phiếu nhập kho, trên phiếu ghi rõ tên nhà cung cấp và các thông tin hàng được nhập Sau đó sẽ chuyển phiếu nhập kho sang bộ phận kế toán để thanh toán tiền cho nhà cung cấp

o Trong trường hợp số lượng và chất lượng không đảm bảo yêu cầu, thì nhân viên kho sẽ báo cho chủ cửa hàng Chủ cửa hàng sẽ thông báo cho nhà cung cấp

o Lập phiếu nhập kho để xác định rằng đã nhận đầy đủ hàng hóa

2.2 Bảng mô tả công việc

STT Công

việc

Mô tả công việc

Điều kiện khởi động

Vị trí làm việc

Tần suất Thời

lượng

Hồ sơ nhập

Hồ

sơ xuất

đặt hàng online:

Nhận và kiểm tra thông tin đặt hàng

từ phía khách hàng, tiến hành xác nhận thông tin

và tình

Khi có khách hàng đặt hàng

Nhân viên bán hàng

10 – 20 ĐĐH/ngày

5 – 10 dòng/ĐĐH

5 phút/

ĐĐH

D1

34

trạng hàng hoá và thực hiện bán hàng cho khách hàng

2 T2 Lập hóa

đơn bán hàng:

Lưu thông tin mua hàng và đưa hoá đơn cho khách hàng

Khi khách hàng xác nhận mua hàng

Nhân viên bán hàng

10 – 20 ĐBH/ngày

5 – 10 dòng/ĐBH

5 phút/

ĐĐH

3 T3 Lập báo

cáo bán hàng: Lập

thống kê, báo cáo tình trạng bán hàng của cửa hàng

Khi có yêu cầu

từ chủ cửa hàng, báo cáo hàng ngày

Nhân viên bán hàng

1 lần/ ngày Tất cả hàng hóa bán ra trong ngày

1 giờ/

báo cáo

D3

35

phiếu chi:

Thanh toán tiền cho đối tác cung cấp hàng

Khi đã hoàn thành nhập kho

Kế toán

1 lần/ tháng Thanh toán tất cả hàng hóa

Yêu cầu của chủ cửa hàng, báo cáo hàng tháng

Kế toán

1 lần / tuần Tất cả doanh thu tuần

1 giờ/

báo cáo

phiếu nhập kho: Lưu

thông tin hàng hoá khi nhập vào kho

Kho hết hàng, báo cáo cho chủ

và khi đã đúng yêu cầu

Nhân viên quản

lý kho

1 lần/ tháng

50 – 100 hàng hóa/

36

2.3 Bảng mô tả hồ sơ

1 D1 Phiếu đặt hàng: Dùng ghi thông tin đặt

37

2.5.2 Lập hóa đơn

Vị trí liên quan Nhân viên bán hàng, chủ cửa hàng Vị trí ngoại

Kiểm tra, xác nhận thông tin

Kiểm tra thông tin hàng hoá trong kho

Phiếu đặt hàng(D1) Phiếu bán

hàng(D2)

Khách hàng

Bán hàng (T2)

Phiếu bán hàng(D2)

Khách hàng

Phiếu bán hàng(D2)

Báo cáo bán hàng (T3)

Báo cáo bán hàng (D3)

39

2.5.5 Lập báo cáo tài chính

Vị trí liên quan Nhân viên kế toán, chủ cửa hàng Vị trí ngoại

2.5.6 Lập phiếu nhập kho

Lập phiếu chi (T4)

Phiếu chi(D4)

Phiếu bán hàng(D2) Phiếu chi(D4)

Báo cáo, thống kê tài chính (T5)

Báo cáo tài chính (D5)

40

2.6 Hiện trạng tin học:

- Phần cứng:

Số lượng máy tính cá nhân: 3

Cấu hình : AMD Ryzen 5 2600 , 4 GB RAM , 500 GB HDD

Vị trí: Chủ cửa hàng (1 chiếc), bộ phận bán hàng (1 chiếc), bộ phận kho (1 chiếc)

Phiếu nhập kho (D6)