Módulo abreviado de Node.js NPM

NPM (Node Package Manager) es un administrador de paquetes de paquetes Node.js. Hay un paquete NPM llamado ‘shortid’ que se utiliza para crear identificadores únicos cortos no secuenciales aptos para direcciones URL. De forma predeterminada, utiliza de 7 a 14 caracteres aptos para URL: AZ, az, 0-9, _-. Admite clúster (automáticamente), semillas personalizadas, alfabeto personalizado. Puede generar cualquier número de identificaciones sin duplicación.

Comando para instalar:

npm install shortid

Sintaxis para importar el paquete en un archivo local-

const shortid = require('shortid')

Sintaxis para crear una identificación única

const newId = shortid.generate()

Hay algunos métodos definidos en los módulos shortid para crear identificaciones únicas y personalizar las identificaciones. algunos de los métodos se ilustran a continuación.

shortid.generate(): se utiliza para crear una identificación única.

Ejemplo:

users.insert({
  _id: shortid.generate(),
  name: '...',
  email: '...'
});

shortid.isValid (id): se utiliza para verificar si la identificación es válida o no.

Ejemplo:

shortid.isValid('41GHDbE');
// true
shortid.isValid('i have spaces');
// false

shortid.characters (caracteres): se utiliza para personalizar los identificadores.

Ejemplo:

shortid.characters('ⒶⒷⒸⒹⒺⒻⒼⒽⒾⒿⓀⓁⓂⓃⓄⓅⓆⓇⓈⓉ'
+ 'ⓊⓋⓌⓍⓎⓏⓐⓑⓒⓓⓔⓕⓖⓗⓘⓙⓚⓛⓜⓝⓞⓟⓠⓡⓢⓣⓤⓥ'
+ 'ⓦⓧⓨⓩ①②③④⑤⑥⑦⑧⑨⑩⑪⑫');

Ejemplo 1: este ejemplo ilustra cómo generar y usar el paquete shortid para crear identificadores únicos.

filename-index.js: este archivo contiene toda la lógica para crear una identificación corta y adjuntarla con la información del usuario y guardarla en la base de datos.

javascript

const express = require('express')
const bodyParser = require('body-parser')
const shortid = require('shortid')
const formTemplet = require('./form')
const repo = require('./repository')
 
const app = express()
const port = process.env.PORT || 3000
 
// The body-parser middleware to parse form data
app.use(bodyParser.urlencoded({extended : true}))
 
// Get route to display HTML form
app.get('/', (req, res) => {
  res.send(formTemplet({}))
})
 
// Post route to handle form submission logic and
app.post('/', (req, res) => {
 
  // Fetching user inputs
  const {name, email} = req.body
 
  // Creating new unique id
  const userId = shortid.generate()
   
  // Saving record to the database
  // with attaching userid to each record
  repo.create({
    userId,
    name,
    email
  })
  res.send('Information submitted!')
})
 
// Server setup
app.listen(port, () => {
  console.log(`Server start on port ${port}`)
})

filename – repository.js: este archivo contiene toda la lógica para crear una base de datos e interactuar con ella.

javascript

// Importing node.js file system module
const fs = require('fs')
 
class Repository {
 
  constructor(filename) {
 
    // Filename where data are going to store
    if(!filename) {
      throw new Error(
'Filename is required to create a datastore!')
    }
 
    this.filename = filename
     
    try {
      fs.accessSync(this.filename)
    } catch(err) {
 
      // If file not exist it is created
      // with empty array
      fs.writeFileSync(this.filename, '[]')
    }
  }
 
  // Get all existing records
  async getAll(){
    return JSON.parse(
      await fs.promises.readFile(this.filename, {
        encoding : 'utf8'
      })
    )
  }
   
  // Create new record
  async create(attrs){
 
    // Fetch all existing records
    const records = await this.getAll()
 
    // All the existing records with new
    // record push back to database
    records.push(attrs)
    await fs.promises.writeFile(
      this.filename,
      JSON.stringify(records, null, 2)  
    )
    return attrs
  }
}
 
// The 'datastore.json' file created
// at runtime and all the information
// provided via signup form store in
// this file in JSON format.
module.exports =
    new Repository('datastore.json')

nombre de archivo – form.js: este archivo contiene toda la lógica para representar el formulario.

javascript

module.exports = ({errors}) => {
  return `
<!DOCTYPE html>
<html>
 
<head>
  <link rel='stylesheet' href=
'https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.0/css/bulma.min.css'>
  <style>
    div.columns {
      margin-top: 100px;
    }
 
    .button {
      margin-top: 10px
    }
  </style>
</head>
 
<body>
  <div class='container'>
    <div class='columns is-centered'>
      <div class='column is-5'>
        <form action='/' method='POST'>
          <div>
            <div>
              <label class='label' id='str'>
                Name
              </label>
            </div>
            <input class='input' type='text'
              name='name' placeholder='Name'
              for='name'>
          </div>
          <div>
            <div>
              <label class='label' id='email'>
                Email
              </label>
            </div>
            <input class='input' type='email'
              name='email' placeholder='Email'
              for='email'>
          </div>
          <div>
            <button class='button is-info'>
              Submit
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>
</body>
 
</html>
  `
}

Producción:

Envío de información1

Envío de información2

Envío de información3

Base de datos:

Base de datos después de enviar la información

Ejemplo 2: este ejemplo ilustra cómo personalizar y usar el paquete shortid para crear identificadores únicos.

filename-index.js: este archivo contiene toda la lógica para crear una identificación corta y adjuntarla con la información del usuario y guardarla en la base de datos.

javascript

const express = require('express')
const bodyParser = require('body-parser')
const shortid = require('shortid')
const formTemplet = require('./form')
const repo = require('./repository')
 
const app = express()
const port = process.env.PORT || 3000
 
// The body-parser middleware to parse form data
app.use(bodyParser.urlencoded({extended : true}))
 
// Get route to display HTML form
app.get('/', (req, res) => {
  res.send(formTemplet({}))
})
 
// Post route to handle form
// submission logic and
app.post('/', (req, res) => {
 
  // Fetching user inputs
  const {name, email} = req.body
 
  // Customising id creation
  shortid.characters('ⒶⒷⒸⒹⒺⒻⒼⒽⒾ'
    + 'ⒿⓀⓁⓜⓃⓄⓅⓆⓇⓈⓉⓊⓋⓌⓍⓎⓏ'
    + 'ⓐⓑⓒⓓⓔⓕⓖⓗⓘⓙⓚⓛⓜⓝⓞⓟⓠ'
    + 'ⓡⓢⓣⓤⓥⓦⓧⓨⓩ①②③④⑤⑥⑦⑧⑨⑩⑪⑫')
 
  // Creating new unique id
  const userId = shortid.generate()
 
  // Saving record to the database
  // with attaching userid to each record
  repo.create({
    userId,
    name,
    email
  })
  res.send('Information submitted!')
})
 
// Server setup
app.listen(port, () => {
  console.log(`Server start on port ${port}`)
})

filename – repository.js: este archivo contiene toda la lógica para crear una base de datos e interactuar con ella.

javascript

// Importing node.js file system module
const fs = require('fs')
 
class Repository {
  constructor(filename) {
 
    // Filename where data are going to store
    if(!filename) {
      throw new Error(
'Filename is required to create a datastore!')
    }
    this.filename = filename
    try {
      fs.accessSync(this.filename)
    } catch(err) {
 
      // If file not exist it is
      // created with empty array
      fs.writeFileSync(this.filename, '[]')
    }
  }
 
  // Get all existing records
  async getAll(){
    return JSON.parse(
      await fs.promises.readFile(this.filename, {
        encoding : 'utf8'
      })
    )
  }
   
  // Create new record
  async create(attrs){
    // Fetch all existing records
    const records = await this.getAll()
 
    // All the existing records with new
    // record push back to database
    records.push(attrs)
    await fs.promises.writeFile(
      this.filename,
      JSON.stringify(records, null, 2)  
    )
    return attrs
  }
}
 
// The 'datastore.json' file created
// at runtime and all the information
// provided via signup form store in
// this file in JSON format.
module.exports =
    new Repository('datastore.json')

nombre de archivo – form.js: este archivo contiene toda la lógica para representar el formulario

javascript

const getError = (errors, prop) => {
  try {
    return errors.mapped()[prop].msg
  } catch (error) {
    return ''
  }
}
 
module.exports = ({errors}) => {
  return `
<!DOCTYPE html>
<html>
 
<head>
  <link rel='stylesheet' href=
'https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.0/css/bulma.min.css'>
  <style>
    div.columns {
      margin-top: 100px;
    }
 
    .button {
      margin-top: 10px
    }
  </style>
</head>
 
<body>
  <div class='container'>
    <div class='columns is-centered'>
      <div class='column is-5'>
        <form action='/' method='POST'>
          <div>
            <div>
              <label class='label' id='str'>
                Name
              </label>
            </div>
            <input class='input' type='text'
              name='name' placeholder='Name'
              for='name'>
          </div>
          <div>
            <div>
              <label class='label' id='email'>
                Email
              </label>
            </div>
            <input class='input' type='email'
              name='email' placeholder='Email'
              for='email'>
          </div>
          <div>
            <button class='button is-info'>
              Submit
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>
</body>
 
</html> 
  `
}

Producción:

Envío de información1

Envío de información 2

Envío de información 3

Base de datos:

Base de datos después de enviar la información

Nota: Hemos utilizado algunas clases de Bulma en el archivo form.js para diseñar nuestro contenido.

Publicación traducida automáticamente

Artículo escrito por hunter__js y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *