- 1. Reactのコンテナを作成してみよう!
- 2. 住所を入力するとCesiumでピンを立てるアプリ
- 3. @shopify/shopify-api: Cannot read property ‘initialize’ of undefinedの解決方法
- 4. nodeのバージョンを簡単に切り替えることができるツール「n」のよく使うコマンドまとめ
- 5. ターミナル起動時に「N/A: version “N/A -> N/A” is not yet installed.」のエラー
- 6. twitter api v1からv2へ
- 7. Astro の打ち上げ ??
- 8. Visual Studio Code のデバッグコンソールで「利用可能なデバッガーがありません。’variables’ を送信できません」の対処
- 9. AlmaLinux OS 8にNode.js 18をインストール(AppStream)
- 10. GraphQL(TypeGraphQL) における認可の実装例
- 11. JSのツール管理ライブラリVoltaとは
- 12. 「Node.jsの使用開始」チュートリアルで S3 の体験
- 13. Embedded Node-REDのカスタムノードについて
- 14. Node.js/Prisma(ORM)/SQLite コネクションエラー、タイムアウトする問題の対策
- 15. PuppeteerでUIテストを試してみた
- 16. nodenv installで yarn command not found になった時の対処法
- 17. 【初心者向け】AWS OpsWorksでSample Stackを使用し、アプリケーションの実行環境をサクッと作ってみた。
- 18. 文化祭のWEBサイトとチケット発券システムを作った話
- 19. npm-run-allで複数の処理を実行する メモ
- 20. MacでSQL Serverを動かしてsqlcmdとNode.jsからアクセスしてみる(2022)
Reactのコンテナを作成してみよう!
## 前提
– Dockerコマンドについてある程度理解している## はじめに
– Dockerfile
– docker-compose.ymlを作成します
## 必要なファイルの作成
### Dockerfile
今回はNodeJSの14.17.1のDocker imageから作成します
今回はワークディレクトリをcodeにします
“`Dockerfile:Dockerfile
FROM node:14.17.1-alpine
WORKDIR /code
“`### docker-compose.yml
“`docker-compose.yml
version: ‘3.8’
services:
# サービス名はfront
front:
# コンテナ名はフロント
container_name: front
# ビルドコンテキストはカレントディレクトリ
build:
context: .
dockerfile: Dockerfile
# カレントディレクトリ内の全てのファイル・フォルダをcode
住所を入力するとCesiumでピンを立てるアプリ
# はじめに
ブラウザで住所を入力するとCesiumの地球儀にピンを立てるアプリを作った。住所を入力するとCesiumの地球儀にピンを立てるアプリを作りました。 pic.twitter.com/mMAGHcChpW
— ダンブル扉 (@danburutobira) November 20, 2022
>Cesium とは?
そもそもCesiumとは何かという問いに誤解を恐れずに答えるなら、Web
@shopify/shopify-api: Cannot read property ‘initialize’ of undefinedの解決方法
# はじめに
Shopifyの[公式ライブラリ](https://github.com/Shopify/shopify-api-node)を使いOAuth認証・認可→アクセストークン取得をしようとしたとき、***公式ドキュメント***通りでは動かなかったので、その対処法を残しておきます。# 環境
– **実行環境**
– OS:Windows 11 Home 21H2
– 言語
– Node.js
– version: 16.11.1
– npm
– version: 8.0.0
– 使用しているライブラリ・フレームワーク
– Express
– version: 4.18.1
– @shopify/shopify-api (shopify-api-node Shopify公式のライブラリ)
– version: ^5.0.1# 解決法だけ知りたい方
“`js:index.js
//
nodeのバージョンを簡単に切り替えることができるツール「n」のよく使うコマンドまとめ
## 概要
「n」というnodeのバージョン管理ツールが便利だったのでよく使うコマンドをまとめてみた。
https://github.com/tj/n
## nのインストール
### npmでインストールする
“`shell
npm i -g n
“`下記をターミナルで実行し、バージョンが出力されれば成功
“`shell
n –version
# => v9.0.1
“`### Homebrewでインストールする
“`shell
brew i n
“`## インストール可能なnodeのバージョンを確認する
### 最新安定版(LTS)を確認
“`shell
n –lts
“`or
“`shell
n –stable
“`### 最新版を確認
“`shell
n –latest
“`### 最新の20件を確認
“`shell
n ls-remote
“`### 全て確認
“`shell
n ls-remote –all
“`## nodeのインストール
### 特定のバージョンを指定してインスト
ターミナル起動時に「N/A: version “N/A -> N/A” is not yet installed.」のエラー
### 概要
zshターミナル起動時に、下記文言のエラーが出たときの対処方法
(デフォルトのnodeバージョンの指定し直し)
(私の場合は、前触れなく急にエラーが発生。。。?)### エラー
“`:ターミナル起動時
N/A: version “N/A -> N/A” is not yet installed.You need to run “nvm install N/A” to install it before using it.
“`
この状態だと`node`コマンドが使えない。。。(`command not found: node`)
(指示通り`nvm install N/A`コマンドを実行しても解消せず)### 対処方法
下記コマンドをターミナルで実行するのみ
“`shell:ターミナル
nvm alias default デフォルトで利用したいnodeバージョン
# 例) nvm alias default v16.18.1
“`
※利用するバージョンは`nvm ls`コマンドで確認### 対処前後
twitter api v1からv2へ
# はじめに
いやー、大変だった。
今まで、twitter api v1.1で[ang12-twitter](https://github.com/hideume/ang12-twitter)というのを作成していたのだが、これをtwitter api v2に移植しようかといろいろやって、今日、まあまあ筋道が見えたというご報告# twitter api v2とは
twitter developerにいけば、説明がある。v1だと、検索結果が10個ぐらいしかとれなくなってしまったので、しかたがないので移植を行っているということ。
v1に比べて、restを利用できる回数が多いということだ。# Oauth2.0 with PKCE
v2でめんどくさいのが、認証で、全ての機能を使いこなすには、Oauth2.0 PKCEをクリアするアプリを作らないといけない。ただ、まだ、この認証部分は作っていない。認証の中でもbearer_tokenを使えば、一部のRESTは使用することができる。(app onlyともいう)
これが、わかるまでかなりかかった。
このbearer_tokenはtwit
Astro の打ち上げ ??
## 手順
### 1. `docker-compose.yml` を作成
“`yml:docker-compose.yml
services:
node:
image: node:lts-alpine
volumes:
– ./project/:/project/
working_dir: /project/
ports:
– “3000:3000”
tty: true
# command: ‘npm run dev — –host 0.0.0.0’“`
### 2. コンテナの起動 ?
“`sh
docker compose up
“`### 3. Astro のインストール
“`sh
docker compose exec node npm create astro@latest .
“`実行後、↓ 質問があるので、
“`
Need to install the following packages:
create-astro@1.2.3
Ok to proc
Visual Studio Code のデバッグコンソールで「利用可能なデバッガーがありません。’variables’ を送信できません」の対処
# 背景
Node.js を学び始め、Visual Studio Code でデバッグをし始めたところ、下のようなエラーが出た> 利用可能なデバッガーがありません。’variables’ を送信できません
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/159306f9-2b97-2647-cb0f-cc793c510312.png)なんだこれ?となったので、その解決法を記録
# 理由
単に、built-in Node.js Debugger が停止してしまっているので、Object として Console.log(Object) とした場合の ‘variables’ が表示出来ない。ってことだった。Debug 中にコード上で、Object を Hover Over させるのと同様ってことですね。
# 回避策
console.log(Object) をした後 ~ 終了 までの間のどこかに Brake Point を設定しておくことで、
デバッグコンソールにオブ
AlmaLinux OS 8にNode.js 18をインストール(AppStream)
# はじめに
Application Stream(AppStream)を利用してAlmaLinux OS 8にNode.js 18をインストール
## サポート
本手法で導入した場合、[Red Hat Enterprise Linux Application Streams Life Cycle \- Red Hat Customer Portal](https://access.redhat.com/support/policy/updates/rhel-app-streams-life-cycle)より、2025-04がEOLだと思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。## LOG
### インストール
“`shell-session
# cat /etc/redhat-release
AlmaLinux release 8.7 (Stone Smilodon)# yum module install -y nodejs:18
… 略
“`### 各種確認
“`shell-session
# which
GraphQL(TypeGraphQL) における認可の実装例
# 概要
[Apollo Server](https://www.apollographql.com/docs/apollo-server/v3) と [TypeGraphQL](https://typegraphql.com) を使用して GraphQL API サーバを構築しました.
その中で, 下記の通り認可の実装をする必要がありました.– Administrator は全てのリソースに対してアクセスできること
– Owner は自己所有のリソースに対してのみアクセスできること
– 自己所有でないリソースにアクセスできないことサンプルコードを通して, TypeGraphQL における認可の実装例を紹介します.
# サンプルコード
## 全体像
“`bash
.
├── src
│ ├── authorizations
│ │ ├── authChecker.ts
│ │ ├── Role.ts
│ │ └── RolePolicy.ts
│ ├── schemas
│ │ ├── models
│ │ │
JSのツール管理ライブラリVoltaとは
# Voltaとは
[公式](https://volta.sh/)は手間のかからないJavaScriptのツール管理システムと謳っています(The Hassle-Free JavaScript Tool Manager)。
主なユースケースとしてはNode、npmのバージョン管理です。Voltaには三つの宣伝文句があります。
⚡高速
あらゆるJSツールを素早くシームレスにインストールし、実行することができます。VoltaはRustでビルドされ、軽快な静的バイナリとして出荷されます。⚡信頼できる
プロジェクトに参加する全員が同じツールを使えるようにし、ワークフローに支障をきたさないようにします。⚡ユニバーサル
パッケージマネージャ、Nodeランタイム、OSに関係なく、volta installという1つのコマンドで済みます。他より早くて、コマンド一つでプロジェクト内で共有できて、OSに依存ないようなツールということです。
# Voltaのセットアップ
Voltaのセットアップは簡単にできます。[Getting Started](https://docs.volta.s
「Node.jsの使用開始」チュートリアルで S3 の体験
# 背景
業務でAWS に関わることになったので、必要そうな技術を試行中そもそも、Node.js から理解していなかったので、まずはそれを理解しつつ、以下をやってみることに
https://docs.aws.amazon.com/ja_jp/sdk-for-javascript/v3/developer-guide/getting-started-nodejs.html
# 色々やってなんとなく把握したこと
– NVM: Npm の Version 管理。Node.js 使うなら入れたほうがよさげ
– [windows 版はここで](https://github.com/coreybutler/nvm-windows)
– npm: Node.js の Package 管理。
– [package.json](https://docs.npmjs.com/cli/v6/configuring-npm/package-json): これを元に bulid してくれる感じ?
– dependencies: 本番用
– devDependencies: 開発用
Embedded Node-REDのカスタムノードについて
## 要約
Embedde Node-REDのユーザディレクトリは絶対パスで指定しましょう。## Headless Node-REDが欲しい
Node-REDの実行時にはエディタ等のWeb UIは不要なのでいわゆるHeadlessなモードが欲しかった。軽く調べたところ、[httpAdminRootにnullを設定する](https://discourse.nodered.org/t/headless-node-red-instance/29053)というのが見つかったが、Webサーバ自体は起動してしまうようなので求めているものとは違った。## Embedded Node-RED
[Node-REDのソース](https://github.com/node-red/node-red/blob/master/packages/node_modules/node-red/lib/red.js#L54)を眺めていると、initの第1引数にnullを指定してWebサーバを渡さないことを想定しているような書き方だった。なので以下のガイドを参考にHeadlessなEmbedded Node
Node.js/Prisma(ORM)/SQLite コネクションエラー、タイムアウトする問題の対策
## この記事の概要
Node.js CLIプログラム 開発中に遭遇した問題とその対応内容を記録する。
DBレイヤーに使用した Prisma と SQLite3 の組み合わせで発生。開発元のIssuesでは、ざっくり昨年10月頃以降に同様の項目がある。
ワークアラウンドは判ったが、現時点までに本質的な修正はないように見えた。## 何が起きた?
よくわからないが、処理がエラーで中断する。
コンソールのメッセージを頼りに、調査した。### エラー発生時のコンソール出力(抜粋)
“`bash
PrismaClientUnknownRequestError:
Invalid `prisma.images.update()` invocation:Error occurred during query execution:
ConnectorError(ConnectorError { user_facing_error: None, kind: ConnectionError(Timed out during query execution.) })
clientV
PuppeteerでUIテストを試してみた
## はじめに
`Puppeteer`というAPIを利用して画面操作のテストを行うサンプルを作成したことを備忘として残します。
今回はローカルサーバーの掛け算を行う画面にアクセスし、値の入力と計算結果の検証までを自動化するテストコードを作成しました。
(本来のやりたかったことはSPAの画面操作を自動化することでしたが、簡単に動きを確認するために作成しました)## Puppeteerとは
`Googleで開発されて、DevToolsプロトコルを介してChromiumやChromeを制御するための高レベルなAPIを提供するNodeライブラリ`
とのこと。
`Google Chrome`のヘッドレスブラウザ(GUIを必要としないブラウザ)機能であるヘッドレスChromeを操作するものがこの`Puppeteer`になります。
GitHubのスター数は8万以上, 最新バージョンは13日前(本記事執筆時点)と今後も盛り上がりを見せそうなライブラリです。
`Puppeteer`が登場する以前は`PhantomJS`がヘッドレスブラウザの主流だったようです。https://github.com
nodenv installで yarn command not found になった時の対処法
“`
> nodenv install 18.12.1
Downloading node-v18.12.1-darwin-x64.tar.gz…
-> https://nodejs.org/dist/v18.12.1/node-v18.12.1-darwin-x64.tar.gz
Installing node-v18.12.1-darwin-x64…
Installed node-v18.12.1-darwin-x64 to /Users/watabe/.nodenv/versions/18.12.1
“`“`
> yarn
zsh: command not found: yarn
“`下記コマンドで解決
“`
npm install –global yarn
nodenv rehash
“`
【初心者向け】AWS OpsWorksでSample Stackを使用し、アプリケーションの実行環境をサクッと作ってみた。
今回はnode.jsの実行環境をOpsWorksを使用して作ってみたいと思います。
# AWS OpsWorks stackを作成する
・OpsWorksを選択し、Add your first stack を押下今回は以下のような構成にします。
1. ”Sample Stack” を選択
2. Operating System typeは “Linux”
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2230506/f0a976d4-8897-b6c1-2cda-24b59a8908c8.png)
Create stackを押下すると、下記画像のように「stack を作成するにはIAMロールが必要だよ」と警告文が出てきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2230506/df0ae00c-2eba-b642-8e92-0090d4116077.png)
文化祭のWEBサイトとチケット発券システムを作った話
# はじめに
こんにちは、[Tomo](https://twitter.com/Tomo02721601)です。今回は、10/1(土), 2(日)に自分の高校で行われた文化祭の特設サイト、チケット発券システムを作成しました。:::note inf
本記事の内容は、私が所属する学校にに非公式で公開しているものです。
本記事に関する問い合わせを学校へ行う行為は慎んでいただくようお願いいたします。
:::# 自己紹介
現在高1で某進学校に所属する男子生徒です。中学2年生からWEBサイトの勉強を始めて今に至ります。今ではなんと自宅でサーバーを運用するほどになりました。
![IMG_4787.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/664165/85c4391b-9b5f-e47b-6c8c-17151111347e.jpeg)
# 作ったもの
こういうの↓
![ezgif-1-f66467165a.gif](https://qiita-image-store.s3.ap-northeast-1.a
npm-run-allで複数の処理を実行する メモ
## npm-run-allとは??
複数の処理を1つのコマンドでできるようになるツール
`buildを入力して実行`→`exportを入力して実行` から
`1つのコマンドを入力`→`buildとexport`が実行されるようにできる## やってみる
Next.jsの静的HTML書き出しを行います
***1\.従来の実行方法***
“`
npm run build
————-
npm run export
“`
と2回コマンドを入力しなければなりません***2\.npm-run-allでの実行方法***
まずは`npm-run-all`をインストール
“`
npm i -D npm-run-all
“`package.jsonを見てみると
“`typescript
“devDependencies”: {
“eslint”: “8.20.0”,
“eslint-config-next”: “12.2.3”,
“npm-run-all”: “^4.1.5″
}
“`
`”npm-run-all”: “^4.1.5”
MacでSQL Serverを動かしてsqlcmdとNode.jsからアクセスしてみる(2022)
node.jsからSQL Serverいじる必要が発生するかもしれないのでメモ。
## SQL Serverの起動
MacでSQL Serverを動かすにはDockerを使います。
“`bash
docker run -e ACCEPT_EULA=Y -e SA_PASSWORD=P@ssw0rd! -p 1433:1433 -d mcr.microsoft.com/mssql/server:2022-latest
“`## sqlcmd
SQL Server標準のクライアントツールをインストールします。
>使いにくいのでpythonツールであるmssql-cliを利用しようと思いますたが、Python3.10.xで動かず断念。
### インストール
インストールはBrewでできるみたいです。
“`bash
brew tap microsoft/mssql-release https://github.com/Microsoft/homebrew-mssql-release
brew install mssql-tools
“`### 利用
簡単な操