f@ctor

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

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

【備忘録】自分がフロントエンドで使っているツール

はじめまして、にへーと申します。

私は、フロントエンドエンジニアを経験後に専門学校講師を仕事にしています。

趣味は、コーディング。他の人の書いたソースを眺めていられるそんな人です。

今回、自分自身がフロントエンドを作っていく際に使っているツールをまとめておきます。

## 1.Visual Studio Code
前職で使っていたのですが、とにかく軽い。
Microsoftが開発しているので、TypeScriptとかとも相性がバッチリみたいです。

アカウント連携が結構良くて、複数環境で開発を行っている人にはとても使いやすいと思います。
Windows、Ubuntu、Macを使う人にはもってこいです。

## 2.NeoVim
Vimなどは使ったことがなかったのですが、最近使うように心がけています。
VSCodeなどGUIアプリケーションがない場合にも対応できるよう、現在勉強中です。

プラグインもNeoVimは豊富にあるようなので、これから実験していこうと考えています。

## 3.Google Chrome Developer Tool
エンジニアの人からしたら「あたりまえ!

元記事を表示

Everything about Cancellation of Promises

以下は英語版です。日本語版はまだ準備中です。申し訳ありません。今日中に公開するつもりです。

In this **thorough** post about JavaScript and Node.js you can learn about the history of cancellation of [Promises][Promise]; why it is relevant to Node.js and what you should be aware of when you try to use it with the [async/await][async-await] API.

This post is for you if you have a good insight into the `JavaScript` Promise API and some experience with `Node.js`.

## History

Ever since the [Promise][Promise] API was introduced to browsers in

元記事を表示

空いてる時間を気軽に共有出来るサービスを作ってみた

この記事は[CA21 Advent Calendar 2020](https://adventar.org/calendars/5308)に投稿する予定の記事です。

## 初めに
来年からインフラエンジニア(SRE)として働く予定のしがない学生です > [Twitter](https://twitter.com/_tetsuya28)
アドカレ3日目担当ということで今日はとあるサービスを勉強がてら作ってみたお話をしようと思います
あんまり1つずつの技術の深堀りはしないのでよろしくお願いします

## 空き時間共有サービス
という訳で早速今回作ってみたサービスの紹介から
題名の通りなんですが、ミーティングや遊びなどの色々な場面で日程調整をすることがあると思うんですが、僕はその時間を列挙すると言う作業へのだるさを感じていて以前はGoogleカレンダーと連携して空き時間をリスト化出来るサービスを使っていたのですがどうしてもちゃんとしているサービスが故に僕の目的を果たすのにはToo muchな部分や、逆に足りないなと思う部分がありました
具体的には

– 文字だけでは視認性が悪い
–

元記事を表示

フロントエンドだけ作ったアプリをGitHubPagesからHerokuに移行する

## abstract

端的に言うと、GitHubPagesに公開している、フロントエンドのみで構成されたアプリケーションをHerokuに移行しました。

※今回のアプリケーションはVue-CLI + webpackのアプリケーションですが、そうでないアプリケーションを移行したい場合でも、基本的な流れは同じだと思います。

### 背景

過去にVue.jsで[ポケモンずかん](https://qiita.com/homusuke/items/8bbf96c750e9a6fcb2d2)を作りました。「ポケモンずかん」はバックエンドの実装をしておらず、フロントエンドのJavaScriptと外部のAPIだけで作ったものになります。「ポケモンずかん」の実装はフロントエンドのみなので、GitHubPagesでの公開が可能です。ですので、GitHubPagesに公開していました。しかし、Herokuを使えばGitHubPagesに頼ることなくデプロイできるようなので移行してみました。

### Heroku とは

Herokuは作成したアプリケーションを簡単にデプロイできるサービスです。He

元記事を表示

フロントエンドプロジェクト向けの開発環境導入

#はじめに

[自分用 技術の振り返り Advent Calendar 2020](https://qiita.com/advent-calendar/2020/my-tech)の1日目、手始めに大好きなフロントエンド開発の業務環境の構築から。
この記事を読む、稀有な方がいて分かりにくいなーと思ったら、リクエストください。出来る限り修正します。

自分用ですが、初学者をターゲットに専門用語をなるべく利用しない、シンプルな記事を投稿していく予定です。
中級, 上級者の方にはあまり向いていないものと思われます。

#目的

業務で利用しているフロントエンドの開発環境導入を振り返る。

Advent Calendar と言うこともあって続き物にしたほうがモチベーションが上がるので、
ここで開発環境の導入からプロジェクトの生成～パッケージ化まで行っていきたい。

#動機

フロントエンド環境でよく利用するツールやライブラリ、パッケージマネージャの導入を
どういった手順で揃えるか、何度も行う作業ではないので記録していく。

#環境
OS: Windows7(そんなに10と変わらんでしょの精神)

元記事を表示

2020 アメリカ大統領選　 node-red で調査・予測してみた

![2020-1105.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387051/948d71ca-4a23-c106-a666-01ead48789b2.png)

##要約##
：node-red /sentiment(以降、感情推定モデル)を使って、２０２０アメリカ大統領選でどちらが当選するか予測(11/3時点)してみました。僅差でトランプ大統領再選と予測しました。全国規模でそのまま調査をしたため、州ごとの傾向を予測することができなかったことが予測が八ズレた原因です。ただ、全国規模の傾向分析や商品のトレンド分析を行う際は、リアルタイムに測定する、感情推定モデルは有効と思われます。

##〔はじめに〕##
1.今回使用した、感情推定モデルの元ソースコード
https://flows.nodered.org/flow/210746ff118272e4f38a073108193049

アメリカ国内では、1分間に500件くらいトランプ大統領に関して、ツイートされています。その全内容を、ポジティブ：分析

元記事を表示

GitHub REST API から Node.js で 特定の organization の issue の一覧を取得する

## コード

古い issue の一覧をチャットに通知するツールを作成しておりまして、その一環として書いたコードです。
組織（ユーザー）名、リポジトリ名はクエリパラメータに設定するなど複数パターンがあるようですが、今回は下記URLでアクセスしました。

– `[GET] https://api.github.com/orgs/{org}/issues`

コードは下記の通りです。

“`typescript
import fetch from ‘isomorphic-unfetch’;
import { Issue, State } from ‘./types/vendor’;

export async function get_issues(
owner: string,
repository: string,
api_token: string,
state: State // `State`の方は`’open’ | ‘closed’ | ‘all’`です。
): Promise {
const response = await fe

元記事を表示

fondesk のメンション機能を Slack Bolt Framework を使っていい感じにした話

# はじめに
この記事は前回取材してもらった記事 [社内部活動でfondeskのカスタマイズ版とSlackチャンネル「TLけいさつ」を作った僕の野望](https://note.com/tambourine_75/n/n2163b752786e) から技術的な要素をもっと細かく書いたものです

# 使用技術
– 言語
– NodeJS
– TypeScript
– FrameWork
– [Slack Bolt for JS](https://github.com/SlackAPI/bolt-js)
– PaaS
– [Goole App Engine a.k.a. GAE](https://cloud.google.com/appengine/?hl=ja&utm_source=google&utm_medium=cpc&utm_campaign=japac-JP-all-ja-dr-bkws-all-super-trial-e-dr-1009137&utm_content=text-ad-none-none-DEV_c-CRE_31471231

元記事を表示

Node.jsとnpmとは？

Nodo.jsは『サーバーサイドのJavaScript』
npm（Node Package Manager）はNode.jsのパッケージを管理するもの。

元記事を表示

パソコン初心者がおうむ返しlinebotを作ってみた話

##はじめに
これは
この記事はこちらの記事を参考してかいています。
詳しくはこちらまでhttps://qiita.com/inoue2002/items/a87df2b520f8b6e37f42
##目次
1 環境構築（必要なものをダウンロード）
>ngrok
node.js
git
VScode

##環境構築(ngrok)
[ngrok](https://ngrok.com/download)をダウンロードします。
　↑こちらからサイトに飛べます。
![5DC24C03-CAE7-4AE0-999D-3AAC0D000A2A.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/763535/d726b334-f324-fbef-b775-5788fd673c41.png)
下の方にこちらがでてきます。あとは解凍するだけ。![6F4250F8-367F-4386-952D-6A3065A0EAC8_4_5005_c.jpeg](https://qiita-image-store.s3.ap-northe

元記事を表示

12月なのでクリスマスソングにノるテンアゲなキーボードliteを実装！【WebHID API】 #iotlt

この記事は[IoTLTアドベントカレンダー1日目](https://qiita.com/advent-calendar/2020/iotlt)です！（先に断っておきますが自作キーボード話ではないです） 先日のIoTLT vol69で話したネタをアップデートした感じです。
関係ないけどついに、この季節がやってきましたか〜 2020年めちゃ早い

> IoTLT vol69 https://iotlt.connpass.com/event/192582/

## テンション爆上がりなキーボードがこちら

Backstageを完全に理解した

# はじめに

[Ateam Group Manager ＆ Specialist Advent Calendar 2020](https://qiita.com/advent-calendar/2020/ateam)の2日目は株式会社エイチームライフスタイル 執行役員CTOの @tsutorm がお送りします。例年マニアックなネタで好評を頂いておりますので、今年もマイペースで行こうと思います。 🙂

一応 完全に理解した[^1] はネタです。

# この記事の概要

* エンジニア向けポータル [Backstage](https://backstage.io/) をうまく使って社内外サービスの “あれどこ / これ誰が見てるの / 詳しいのだれ” を減らせそうだよ
* [Spotify社が作ったOSS](https://github.com/backstage/backstage)でpluggableなreact-appとして見てもとっても勉強になるよ

# Backstageとは

![Backstage logo](https://github.com/backsta

元記事を表示

Steinの仕様メモ 条件にハマる行が複数あっても1行だけ対応。どうやらLookUpみたい

削除するメソッド

今日の

“`javascript
await store
.delete(tranSheet, {
search: { date: today, user_id: event.source.userId }
})
.then(res => {
console.log(res);
});

“`

削除前
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737206/97205d6e-9fcf-f7d2-d112-d0269474bf75.png)

削除後
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/737206/112c8ee7-fd33-0748-6efd-d8d2894ac427.png)

一番上が消えただけ！！笑

同じ日に同じIDの人が参加することはないから、
仕様上は大丈夫だけど、SQLのDELETE文とは違うということを意識して

元記事を表示

User-Agentと私

この記事は、[mediba Advent Calendar 2020](https://qiita.com/advent-calendar/2020/mediba) 2日目です。
[auスマートパス](https://pass.auone.jp/home)のバックエンドエンジニア(BE)、アーキテクト担当をしている北田です。
みんな大好き[User-Agent(以下UA)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/User-Agent)を通して今年を振り返り、来年を展望してみようと思います。

## User-Agentは便利

auスマートパスでは、auブランドで提供している多彩な端末(以下デバイス)をサポートしています。

– 参考: [Android\(TM\) 技術情報 \| 開発者向け技術情報 \| au](https://www.au.com/developer/android/)

そのため、開発プロジェクトではデバイス要件を必ず確認するようにし、デバイス種別も定義していす。

これまでは、Web

元記事を表示

【覚書】YouTube Data API で特定のチャンネルの動画情報を全取得

## 50 個まではこれでいける

“`js
const API_KEY = “”;

const getYouTube = async (api, query, cooldown = 3000) => {
await new Promise((r) => setTimeout(r, cooldown));
return await (
await fetch(
`https://www.googleapis.com/youtube/v3/${api}${Object.entries(
query
).reduce((p, [k, v]) => `${p}&${k}=${v}`, `?key=${API_KEY}`)}`
)
).json();
};

const getVideos = async (channelId, pageToken = “”) => {
const playlistId = (
await getYouTube(“channels”, {
part: “conten

元記事を表示

Ethereum（ブロックチェーン）のスマートコントラクトの処理履歴を取得する方法

# はじめに
この記事では、Ethereumのスマートコントラクトの実行結果の履歴を取得する方法について解説していこうと思います。

自身でdApps（スマートコントラクトを活用したアプリケーション）を作る場合は、スマートコントラクトの処理の状態を確認するために、スマートコントラクトの実行結果を監視したりします。それ以外にも、他者が作ったdAppsの利用状況を把握するといった目的で、スマートコントラクトの実行結果の履歴を取得することもできます。

今回は、dAppsの利用状況を把握するケースを例に解説していきます。

# 環境
この記事では、下記を利用します。
– 言語：Javascript
– 実行環境：Node.js
– 接続先ブロックチェーンノード：Infura

# 利用状況を確認するdApps
今回はRaribleというdAppsを対象にスマートコントラクトの実行結果を取得します。Raribleは、デジタルアート（NFT）を売買できるdAppsで、2020年12月現在、利用量で世界トップクラスのdAppsです。
https://rarible.com/
![スクリーンショット

元記事を表示

Flash Advent Calendar 1日目 – JavaScriptでの開発環境の構築 –

当時は`grunt`が主流で、`gulp`が出始めた頃でした。
JSで本格的な開発をするにあたってどちらで進めるか悩んだのですが
折角だから新しい`gulp`を使ってみようという安易な理由で`gulp`を選びましたw

また、当時はJSでテストを全然書いてなかったので
デグレに苦しめられていて。。。この機会にテスト駆動で開発してみようと思ったのも`gulp`を選んだ理由の一つでもあります。

# 目次
1. Node.jsを準備する
2. gulp & karmaを準備する

# 1 Node.jsを準備する
nvmでNode.jsは管理する
※バージョンが古いですが、2015年位のお話なので、悪しからず

“`linux
cd ~
git clone https://github.com/creationix/nvm.git ~/.nvm
source ~/.nvm/nvm.sh
nvm install v8.9.3
nvm alias default v8.9.3
“`
自分のhomeディレクトリにnvmをcloneして起動
macを起動した時に自動でNode.jsが起動す

元記事を表示

時間起動を試作。ドラクエの宿屋の曲をObnizの圧電スピーカーで流してみた。

Obnizの時間起動のテストとして、ドラクエの宿屋の曲を圧電スピーカーで流してみた。起動したい時間をDB登録しておいて、その時間になったら曲を流す。（曲のチョイスはただの遊び。あと、音飛びはただのテストなので勘弁して。）

元記事を表示

【TypeScript】ObjectのKeyに変数でアクセスする

# 1. はじめに
こんにちは！みなさま楽しいプログラミンライフをお過ごしでしょうか？
最近TypeScriptでのReact開発を勉強しています。

**ObjectのKeyに変数でアクセス**しようとしたときに、
**型付けのところでハマったポイントがあったので**、備忘録として残しておきたいと思います。

| | Version |
|:-:|:-:|
|node.js|14.12.0|
|yarn|1.22.7|
|TypeScript|3.8.3|

# 2. やりたいこと
以下のような、
object2のcategoryのvalueと、object1のkeyが一致するvalueの配列に、object2をまるっとpushしたい。object3のようになるイメージ。

“`javascript
const object1 = {
category1: [],
category2: []
}

const object2 = {
id: 1,
title: “nazeudon”,
category: “category1”,
}

const object

元記事を表示

OTHERカテゴリの最新記事