Related articles

  • P01: Node.js tutorial from a practical perspective
  • P02: Basic node usage
  • P03: Node built-in module PATH
  • P04: Buffer for nodeAPI
  • P05: Events of node built-in module
  • P06: Node built-in module FS (1)
  • P07: Node built-in module FS (2)
  • P08: Node implements static server ~ create project
  • P09: Node implements static server ~ Hello HTTP
  • P10: Node implements static server ~ static file or folder reading

Initial experience with static servers

  • Write the root file app.js 
    Const HTTP = require(const HTTP = require('http'); Const chalk = require(const chalk = require('chalk'Const conf = require()'./config/defaultConfig'); // create a server instance const server = http.createserver ((rep, res) => {// statusCode res.statuscode = 200; // set the corresponding header res.setheader ('Content-Type'.'text/plain'// Output res.end('haha http! 'Server.listen (conf.port, conf.hostname, () => {const addr = 'http://'${conf.hostname}:${conf.port}`

    console.info(`server startd at ${chalk.green(addr)}`)})Copy the code
  • Example Remove the configuration file
    • Writing code is simple and practical, let’s pull out the port host name and so ondefaultConfig.js
    Module. exports = {// hostname:'127.0.0.1'// Port: 6969}Copy the code
  • The output
    • Perform the node app. Js
    • Because we print ports when we listen, we have the following output
    <! --> server startd at http://127.0.0.1:6969Copy the code
  • Enter the specified host name and port in the browser to access the local server we wrote

Output Web pages

We set res.setheader (‘ content-type ‘, ‘text/plain’) to format the output as text. At this point, we have encountered the interface to return to the Web page situation, how to implement this?

  • You need to change the app.js file creation instance section above to
    • Note that if the project is not configured with hot following, it needs to be executed againnode app.js
// create a server instance const server = http.createserver ((rep, res) => {// statusCode res.statuscode = 200; // set the corresponding header res.setheader ('Content-Type'.'text/html')
    
    res.write('<html>')
    res.write('<body>')
    res.write('<h1 style="color: blue">')
    res.write('ah, http ! ')
    res.write('</h1>')
    res.write('</body>'// Output res.end('</html>')})Copy the code
  • You can see that the page outputs blue text, which means that we have exported the Web page

About Hot Updates

To modify the code mentioned above, you need to re-execute the file using Node. Actually writing code requires constant debugging, and it would be nice if there was one thing that could automate it for us. It has an official name: hot updates

  • supervisor

    • We all know that Webpack comes with hot and new and is very powerful. But we can’t write code for every demo using Webpack, it’s too cumbersome

    • Supervisor is a lightweight hot update tool that is recommended to be loaded globally so that any JS file can be updated at any time

      node i -g supervisor
Copy the code

    • You just need to execute the code

      supervisor app.js
Copy the code

      From the startup description, it can be seen that node Watch is used to listen for file changes, thus triggering Node XXX.js again

    • Then modify the file again, directly refresh the page, plug-in tools will help us to execute the relevant file again

    • Also, webpack does not need to refresh to see the effect. I guess there was a subsequent execution like location.reload()

    close