- 0.0.1. Google Cloud ShellでNode.js最新版の19をインストールする
- 0.0.2. GitHub ActionsでNode.js 12のサポートが終了します
- 0.0.3. DartでExpressを使う(型定義なし)
- 0.0.4. DartからNode.js用のJavaScriptを作成する
- 0.0.5. 【NodeJS(TypeScript)】標準入力から読み取る
- 0.0.6. 再帰的にフォルダパスを取得する(node)
- 0.0.7. 【javascript】とにかくはじめたい
- 0.0.8. Typescript備忘録~Google mapへheatmapを描写~
- 0.0.9. 【2022年10月版】 macOS で node をインストールする
- 0.0.10. Node.js(axios)からQiita APIを利用して指定したユーザーの記事を取得するメモ
- 0.0.11. 【Puppeteer】スクリーンショットを撮る/ページのソースを取得する方法
- 0.0.12. MacにNode.jsをインストール
- 0.0.13. 2022年度のTypeScript製ES Modulesレシピ
- 0.0.14. gRPCのサーバーが空配列を返してくれない
- 0.0.15. gRPCで3テーブル結合したデータを取得する
- 0.0.16. Error: Failed to lookup view “index” in views directory “/Users/***/views”
- 0.0.17. GoとNode.jsでgRPCサーバーとクライアントを作成
- 0.0.18. Daggerを使ってNode.jsのHello worldをCIしてみる
- 0.0.19. node js基礎終わり。
- 1. htmlだと面倒な複数作業が一気に効率化した
Google Cloud ShellでNode.js最新版の19をインストールする
https://shell.cloud.google.com/
Google Cloud Shellでは`nvm`がプリインストールされている。nはインストールされてない
“`bash
nvm install 19
#nvm use 19
“``nvm install latest`みたいに最新のバージョンをインストールする方法はないようだ
“`bash
$ node -v
v19.0.0
“`
GitHub ActionsでNode.js 12のサポートが終了します
## 先に結論だけ
2022年9月22日から、GitHub ActionsでNode.js v12の非推奨化プロセスが始まりました。Node.js v12に依存する`actions/checkout@v2`, `actions/setup-node@v2`をv3に移行しましょう。
## はじめに
この記事は、GitHub ActionsでのNode.js v12サポート終了と、その対処法を共有するためのものです。
### 対象とする読者
– すでにGitHub Actionsを使っている
## サポート終了の告知
いつも通りGitHubで作業をしていると、見慣れない警告がActionsタブに表示されていました。
![](https://www.evernote.com/l/AAlE00XMoR5H3paA6xy77yXo4I2L8Tuv8scB/image.png)
> build (14.x)
> Node.js 12 actions are deprecated. For more information see: https://github.blog/chan
DartでExpressを使う(型定義なし)
# 概要
[DartでNode.js用のJavaScriptトランスパイルができた](https://qiita.com/riafeed/items/e8f36bb68e7f8ed68eaf)ので、Expressを使ったサーバーを**あえて**型定義なしで作成してみる。
なぜならDart用の型定義なんて全く用意されていないし、わざわざ作るのは面倒なので、型定義しないで作ってみてどうしても複雑で必要になってから型定義を作るか考える方針でやるのがいいんじゃないかと。
# コード
とりあえず型定義なしで最低限サーバーとして動くレベルは作れた。
“`main.dart
import ‘dart:js’;
import ‘package:js/js.dart’;
import ‘package:js/js_util.dart’;
import ‘package:node_interop/node.dart’;void main() {
var express = require(‘express’);
var app = express();
const port =
DartからNode.js用のJavaScriptを作成する
# 概要
Dartにはdartdevcやdart2jsといったJavaScriptへのトランスパイラが含まれていますが、どちらも出力されたJavaScriptそのままではNode.jsで実行しようとしてもエラーが出て使えません。
しかしながら、[Dart Sass](https://sass-lang.com/dart-sass)はDartコードからJavaScriptのトランスパイルによりNode.js向けのsassコンパイラの作成に成功しているようです。
この記事はDart SassがどのようにしてNode.js向けのJavaScriptトランスパイルを実現したのか自分なりに探った結果を残しておこうというものです。https://github.com/sass/dart-sass
# 使用パッケージ
### Node.js型定義 node_interop
Node.jsの型定義ファイルです。全部はカバーしていないようです。どれくらいカバーされているかは[GitHub](https://github.com/pulyaevskiy/node-interop/tree/ma
【NodeJS(TypeScript)】標準入力から読み取る
CLIツールを作るときにいつも使っている関数を紹介します。
NodeJSでは、標準の`readline`モジュールを使うことで標準入力から入力を受け取ることができます。## ソース
“`ts
import * as readline from “readline”;export const readFromCli = async (message: string, accept?: (input: string) => boolean): Promise
=> {
while (true) {
const ans = await readFromCli2(message);
if (!accept || accept(ans)) return ans;
}
};const readFromCli2 = async (message: string): Promise
=> {
const readlineInterface = readline.createInterface({ input: process.
再帰的にフォルダパスを取得する(node)
## lib xlsx install
[xlsx(SheetJS)()](https://www.npmjs.com/package/xlsx)
“`bash
npm install xlsx
“`## source
“`js
let XLSX = require(‘xlsx’)
let workbook = XLSX.readFile(‘./xls/ex_-01.xlsx’)
let input_sheet = workbook.Sheets[‘input’]
let input_json = XLSX.utils.sheet_to_json(input_sheet)
// console.log( input_json )
let ab_path = [];function getPath(json, folder_id) {
var tmp1 = json.find((v) => v.FOLDER_ID == folder_id);
if (!tmp1[‘PARENT_FOLDER_ID’]) {
console.log(`###### PA
【javascript】とにかくはじめたい
# はじめに: Javascript がとにかく分からない
何度も挫折している、役立たずで仕事ができなかったのが、このjava script を用いたfrontend 開発です。今回、少し、心を落ち着けてメモしておきたいと思います。
とりあえず、node.js の導入をメモしておきます。
WSL2で作業しています。下記にある通りの内容をなぞっています。
https://learn.microsoft.com/ja-jp/windows/dev-environment/javascript/nodejs-on-wsl
# 内容
## インストール
WSL2 ubuntu20.04 で、下記を行います。パッケージ管理ソフトでnode.js を導入することが推奨
されているようです。ここではnvm が使われていましたが、他にもあるそうです。まぁ面倒くさい。– nvm をインストール
– nvm を利用してNode.js と Node Package Manager (npm) をインストールする“`
$ sudo apt-get install curl
$ curl
Typescript備忘録~Google mapへheatmapを描写~
## Typescriptとは
TypeScriptは、JavaScriptの拡張版言語(2014年~@[Microsoft](https://learn.microsoft.com/ja-jp/training/modules/typescript-get-started/2-typescript-overview))。Javascriptから、静的型付けなどが改善されている。TypeScriptは、JavaScriptとシームレスな関係にあり、TypeScriptで書かれたコードをコンパイルすることで、JavaScriptのコードに変換される。コンパイル時に型チェックなどを行い、開発段階でエラー判定を行える。## Node.js npmとは
Node.jsとはJavaScriptを、サーバーサイドで動作させるプラットフォーム。Webブラウザ上で動作するJavaScriptを、Node.jsを使いサーバー上で動作させることで大量アクセスによる不具合の軽減などが行える。
インストールは以下のホームページから、インストーラーをダウンロードして、実行する。
https://n
【2022年10月版】 macOS で node をインストールする
# はじめに
macOS で node をインストールするメモです。ここでは nvm と nodebrew を使います。
# brew のインストール
まずは brew をインストールします
“`terminal
> /bin/bash -c “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)”
“`# nvm 版
## nvm のインストール
“`terminal
> brew install nvm
> echo ‘export NVM_DIR=”$HOME/.nvm”‘ >> ~/.zshrc
> echo ‘[ -s “$NVM_DIR/nvm.sh” ] && \. “$NVM_DIR/nvm.sh” # This loads nvm’ >> ~/.zshrc
> echo ‘[ -s “$NVM_DIR/bash_completion” ] && \. “$NVM_DIR/bash_completion” # This loads nv
Node.js(axios)からQiita APIを利用して指定したユーザーの記事を取得するメモ
たまに書くけどまとめてなかったので自分用メモとして残しておきます。
axiosを使ってQiita APIをアクセストークン付きで利用します。
## アクセストークンの取得
https://qiita.com/settings/tokens/new
> ![スクリーンショット 2022-10-22 17.15.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/e7566f42-ae84-a867-efe4-6e756b8e5331.png “スクリーンショット 2022-10-22 17.15.25.png”)
スコープのチェックは`read_qiita`だけでOK
> ![スクリーンショット 2022-10-22 17.15.48.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/35387/38fbb336-831f-142c-23ed-e19466ed23b9.png “スクリーンショット 2
【Puppeteer】スクリーンショットを撮る/ページのソースを取得する方法
Puppeteerを使用する機会がありました。
https://github.com/puppeteer/puppeteer
デバッグの際、以下の2つのコマンドがすごく便利だったのでメモしておきます。
スクリーンショットを撮る
“`
await page.screenshot({ path: ‘screenshot.png’ });
“`ページのソースを取得する
“`
const bodyHandle = await page.$(‘body’);
const html = await page.evaluate((body) => body.innerHTML, bodyHandle);
console.log(html);
“`
MacにNode.jsをインストール
# 環境
“`
% sw_vers
ProductName: macOS
ProductVersion: 12.6
BuildVersion: 21G115
%
% brew -v
Homebrew 3.6.6
Homebrew/homebrew-core (git revision c6c9e681ea6; last commit 2022-10-19)
“`# インストール
## 1. nodebrew をインストール
“`
% brew install nodebrew
Running `brew update –auto-update`…
==> Auto-updated Homebrew!
Updated 1 tap (homebrew/core).You have 1 outdated formula installed.
You can upgrade it with brew upgrade
or list it with brew outdated.==> Downloading https://ghcr.io/v2/homebrew/cor
2022年度のTypeScript製ES Modulesレシピ
## はじめに
この記事は、2022年におけるTypeScript製ES Modulesの作成方法を解説、共有するためのものです。
node.jsにおけるCommonJSの歴史は長く、それに関する記事が大量にあります。どの設定がCommonJSに関わり、どの設定がES Modulesに関わるのかを読み解くには労力がかかります。この記事ではPure ESM作成の最小限構成を通して、ES Modulesの設定を整理します。
### 想定する読者
– JavaScript、TypeScriptの開発経験者
– node.jsおよびnpmの基礎的な知識がある
– CommonJSのサポートは考えず、新規にPure ESMのパッケージを開発したい### 想定する環境
– node.js v16.18.0 ~ v18.11.0
– TypeScript v4.8::: note warn
ES Modulesに関わる環境は頻繁に更新されます。この記事は2022/10/15時点での環境設定をまとめたものです。
:::node.jsのメジャーバージョンが更新された場合、この記事の
gRPCのサーバーが空配列を返してくれない
サーバー側から送信されているはずのオブジェクトのキーが排除されていたので原因を調べた。
そもそも LEFT JOIN を使っていたということもあり、レコードがない場合でも下記のようにオブジェクトを返していたので、空の配列を返すことにした。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/641690/cdd4a08d-739f-04eb-1cf7-9ea68dde865e.png)
## SQL
CASE WHEN THEN を使って値がない場合は空の配列を返すという条件を追加。
“`sql:sql
SELECT
g.id, g.name, g.orignal_extra_fields, CASE WHEN g.key is NULL THEN JSON_ARRAY() ELSE JSON_ARRAYAGG((JSON_OBJECT(‘key’, g.key, ‘title’, g.title, ‘gameId’, g.gameId, ‘adminId’, g.adminId,
gRPCで3テーブル結合したデータを取得する
gRPCで少し複雑なJSONを取得する方法に時間がかかったのでメモ。
## 環境
* Window10
* Go
* Node.js
* MYSQL8.0## JSON
最終的に下記のようなJSONが欲しい。“`json:game.json
{
“id”: 1,
“name”: “BLACK JACK”,
“tables”: [
{
“key”: “cf955e95-360b-43dd-bc0f-2d4569604a13”,
“title”: “Hello world”,
“gameId”: 1,
“adminId”: 3,
“limit”: 5,
“extraFields”: {
“turn”: “”
},
“players”: [
{
“i
Error: Failed to lookup view “index” in views directory “/Users/***/views”
Error: Failed to lookup view “index” in views directory “/Users/***/views”
`Node.js` + `Express` でテンプレートエンジンを`ejs`で設定するとエラーとなった
## フォルダ構成
エラー時のappフォルダ以下の構成
“`
├── package.json
├── src
│ ├── index.ts
│ ├── routes
│ │ └── index.js
│ └── views
│ └── index.ejs
├── tsconfig.json
├── yarn-error.log
└── yarn.lock
“`## 解決した方法
`app.set(‘views’, __dirname + ‘/views’)`を追加“`javascript:index.ts
import express from ‘express’;const app: express.Express = express();
app.set(‘view engi
GoとNode.jsでgRPCサーバーとクライアントを作成
## ディレクトリ構成
“`:ディレクトリ
root/
├ server/
│ ├ helloworld/
│ └ main.go
└ proto/
└ helloworld.proto
“`“`protobuf:helloworld.proto
syntax = “proto3”;option go_package = “./”;
package helloworld;
// The greeting service definition.
service Greeter {
// Sends a greeting
rpc SayHello (HelloRequest) returns (HelloReply) {}
}// The request message containing the user’s name.
message HelloRequest {
string name = 1;
}// The response message containing the greetings
message HelloRep
Daggerを使ってNode.jsのHello worldをCIしてみる
## Daggerとは
CICDというとGithub Actions、CircleCI、AWS CodeBuildのようなクラウドサービスを利用するケースが多いと思いますが、Daggerは、ローカル環境でも動作させることができるCICDツールになります。Daggerを使う利点は以下のようなことがあげられます。– ローカル開発で動かすことができるため、開発者が簡単に試すことができる
– CICDサービス上でも動作することができるため、Daggerで処理を共通化することでロックインを減らせますhttps://github.com/dagger/dagger
## インストール
OSによって手順が違うので以下の公式ドキュメントを参考にインストールしてください。
https://docs.dagger.io/install/
## Hello worldで試してみる
早速、Hello worldでDaggerを体験してみましょう。今回使用する開発言語はNode.js(TypeScript)にします。Dagger自体は特定の開発言語に依存するツールではありません。公式でもj
node js基礎終わり。
htmlだと面倒な複数作業が一気に効率化した
プログラミングチュートリアルさんというyoutubeに動画を載せている方がいて簡単なお天気アプリの作成からnodejsのデプロイ方法を載せていたので復習もかねて見てみる。楽しそう。早く実際に何か物を作りたい。
話はずれるが、よくapp storeやgoogle playで見かけるいわゆる“くそげー”の制作に関する面白い話を聞いた。映画が理論的に「何時間何分の時にこういう行動を起こす」と人は最も感動するといった具合に、ある程度くそげーも論理化されて作成されてきている話を聞いたので、一度作成してみたい。日本人向けに作るならappstoreで、上位にあるゲームのプログラムを覗いてマネするのがよさそう。
姿勢が悪いので、自分の姿勢を強制させる装置を作ったら逆に肩が凝りまくった。
## これは将来が心配だ
皆さんは、姿勢が良いほうですか?
私は、最近どんどん悪くなっていることを感じています。
危機感を持っているけど、気が付けば猫背になっています。もう猫になりたいです:smiley_cat:そんな中、会社の朝礼のラジオ体操にて腰に電撃が走ってしまい、さらに姿勢をよくすることを余儀なくされてしましました:sob:
ですので、手元にあるもので姿勢を正せるものを作れないか?と考えました。
いや、正すというよりも矯正させるものを作れないか?**つまり、姿勢矯正装置です:exclamation:**
## 目指すもの
姿勢の状態を検知して、姿勢が悪くなったと判断したら何かで知らせるものを作ることにしました。
できれば、**持ち運び可能**でどこでも使用できるものにしたいのと、どこでも使えることを前提に周りに迷惑が掛からないよう音とか光ではない知らせ方を模索したいなと思いました!## 姿勢矯正装置の完成デモ
試行錯誤した末にできた装置です。
どこにでも持ち運べるということで、**帽子に装置をつけることにしました。**### 仕組み
帽子に付いて