f@ctor

Node.js関連のことを調べてみた2019年12月09日

Node.js関連のことを調べてみた2019年12月09日
目次

【解決済】node.js v12.13.1で “expo start”コマンドで起動するとエラーを吐いてしまうバグ

“Unterminated character class. Run CLI with –verbose flag for more details.”

ゼロ環境でExpoを導入しようとしたのでnode入れろとかC++入れろとか挙句の果てにはexpoの最新版だとインストール出来ないって怒られやっとインストール出来て起動出来ると思ったらよくわからないエラーに遭遇したので書き留めて置きます。

##環境
expo 3.5.0
node.js LTS版(12.13.1)

## 原因と解決策

nodeの12.10前後のバージョンが悪さをしてるみたいなのでダウングレードもしくは修正済のバージョンにアップグレードするのが安定しそうでしたが自分は入れ直したりアップグレードする手間が惜しかったでエラー箇所を修正しました。エラーと修復手順を見る感じだと文法の記述ミスなのかな。

##エラー箇所の修復手順

###手順1 原因のファイルを開きます

“Expoのプロジェクトを作成したフォルダ”\node_modules\metro-config\src\defaults\blacklist.j

元記事を表示

express-graphql + TypeScript で始めるGraphQL API Server

# はじめに

この記事は `express-graphql` で`Node.js` + `TypeScript` で簡単にGraphQL APIサーバを実装する
ハンズオンちっくな記事です。
実際に手を動かしてみてください?

ディレクトリ構造は下記のようになります。

“`
.
├── src
│   ├── data
│   │   └── index.ts
│   ├── fields
│   │   ├── index.ts
│   │   └── member
│   │   ├── index.ts
│   │   ├── query.ts
│   │   ├── resolvers.ts
│   │   └── types.ts
│   └── index.ts
├── package.json
└── tsconfig.json

“`

# 準備
## パッケージのインストール

実行は `ts-node` で行います。

“`
yarn add @types/express cors express express-graph

元記事を表示

NestJS Service 初期化 非同期

この記事は [NestJS アドベントカレンダー 2019](https://qiita.com/advent-calendar/2019/nestjs) 8 日目の記事です。

## はじめに

この記事では DB のコネクションやクラウドサービスの認証など、 Service として切り出したいが初期化が非同期になるものの扱い方を説明します。

サンプルコードのリポジトリは以下になります。

https://github.com/nestjs-jp/advent-calendar-2019/tree/master/day8-initialize-async-provider

なお、環境は執筆時点での Node.js の LTS である v12.13.1 を前提とします。

## おさらい: NestJS における Provider の初期化タイミング

NestJS の Module において定義された Provider (Service など) は、 NestJS のエントリーポイントで `NestFactory.create()` された際にインスタンスの生成がされます。
`@

元記事を表示

pm2を使っているからnodeアプリでlog4jは使わなくていい？

pm2で動かすこと前提のnodeアプリを書いていて、ログをそのままconsole.logとconsole.errorの2種類を使い分けるか、log4jを入れてきっちり分けるかで悩んだ結果、前者のconsoleを直に叩く方式にした。

## console直のメリット

– ライブラリを入れなくてもいい

## log4jのメリット

– stdout stderrの他に細かくログレベルを切り替え出来る
– ログにタイムスタンプを入れる事が簡単に出来る

pm2の機能で、ログにタイムスタンプを入れる事が出来るからconsoleでいいかな。

元記事を表示

IBM Cloud ObjectStorageにファイルをアップロードする

## やりたいこと
* multer, ibm-cos-sdk, multer-s3を使用して、multipart/form-dataで受け付けたファイルをIBM CloudのObject Storageにアップロードする。
* 参考：https://github.com/IBM/cos-web-gallery/blob/master/src/controllers/galleryController.js
* 備忘録

## 前提条件
* Node.js…10.16.0
* multer…1.4.2
* multer-s3…2.9.0
* ibm-cos-sdk…1.5.4
* IBM Cloud Object Storage・Bucket作成ずみ

## パッケージのインストール
“`
npm install –save multer multer-s3 ibm-cos-sdk
“`

### upload.controller.js
“`javascript
const multer = require(‘multer’);
const config =

元記事を表示

MacBook Proの充電器の情報をメニューバーに表示するElectronアプリをつくった

MacBook Proで使われてるType-Cの充電は条件により充電速度が変わってきます。

例えば、私の場合RAVPowerのType-AとType-Cの両方が使え 最大60W まで供給できる充電器を普段使いしています。

[
](https://amzn.to/2sWzGPz)

しかしType-AとType-CにそれぞれiPhoneとMacBook Proへ同時に充電しようとすると、30W に供給される電力が低下してしまいます。

この状態で頑張って仕事していると、徐々バッテーリーが減っていってしまいます。
減らないにしても充電速度がかなり遅くなる。

充電器など、ケーブル、PD対応など、Type-C関連は仕様が複雑過ぎるので、繋いでみないと正直わかりません。
充電できたとしても、この供給電力の情報はかなり奥まった

元記事を表示

AxiosでCookieを自動処理する

※環境はNode.js 12.xです

## withCredentials: true

色んなサイトに書いてある方法。

“`js
const Axios = require(‘axios’);

let client = Axios.create({ withCredentials: true });

const response1 = client.get(‘https://example.com/set_cookie’);
console.log(response1.headers[‘set-cookie’]); // [ ‘PHPSESSID=pbjscl1plduu6npqeemep58550’ ]

const response2 = client.get(‘https://example.com/check_cookie’);
console.log(response2.indexOf(‘Cookie’) != -1); // false
“`

ところがこの方法ではうまく行かなかった。

## axios-cookiejar-support

[CookieJ

元記事を表示

Arrayの分割2種

# chunk

Lodashとかであるやつです。
第1引数の配列を第2引数の数の要素数の配列に分割します。

“`javascript

const chunk = (array, n) =>
array.reduce(
(a, c, i) =>
i % n == 0 ? […a, [c]] : […a.slice(0, -1), […a[a.length – 1], c]],
[]
);
“`

実行結果はこんな感じ

“`javascript
const array = Array.from({ length: 7 }, (v, k) => k);
chunk(array, 2);
// [ [ 0, 1 ], [ 2, 3 ], [ 4, 5 ], [ 6 ] ]
“`

—

# divide

自分が欲しかったやつはこれでした。
第1引数の配列を第2引数の数の配列に分割します。

“`javascript
const divide = (array, n) => {
const tbl = new Array

元記事を表示

オリジナルアイコンフォントを作成する

# 概要

Fontello や Font Awesomeなど様々なアイコンを提供しているサイトは多く存在するが、サイトデザインの時に用途にあったアイコンが見つからない場合がよくあります。

その場合、イラレなどで作成したデータからアイコンフォントを作成する方法を紹介します。

#アイコンフォンとは？

>アイコンフォントとは、簡単にいうと「アイコンを表現出来るWebフォント」です。
Webフォントとは、クラウド上にあげられたフォントデータを読み込むことでホームページに反映させる仕組みを指します。
CSS3からWebフォント機能が追加され、Webデザインの世界でも利用が進んできました。
アイコンフォントはWebフォント同様、CSS3を利用すれば比較的簡単に導入できます。

[ferretからの引用](https://ferret-plus.com/6248)

#制作物

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/43894/33dfa5d1-d56b-cac7-4df2-bb6f0

元記事を表示

Heroku CLIの動きを観察する

Herokuは[CLI](https://devcenter.heroku.com/articles/heroku-cli)でもちゃんと利用できます。でも、CLIがうまく動かなかったり、同様の動作を、直接[Platform APIを叩いて](https://www.utakata.work/entry/2019/12/06/000000)、プログラムから実行したくなることもありますよね。そんな時は、CLIの動作を眺めてみるといろいろとヒントが得られるかもしれません。

この記事は[Heroku Advent Calendar 2019](https://qiita.com/advent-calendar/2019/heroku)の8日目の記事です。7日目はさえきさんによる「[見積から開発・運用まで！Herokuの基本とTips](https://qiita.com/yonyonsaeki/items/eb57278061c9930ca206)」でした。9日目は、「[Herokuのdynoは何コアか](https://qiita.com/zunda/items/acf33c53b30da

元記事を表示

花粉症の重症度が分かるWEBアプリの作成～Auth0でユーザー認証～

##概要
プログラムの勉強を始めて5か月ほどの開業医です。

今回Auth0を使ったユーザー認証を勉強したので、花粉症の重症度が分かるWEBアプリに実装してみました。

花粉症（アレルギー性鼻炎）の重症度はくしゃみ・鼻水・鼻づまりの程度で判定できるので、その診断アルゴリズムをプログラミングしています。

##実装
Googleアカウントを使ったユーザー認証機能。
ボタンを選択すると鼻アレルギーの重症度が分かるWEBアプリ。

##完成動画

Node.jsのasync/awaitとPromiseを超ざっくり_中編

※[Node.jsのasync/awaitとPromiseを超ざっくり_前編](https://qiita.com/masa_miyazaki/items/fb137d8b7d3aeb6967b1)の続きです。後でまとめるかも。
※arrow関数は使わないといったな、あれは嘘だ。

## 目次
~~1. Node.jsの非同期処理について~~
~~2. 非同期処理の書き方~~
~~2.1 コールバック（callback）関数~~
~~2.2 Promise~~
2.3 asycn/await ←この記事はココから！
~~3. Promiseとasycn/awaitが一緒だと思ったらハマった件~~
4. 参考

## 2.3.asycn/await
asycn/awaitとはPromiseのシンタックスシュガー。
（同じような内容のことをもっと簡単な書き方でできるよ、というもの。）

###async
Promiseの場合は

“`javascript
function hoge() {
r

元記事を表示

[Electron / TypeScript] ElectronでTypeScript

次Electronでなにか作る時はTypeScript使おっかなー。

# 本題
TypeScriptってのをあんまり触ったこと無いけど型が決められるとかなんとか。

# 参考にしました
https://github.com/electron/electron-quick-start-typescript

ここを真似してやる。

# package.jsonつくる

Node.js入れておいてね。
npm versionは6.4.1です。

適当にフォルダを作成し、ターミナルで以下のコードを。

“`terminal
npm init -y
“`

“`package.json“` が作成されていれば成功です。

# Electron入れる

ターミナルで

“`terminal
npm install –save electron
“`

# TypeScript入れる

ターミナルで

“`terminal
npm install -g typescript
“`

# package.jsonを書き換える

package.jsonを開いて、”scripts”

元記事を表示

Node.js v12のES Modulesと、Babel/TypeScriptの対応について

本日は誕生日です。みなさんプレゼントありがとうございます。まだの方は急いでください。
あと年齢は聞かないでください。

# はじめに

Node.js v12で変更されるES Modulesの挙動についてと、Babelでの対応方法についての記事です。

10月に開催された[関西Node学園 8時限目](https://nodejs.connpass.com/event/147459/)で発表した内容＋α（後日談含む）です。

## 対象者

– ES Modules（`import`構文）は知ってるけどNode.js v12で何か変わったの？

## 非対象者

– v12での変更点もちゃんと知ってるし！
– そういう強い子は、この記事本文はスルーしてもいいので**最後にある「おまけ」だけでも見てください**。
– ES Modulesって何？
– ていうかJavaScriptって何？

## この記事のゴール

– Node.js v12におけるES Modulesの変更点について理解し、適切なコードを書けるようになる
– Babelを使っている場合は適切な設定を行えるように

元記事を表示

初学者向けpackage.jsonハンズオン

これは [Node.js Advent Calendar 2019](https://qiita.com/advent-calendar/2019/nodejs) の8日目の記事です。
昨日は @yuta-ron さんによる [スクレイピング & サーバレスAPIでNode.jsの雰囲気を体験してみる](https://qiita.com/yuta-ron/items/e752947b9e395b0c2ee8) でした。

# 初学者向けpackage.jsonハンズオン

Node.js初学者向けにpackage.jsonハンズオンを実施しましたので、その時に作ったハンズオン資料を公開します。

npmコマンドやpackage.jsonに慣れることが目的のハンズオンの資料ですので、Node.jsとは何か？といった説明はしません。ご了承ください。

文章の手順通りに進めていけば、npmコマンドやpackage.json編集が体験できます！

# 事前準備
## Node.jsのインストール

事前にNode.jsのインストールをお願いします。（すでにNode.jsがインストー

元記事を表示

[Memo]DockerでDjango+Nuxt.jsの開発環境構築

##はじめに
2つのDockerコンテナで構成される、Webアプリ(バックエンドにdjango、フロントエンドにNuxt.js)の開発環境をdocker-composeで構築した際のメモ書きです。

##手元の環境
– macOS Catalina v10.15.1
– Docker version 18.09.2, build 6247962
– docker-compose version 1.23.2, build 1110ad01

##ディレクトリ構成
“`
home
|- backend
| |- code (djangoプロジェクトのソースコードが入る)
| |- Dockerfile
| |- requirements.txt
|- frontend
| |- src (nuxtプロジェクトのソースコードが入る)
| |- Dockerfile
|- .gitignore
|- docker-compose.yml
|- README.md
“`

## Dockerコンテナを立てる
今回は、フロンエンドにnuxt、バックエンドにdjangoを採用して、2つのDoc

元記事を表示

Node.js + Express で ES6を使う

# 確認環境
node v10.17.0

# アプリケーションテンプレートの作成
ここでは`play_express`というアプリを作る前提で進めていきます。
※npxコマンドの使用には、`npm 5.2.0`以降がインストールされている必要があります。

“`
npx express-generator play_express
“`

次に依存関係をインストールします。

“`
cd play_express
npm i
“`

一旦、動作確認をします。アプリのカレントディレクトリで以下のコマンドを実行します。

“`
npm start
“`

このあと、webブラウザから`http://localhost:3000/`にアクセスすると、「Welcome to Express」画面が表示されます。
動作確認を終了するには、`npm start`実行中のコンソール上で、**Cmd(Ctrl)+c** を押下します。

# Babelのインストール
ES6を使うため、babelをインストールします。

“`
npm i @babel/core @babel/node

元記事を表示

ソフトウェア初心者がtoio.jsで作ってみた　5つの作例紹介

これは「toio™(ロボットトイ | toio（トイオ）) Advent Calendar 2019」の8日目の記事になります。

# はじめに
はじめまして。ヒラノユウヤです。
普段はハードウェアエンジニア(電気)として暮らしています。
この記事では、ソフトウェア初心者の私がtoio.jsを使って作ってみたtoio作品を紹介したいと思います。

## ソフトウェアスキル
– C言語
– 学校の授業では真面目に取り組んでいました
– 社会人になってからも、Arduinoを使いこなすくらいには使っていた感じ

以上。なんとも貧弱で泣けてきます。
なんですが、toio core cubeを使ったプログラミングがどうしてもやりたくて。
toio.jsの環境を友人に手伝って構築してもらったところからスタートしました。
始めてみると、サンプルコードもあるので、苦労はしながらも意外といろんなものができました。

## 参考にしたもの
１にも2にも、公式情報が命でした。
用意されているtoio.jsの使い方はtoio.jsのページで。
buzzerの音階やtoio IDの情報など、t

元記事を表示

Node.jsでTwitterを自動化する

https://adventar.org/calendars/4650
OUCC(大阪大学コンピュータクラブ)のアドベントカレンダー12日目です。

Node.jsのtwitterモジュールでtwitterAPIを叩きました。
モジュールの更新が2017年で止まっており、一部機能が使えなくなっています。
先駆者の皆さんの記事のコードが動かないこともありました。

# ツイートする
twitter APIを取得して、API key, API secret key, Access token, Access token secretを取得しました。これに関しても参照ページからほかの方の記事をご覧ください。

送信できる環境が整ったので、ひとまずtwitterモジュールからツイートしてみました。

“`
//モジュールの読み込み
const twitter = require(‘twitter’);

//ツイート内容
const text = ‘test’

//上からAPI key, API secret key, Access token, Access token secret
c

元記事を表示

OTHERカテゴリの最新記事