He that will do his work well must first sharpen his tools
Let’s first sort out what a simple station needs to prepare.
- A server.
- A domain name of your own.
- Code and time. The technology stack chosen here is Vue + Node.js + nginx + mongoDB. (Why did you choose these? For only these o(╥﹏╥)o)
Alibaba and Tencent can buy both cheap for the first time
Personally recommend lightweight application server, first purchase or student certification only need about 100 yuan a year. For those unfamiliar with Linux commands, just buy the Windows version. The specific login method service providers will also have detailed documentation, not a repeat.
Domain name filing plus parsing official documents is very clear
Baidu domain name registration, ordinary domain name a few yuan to dozens of yuan a year. After purchasing the domain name, we also need to record and DNS resolution.
- Record: network security supervision requirements, need to upload personal certificates and other authentication information as well as the basic information of the website, can be used after approval. The specific requirements for the record and the process in the domain registrar’s official website will have detailed documents, the record process will also have information confirmation of telephone communication, so this step is relatively simple.
- DNS resolution: The DNS resolution is manually configured in the domain name control center to bind the server IP address to the domain name.
Native code codes fly up more break points and debug more
Do not explain the basic usage of Node, MongoDB, these can be taken out to learn separately, here is the focus on the whole site local development, how to link between the front and back end, database.
1. Server
The server uses express framework developed based on Node.js. The specific steps are as follows.
- Create a new folder and go to NPM init to initialize a package.json file.
- Download the express.
npm install express --save-dev
- The new server. Js. Note that this port is customizable, so we’ll define it as 9527 for the moment and refer to it later.
Const express = require('express') const app = express() app.listen(9527, () => {console.log(" service enabled "); })Copy the code
- Enable the service. CMD to run the command line
node server
2, the front end,
Front-end development ability, NPM run is done.
3. Database
The database uses MongoDB, as follows.
- Download and install MongoDB.
- Start the database.
Mongod --dbpath c:\mongo(location)
4, front-end departure service end
As mentioned above in the introduction of the server, the service starts with a custom port, while the front-end project development to solve the cross-domain problem, the proxy will be set, so it is ok to set the port of the proxy to be consistent.
Proxy: {"/" : {target: "http://127.0.0.1:9527", changeOrigin: true,}}Copy the code
5, service terminal database
- Download the mongodb package.
npm i mongodb --save-s
- Introduction.
const mongodb = require("mongodb");
const mongoClient = mongodb.MongoClient;
Copy the code
- Create links.
Mongoclient.connect ("mongodb://127.0.0.1: port number ",function(err,client){if(err){console.log(" db failed to connect "); mongoclient.connect ("mongodb://127.0.0.1: port number ",function(err,client){if(err){console.log(" dB failed to connect "); }else{console.log(" database connection successful "); Const db = client.db(" database name "); cb(db); }})Copy the code
At this point, local development can be started, and services can be uploaded to the server (online) after completion.
Package configuration without loss n chicken x one key start
1. Server environment configuration
- Install Node. js and install the stable version on the official website.
- Install nginx and install the stable version on the official website.
- To install MongoDB, install the personal version on the official website.
- A lightweight text editor such as notepad++ is recommended.
2, local packaging
- Copy dist file to server nginx folder after Vue project NPM run build.
- Upload the server file to the server.
3. Start the service
- The mode for starting server is the same as that for local development. Run the Node server command.
- Start the database in the same way as local development, mongod –dbpath path.
- The front-end resources wait for the Nginx agent.
4, Nginx configuration
Do this in nginx file nginx.conig.
server { listen 80; Server_name Your domain name; #charset koi8-r; #access_log logs/host.access.log main; Location / {root front-end root points to the dist package; index index.html index.htm; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } # proxy node service location ^~/ API / {proxy_pass http://127.0.0.1:21; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; error_page 500 502 503 504 /50x.html; }}Copy the code
5. Nginx starts
cmd nginx -s reload
Finally, enter your domain name in the address bar to test it
We welcome your comments and discussions.
Thank you!