Mynuxt is an article add, delete, change and check system

Because the current spa one-page project for seo is not very friendly, if you want your web site in the seo has better support, nuxt. Try SSR js is specific to the vue of technologies to implement this problem, so this time I will try to write a program, the main implementation of a simple article to add and delete system, Mainly for nuXT set node to achieve SSR function.

New people can learn github.com/ITCNZ/mynux… If you like it, please give us ✨✨✨star

Nuxt also can add technical exchange group: group number :320243648 can also come to personal blog, discussion exchange: ITCNz.top

The technology used

Vue2.0

Nuxt1.0

Node9.8 (must >=8.0)

Express

MongoDB

The directory structure

├─ Assets Assets for organizing uncompiled static resources such as LESS, SASS or JavaScript ├─ Build ├─ Components Vue. Js component │ ├─ Footer Page │ ├─.... ├─ Layouts template file, default, change to │ ├─ Edit edit/Create article template │ ├─.... by setting layout for the page ├── Middleware ├─ Node_modules Node.├ ─ Nuxt.config.js Nuxt main configuration file ├─ Pages Directory │ ├─ index.vue home │ ├ ─ ─... Bass Exercises ─ Plugins, ├─ ├─ readme.md README ├─ Server for organizing Javascript exercises that need to be run before the root vue Express Directory │ ├─ API. Js Server interface │ ├─ db.js Link to MongoDB database file │ ├─ listrouter. Js Server Setup │ ├─.... ├─ static Directory for static files that nuxt.js calls Webpack to build and compile. ├ ─ util when the server starts, files in this directory are mapped to the root of the application.Copy the code

Front-end Development Guide

Nuxt1.0.0 must be installed under >=node8.0 to be successful

The nuxt-quill-plugin is a rich text editor. The nuxt-quill-plugin is a rich text editor

To monitor port 3000, run the NPM run dev command.

Backend development guide

Download and install MongoDB. The details are not described here.

Install Express, details are not detailed here, give Express link

To monitor port 3333 on the back-end, go to the supervisor listrouter.js command in the server folder.

Build and Run

# install dependencies
$ npm install # Or yarn install

# serve with hot reload at localhost:3000
$ npm run dev

# build for production and launch server
$ npm run build
$ npm start

# generate static project
$ npm run generate
Copy the code

For detailed explanation on how things work, checkout the Nuxt.js docs.