Rails×Reactで構成されたアプリケーションに対して git clone した後、環境構築しようとした際に、ものすごく時間がかかったので、同じミスをしないようにメモしておく。 結論 ()は必要に応じて ① Nodeのバージョンを指定 (② .nvmrcに希望のバージョンを指定) (③ .gitignoreに .nvmrcを追加) ④ gemfile.lock削除 ⑤ Railsのバージョンを指定 ⑥ Bundle install ⑦ Rails db:create ⑧ Rails db:migrate ⑨ npm ci ⑩ yarn -v(→ yarnがインストールされていなければ yarn install) ( rails webpacker:compile) ①について まずlatestなNodeを使用するとnode-gypのエラーが後々発生する可能性があるので、出来ればstableなバージョンをインストールして使用するべき。 (npmは基本自動で変更されるので合わせる必要なし) ②について 筆者は、Nodeバージョン管理にnvmを使用していたので以下のHPを参考にした。 引用：https://shinshin86.hateblo.jp/entry/2020/05/14/220149 ③について 今後gitでマージする際に、.nvmrcファイルをアップロードしないように、以下のソースコードをプロジェクト内の.gitignoreファイルに追加。 .gitignore /.nvmrc ④について 基本的にGemfile.lockを削除することは、基本的にNG。 だが、筆者がクローンしたプロジェクトは、mimemagic <= 0.3.5に依存しているRailsアプリであったため、どうしても⑤のbundle installに失敗してしまっていた。 以下のHP上での、「都合によりRailsをアップデートできない・したくない場合の操作」を実行しても、どうしても上手くいかなかったため、 ④→⑤の流れをするとなぜか上手くいった。 引用：https://hackmd.io/@mametter/mimemagic-info-ja ⑤について Gemfileにrailsのバージョンを指定。 ⑨について npm ciとは。 package-lock.json から依存関係をインストールするコマンド。 既に node_modules フォルダの中身があっても一旦削除してくれる。 依存関係の更新をせずに整合性チェックと依存パッケージのダウンロードのみを行い、 npm install より高速に動作し、CIで必要なことだけを行うのが、このコマンドである。 nodeを使用しているプロジェクトをgit cloneするときは、必ず必要になるコマンド 引用：https://qiita.com/mstssk/items/8759c71f328cab802670 ⑩について ローカルでサーバーを開いたときに、 ℹ ｢wdm｣: wait until bundle finished: / ...... などが出てきてフロント画面の描画が遅い時などは、このコマンドが必要になる場合がある。

概要 複数のServerlessFrameworkプロジェクトをYarn Workspacesを利用して１リポジトリに収めた際の備忘録です。 GitHubにコードサンプルを上げています：https://github.com/shu000/serverless-ts-monorepo-sample Dependencies Node.js v14.15.1 Yarn v1.22.5 ServerlessFramework v2.52.1 Step 1. テンプレートのインストール まずは、ServerlessFrameworkのテンプレートを利用して、helloパッケージを作成します。 sls create --template aws-nodejs-typescript --path hello 複数のパッケージを用意したいので、同様にbyeパッケージも作成します。 sls create --template aws-nodejs-typescript --path bye これでディレクトリはこのような状態です（一部ファイル省略）。 bye/ src/ functions/ libs/ package.json serverless.ts webpack.config.js hello/ src/ functions/ libs/ package.json serverless.ts webpack.config.js （以下、helloパッケージのコードサンプルが登場しますが、byeパッケージでも同一の変更が必要です。） Step 2. モノレポ化 ここまでで１リポジトリ内に２つのnpmパッケージを設置しました。 ここからYarn Workspacesを活用してモノレポと呼べる構成にしていきます。 packages/ bye/ src/ functions/ libs/ package.json serverless.ts webpack.config.js hello/ src/ functions/ libs/ package.json serverless.ts webpack.config.js 次にルートディレクトリにpackage.jsonを作成して、Yarn Workspaces設定を記述します。 また、今回は子パッケージのdevDependenciesは共通依存と見做し、ルートのpackage.jsonに書き写してします。 /package.json { "name": "monorepo-sample", "version": "1.0.0", "private": true, "workspaces": [ "packages/bye", "packages/hello" ], "devDependencies": { "@serverless/typescript": "^2.23.0", "@types/aws-lambda": "^8.10.71", "@types/node": "^14.14.25", "json-schema-to-ts": "^1.5.0", "serverless": "^2.23.0", "serverless-webpack": "^5.3.5", "ts-loader": "^8.0.15", "ts-node": "^9.1.1", "tsconfig-paths": "^3.9.0", "tsconfig-paths-webpack-plugin": "^3.3.0", "typescript": "^4.1.3", "webpack": "^5.20.2", "webpack-node-externals": "^2.5.2" } } ルートにdevDependenciesを記述したので、byeおよびhelloのpackage.jsonも編集します。 /packages/hello/package.json { "name": "hello", "version": "1.0.0", "private": true, "dependencies": { "@middy/core": "^1.5.2", "@middy/http-json-body-parser": "^1.5.2", "source-map-support": "^0.5.19" } } これで一旦モノレポにはなりました。 ルートディレクトリでyarnを実行すると、共通するライブラリがルートに巻き取られることが分かります。 Step 3. webpack.config の修正 ここまででは、まだデプロイはうまくいきません。 デフォルトのwebpack.config.jsでは親のnode_modulesを解決できないためです。 従ってwebpack-node-externalsに親のnode_modulesを教えてやります。 /packages/hello/webpack.config.js externals: [nodeExternals({ modulesDir: path.resolve(__dirname, '../../node_modules') })], これで、各パッケージ内でsls deployの実行に成功するようになります。 Step 4. 共通パッケージの作成 せっかくモノレポにしたので、重複ソースを共通パッケージとして切り出しましょう。 まずはpackages/my-libsディレクトリを作成します。 mkdir packages/my-libs テンプレートに含まれるsrc/libsを共通パッケージにしてみます。 mv packages/hello/src/libs packages/my-libs/src rm -rf packages/bye/src/libs /packages/my-libs/package.json { "name": "my-libs", "version": "1.0.0", "private": true, "main": "src/index.ts", "dependencies": { "@middy/core": "^1.5.2", "@middy/http-json-body-parser": "^1.5.2" } } /packages/my-libs/src/index.ts export * from './apiGateway' export * from './handlerResolver' export * from './lambda' 上記ではmy-libsのmainをts（src/index.ts）にしています。 今回の構成では、byeやhelloのビルド時に、ts-loaderがmy-libsのtsも併せてビルドしてくれるためです。 通常、他者のパッケージからも呼ばれる場合は、ちゃんとトランスパイルしてからjsをmainに設定しましょう。 これでディレクトリ構成はこんな感じ。 package.json packages/ my-libs/ src/ index.ts apiGateway.ts handlerResolver.ts lambda.ts package.json bye/ src/ functions/ package.json serverless.ts webpack.config.js hello/ src/ functions/ package.json serverless.ts webpack.config.js ではmy-libsをworkspacesに追加しましょう。 /package.json "workspaces": [ "packages/my-libs", "packages/bye", "packages/hello" ] 続いてbyeとhelloからmy-libsを利用してみます。 /packages/hello/package.json "dependencies": { "my-libs": "*", "source-map-support": "^0.5.19" } /packages/hello/src/functions/handler.ts import type { ValidatedEventAPIGatewayProxyEvent } from 'my-libs'; import { formatJSONResponse } from 'my-libs'; import { middyfy } from 'my-libs'; /packages/hello/src/functions/index.ts import { handlerPath } from 'my-libs'; 最後に、このままではServerlessFrameworkがmy-libsをバンドルする際にエラーになるため、webpack.configに設定を追加します。 /packages/hello/webpack.config.js externals: [nodeExternals({ modulesDir: path.resolve(__dirname, '../../node_modules'), allowlist: ['my-libs'] })], これで、ルートディレクトリでyarnを再実行すれば、sls deployが成功するようになります！ 以上、当方初学者のため、マサカリ募集中です。 参考記事

目標 electronを用いてフレームレス（タイトルバーのない）なウインドウアプリケーションを作成し、その際独自に最小化、最大化、閉じるボタンを作り、機能させる。 下準備 Node.jsのインストール 割愛します、詳しくはこちら アプリケーションのディレクトリを作成 ディレクトリ名は仮にTestWindowAppとした。 $ mkdir TestWindowApp $ cd TestWindowApp package.jsonの作成 Node.jsのパッケージを管理するnpm（Node Package Manager）を使い、packege.jsonを生成する。 $ npm init -y 生成されたpackage.json package.json { "name": "testwindowapp", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC" } Electronのインストール $ npm i -D electron カレントディレクトリにElectronがインストールされる。 これにより、node_modulesフォルダと、package-lock.jsonが生成されます。 ディレクトリ構成 TestWindowApp ├ node_modules/ ├ package-lock.json └ package.json 各種ディレクトリ、ファイルの作成 カレントディレクトリにsrcフォルダを作成。 更にその中に、index.html、main.js、package.json を作成します。 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Test Window App</title> </head> <body> <!-- header area --> <div class="header-area"></div> <!-- main area --> <div class="main-area">Hello World!</div> <!-- footer area --> <div class="footer-area"></div> </body> </html> main.js const { app, Menu, BrowserWindow, ipcMain } = require('electron'); const path = require('path'); const url = require('url'); let mainWindow; function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600, }); mainWindow.loadURL(url.format({ pathname: path.join(__dirname, '/index.html'), protocol: 'file:', slashes: true })); // コメントアウトで開発者ツール起動 // mainWindow.webContents.openDevTools(); mainWindow.on('closed', () => { mainWindow = null; }); } app.on('ready', createWindow); app.on('window-all-closed', () => { if (process.platform !== 'darwin') { app.quit(); } }); app.on('activate', () => { if (mainWindow === null) { createWindow(); } }); package.json { "main": "main.js" } これらを作成したら、下記コマンドで実行するとブラウザが立ち上がります。 実行 $ npx electron src このようなウインドウが表示された。 が、タイトルバーやツールバーがちょっと邪魔だなと思った。 そういう時は main.js mainWindow = new BrowserWindow({ width: 800, height: 600, frame: false }); とすると、これらが非表示となりフレームレスなウインドウが表示される。 Visual Studio Codeで実行する Electronでアプリを作っている時に、いちいち npx electron src をするのはめんどくさい。 ということで、起動構成を追加する。 main.jsを選択した状態で、VSCode上の構成の追加を行う際、Node.jsを選択できます。 Node.jsを選択して起動構成を追加すると、 ルートディレクトリの直下に.vscodeファイルが、更にその中にlaunch.jsonが生成されます。 launch.json { // IntelliSense を使用して利用可能な属性を学べます。 // 既存の属性の説明をホバーして表示します。 // 詳細情報は次を確認してください: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "pwa-node", "request": "launch", "name": "Launch Program", "skipFiles": [ "<node_internals>/**" ], "program": "${workspaceFolder}\\src\\main.js" } ] } このままでは動かないので、launch.jsonを以下のように変更した。 launch.json { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Electron Main", "program": "${workspaceFolder}/src/main.js", "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron", "runtimeArgs": [ "--enable-logging" ], "console":"integratedTerminal" } ] } これでVisual Studio Code上で実行して、Electronブラウザを立ち上げることが出来るようになりました。 簡易的なレイアウトの作成 srcフォルダ直下にcss, imgフォルダを追加しました。 cssフォルダ内に、2つのcssファイルを作成 imgフォルダ内に、最小化、最大化、閉じるボタンの画像を用意 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Test Window App</title> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/parts.css"> </head> <body> <!-- header area --> <div class="header-area"> <div class="header-container"> <div class="button-tools"></div> <div class="title-bar">Test Window App</div> <div class="button-control"> <!--最小化、最大化、閉じるボタンが格納されるエリア--> <div class="button" id="button-minimize"> <button><img src="img/minimize.png"></button> </div> <div class="button" id="button-maximize"> <button><img src="img/maximize.png"></button> </div> <div class="button" id="button-close"> <button><img src="img/close.png"></button> </div> </div> </div> </div> <!-- main area --> <div class="main-area"> <div class="main-container"> <p>Hello World!</p> </div> </div> <!-- footer area --> <div class="footer-area"> <div class="footer-container"></div> </div> </body> </html> メインウインドウのレイアウト担当 main.css * { margin: 0px; padding: 0px; } html, body { width: 100%; height: 100%; overflow: hidden; background-color: #e4edf1; } /* ヘッダーエリア */ .header-area { position: fixed; -webkit-app-region: drag; /* draggable */ height: 34px; width: 100%; } .header-container{ display: flex; height: 100%; } .button-tools{ width: 10%; } .title-bar{ display: inline-flex; justify-content: center; align-items: center; flex: 1; font-size: 14px; } .button-control{ display: flex; width: 160px; } /* メインエリア */ .main-area { /* ヘッダーが34px、フッターが20pxのため余白に */ padding: 34px 0px 20px 0px; height: 546px; } .main-container { width: 100%; height: 100%; background-color: #ffffff; } /* フッターエリア */ .footer-area { position: fixed; height: 20px; width: 100%; bottom: 0px; } ボタン等の細かなパーツの装飾担当 parts /* ボタン装飾 */ button{ width: 100%; height: 100%; border: none; outline: none !important; background: transparent; } .button{ display: inline-flex; justify-content: center; align-items: center; text-align: center; height: 100%; width: 100%; -webkit-app-region: no-drag; } #button-minimize{ flex: 1; } #button-maximize{ flex: 1; } #button-close{ flex: 1; } #button-minimize:hover{ background-color: #aed5fa; } #button-maximize:hover{ background-color: #aed5fa; } #button-close:hover{ background-color: #ff4747; } この状態で実行すると、画像のようになります。 次回 今回追加したボタンにクリックイベントを割り当てます。 （未完成）

はじめに バックエンドJS(Node.js)でWASM(Web Assembly)の使い方を説明する日本語記事が少なさそうだったので書いてみます。 Rustのインストール方法等は省略します。わからない場合は参考先をご確認ください。 バックエンドならそのままGoやRustで書けばいいのでは?と思うかもしれません。 それができる体制であれば、その方がいいと思います。 個人的には少人数でプロダクトを創っているチームは とりあえず、フロントエンド/バックエンド両方をTypeScriptで書いて、プロダクトの仮説検証まわしつつ、 パフォーマンス向上させたい部分をWASMで置き換えていく戦略もありかなと思い、検討しています。 この投稿で説明すること この投稿では以下のようなプロジェクトを構成で ➜ tree -I 'target|node_modules' sample_project sample_project ├── node_ts_express_sample │   ├── package-lock.json │   ├── package.json │   ├── pkg -> ../wasm_sample/pkg │   ├── src │   │   └── index.ts │   └── tsconfig.json └── wasm_sample ├── Cargo.lock ├── Cargo.toml ├── pkg │   ├── package.json │   ├── wasm_sample.d.ts │   ├── wasm_sample.js │   ├── wasm_sample_bg.wasm │   └── wasm_sample_bg.wasm.d.ts └── src └── lib.rs Node.jsのWeb Server内でWASMを実行する方法を説明します。 ➜ npx ts-node src/index.ts server started at http://localhost:8080 ➜ curl http://localhost:8080/api/hello/John Hello, John! Node.js with TypeScriptでWeb Assemblyを使う 1. ルートプロジェクト作成 ➜ mkdir sample_project ➜ cd sample_project 2. Web Assembly作成 Rustを使って、Web Assemblyを作ります。 ➜ cargo new --lib wasm_sample cd wasm_sample src/lib.rsを以下のコードに置き換えます。 #[wasm_bindgen] pub fn hello(name: &str) -> String { return format!("Hello, {}!", name); } Cargo.tomlを以下のコードに置き換えます。 [package] name = "wasm_sample" version = "0.1.0" edition = "2018" [lib] crate-type = ["cdylib"] [dependencies] wasm-bindgen = "0.2" 以下のコマンドでWASMを作成します。 ➜ wasm-pack build --target nodejs 成功すると以下のようなファイルが作成されます。 ➜ ls pkg package.json wasm_sample.d.ts wasm_sample.js wasm_sample_bg.wasm wasm_sample_bg.wasm.d.ts ts-nodeでWASMが動作することを確認してください。 ➜ npx ts-node > import {hello} from './pkg/wasm_sample' {} > hello("John") 'Hello, John!' > 3. Node.jsでWeb Server作成 TypeScript用のプロジェクトを作成後、WASMにシンボリックリンクをはります。 ➜ mkdir node_ts_express_sample ➜ cd node_ts_express_sample ➜ ln -s ../wasm_sample/pkg pkg 今回はWASMを動かすのが目的なので、詳細は省略しますが、TypeScriptが動くプロジェクトを作成してください。 ts-nodeを利用して、tsファイルを実行できる環境があれば十分です。 ➜ npx ts-node src/index.ts Hello Typescript world! あとはWebサーバのモジュール(Express)をインストールし、 ➜ npm i --save express ➜ npm -D @types/express エントリーポイント(src/index.ts)を以下のコードに置き換えます。 import express from 'express'; import { hello } from '../pkg/wasm_sample'; const app = express(); app.get('/api/hello/:name', (req, res) => { res.send(hello(req.params.name)); }); const PORT = 8080; app.listen(PORT, () => { console.log(`server started at http://localhost:${PORT}`); }); あとはServerを起動し、 ➜ npx ts-node src/index.ts server started at http://localhost:8080 以下のようにAPIをコールすると、結果が返ってくることが確認できます。 ➜ curl http://localhost:8080/api/hello/John Hello, John! 以上です。 参考 RustからWebAssembly (wasm)を生成してJavaScriptとブリッジ通信してみる Typescript + Express Template (just add npm)

背景 掲題モジュールを使えば「CSVを取得して読み込む時はカンマでsplitして…」といった面倒な処理から解放されたため、自身のメモ代わりに共有する。 二次元配列または連想配列の配列のように取得することができるため、肝心の実装に注力することができる。 公式ページ CSV Parser for Node.js CSV stringifier for Node.js csv-parse実装例 ■元データ A列, B列, C列 1, 2, 3 といったCSVファイルがあるとする。 const csvParseSync = require('csv-parse/lib/sync') // requiring sync module const fs = require('fs') let path = '/any/' let filename = 'test.csv' // ファイル読込。パスやファイルネームはここでは仮。 let buffer = fs.readFileSync(path + filename ) // CSV変換 let csvResult = csvParseSync(text) // 結果出力 console.log(csvResult ) ■出てくるであろう結果 [ ['A列', 'B列', 'C列'], ['1', '2', '3'] ] 上記のように二次元配列として取得できる。 csv-stringify実装例 ■元データ [ ['A列', 'B列', 'C列'], ['1', '2', '3'] ] 上記のような二次元配列をCSV化したいとする。 const fs = require('fs') const stringify = require('csv-stringify/lib/sync') let outputArray = [ ['A列', 'B列', 'C列'], ['1', '2', '3'] ] // 二次元配列をCSV向けテキスト化 let resultCSV = stringify(inputArray) let path = '/any/' let filename = 'test.csv' // ファイル書込。パスやファイルネームはここでは仮。 fs.writeFileSync(path + filename , resultCSV ) ■期待されるであろう結果 A列, B列, C列 1, 2, 3 上記のようなCSVを出力することができる。 その他留意すべきこと sync（同期的）モジュールとasync（非同期的）モジュールがあることを理解する 本記事にて紹介している2機能とも同期的・非同期的モジュールがそれぞれ用意されている。 上記例にて用いている例がsync（同期）であるように、単純で使いやすいのはsync（同期）である。 公式（＋Google自動翻訳）では同期APIについて、以下のように書かれている。 レコードの完全なデータセットを受け入れ、完全な結果セットを返します。 これは、関数への通常の直接同期呼び出しを表します。レコードを渡すと、CSVテキストが返されます。単純であるため、スケーラビリティが不要で、データセットがメモリに収まる場合は、これが推奨されるアプローチです。 optionを活用 要件や実装によっては、初期設定にてマッチしないケースが考えられるだろう。 その時はoptionを見て解決できないかを判断しても良い。 以下は便利だなと思ったオプションを一部紹介する。 csv-parseのオプション：endoding https://csv.js.org/parse/options/encoding/ bufferとなっているデータについて、encodingにもとづいて出力してくれる。 bom付きなども判定できる。 csv-parseのオプション：relax_column_count https://csv.js.org/parse/options/relax_column_count/ レコード間でフィールド数が一貫していない場合、許容するかどうかを設定できる。デフォルトはfalse。 csv-stringifyのオプション：quoted_empty https://csv.js.org/stringify/options/quoted_empty/ nullやundefinedを空文字に変換してくれる。 双方のモジュールにあるオプション：columns https://csv.js.org/parse/options/columns/ 二次元配列ではなく、連想配列の配列のように変換してくれる。列変更が楽になりそう。 ただし1行目が日本語ヘッダーの場合、連想配列のキーとしてはよろしくない可能性がある。 キー名が何かを明示的に設定した後、オプションfrom_lineと併用することが望ましいと考えられる。 https://csv.js.org/parse/options/from_line/

初期設定ではlocalhost:3000となっているが、 bin/wwwファイルを変更することでポートを変更できる。 この点を var port = normalizePort(process.env.PORT || '3000'); このように var port = normalizePort(process.env.PORT || '4000'); これでローカルでwebサーバーを立ち上げる際にポートを分けることができる。 参考 stackoverflow

概要 表題通り、Node.jsでDynamoDBを操作する記事です。 基本情報 操作TBL ディレクトリ構成 ~/develop/study/aws/node/dynamo $ tree . ├── crud │ ├── OlympicCreateItem.js │ ├── OlympicDeleteItem.js │ ├── OlympicGetItem.js │ └── OlympicUpdateItem.js ├── data │ └── olympicData.json └── migration ├── OlympicCreateTable.js └── OlympicLoadData.js 3 directories, 7 files 事前準備 TBL作成(OlympicCreateTable.js) var AWS = require("aws-sdk"); AWS.config.update({ region: "ap-northeast-1" }); var dynamodb = new AWS.DynamoDB(); var params = { TableName : "Olympic", KeySchema: [ { AttributeName: "Id", KeyType: "HASH"}, //Partition key { AttributeName: "Country", KeyType: "RANGE" } //Sort key ], AttributeDefinitions: [ { AttributeName: "Id", AttributeType: "N" }, { AttributeName: "Country", AttributeType: "S" } ], ProvisionedThroughput: { ReadCapacityUnits: 10, WriteCapacityUnits: 10 } }; dynamodb.createTable(params, function(err, data) { if (err) { console.error("TBL作成失敗：", JSON.stringify(err, null, 2)); } else { console.log("TBL作成成功：", JSON.stringify(data, null, 2)); } }); olympicData.json [ { "Id": 1, "Country": "日本", "Medal": { "GoldMedal": 11, "SilverMedal": 11, "BronzeMedal": 11 } }, { "Id": 2, "Country": "アメリカ", "Medal": { "GoldMedal": 10, "SilverMedal": 8, "BronzeMedal": 7 } }, { "Id": 3, "Country": "中国", "Medal": { "GoldMedal": 5, "SilverMedal": 5, "BronzeMedal": 5 } } ] TBL作成の実行結果 ~/develop/study/aws/node/dynamo/migration $ node OlympicCreateTable.js TBL作成成功： { "TableDescription": { "AttributeDefinitions": [ { "AttributeName": "Country", "AttributeType": "S" }, { "AttributeName": "Id", "AttributeType": "N" } ], "TableName": "Olympic", "KeySchema": [ { "AttributeName": "Id", "KeyType": "HASH" }, { "AttributeName": "Country", "KeyType": "RANGE" } ], "TableStatus": "CREATING", "CreationDateTime": "2021-07-29T10:20:05.059Z", "ProvisionedThroughput": { "NumberOfDecreasesToday": 0, "ReadCapacityUnits": 10, "WriteCapacityUnits": 10 }, "TableSizeBytes": 0, "ItemCount": 0, "TableArn": "arn:aws:dynamodb:ap-northeast-1:696770525325:table/Olympic", "TableId": "5e5fb4bf-a314-496e-ad61-40387663f17f" } } データのロード(OlympicLoadData.js) var AWS = require("aws-sdk"); var fs = require('fs'); AWS.config.update({ region: "ap-northeast-1", }); var docClient = new AWS.DynamoDB.DocumentClient(); console.log("データのロード開始"); var Countries = JSON.parse(fs.readFileSync('../data/olympicData.json', 'utf8')); Countries.forEach(function(country) { console.log(country) var params = { TableName: "Olympic", Item: { "Id": country.Id, "Country": country.Country, "Medal": country.Medal } }; docClient.put(params, function(err, data) { if (err) { console.error("ロード失敗", country.Id, ". Error JSON:", JSON.stringify(err, null, 2)); } else { console.log("ロード成功:", country.Id + country.Country); } }); }); データのロード ~/develop/study/aws/node/dynamo/migration $ node OlympicLoadData.js データのロード開始 { Id: 1, Country: '日本', Medal: { GoldMedal: 11, SilverMedal: 11, BronzeMedal: 11 } } { Id: 2, Country: 'アメリカ', Medal: { GoldMedal: 10, SilverMedal: 8, BronzeMedal: 7 } } { Id: 3, Country: '中国', Medal: { GoldMedal: 5, SilverMedal: 5, BronzeMedal: 5 } } ロード成功: 3中国 ロード成功: 1日本 ロード成功: 2アメリカ CREATE文 OlympicCreateItem.js var AWS = require("aws-sdk"); AWS.config.update({ region: "ap-northeast-1", }); var docClient = new AWS.DynamoDB.DocumentClient(); var table = "Olympic"; var params = { TableName:table, Item:{ "Id": 4, "Country": "ドイツ", "Medal": { "GoldMedal": 7, "SilverMedal": 7, "BronzeMedal": 7 } } }; docClient.put(params, function(err, data) { if (err) { console.error("Unable to add item. Error JSON:", JSON.stringify(err, null, 2)); } else { console.log("Added item"); } }); READ文 OlympicGetItem.js var AWS = require("aws-sdk"); AWS.config.update({ region: "ap-northeast-1", }); var docClient = new AWS.DynamoDB.DocumentClient(); var table = "Olympic"; var params = { TableName: table, Key:{ "Id": 1, "Country": '日本' } }; docClient.get(params, function(err, data) { console.log(params) console.log(data) if (err) { console.error("Unable to read item. Error JSON:", JSON.stringify(err, null, 2)); } else { console.log("GetItem succeeded:", JSON.stringify(data, null, 2)); } }); UPDATE文 OlympicUpdateItem.js var AWS = require("aws-sdk"); AWS.config.update({ region: "ap-northeast-1", }); var docClient = new AWS.DynamoDB.DocumentClient() var table = "Olympic"; var params = { TableName:table, Key:{ "Id": 1, "Country": '日本' }, UpdateExpression: "set Medal.GoldMedal = :g", ExpressionAttributeValues:{ ":g":17, }, ReturnValues:"UPDATED_NEW" }; console.log("Updating the item..."); docClient.update(params, function(err, data) { if (err) { console.error("Unable to update item. Error JSON:", JSON.stringify(err, null, 2)); } else { console.log("UpdateItem succeeded:", JSON.stringify(data, null, 2)); } }); DELETE文 OlympicDeleteItem.js var AWS = require("aws-sdk"); AWS.config.update({ region: "ap-northeast-1" }); var docClient = new AWS.DynamoDB.DocumentClient(); var table = "Olympic"; var params = { TableName:table, Key:{ "Id": 4, "Country": 'ドイツ' }, }; console.log("Attempting a conditional delete..."); docClient.delete(params, function(err, data) { if (err) { console.error("Unable to delete item. Error JSON:", JSON.stringify(err, null, 2)); } else { console.log("DeleteItem succeeded:", JSON.stringify(data, null, 2)); } });

私は日本就職を目指して、勉強している韓国人大学生です。 もし、内容の中で間違った表現や言葉などがあれば、書き込みをしてください。 本コンテンツはmacOSを基準とします。 NVMというのは？ NVMのレポジトリ（公式ドキュメント） Node.jsのバージョン管理アプリ 様々なプロジェクトを行う時、簡単にNode.jsのバージョンを管理できる デフォルトバージョンの設定 インストールされたバージョンのリスト確認 etc… NVMインストール インストール $ sudo curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash ~/.bash_profileにスクリプトを追加（zshシェルを使っていると、~/.zshrcに追加） export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm $ source ~/.bashrc インストール結果を確認 $ nvm ls -> system node -> stable (-> N/A) (default) iojs -> N/A (default) Node.jsインストール インストール $ nvm install 14.17.3 インストール結果を確認 $ nvm ls -> v14.17.3 system default -> 14.17.3 (-> v14.17.3) node -> stable (-> v14.17.3) (default) stable -> 14.17 (-> v14.17.3) (default) iojs -> N/A (default) lts/* -> lts/fermium (-> v14.17.3) lts/argon -> v4.9.1 (-> N/A) lts/boron -> v6.17.1 (-> N/A) lts/carbon -> v8.17.0 (-> N/A) lts/dubnium -> v10.24.1 (-> N/A) lts/erbium -> v12.22.3 (-> N/A) lts/fermium -> v14.17.3 Node.jsのバージョンを確認 $ node -v v14.17.3 他のバージョンのNode.jsインストール・バージョン変更 インストール $ nvm install 10.15.1 インストール結果を確認 $ nvm ls -> v10.15.1 v14.17.3 system default -> 10.15.1 (-> v10.15.1) node -> stable (-> v14.17.3) (default) stable -> 14.17 (-> v14.17.3) (default) iojs -> N/A (default) lts/* -> lts/fermium (-> v14.17.3) lts/argon -> v4.9.1 (-> N/A) lts/boron -> v6.17.1 (-> N/A) lts/carbon -> v8.17.0 (-> N/A) lts/dubnium -> v10.24.1 (-> N/A) lts/erbium -> v12.22.3 (-> N/A) lts/fermium -> v14.17.3 Node.jsのバージョンを確認 $ node -v v10.15.1 Node.jsのバージョンを変更 $ nvm use 14.17.3 $ node -v v14.17.3 他ののNVMコマンド 最新バージョンをインストール $ nvm install --lts Installing latest LTS version. v14.17.3 is already installed. Now using node v14.17.3 (npm v6.14.13) 現在使っているバージョンを確認 $ nvm current v14.17.3 特定バージョンのアンインストール $ nvm uninstall <version> $ nvm uninstall v10 Uninstalled node v10.15.1