CONSTRUINT CLIS IMPRESSIONANTS AMB JAVASCRIPT I OCLIF

Publicat originalment per Federico Kauffman a streaver.com

Definim primer una CLI

Una cerca ràpida a Google genera, per descomptat, un Article de Viquipèdia amb la definició CLI:

Una interfície de línia d’ordres o intèrpret d’idiomes de comandes (CLI), també coneguda com a interfície d’usuari de línia d’ordres, interfície d’usuari de la consola i interfície d’usuari de caràcters (CUI), és un mitjà per interactuar amb un programa d’ordinador on l’usuari (o client) emet ordres al programa en forma de línies de text successives (línies d'ordres). Un programa que gestiona la interfície s'anomena intèrpret de llenguatge d'ordres o intèrpret d'ordres (computació).

Així, en poques paraules, un CLI és un programa que pot entendre les sol·licituds realitzades per un usuari en forma de text i després actuar i executar codi en resposta a això.

Aquest tipus de programes són molt útils per a molts casos d’ús diferents, des de clics simples com el cal Eina Bash que mostra el mes actual, fins a d'altres extremadament complexes com kubectl per gestionar clústers de Kubernetes.

Fins i tot si no utilitzeu CLIs directament cada dia (cosa que és molt improbable), és probable que us afectin indirectament, per exemple, git és una CLI, gcc el compilador GNU, create-react-app una CLI de bastides per generar aplicacions React i moltes més.

Com crear els vostres propis CLI

Com moltes coses al món tecnològic, la resposta és: 'depèn'. Hi ha moltes maneres de construir-les i probablement totes són vàlides en diferents contextos. En aquest cas, exploraré com construir-ne un amb JavaScript i Oclif: a Node.JS Open CLI Framework (per Heroku) , que inclou una CLI per crear CLI 🤔.

at & t bellsouth per correu electrònic d'inici de sessió

PERILL

A partir d’ara suposaré que esteu còmode amb JavaScript i l’ecosistema NPM en general, si no ho esteu, probablement tindreu una idea general, però us recomano que en llegiu alguna cosa abans de començar.

Com començar amb Oclif

Al meu entendre, construir alguna cosa sol ser una bona manera d’aprendre, de manera que en aquest cas he fet una pluja d’idees @flarraa i va decidir construir una CLI de la Copa Libertadores ( veure Wikipedia ).

La idea és proporcionar un conjunt d’ordres que permetin recuperar i mostrar informació sobre els partits ja jugats i els propers per al campionat de la Copa Libertadores.

Anem a excavar!

La CLI d'Oclif té dues maneres possibles de generar projectes CLI, una és npx oclif single mynewcli i el segon és npx oclif multi mynewcli, en aquest cas, generarem una CLI de múltiples ordres.

Ens agradaria que el nostre ordre fos semblant a libertadores games:all, libertadores games:past, libertadores games:upcoming i això és coherent amb la generació de CLI de múltiples comandes d'Oclif.

Inicialització del projecte

En primer lloc, inicialitzem el projecte fent:

 _-----_ ╭──────────────────────────╮ | | │ Time to build a │ |--(o)--| │ multi-command CLI with │

Això us farà algunes preguntes i, després, instal·larà tot el que necessiteu per començar a codificar.

---------´ │ oclif! Version: 1.13.1 │ ( _´U

|° ´ Y _) ╰──────────────────────────╯
/ A /
| ~ |
'. . ' _
'cd libertadores-cli

? npm nom del paquet libertadores-cli
? nom de la safata d'ordres, la CLI exportarà llibertadors
? descripció Una senzilla CLI per obtenir informació sobre Copa Libertadores al vostre terminal
? autor Federico Kauffman
? versió 0.0.0
? llicència MIT
? Qui és el propietari del repositori GitHub ( https://github.com/OWNER/repo ) streaver
? Quin és el nom GitHub del dipòsit ( https://github.com/owner/REPO ) Alliberadors-cli
? Seleccioneu un fil de gestor de paquets
? TypeScript núm
? Utilitzeu eslint (linter for JavaScript) Sí
? Utilitzeu mocha (marc de proves) Sí
? Afegeix un servei CI de configuració de serveis (integració / servei de lliurament continu)

He seleccionat alguns valors predeterminats que m'agraden i ara teniu un munt de fitxers i carpetes que seran la nostra estructura principal per al projecte. A continuació, introduïu el directori amb bin.

Vaig a explicar breument què ens ha generat Oclif:

src

Mirant l'arbre de fitxers podeu veure el index.js directori que conté els fitxers binaris per executar l'ordre a cada plataforma (Unix / Windows).

descàrrega de graphql-playground

Veieu el src/commands carpeta amb un hello que simplement exporta un paquet Oclif intern que carregarà les ordres disponibles, i aquestes ordres es defineixen als fitxers ubicats a hello carpeta. Per defecte, Oclif genera un tests ordre, executem-ho i vegem què tenim:

npm run test

Si executeu el yarn test subcomanda que obtindreu:

hello

Per últim, però no menys important, teniu el src/command/hello.js carpeta on col·locareu totes les proves, de fet, Oclif ja ha creat algunes proves i les podem executar amb tests/commands/hello.test.js o games:all.

Creació de la primera ordre

En primer lloc, podem eliminar el README.md com que no el farem servir, simplement suprimiu el // Insert some really crazy code to parse the HTML // you can find this at https://github.com/streaver/libertadores-cli this.log(results); i libertadores games:all.

Ara podem utilitzar l’ordre del generador d’OCLif CLI; creem el cli-ux ordre amb:

npx oclif multi libertadores-cli

Això crearà tots els fitxers necessaris per a l'ordre (incloses les proves) i també actualitzarà el

$ npx oclif multi libertadores npx: installed 442 in 32.454s

|_+_|

fitxer automàticament per incloure la nova ordre.

Anem a obtenir els detalls de la Copa Libertadores http://www.conmebol.com/es/copa-libertadores-2019/fixture , i ho farem servir titellaire per entrar al lloc i obtenir les dades.

.
├── README.md
├── bin
│ ├── run
│ └── run.cmd
├── package.json
├── src
│ ├── commands
│ │ └── hello.js
│ └── index.js
├── test
│ ├── commands
│ │ └── hello.test.js
│ └── mocha.opts
└── yarn.lock

5 directories, 9 files

}
}

Ara podem executar

$ ./bin/run

A simple CLI to get information about Copa Libertadores right in your terminal

on comprar un akita

VERSION
libertadores-cli/0.0.0 darwin-x64 node-v11.13.0

USAGE
$ libertadores [COMMAND]

COMMANDS
hello Describe the command here
help display help for libertadores

i obtindrem els resultats allà mateix al terminal:

Com haureu notat, també he afegit una funció de càrrega per proporcionar a l'usuari alguns comentaris visuals. Per afegir-ho, només cal instal·lar el paquet

$ ./bin/run hello

hello world from ./src/commands/hello.js

i, a continuació, emboliqueu les parts lentes del codi en algunes trucades d'inici / aturada:

Instal·leu-lo així:

npx oclif command games:all

Afegiu la filadora amb alguna cosa així:

$ yarn add puppeteer --save  
 const puppeteer = require(puppeteer);  
 …  
 class AllCommand extends Command {  
 async run() {  
 …  
 const browser = await puppeteer.launch();  
 const page = await browser.newPage();  
 await page.goto(  
  http://www.conmebol.com/es/copa-libertadores-2019/fixture  ,  
 { waitUntil: load, timeout: 0 }  
 ); |_+_|
Ara, en aquest moment tenim la CLI, podem escriure-hi proves. Oclif inclou alguns valors predeterminats per provar aquest tipus de CLIs. En aquest cas concret, només voleu provar que la sortida al terminal sigui la que espereu. Afortunadament, això és exactament el que fa la prova generada automàticament per a l'ordre, només heu d'adaptar aquest codi.
Us deixaré aquesta tasca a vosaltres (el lector, igual que els llibres de matemàtiques) ... o podeu consultar-los a la pàgina repositori oficial per a la Copa Libertadores CLI.
Instal·leu la CLI, estigueu al dia i no us perdeu els jocs ❤️⚽️!
-----------------------------------
Gràcies per llegir: heart: Si t’ha agradat aquesta publicació, comparteix-la amb tots els teus amics de programació. Segueix-me   Facebook   |   Twitter    
Aprèn més
☞ Parlant amb Python des de JavaScript (i de nou!)
numpy convertir a flotant
☞ Els 12 millors trucs de Javascript per a principiants  
☞ Programació funcional en JavaScript
☞ JavaScript per a l'aprenentatge automàtic mitjançant TensorFlow.js  
☞ Aprèn JavaScript - Curs JavaScript per a principiants
☞ El curs JavaScript complet 2019: construeix projectes reals.  
predicció del preu de la moneda aeon
☞ Converteix-te en desenvolupador de JavaScript: aprèn (React, Node, Angular)  
☞ JavaScript: entendre les parts estranyes  
☞ Vue JS 2: la guia completa (inclòs Vue Router i Vuex)  
☞ El tutorial complet de JavaScript i ES6 (inclòs ES7 i React)  
☞ JavaScript: guia pas a pas per a principiants  
☞ El Bootcamp per a desenvolupadors web  
☞ MERN Stack Front to Back: Full Stack React, Redux i Node.js  
  
 #javascript
  www.streaver.com
Construint CLIs impressionants amb JavaScript i Oclif
  Publicat originalment per Federico Kauffman a   streaver.com

Construint CLIs impressionants amb JavaScript i Oclif