More than 3 years have passed since last update.

Node.jsのnpxでBusiness Card(電子名刺)を作る方法

Last updated at 2021-06-24Posted at 2021-06-23

はじめに

先日、仕事でご一緒した方が、npxを使ったBusiness Cardで自己紹介をされていて、素敵だな〜と思ったので、真似させていただき作ってみました！！

まず、早速デモをご紹介します。

ターミナルで

npx misa335

と入力してみてください。

ターミナル上にBusiness Cardが表示されるはずです！

① プロジェクトの作成
　　npm initで新規プロジェクトを作成します。

② package.jsonの編集
　　package.jsonを編集して、npx <your-project-name>を実行すると、npmパッケージを落として、package.jsonに記載された"main": "index.js"が実行されるように設定します。

package.json

{
...
"main": "index.js",
  "bin": {
    "misa335": "index.js"
},
...

③ Business Cardの作成
Business Cardとして表示させたい項目を、index.jsのconsole.log内に記載します。
また、1行目に#!/usr/bin/env nodeと、nodeのインタプリタを実行する記述をします。

index.js

#!/usr/bin/env node
console.log('
　　　　　　Business Cardとして表示する項目
');

ローカルでBusiness Cardが表示されるかどうか、
node index.jsで確認することができます。

④ Githubにpushする
任意のGithubレポジトリにpushします。

① npmアカウントの作成
https://www.npmjs.com/ で、npmアカウントを作成します。

② npmへのログイン
　ターミナルでnpm loginと打ち、Username, Password, Email Addressを順に入力してnpmにログインします。

③ プロジェクトの公開
npm publish --access publicと入力すると、npm上でプロジェクトが公開されます。

最後に、<npx your-project-name>を試して、Business Cardが表示されるか確認します。

簡単にnpxを使ったBusiness Cardが作成できました！
よかったらぜひ試してみてください♪
また、SNSでつながっていただけると嬉しいです😆