This is a shopping mall website based on vue family bucket + Node. js+ Express +mysql

Project Github address: vueMall

View demo: address

If you think it is helpful to you, you can give me a favor in the lower left corner, thank you!

The project structure

As shown below:

Note: This project is a real request backend API. Server is the backend data interface project structure, run time can be separately put in wAMP/WWW or XamMP /htdocs these two integration package (Apache + PHP +mysql… Have not used the small partner can baidu study study is very easy. Of course, you can also configure the Mysql environment separately, depending on personal habits. Connect to the Mysql code in server/conf/conf.js and change the configuration information to your own. SQL create table in the server/malldata. SQL file you can directly copy and insert ok. My database name is Malldata, we are not the same remember to change, do not understand the use of database partners to Baidu Baidu is very easy, the basic increase, deletion, change and check will be enough.

Project running

# clone to local:
https://github.com/wzz5304/vueMall.git

# install dependencies:
vue:
....
cdVuemall-master: NPM install express: vuemall-master: NPM installcdServer NPM install# local development, open the server, the browser to http://localhost:8081, express to monitor is port 3001 http://localhost:3001 (I changed the listener port)
vue:
npm run dev

express:
node bin\www

# Build production
npm run build
Copy the code

Note: If you are using VUE and Express for the first time, remember the global installation of VUE-CLI and Express

  • vue-cli

    Type the command: NPM install -g vue-cli

  • express

    Type the command: CNPM i-g express-generator

Do not understand the change of background monitoring port can be opened to view, to help you remember to give a love oh, thank you!

Project description

  • The technology stack used

    Vue-cli2 + vue2.0 + Vue-Router + vuex + AXIos + stylus + SCSS + Node.js + ES6 + Express + mysql

  • Realize the function

- Login registration - Product details - Shopping cart Management - Address Management - Simulated payment (due to unable to call the payment interface) - Order managementCopy the code
  • Functional specifications
- VuE2.0 based - Scaffolding projects using VUE-CLI - Route switching using VUE-Router - State management using VUex - data requests using AXIos - stylus and SCSS writing styles - Linkage scrolling with vue-infinite Scroll plug-in and picture lazy loading vue-lazyload plug-in - Express programming background API - Mysql data storageCopy the code

To study the reference

  • Vue2.0 website vuefe. Cn/v2 / guide /
  • npm www.npmjs.com/
  • ES6 es6.ruanyifeng.com/
  • Sticky footers juejin. Cn/post / 684490…
  • Awesome – vue github.com/vuejs/aweso…