Comment construire votre CV sur NPM

Hier, Ali Churcher a partagé une façon intéressante de faire un CV en utilisant une disposition de la grille CSS. Créons un peu en créant un modèle que nous pouvons tourner chaque fois que nous voulons utiliser la ligne de commande. Ce qui est cool, c'est que vous pourrez l'exécuter avec une seule commande.

Je sais que la ligne de commande peut être intimidante, et oui, nous travaillerons un peu sur node.js. Nous allons garder les choses éclatées en petites étapes pour le rendre plus facile à suivre.

Comme de nombreux projets, il y a une petite configuration impliquée. Commencez par créer un dossier vide dans votre répertoire de travail et initialisez un projet à l'aide de NPM ou de fil.

 mkdir your-project && cd "$ _"

## npm
npm init

## fil
Init de fil

Quel que soit le nom que vous utilisez pour «votre projection» sera le nom de votre package dans le registre NPM.

L'étape suivante consiste à créer un fichier d'entrée pour l'application, qui est index.js dans ce cas. Nous avons également besoin d'un endroit pour stocker les données, alors créez un autre fichier appelé Data.json. Vous pouvez les ouvrir à partir de la ligne de commande une fois que vous les avez créées:

 Touch index.js && touch data.json

Création de l'interface de ligne de commande

Le grand avantage que nous bénéficions de la création de cette application est qu'il nous donne un moyen semi-visuel de créer un CV directement dans la ligne de commande. Nous avons besoin de deux choses pour faire avancer cela:

• L'objet pour stocker les données
• Une interface de ligne de commande interactive (que nous allons construire en utilisant le quitte.js)

Commençons par ce premier. Crack Open Data.json et ajoutez ce qui suit:

 {
  "Éducation": [
    "Quelques informations",
    "Informations moins importantes",
    "Etc, etc."
  ],
  "Expérience": [
    "Quelques informations",
    "Informations moins importantes",
    "Etc, etc."
  ],
  "Contact": [
    "Un moyen de vous contacter"
  ]]
}

Ce n'est qu'un exemple qui définit les objets et les touches qui seront utilisés pour chaque étape de l'interface. Vous pouvez le modifier totalement en fonction de vos propres besoins.

C'est la première chose dont nous avions besoin. La deuxième chose est l'interface interactive. Inquirer.js en gérera 90%., N'hésitez pas à en savoir plus sur ce package, car vous pouvez créer des interfaces plus avancées à mesure que vous vous familiarisez avec les tenants et aboutissants.

 fil Ajouter une craie Inquirer

Quelle est cette chose de craie? C'est une bibliothèque qui va nous aider à personnaliser notre sortie terminale en ajoutant de la couleur et du style pour une meilleure expérience.

Opensons maintenant index.js et collez le code suivant:

 #! / USR / bin / env

"Utilisez strict";

Const Inquirer = require ("Inquirer");
const chalk = require ("craie");
const data = require ("./ data.json");

// ajouter la couleur de la réponse
const Response = chalk.bold.blue;

Const résumeOptions = {
  Type: "Liste",
  Nom: "RessumeOptions",
  Message: "Que voulez-vous savoir",
  Choices: [... Object.Keys (Data), "Exit"]
};

fonction showResume () {
  console.log ("Bonjour, c'est mon CV");
  Handlerresume ();
}

Function Handlerresume () {
  Inquirer.prorompt (remeumeOptions) .Then (réponse => {
    if (réponse.ResumeOptions == "exit") return;

    const Options = data [`$ {réponse.resumeoptions}`]
    if (options) {
      console.log (réponse (new Inquirer.separator ()));
      options.ForEach (info => {
        console.log (réponse ("| =>" info));
      });
      console.log (réponse (new Inquirer.separator ()));
    }

    enquêteur
      .rapide({
        Type: "Liste",
        Nom: "Exitback",
        Message: "Retourne ou sortir?",
        Choices: ["Back", "sortir"]
      }). Ensuite (choix => {
        if (choix.exitback == "back") {
          Handlerresume ();
        } autre {
          retour;
        }
      });
  }). Catch (err => console.log ('ooops,, err))
}

showResume ();

Zoikes! C'est un gros morceau de code. Décollons un peu pour expliquer ce qui se passe.

En haut du fichier, nous importons toutes les choses nécessaires nécessaires pour exécuter l'application et définir les styles de couleurs à l'aide de la bibliothèque de craie. Si vous êtes davantage intéressé aux couleurs et à la personnalisation, consultez la documentation de la craie car vous pouvez devenir assez créatif avec les choses.

 Const Inquirer = require ("Inquirer");
const chalk = require ("craie");
const data = require ("./ data.json");

// ajouter la couleur de la réponse
const Response = chalk.bold.blue;

La prochaine chose que le code fait est de créer notre liste d'options de CV. Ce sont ce qui sera affiché après avoir tapé notre commande dans le terminal. Nous l'appelons remeumeOptions, nous savons donc exactement ce qu'il fait.

 Const résumeOptions = {
  Type: "Liste",
  Nom: "RessumeOptions",
  Message: "Que voulez-vous savoir",
  Choices: [... Object.Keys (Data), "Exit"]
};

Nous sommes principalement intéressés par le champ de choix car il compose les clés de notre objet de données tout en nous fournissant un moyen de «quitter» l'application si nous en avons besoin.

Après cela, nous créons la fonction showResume (), qui sera notre fonction principale qui s'exécute juste après le lancement. Il affiche un message de bienvenue Sorta et exécute notre fonction Handlerresume ().

 fonction showResume () {
  console.log ("Bonjour, c'est mon CV");
  Handlerresume ();
}

Ok, maintenant pour le grand: la fonction Handlerresume (). La première partie est une vérification conditionnelle pour s'assurer que nous n'avons pas quitté l'application et pour afficher les options enregistrées de notre objet de données si tout est bon. En d'autres termes, si l'option choisie est sortie, nous quittons le programme. Sinon, nous récupérons la liste des options qui nous sont disponibles sous la clé choisie.

Ainsi, une fois que l'application a confirmé que nous ne sortons pas, nous obtenons des réponses. Celles que nous avons définies étaient l'éducation, l'expérience et le contact.

Cela nous amène au truc Inquirer.js. Il pourrait être plus facile si nous énumérons ces pièces:

Avez-vous remarqué que la fonction New Inquirer.Separator () dans la sortie des options? C'est une fonctionnalité d'Inquirer.js qui fournit un séparateur visuel entre le contenu pour casser un peu les choses et rendre l'interface un peu plus facile à lire.

Très bien, nous montrons la liste des options! Nous devons maintenant laisser AA moyen de retourner à l'écran précédent. Pour ce faire, nous créons un autre Inquirer. Cela nous rendra la promesse avec des réponses que nous devrons gérer. Si l'option choisie sera de retour, nous exécutons Handlerresume (), ce qui signifie que nous ouvrons à nouveau notre écran principal avec les options; Si nous choisissons la sortie, nous quittons la fonction.

Enfin, nous ajouterons l'instruction Catch pour attraper toutes les erreurs possibles. Bonne pratique. :)

Publication à NPM

Bravo! Essayez d'exécuter le nœud index.js et vous devriez pouvoir tester l'application.

C'est génial et tout, mais ce serait plus agréable de le faire fonctionner sans avoir à travailler directement à chaque fois. C'est beaucoup plus simple que les fonctions que nous venons de regarder.

1. Enregistrez un compte sur npmjs.com si vous n'en avez pas.
2. Ajoutez un utilisateur à votre CLI en exécutant NPM AddUser.
3. Fournissez le nom d'utilisateur et le mot de passe que vous avez utilisés pour enregistrer le compte NPM.
4. Allez sur package.json et ajoutez les lignes suivantes:

    "bin": {
     "Votre nom-package": "./index.js"
   }

5. Ajoutez un fichier readme.md qui apparaîtra sur la page NPM de l'application.
6. Publiez le package.

 NPM Publish --Access = public

Chaque fois que vous mettez à jour le package, vous pouvez les pousser vers NPM. En savoir plus sur le versioning NPM ici.

 Patch de la version NPM // 1.0.1
Version NPM Minor // 1.1.0
Version NPM Major // 2.0.0

Et pour pousser les mises à jour vers NPM:

 NPM Publier

Reprendre la magie!

C'est ça! Vous pouvez maintenant découvrir la magie de taper NPX votre nom de package dans la ligne de commande et de créer votre CV tout de suite. Soit dit en passant, NPX est le moyen d'exécuter des commandes sans les installer localement sur votre machine. Il est disponible automatiquement pour vous, si vous avez l'installation de NPM.

Ce n'est qu'une simple application terminale, mais comprendre la logique dans les coulisses vous permettra de créer des choses incroyables et c'est votre première étape sur votre chemin.

Code source

Codage heureux!

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!