there are three node.js packages useful for developer

there are three node.js packages useful for developer

the following article will recomand three very useful node.js packages for us. threre are some certain reference values. yeah, and friends who need it can refer to it. and hope to give you some helps.html

Node.js is already an integral part of IT development, the node.js with its own package manager called npm. so that we can find out so many libraries and framworks usefully.node

in the article, i will show you some probabilities that use node.js to build complex dynamic application programs.jquery

1. chalk: set and output style in terminal


it's essential to use console.log when we developing a new node.js applications. no matter we use it to output error , system data or function. however, it indeed will causes some confision. because the function that console.log will output pure white text in terminal by default.git

chalk changed this.web

just as usual install Chalk with npm install chalk from the link https://www.npmjs.com/package/chalk.express

this a code example, the following is my actul situation of the teminal.npm

const chalk = require('chalk')
// just blue font
console.log(chalk.blue('this is lit'))
// blue & bold font, red background (bg = background)
console.log(chalk.blue.bgRed.bold('Blue & Bold on Red'))
// blue font, red background
console.log(chalk.blue.bgRed(‘Regular Blue on Red’))
// combining multiple font colors
console.log(chalk.blue('Blue') + 'Default' + chalk.red('Red'))
// Underlining text
console.log(chalk.red('There is an ', chalk.underline('Error')))
// Using RGB-colors
console.log(chalk.rgb(127, 255, 0).bold('Custom green'))

Output:segmentfault

2.png

2. morgan -- record all the important information of the http request


likewise, it's particularly useful in the development of application. because http requests are the heartbeat of the digital world. app

morgan provide so important information about this.ide

as usual, we can use npm install morgan acquire it from https://www.npmjs.com/package/morgan. in morgan, we can define the information about request what we want to get.

be just like in the document, and we just pass it to the middleware of morgan. so that we will use it in the following code example:

const express = require('express')
const morgan = require('morgan')
const app = express()
app.use(
morgan(
 ':method :url :status :response-time ms'
))
app.get('/', function(req, res) {
  res.send('hello, world!')
})
app.listen(8080)

therefore, we hope to get some following detail information about incoming http requets: methodURL of the request, the status of requet and time spent in responding.

when opening the website in a browser, and run this code will result in the following ouput:

3.png

when we open our web page in the browser, it always send a GET-Request request to the server. because we requested /, morgan also displayed this, and our hello, world -- which means status code 200. and the whole of execution process takes about 2.3 millseconds, which's pretty fast.

and we need a favicon icon in the browser, if we con't find it -- error status 404.

let's make a experiment: we change the code that there is a 200 ms pause before each respones. the following are the changes in the code:

app.get('/', function(req, res) {
  setTimeout(function() {
    res.send('hello, world!')
  }, 200)
});

now, morgan wll record this content when we request web page again in the browser.

4.png

cheerio: processing the existing DOM with jquery-like syntax on the server


esspecially when we can't provide static html files instead dynamic websites, cherrio is particularly useful. we can modify the html code of the request straightly between the request and the response of the browser. and the client will not know about this. so it's quite easily that due to its syntax is similar to jquery. of course, we can also do some crawlers and any other operations with cheerio.

install cheerio from https://www.npmjs.com/package/cheerio, we can get the information about the structor and content of html by cheerio.

const template = `
  <div id="main">
    <h1 id="message">Welcome on our site</h1>
  </div>
`
const $ = cheerio.load(template)
console.log($('h1').text()) // Welcome on our site

add html to the existing template:

let template = `
  <div id="main">
    <h1 id="message">Welcome on our site</h1>
  </div>
`
const $ = cheerio.load(template)
$('div').append('<p class=」plum」>Paragraph</p>')
template = $.html()

current template:

<div id="main"> 
  <h1 id="message">Welcome on our site</h1>   
  <p class="plum">Paragraph</p>
</div>

but there is a most commonly situation in cheerio that write into template later :

let template = `
  <div id='main'>
    <h1 id='message'></h1>
  </div>
`
const $ = cheerio.load(template)
$('h1').append('New welcome message!')
template = $.html()

the template now:

<div id="main"> 
  <h1 id="message">New welcome message!</h1> 
</div>

moreover, we can do moe things by cheerio, and we just need to view documentation.

more information about front-end, please follow me damiao.

相關文章
相關標籤/搜索