- 1. Raspberry Pi のセットアップを試みる
- 2. Twitterの特定のハッシュタグでつぶやかれたツイートを収集する
- 3. zone.jsを使用してexpressでリクエストIDを出力するミドルウェアの作成
- 4. [メモ]サウンドプログラミング
- 5. fs.stat を Promise 化して複数のファイルの stat を一気に取る。
- 6. npmについて学んだことまとめ
- 7. Google Translation API v3 を Node で使ってみた
- 8. .nodebrewからnへの移行をやってみた
- 9. 【解決済】node.js v12.13.1で “expo start”コマンドで起動するとエラーを吐いてしまうバグ
- 10. express-graphql + TypeScript で始めるGraphQL API Server
- 11. NestJS Service 初期化 非同期
- 12. pm2を使っているからnodeアプリでlog4jは使わなくていい？
- 13. IBM Cloud ObjectStorageにファイルをアップロードする
- 14. MacBook Proの充電器の情報をメニューバーに表示するElectronアプリをつくった
- 15. AxiosでCookieを自動処理する
- 16. Arrayの分割2種
- 17. オリジナルアイコンフォントを作成する
- 18. Heroku CLIの動きを観察する
- 19. 花粉症の重症度が分かるWEBアプリの作成～Auth0でユーザー認証～
- 20. 超初心者がAuth０でログイン機能を実装した
Raspberry Pi のセットアップを試みる
# はじめに
この記事は、[SLP KBIT Advent Calendar 2019] (https://adventar.org/calendars/4214) の10日目の記事です。
最近 Raspberry Pi を手に入れたので、セットアップを行います。
その後、実際に少しだけさわってみようと思います。# まずは Raspberry Pi について調べてみよう
「ラズパイ手に入れたぜ！ 遊んでみよう！」
と思ったのはいいけれど、Raspberry Pi について何も知らないなあ…
ということで、まずは Raspberry Pi について調べてみようと思います。## Raspberry Pi について
生産しているのは、イギリスを拠点とする Raspberry Pi Foundation という慈善団体です。
彼らは、人々がコンピューティングパワーとデジタル技術を活用して、需要な問題を解決し、
創造的に自分自身を表現できるようにするために、活動しています。Raspberry Piとは、人々が学習し、問題を解決し、楽しむために使用する
低コストで高性能なコンピュ
Twitterの特定のハッシュタグでつぶやかれたツイートを収集する
#概要
node.jsで特定のハッシュダグでつぶやかれたツイートを収集して、csvファイルに保存します。#Twitter Developer Platformにアプリを登録
##1.登録画面右上の「Create an app」をクリック
[アプリ登録画面](https://developer.twitter.com/en/apps)
##2.用途の選択
今回は「Making a bot」にしています。
##3.ツイッターアカウントの確認
現在、ログインしているツイッターのアカウントで問題ない
zone.jsを使用してexpressでリクエストIDを出力するミドルウェアの作成
## zone.jsを使用してアクセス毎にユニークな識別子をログへ出力する
expressではアクセス毎にリクエストIDを発行する機能はなく、自前で用意する必要があります。
そこで、Nginx or UUIDv4を使用してリクエストID毎にユニークな識別子を用意します。
リクエスト毎に値を保持する必要があるので、zone.jsを使用し持ち回れるようにしておきます。
[nginxでrequest_id](https://qiita.com/toritori0318/items/d82f9beccd76ea8ccb85)
[uuid](https://www.npmjs.com/package/uuid)
[zone.jsについて](https://qiita.com/Quramy/items/83f4fbc6755309f78ad2)“`javascript:logger.js
‘use strict’;require(‘zone.js’);
const uuidv4 = require(‘uuid/v4’);
const moment = require(‘moment’);
[メモ]サウンドプログラミング
# Max know-how
# アルゴリズム
# C know-how
fs.stat を Promise 化して複数のファイルの stat を一気に取る。
書いてから思ったのですが、下から読んだ方がいいかも。
# Promise 以前の状況
例えば node.js で ‘x’ という名前のファイルの stat を取得したい場合
“` sample.js
const fs = require( ‘fs’ )fs.stat(
‘x’
, ( er, stat ) => {
if ( er ) console.error( er )
else console.log( stat )
}
)“`
という風にやってたと思います。
### ファイルが複数の場合
複数のファイル、例えば ‘x’, ‘y’ という名前のファイルの stat を取得してから何かやりたいような場合、時間のかかる逐次処理でよければ
“` sample.js
const fs = require( ‘fs’ )const
stats = []
fs.stat(
‘x’
, ( er, stat ) => {
if ( er ) console.error( er )
else {
stats.push( stat )
npmについて学んだことまとめ
## 目次
1. npmとは
2. npmコマンド## 今回の学習のゴール
– npmとは何かを知る
– 実際の使い方について知る## 1. npmとは
– Node Package Managerの略称
– Node.jsのパッケージを管理するツール
– Node.jsをインストールすると、標準パッケージとして一緒にインストールされる
– パッケージとは、あらかじめ用意された便利な機能をまとめたもの
– 代表的なパッケージ
– Express
– Node.jsのWebアプリケーション開発で利用できるMVCフレームワーク
– promise
– 非同期処理を分かりやすく実装できる
– Socket.io
– 双方向のリアルタイムアプリケーションを実装できる
– npmでインストールしたパッケージのバージョン情報を`package.json`に格納し、`package.json`からパッケージを一括でインストールすることが出来る
– `
Google Translation API v3 を Node で使ってみた
# はじめに
案件で使う機会があったので忘備録的な感じで記載していこうと思います。
諸々間違い、認識違いがあるかもしれませんが生暖かく見守っていただければと思います。# 実装イメージ
* XServer X10プランを使用します。
* NodeでWebサーバ起動して云々はXServer上で実装するのは難しいのでphpで受けてコマンド呼び出しで動かします。
* 翻訳結果はjson形式で返却します。
* 本来であれば翻訳結果をjavascriptが受け取りうまくゴニョゴニョしてhtml上で表現するが正しいと思いますが、残念ながら自分はPHPerでjavascriptが得意じゃないのでこの部分は割愛させていただきたく。# 環境
* XServer X10プランで契約できるレンタルサーバ
* php
* 7.2.17
* perl
* 5.16
* nodebrew
* 1.0.1
* Node
* v12.10.0
* npm
* 6.10.3※php, perlのバージョンはXServerのデフォルト設定（2019/12/04時点）
※nodebrew
.nodebrewからnへの移行をやってみた
かれこれnodeを触っておらず、nodebrewの存在を忘れていた状態でした。
アップデートしてもバージョンが変わらず、頭空っぽにして作業していたので笑、『[Node.jsとnpmをアップデートする方法](https://parashuto.com/rriver/tools/updating-node-js-and-npm)』という記事を参考にnを入れてアップデートを行うも(当然)上手くいかずwhichしてnodeのパスを見ると`.nodebrew`が経由されたことを知り、そこで思い出しましたwあまりnodeを使わないので、このまま`$ n –stable`か`$ n –latest`で管理しようと思いnodebrewを消し、nに移行することにした際のまとめです。
## 注意事項
参考にされる際は、**自己責任**でお願いします。
この移行作業を行うことでnpmインストールしたライブラリまで消えてしまうため、削除する際に何をインストールしていたのか確認し、移行した後に再度入れなおしてください。
その際におそらく前のバージョンが新しいnodeでサポート外になり、サポートされ
【解決済】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)
#制作物
でもちゃんと利用できます。でも、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アプリ。##完成動画
— 病気のセルフチェック (@Selfcheckhealt1) December 9, 2019
超初心者がAuth０でログイン機能を実装した
##はじめに
プログラミングを学び始めてから2か月の初心者です。最近は初心者でも出来る色んな技にチャレンジして体感しながら勉強しています。というわけで、今回はと～っても面倒なログイン機能を「さささ～」という感じで実装できちゃうAuth0を使ってみました。
##Auth0とは？（超初心者的解釈）
Auth0とはWebやスマホアプリに対して認証機能をクラウドを介して提供してくれるサービスのこと。有難いことにLine,Google, Facebook, Twitterなど有名どころのSNSと既に連携していて、簡単な操作でそれらを使ったログイン機能を自分のWEBに付加することが出来ます。
初心者的に有難いことにはサイトを作る前からログイン機能だけテストが出来たり、サンプルサイトを用意してくれていたりとても親切。しかも一定時間・量までは無料なので助かります。
詳細は[こちら](https://qiita.com/furuth/items/68c3caa3127cbf4f6b77)でも紹介されています。
##目指すもの
年末ということで引き続き、カレンダーをテーマにすることにしました。
Auth0
