20210308のNode.jsに関する記事は7件です。

投稿日：2021-03-08T23:00:20+09:00

【コピペOK】bashでnodeとyarnのインストールをする方法

こんにちは、くりぱんです。

この記事で実現できること

homebrewのインストール

nodebrewのインストール

Node.jsのインストール

yarnのインストール

説明

フロントエンドの環境を構築している際にnode.jsとyarnが必要になったので、nodebrewを使って、node.jsとyarnをインストールしていきます。
※なお、今回はbashで実装していきます。

開発環境

macOS Catalina

bash

実装の流れ

Homebrewのインストール

Nodebrewのインストール

nodebrewのPATHを通す

Node.jsのインストール

yarnのインストール

実装

Homebrewのインストール

Homebrewはパッケージ管理システムの一つで、様々なソフトウェアの導入を簡単にしてくれるツールです。
今回はこちらを使用していくので、下記のコマンドを実行して、インストールしてください。
$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
公式サイト：https://brew.sh/index_ja

nodebrewのインストール

NodebrewはNode.jsのバージョンを管理するバージョン管理ツールです。今回はこのnodebrewを使用して、Node.jsとyarnを一括管理できるようにしていきます。
下記のコマンドを実行して、先ほどインストールしたHomebrewを使用してnodebrewをインストールしてください。
$ brew install nodebrew
これでnodebrewのインストールは終わりです。

nodebrewのPATHを通す

Nodebrewのコマンドを利用するためにnodebrewにPATHを通していきます。
下記のコマンドを実行してください。
$ echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.bash_profile
追加したパスを適用していきます。
$ source ~/.bash_profile
これでNode.jsとyarnをインストールする準備が完了しました。

Node.jsのインストール

それでは、nodebrewを使用して、Node.jsをインストールしていきます。
$ nodebrew install-binary latest
インストールが完了したら、インストールされたNode.jsのバージョンを確認して、そのバージョンを使う設定にしていきます。
$ nodebrew list
v15.11.0などのバージョンが表示されていればOKです。このバージョンは人によって違うので、数字が違くても気にしなくて大丈夫です。

バージョンを確認したら、下記コマンドのバージョンを自分がインストールしたバージョンにしてコマンドを実行してください。
$ nodebrew use v15.11.0
下記コマンドでNode.jsのバージョンを確認してください。
$ node -v
v15.11.0
yarnのインストール

最後にyarnのインストールをして終わりです。
$ npm install -g yarn
バージョン確認もしておきましょう
$ yarn -v
1.22.10
最後に

以上でbashを使用したNode.jsとyarnのインストールは終了です。
各々フロントの開発を楽しんじゃってください！

少しでも役に立った！という時は、LGTMをポチッと、、、笑
1つでもLGTMが付くとその日がハッピーになるんです！
役に立たなかった時は、怒らないでコメント頂けると幸いです笑

Twitterもやってます！
プログラミングや金融知識についてやエンジニアの現実についてつぶやいています！
よかったら見てみてくださいね！
https://twitter.com/sakuslife

　 Tweet
Qiitaで続きを読む

投稿日：2021-03-08T21:11:28+09:00

【Node.js】Firebaseでエミュレーターを使ってjestのCIをGithub Actionsで

もうエミュレーターでテストすればいいんじゃないか説。

package.json

  "scripts": {
    "jest": "jest",
    "test": "firebase emulators:exec --only functions,firestore \"npm run jest --exit\"",
  }

別のFirebaseプロジェクトを用意する必要もないし、sinonでFirebaseAdminのモックとかも作る必要ないから楽。

Github Actions

jobs:
  ci:
    runs-on: ${{ matrix.os }}

    strategy:
      matrix:
        os: [ubuntu-latest]
        node: [12]

    steps:
      - name: Checkout ?
        uses: actions/checkout@master

      - name: Setup node env ?
        uses: actions/setup-node@v2.1.2
        with:
          node-version: ${{ matrix.node }}

      - name: Cache node_modules ?
        uses: actions/cache@v2
        with:
          path: ~/.npm
          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-

      - name: Install dependencies ??‍?
        run: |
          npm install -g firebase-tools
          npm ci

      - name: Firebase runtime config ?
        uses: w9jds/firebase-action@master
        with:
          args: functions:config:get > .runtimeconfig.json
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
          PROJECT_ID: "default"

      - name: Run linter ?
        run: |
          npm run lint
          npm run test

functions.config()を使ってる場合は、firebase-actionsを使って.runtimeconfig.jsonに吐き出す。
また、エミュレーターの起動はfirebase-actionsを使わないのでnpm install -g firebase-toolsを忘れずに。

　 Tweet
Qiitaで続きを読む

投稿日：2021-03-08T21:11:28+09:00

【Node.js】Firebaseでエミュレーターを使ったjestのCIをGithub Actionsで

もうエミュレーターでテストすればいいんじゃないか説。
package.json
  "scripts": {
    "jest": "jest",
    "test": "firebase emulators:exec --only functions,firestore \"npm run jest --exit\"",
  }
別のFirebaseプロジェクトを用意する必要もないし、sinonでFirebaseAdminのモックとかも作る必要ないから楽。

Github Actions
jobs:
  ci:
    runs-on: ${{ matrix.os }}

    strategy:
      matrix:
        os: [ubuntu-latest]
        node: [12]

    steps:
      - name: Checkout ?
        uses: actions/checkout@master

      - name: Setup node env ?
        uses: actions/setup-node@v2.1.2
        with:
          node-version: ${{ matrix.node }}

      - name: Cache node_modules ?
        uses: actions/cache@v2
        with:
          path: ~/.npm
          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.os }}-node-

      - name: Install dependencies ??‍?
        run: |
          npm install -g firebase-tools
          npm ci

      - name: Firebase runtime config ?
        uses: w9jds/firebase-action@master
        with:
          args: functions:config:get > .runtimeconfig.json
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
          PROJECT_ID: "default"

      - name: Run linter ?
        run: |
          npm run lint
          npm run test
functions.config()を使ってる場合は、firebase-actionsを使って.runtimeconfig.jsonに吐き出す。
また、エミュレーターの起動はfirebase-actionsを使わないのでnpm install -g firebase-toolsを忘れずに。

Cloud Storageのテスト

FirebaseのStorageは現状エミュレーターのサポート外なので、initializeAppで認証情報を渡してテストする。同じプロジェクトでテストする場合、バケットをテスト用に変更すると楽。（デフォルトで用意されてるstagingのバケットなど）
storage.test.js
import * as admin from 'firebase-admin';
import { config } from 'firebase-functions';
admin.initializeApp({
  credential: admin.credential.cert({
    project_id: config().credential.project_id,
    client_email: config().credential.client_email,
    private_key: config().credential.private_key.replace(/\\n/g, '\n'),
  }),
  storageBucket: 'staging.<PROJECT_ID>.appspot.com', // test用に変更
});
秘密鍵をfunctions.config()から読み込む場合、\nが\\nになって
Failed to parse private key: Error: Invalid PEM formatted message.
と、認証でコケるので改行に置換してあげる。

　 Tweet
Qiitaで続きを読む

投稿日：2021-03-08T16:22:36+09:00

環境構築　OSがMojave以前の場合

1. Command Line Toolsの導入

1-1. Command Line Toolsをインストール

ターミナルに入力
$ xcode-select --install
「インストール」をクリック。
「同意する」をクリック。

2. Homebrewの導入

2-1.　Homebrewをインストール

コマンドを順番に1つずつ実行。
$ cd  #ホームディレクトリに移動
$ pwd #ホームディレクトリにいるかどうか確認
$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)" # コマンドを実行
PCのパスワードを入力する。
「Press RETURN to continue or other key to abort」
が表示されたら、エンターキーをおす。

2-2. Homebrewがインストールされているか確認

上のコマンドだけ実行する。
バージョン情報が表示されれば無事にインストールされている。
$ brew -v
Homebrew 2.5.1 # 数値は異なる場合があります
2-3. Homebrewをアップデート
$ brew update
2-4. Homebrewの権限を変更
$ sudo chown -R `whoami`:admin /usr/local/bin
再度パスワードを求められた場合は、先ほどと同じように入力。

3. Rubyをインストール

Webアプリケーションの開発においては専用のRubyをインストールする必要があります。

3-1. rbenv と ruby-buildをインストール
$ brew install rbenv ruby-build
3-2. rbenvをどこからも使用できるようにする
$ echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
3-3. bash_profileの変更を反映
$ source ~/.bash_profile
3-4. readlineをinstall

ターミナルのirb上で日本語入力を可能にする設定
$ brew install readline
3-5. readlineをどこからも使用できるようにする
$ brew link readline --force
3-6. rbenvを利用してRubyをインストール
$ RUBY_CONFIGURE_OPTS="--with-readline-dir=$(brew --prefix readline)"
$ rbenv install 2.6.
2.6.5と書いてあるのは今回インストールするRubyのバージョンです。

3-7. 利用するRubyのバージョンを指定
$ rbenv global 2.6.5
デフォルトでPCに入っていたRubyから、先ほどインストールしたRubyを使用するように切り替えることができました。

3-8. rbenvを読み込んで変更を反映
$ rbenv rehash
3-9. Rubyのバージョンを確認

以下のコマンドで最終確認。
$ ruby -v
4. MySQLを用意

4-1. MySQLのインストール
$ brew install mysql@5.6
4-2. MySQLの自動起動設定

MySQLは本来であればPC再起動のたびに起動し直す必要がありますが、それは面倒であるため、自動で起動するようにしておく。
$ mkdir ~/Library/LaunchAgents
$ ln -sfv /usr/local/opt/mysql\@5.6/*.plist ~/Library/LaunchAgents
$ launchctl load ~/Library/LaunchAgents/homebrew.mxcl.mysql\@5.6.plist
4-3.mysqlコマンドをどこからでも実行できるようにする
# mysqlのコマンドを実行できるようにする
$ echo 'export PATH="/usr/local/opt/mysql@5.6/bin:$PATH"' >> ~/.bash_profile
$ source ~/.bash_profile
# mysqlのコマンドが打てるか確認する
$ which mysql
# 以下のように表示されれば成功
/usr/local/opt/mysql@5.6/bin/mysql
4-4. mysqlを起動を確認
# mysqlの状態を確認するコマンドです
$ mysql.server status

# 以下のように表示されれば成功
 SUCCESS! MySQL running
5. Railsの導入

5-1. bundlerをインストール

Rubyの拡張機能（gem）を管理するためのbundler（バンドラー）をインストールする。
$ gem install bundler --version='2.1.4'
5-2. Railsをインストール
$ gem install rails --version='6.0.0'
5-3. rbenvを再読み込み
$ rbenv rehash
5-4. Railsが導入できたか確認
% rails -v
Rails 6.0.0   #「Rails」のあとに続く数字は変わる可能性があります
6. Node.jsの導入

6-1.Node.jsのインストール
$ brew install node@14
Node.jsへのパスを設定
$ echo 'export PATH="/usr/local/opt/node@14/bin:$PATH"' >> ~/.bash_profile
$ source ~/.bash_profile
6-2. Node.jsが導入できたか確認
$ node -v
v14.15.3 # 数値は異なる場合があります
7. yarnの導入

7-1. yarnをインストール
$ brew install yarn
7-2. yarnが導入できたか確認
$ yarn -v

　 Tweet
Qiitaで続きを読む

投稿日：2021-03-08T07:44:36+09:00

環境構築　6　Node.js

Node.jsの導入

Railsを動かすためにはNode.jsが必要となり、それをHomebrewを用いてインストールします。

1. Node.jsのインストール

ターミナルに入力
brew install node@14
Node.jsへのパスを設定しましょう
% echo 'export PATH="/usr/local/opt/node@14/bin:$PATH"' >> ~/.zshrc
% source ~/.zshrc
2. Node.jsが導入できたか確認
% node -v
v14.15.3 # 数値は異なる場合がある

　 Tweet
Qiitaで続きを読む

投稿日：2021-03-08T01:09:22+09:00

LINEボットとATOM Echoでボイスメッセージを作る

ATOM Echoには、マイクとスピーカとボタンとLEDが付いています。
ATOM Echoのマイクにしゃべった言葉がLINEメッセージとして通知されるようにするとともに、LINEアプリから応答メッセージを入力したら、ATOM EchoのLEDが点灯し、さらにボタンを押したら応答メッセージが音声でATOM Echoのスピーカから流れるようにします。

いくつかのサービスを使っています

・録音したWAVEファイルを、Google Cloud Speech APIの音声認識サービスを使ってテキスト文字に起こします。
・LINEボットの機能を使って、メッセージをLINEアプリに通知したり、LINEアプリに入力したメッセージを受信したりします。
・受信したテキストメッセージを、Amazon Pollyの音声合成サービスを使って音声ファイルにします。
・ATOM Echoで、メッセージ通知を検知するために、MQTTでサブスクライブします。

ソースコードもろもろは、以下のGitHubに上げておきました。

poruruba/LinebotCarrier
　https://github.com/poruruba/LinebotCarrier

ATOM Echo側

以下のライブラリを利用しています。

m5stack/M5StickC
　https://github.com/m5stack/M5StickC
ボタンの検出に使っています。

knolleary/PubSubClient
　https://github.com/knolleary/pubsubclient
MQTTサブスクライブに使っています。

bblanchon/ArduinoJson
　https://github.com/bblanchon/ArduinoJson
MQTTサブスクライブで受信するJSONのパースに使っています。

adafruit/Adafruit_NeoPixel
　https://github.com/adafruit/Adafruit_NeoPixel
RGBのLED制御に使っています。

録音は、以下を参考にしました。
　M5StickCとSpeaker HatでAI Chatと会話
　 m5stack/M5-ProductExampleCodes

こんな感じです。

Arduino\LinebotCarrier\src\main.cpp

// 録音用タスク
void i2sRecordTask(void* arg){
  // 初期化
  recPos = 0;
  memset(soundStorage, 0, sizeof(soundStorage));

  vTaskDelay(100);

  // 録音処理
  while (isRecording) {
    size_t transBytes;

    // I2Sからデータ取得
    i2s_read(I2S_NUM_0, (char*)soundBuffer, BUFFER_LEN, &transBytes, (100 / portTICK_RATE_MS));

    // int16_t(12bit精度)をuint8_tに変換
    for (int i = 0 ; i < transBytes ; i += 2 ) {
      if ( recPos < STORAGE_LEN ) {
        int16_t* val = (int16_t*)&soundBuffer[i];
        soundStorage[recPos] = ( *val + 32768 ) / 256;
        recPos++;
        if( recPos >= sizeof(soundStorage) ){
          isRecording = false;
          break;
        }
      }
    }
//    Serial.printf("transBytes=%d, recPos=%d\n", transBytes, recPos);
    vTaskDelay(1 / portTICK_RATE_MS);
  }

  i2s_driver_uninstall(I2S_NUM_0);

  pixels.setPixelColor(0, pixels.Color(0, 0, 0));
  pixels.show();

  if( recPos > 0 ){
    unsigned long len = sizeof(temp_buffer);
    int ret = doHttpPostFile((base_url + "/linebot-carrier-wav2text").c_str(), soundStorage, recPos, "application/octet-stream", 
                              "upfile", "test.bin", NULL, NULL, temp_buffer, &len);
    if( ret != 0 ){
      Serial.println("/linebot-carrier-wav2text: Error");
    }else{
      Serial.println((char*)temp_buffer);
    }
  }

  // タスク削除
  vTaskDelete(NULL);
}

void i2sRecord(){
  isRecording = true;

  pixels.setPixelColor(0, pixels.Color(0, 100, 0));
  pixels.show();

  i2s_driver_uninstall(I2S_NUM_0);
  i2s_config_t i2s_config = {
      .mode = (i2s_mode_t)(I2S_MODE_MASTER | I2S_MODE_RX | I2S_MODE_PDM),
      .sample_rate = SAMPLING_RATE,
      .bits_per_sample = I2S_BITS_PER_SAMPLE_16BIT, // is fixed at 12bit, stereo, MSB
      .channel_format = I2S_CHANNEL_FMT_ALL_RIGHT,
      .communication_format = I2S_COMM_FORMAT_I2S,
      .intr_alloc_flags = ESP_INTR_FLAG_LEVEL1,
      .dma_buf_count = 6,
      .dma_buf_len = 60,
  };

  esp_err_t err = ESP_OK;

  err += i2s_driver_install(I2S_NUM_0, &i2s_config, 0, NULL);
  i2s_pin_config_t tx_pin_config;

  tx_pin_config.bck_io_num = I2S_BCLK;
  tx_pin_config.ws_io_num = I2S_LRC;
  tx_pin_config.data_out_num = I2S_DOUT;
  tx_pin_config.data_in_num = I2S_DIN;

  //Serial.println("Init i2s_set_pin");
  err += i2s_set_pin(I2S_NUM_0, &tx_pin_config);
  //Serial.println("Init i2s_set_clk");
  err += i2s_set_clk(I2S_NUM_0, SAMPLING_RATE, I2S_BITS_PER_SAMPLE_16BIT, I2S_CHANNEL_MONO);

  // 録音開始
  xTaskCreatePinnedToCore(i2sRecordTask, "i2sRecordTask", 4096, NULL, 1, NULL, 1);    
}

録音が完了したら、以下の部分で音声の生データをファイルとしてアップロードしています。

Arduino\LinebotCarrier\src\main.cpp

    int ret = doHttpPostFile((base_url + "/linebot-carrier-wav2text").c_str(), soundStorage, recPos, "application/octet-stream", 
                              "upfile", "test.bin", NULL, NULL, temp_buffer, &len);

MP3の再生は、以下を利用させていただきました。

schreibfaul1/ESP32-audioI2S
　https://github.com/schreibfaul1/ESP32-audioI2S

PlatformIOを利用している場合は、zipファイルの中身をlibフォルダに突っ込めばコンパイルに含めてくれます。
ポート番号は、ATOM Echoの配線に合わせています。

ただし、うまく動かないところがあり、いくつか修正しています。（この直し方でよいのか自信がないですが。。。）
GitHubには、修正したファイルだけ上げてあります。

録音と再生を切り替えられるように、Audioのコンストラクターから再セットアップ用の関数Audio:setup()に分離しました。

変更前