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

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

Node.js 開発環境構築

# はじめに
Node.js 未経験者が初めて開発環境を構築したときの備忘録です。
Homebrew や git はインストール済みの前提です。

## 環境
“`
macOS Catalina version 10.15.5
Homebrew 2.4.2
git version 2.22.0
fish, version 3.0.2
“`

# nodenv
## anyenv
こちらはnodenv以外にもあるpyenv等、様々なenv系のツールをまとめてくれるもの。
今回はこちらを経由して nodenv をインストールする。
https://github.com/anyenv/anyenv

インストール

“`sh
$ brew install anyenv
“`

初期化します。

“`sh
$ anyenv init
# Load anyenv automatically by adding
# the following to ~/.config/fish/config.fish:

status –is-interactive; and source (any

元記事を表示

ルートディレクトリ(/)とホームディレクトリ(~)のちゃんとした理解

ものすごい細かいことだけど、パスの指定方法での`~`(チルダ)と`/`(スラッシュ)の理解が曖昧で気持ち悪い思いをしたのでメモ。

`/`: ルートディレクトリ
`~`:今のユーザーのホームディレクトリ
`~taro`: taroというユーザーのホームディレクトリ

## スラッシュの意味合い
ルートディレクトリの`/`と、各ファイルやディレクトリの前につく`/`は意味合いが違っている模様。

– 前者:ルートディレクトリそのもの
– 後者:ディレクトリを区切るもの

なので、一見ルートディレクトリのせいで「ディレクトリとは末尾にスラッシュが付いているもの」という勘違いを(少なくも筆者は)しちゃうが、`hogehoge/`がディレクトリなのではなく`hogehoge`がディレクトリなのだ。ホームディレクトリを`~/`だと思ってしまっている人は多いのではないか?

## ~ユーザー名
また`~taro`でtaroさんのホームディレクトリを指定できるのは初耳で、結構ググったけどこれについて深く語っている記事は見当たらなかった。こういう指定の仕方があるんですね。

今すぐ使いたいスプレッド構文、”Three-dots” Tip 集

Screen Shot 2020-06-17 at 6.40.18 PM.png

こんにちは。また転職しますので、以前仕事で使っていたアカウントから切り離して新しいアカウントからこれを書いています。(なので現在フォロワー0からの再出発!)

この記事は10日ほど前に私が [Dev.to](https://dev.to/girlie_mac/spread-syntax-three-dots-tricks-you-can-use-now-aob) で投稿したものと同じ内容なのですが、Must-read に選ばれるほどの好評でしたので日本語でも書いてみることにしました。

ES6 (ECMAScript 2015, the 6th edition) が標準化されて5年経ちました。この通称 ES6 は多くの新機

元記事を表示

Webアプリが作れるようになるまで【Heroku,Node.js使用】

# 注意
記載途中です。内容に大幅な変更もあると思います。
(私自身完全に理解できていない状態での記事作成になるため。)

# はじめに
HTMLやJavascript、C#もしくはjavaは分かるけど、サーバーをどう構築すれば良いか分からないレベルの人なら参考になると思います。
(恐らくSES事業を経験してると、そのレベルにはなると思います。)

具体的には、docker、AWS、Heroku、node.js、Nginxの辺りが完全に理解できていないレベルの人です。

Gitが分からない人は、ソースツリーを使用して、コミットプッシュマージクローンプルリク辺りを理解するところから始める方が良いと思います。とりあえず、下記サイトを参考にどうぞ。

[SourceTreeの使い方 GitHubとの連携方法](https://ics.media/entry/15195/)

# 実施内容

## Herokuに登録
まずはHerokuが無料でDB使えるということが分かったので、下記サイトを参考にしつつHerokuに会員登録しました。

[【HEROKUとは】これを読めばOK!デプロイの仕方ま

元記事を表示

mongoose で docker でたてた MongoDB に接続するのにはまった話

## はじめに

Python でせっせと実装していたものが、“`npm install“` すれば、あっという間に出来てしまうことを知り、少し落ち込んだりもしたけど、Node.js で書き直している私です。Node.js は超初心者です。

開発は1人でやっていて、まだ試しに作ってるだけの状態で、Mac にあれこれ DB をたてるのが嫌なので、DB だけ docker でやっちゃおう!とやってみたところ、ちっとも繋がりませんでした。

mongoose の Top ページ ([ココ](https://mongoosejs.com/))に書いてある

“`javascript
const mongoose = require(‘mongoose’);
mongoose.connect(‘mongodb://localhost:27017/test’, {useNewUrlParser: true, useUnifiedTopology: true});

const Cat = mongoose.model(‘Cat’, { name: String });

const kit

元記事を表示

【Node.js入門】ファイル&jsonファイルI/Oをやってみた♬

常識だからだと思うけど、Node.js始めたのでファイル入出力やろうとすると、割と動かないし、記事がもう一息なので、自分で整理しておこうと思う。
今回は、テキストファイル書き出し/読込とJsonファイルの書き出し/読込をやろうと思う。
参考は以下のとおり
【参考】
①[Node.jsを使ったやっつけのファイル操作](https://qiita.com/wifeofvillon/items/b307306eed08d8a7b4f4)
②[[Node.js]ファイルの作成、書き込み、追記をする](https://tech.chakapoko.com/nodejs/file/write.html)
③[JSのObjectをforEachで処理する方法](https://qiita.com/nantekkotai/items/6c603b40ac2264e9f6f6)
###やったこと
・テキストファイル書き出し/読込
・Jsonファイル書き出し/読込
###・テキストファイル書き出し/読込
これは、参考①で取り上げているので、まんま動くかなと思ったが、少し違うような気もしたので、参考②を見つ

元記事を表示

Node.jsのコードを定期実行する(crontabを利用)

# これまでのおさらい
– [Raspberry piにNode.jsをインストールする](https://qiita.com/takashi53/items/69d4395c70d76ddbb0ab)
– [Node.jsでrequestモジュールを使ってHTTPリクエストを実行する](https://qiita.com/takashi53/items/76c5987b73b76ba9ea96)
– [Node.jsでIFTTTのWebhooksを使う(requestモジュール利用)](https://qiita.com/takashi53/items/7f1679c52edd741c3ed8)
– [Node.jsからobnizでBME280(気温、湿度、気圧)センサーを動かす](https://qiita.com/takashi53/items/49ce6686df961df9001e)

# 今回のお話
– node.jsをcrontabで定期実行する。

前回書いたコードは、「BME280センサーの値を読み取り、Google スプレッドシートに書き込む」というものでした。

元記事を表示

「Cannot extend an interface ‘NodeJS.EventEmitter’.…」の解決方法メモ(vue-cli4+TypeScript+Electron)

# はじめに
vue-cli 4とElectronでデスクトップアプリケーションを開発しようとした際に、@types/nodeのEventEmitterに関するエラーが発生した。無事解決できたのでメモとしてまとめる。

# 環境・バージョン
Vue:2.6.11
Vue CLI:4.4.6
@types/node:(14.0.14)→12.6.9(本記事の解決策)
Electron:9.0.0

# 発生した事象
[“vue-cli3 + TypeScript + Electronでアプリを開発する”](https://qiita.com/paragaki/items/e7d3a43b50233af96424)を参考に(ほぼコマンドや設定そのままで設定)プロジェクトを作成すると、最後のアプリケーションビルドの段階で以下のようなエラーが発生した。

“`
$ npm run electron:build
~~~省略~~~
ERROR Failed to compile with 19 errors
~~~省略~~~
ERROR in C:(作業ディレクトリ)/node_modules

元記事を表示

【個人メモ】Express環境ハンズオン

完全に個人用メモです。

1. Node.jsとnpmがinstall済みであることを確認する
node -v, npm -vコマンド実行

2. expressのインストール
作業ディレクトリでnpm initを実行してpackage.json作成
npm install express express-generator –save

3. expressアプリケーションの雛形作成
./node_modules/.bin/express –view=pug sample

4. アプリ立ち上げ
cd sample
npm install
npm start
ブラウザからhttp://localhost:3000/につなぐと「Welcome to Express」が表示される。

元記事を表示

npm install時のエラー解決 No Xcode or CLT version detected!

# 環境
macOS Catalina 10.15.4
npm 6.14.5

以下のエラーが出た時の解決

“`.shell
No receipt for ‘com.apple.pkg.CLTools_Executables’ found at ‘/’.

No receipt for ‘com.apple.pkg.DeveloperToolsCLILeo’ found at ‘/’.

No receipt for ‘com.apple.pkg.DeveloperToolsCLI’ found at ‘/’.

gyp: No Xcode or CLT version detected!
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1
gyp ERR! stack at ChildProcess.onCpExit (/Users/izumi/.anyenv/envs/nodenv/versions/14.3.0/lib/node_modules/npm/node_m

元記事を表示

TypeScript の event を良い感じの type safety に実装する

# TypeScript における代表的な event 実装方法
TypeScript は言語仕様としては event 機能を持っていません。
なので class に event を実装する場合、自前で実装するか [EventEmitter](https://www.npmjs.com/package/events) のような補助クラスを使うことになりますが、TypeScript ですのでやはり type safety に実装したいところです。
type safety に実装する代表的な方法は次の通りです。

* EventEmitter + 型定義 (event 一つ一つに特化した on(), once(), off(), removeAllListeners() あたりのメソッドを定義していく)
* [StrictEventEmitter](https://www.npmjs.com/package/strict-event-emitter-types) を導入する
* [TypedEvent](https://typescript-jp.gitbook.io/deep-dive/

元記事を表示

NestでTypeORM環境を構築してサンプル実装(CRUD+トランザクション+ロック)してみる

# 背景

前回は純粋なTypeORM環境をCLIで構築してみましたが、TypeORMはNestというフレームワークのORMとして利用されているとのことを知ったので、今度はNestでTypeORM環境を構築してみようと思う。
https://qiita.com/yusuke-ka/items/195e6bba4f21a659b424

# Nest環境の構築

前回同様、DBは以前インストールしたpostgresql(windows)を利用する。
https://qiita.com/yusuke-ka/items/448843020c0406363ba5#%E6%BA%96%E5%82%99

pgadmin4でデータベースインスタンスだけ作っておく。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/643184/f0e40bd7-470e-94a0-87dc-227a7d001941.png)

データベース名(“nest_typeorm”とした)を入力して作成。

ここからは、

元記事を表示

令和元年? JavaScript International Date フォーマットで和暦を表示させるには (再)

*この記事は 平成最後の日、2019年4月31日に別のアカウントからポストしたものをこちらに移行した記事です。今更感があるかもしれないですが ECMA 402 について知るのは悪くないと思います〜。*


令和元年おめでとうございます ?

さて、今回は新年号にふさわしく International Date format で和暦を表示する方法について書いていきたいと思います。

JavaScript `Intl.DateTimeFormat` オブジェクトを使えば、言語とローケルに特化した日付と時刻のフォーマットが可能になります。

[The ECMAScript Internationalization API](https://tc39.github.io/ecma402/)(国際標準化 API) は、日付と時刻そして貨幣の表示のローカライズを JavaScript で可能にするために作られたもので、2010 年に初版が発行されて現在は第6版が最新です。この API は最新のブラウザではすでにサポート済です。(参照 [Can I use](https://caniuse.c

元記事を表示

TypeScriptのコンパイルからブラウザ反映までを自動でやりたい

# 目的
TypeScripはそのままでは実行できないので、コンパイルしてJavaScriptに変換しなければならない。
またローカルサーバで開発している場合、コンパイルされる毎にブラウザの更新もかけないといけない。
めんどい!!—>自動化したい!!!

# 環境
環境
windows10
node.js v12.13.0
npm v6.12.0
typescript v3.9.5

今回はnode.jsを使ってTypeScripがインストールされている状態を前提とする。
環境構築にはこちらも参考に。
・[TypeScriptのインストールから実行まで](https://qiita.com/eiji-noguchi/items/8c1d3741ac9f2857b230)

初期フォルダ構成はこんな感じ。

“`
TS_Project
├─ node_modules
├─ app.ts
├─ index.html
├─ package-lock.json
└─ package.json
“`

# コンパイルの自動化
TSファイルに変更があった場合、自動でコン

元記事を表示

TypeScriptのインストールから実行まで

# 目的
細かい設定は後回しにしてとりあえずTypeScriptをインストールして実行する。

# 環境
windows10
node.js v12.13.0
npm v6.12.0
typescript v3.9.5

今回はnode.jsを使ってTypeScriptのインストールを行うため、先にnode.jsをインストールしておく。
node.js(公式サイト) -> https://nodejs.org/ja/

# TypeScriptのインストール準備
TypeScriptのプロジェクトを作りたいディレクトリを初期化する。

“`terminal:コマンドプロンプト
npm init
“`

初期化時に色々設定を聞かれるがすべてデフォルトでOKなので、Enter連打。
初期化が完了すると、`package.json`が作られる。

“`
TS_Project
└─ package.json
“`

# TypeScriptのインストール
次に、package.jsonと同じディレクトリで次のコマンドを実行する。

“`
npm install typescrip

元記事を表示

Gulpを使ってScss/Sassをコンパイルする方法

ゆっくり見て行ってください!(*’’*)

# 自己紹介

HAL大阪四年生4年IT学科Web開発専攻所属(現2020年)

# 記事について

Sassのコンパイルをいちからやろうと思って遊んでいたら楽しくなってしまったのでまとめておきます
難しいお話は私もわからないので参考記事にて閲覧ください!!

***

↓下記から記事開始

***

# Gulpとは
gulpはNode.jsをベースとしたビルドシステムヘルパーです。

gulpを使えばさまざまな作業を自動化することができます。
gulpの一番の特徴はサイトのトップページで「ストリーミングビルドシステム」と自ら名乗っているように、ファイルの処理をストリームで行うというところです。

この特徴によって複雑なタスクも細かくカスタマイズして書くことができます。

## Gulpを使うところ
今回の記事ではSass/Scssをコンパイルする為に使用しています。

## 実行環境の構築とgulpのインストール

### 【AWS;Lambda入門】第三弾;Linebotなじゃんけんゲームで遊ぶ♬

今回は、apigatewayを利用したnode.js@Lambdaでじゃんけんゲームを作ってみた。
環境構築やプログラムなどは、全て以下の参考①~④を参考に進めた。
だいたい、最初の①と②でLinebotが動く。そして③と④でLambda版のLinebotが動いた。筆者も言っているように感動ものである。
ちなみに、ほぼ1日でLinebotが動くようになった。
したがって、コードのほとんどは参考のまんまであることをお断りしておきます。
【参考】
①[LINEBotをみんなで作ろう〜環境構築編〜【GWアドベントカレンダー1日目】](https://qiita.com/inoue2002/items/a87df2b520f8b6e37f42)
②[LINEBotをみんなで作ろう〜おうむ返しbotを作ろう編〜【GWアドベントカレンダー3日目】](https://qiita.com/inoue2002/items/dcf40d5ebfe2454796fa)
③[LINEBotをみんなで作ろう〜レイヤーとAPIgateway設定編〜【GWアドベントカレンダー7日目】](https://qiita.

元記事を表示

nodejsを使ってウエブサーバーを作ろう – majidai

[![Build Status](https://travis-ci.com/dakc/majidai.svg?branch=develop)](https://travis-ci.com/dakc/majidai)[![npm](https://img.shields.io/npm/v/majidai.svg)](https://www.npmjs.com/package/majidai)[![GitHub license](https://img.shields.io/github/license/dakc/majidai.svg?style=popout)](https://github.com/dakc/majidai/blob/master/LICENSE)
# majidaiとは
majidaiとは、nodejs用のWebフレームワークです。
サードパーティーライブラリが使っていないため非常に軽いです。
データ量 < 50KB

#### インストール
[nodejs](https://nodejs.org/en/dow

元記事を表示

S3に保存されたwavファイルをLambdaでGoogle Cloud Speech-to-Textを使って文字起こしする

# S3に保存されたwavファイルをLambdaでGoogle Cloud Speech-to-Textを使って文字起こしする
## はじめに
以下リンク記事を参考に、S3に保存されたwavファイルをLambdaでGoogle Cloud Speech-to-Textを使って文字起こしをやってみたのでまとめておきます。

[S3 + ElasticTranscoder + Lambda + Google Cloud Speech-to-Text APIで、動画の音声を自動でテキストにする](https://qiita.com/inoue37/items/e526cc8d389808863943)

?完全なる上位互換なので、私の記事は読む必要ないかと。

## 1. S3の作成
特別なことはしないです。
1-1. 適当なバケット名、リージョン(私は東京)で次へ
1-2. オプションの設定はノータッチ
1-3. アクセス許可の設定もノータッチ(パブリックアクセスをすべてブロック)
1-4. 確認

## 2. ローカルでGoogle Cloud Speech-to-Text APIをイン

元記事を表示

コンセプト | webpack

https://webpack.js.org/concepts/ の日本語訳。

## コンセプト

webpack は、最新の JavaScript アプリケーションの為の静的モジュールバンドラーです。
webpack がアプリケーションを処理するとき、プロジェクトが必要とするすべてのモジュールを整理して、 1 つ以上のバンドルを生成する [依存グラフ](https://webpack.js.org/concepts/dependency-graph/) を内部的に構築します。

JavaScript モジュールと Webpack モジュールの詳細については、 [こちら](https://webpack.js.org/concepts/modules) をご覧ください。

バージョン4.0.0以降、 webpack はプロジェクトをバンドルするための構成ファイルを必要としません。
しかし、開発者のニーズに合わせて設定することができ、 [驚くべきカスタマイズ性](https://webpack.js.org/configuration) を有しています。
よりよく合うように柔軟に設定

元記事を表示

OTHERカテゴリの最新記事