- 1. ReactとGraphQLを使って作るTODOアプリ
- 2. Node.js ってなんだ?
- 3. PostgreSQL/PostGIS データベースからnodejsでデータを読み込む(pgモジュール)
- 4. web-ifcでIFCファイルを読み込む
- 5. 彼女の怒りを早急に鎮火。むしろ怒りを遊びに転換したい。〜obnizで早押しゲームつくり〜
- 6. Playwright と Artillery によるパフォーマンステスト
- 7. Discord jsの最小構成(メモ)
- 8. LINE チャットボットと IBM Cloud Functions でアルバイトのシフトを管理しよう
- 9. React Native + Expoでのアプリ開発入門
- 10. CypressでE2Eの世界観にほんの少しだけ触れてみた
- 11. AWS CodeArtifactにPythonパッケージを登録して、実際に使ってみた
- 12. 非技術者がJavaScriptフレームワーク・ライブラリの違いを調べてみた
- 13. Jasmine と Mocha の違いは?
- 14. NestJS のカスタムログに リクエストID を出力する
- 15. [TypeScript,Jest] JestでオリジナルのMatcherを作ってテストをしよう
- 16. Raspberry PiにNode-REDをインストールしてデーモン起動する
- 17. Docker内でnode-modules消してしまって環境が壊れた時の対処法
- 18. Symbol Node Maintenance: Monitoring, Backups, Crashes, and Recovery
- 19. DenoでNotionのAPIを触ってみる
- 20. VSCodeでPlaywrightによるE2Eテスト自動化をはじめてみよう
ReactとGraphQLを使って作るTODOアプリ
# はじめに
こんにちは,ペンギン丸です.学生兼フロントエンドエンジニアをしています.
本記事は私が来年からお世話になるDMM様の23卒アドベントカレンダー24日目です.何か書けるような技術無いかな〜っと考えたところ何も思い浮かばなかった為,
逆に全然分かってない技術(GraphQL)を使ってTODOアプリを作ることにしました.最近はお絵かきにかまけて技術の勉強をしてなかったので,手を動かして行きます!
# 本記事の目標「GraphQL? 何それ美味しいの?」って方でも
この記事通りに作業すればGraphQLを用いてTODOアプリが作れてしまい,何となくGraphQLが分かった気になれることを目標にします.GraphQLそのものに関する説明や,細かな用語の説明は他の方の記事に任せ,なるべく少ないコードで必要最低限のTODOアプリが作れたら良いなと思います.
張り切って行きましょう!# 前提条件
Node.jsとnpmは既にインストールされている前提で作業します.
また,本記事の大部分はApolloの公式チュートリアルを参考にしています.https://apo
Node.js ってなんだ?
「Node.js って結局なに?」
って急に聞かれても答えられない気がします。私は Node.js = JavaScript をサーバーで動かす環境、くらいの認識だったのですが、きちんと調べてみると間違っていたのでまとめていきます。
## Node.js とは
[公式ドキュメント](https://nodejs.dev/en/learn/) には以下のようなことが書かれていました。
– JavaScript の実行環境
– 拡張性の高いネットワークアプリケーションを構築できる
– Google Chrome のコアとなっている、(高速に動作する) V8 エンジンをブラウザの外で動かすことで高いパフォーマンスを実現している
– ほとんどの種類のプロジェクトに対応できる
– クロスプラットフォーム
– オープンソース
– スレッドを複数立ち上げることが重大なバグの原因となるため、シングルプロセスであり、非同期処理に対応
– JavaScript を書いていた人にとっては別言語を勉強せずにサーバーサイドの開発ができるメリットがある
– ブラウザのアップデートを待たずに新しい ECM
PostgreSQL/PostGIS データベースからnodejsでデータを読み込む(pgモジュール)
# はじめに
これまで使っていたベクトルタイル作成のプログラムにについて、nodejsのバージョンアップが必要なこともあり、主要なnodejsモジュールがnodejs v18でも動くか試してみる必要がありました。この機会に、改めてPostgreSQL/PostGISからのデータ読み込み、GeoJSON sequenceでの書き出しについてメモを書いておこうと思ってこの記事をまとめました。
今回の練習レポジトリはここです: https://github.com/ubukawa/ex-postgis
なお、現在、実際に動いているプログラムはnodejs v.16で動かしていますが、レポジトリはここ https://github.com/unvt/produce-gsc-6 にあります。このプログラムは @hfu さんの開発をベースにしています。
## 注意点
今回の練習用では、pgモジュールをつかってPostgreSQLデータベースでのアクセスするところを中心にみるため、childプロセスを使ってベクトルタイル変換ツールにデータをパイプすることや、better-queueを使っ
web-ifcでIFCファイルを読み込む
# はじめに
[前回の記事](https://qiita.com/kiyuka/items/00434f1b8e0b38c621fb)ではIFCファイルのテキストを見て手作業で解読しました。まあなんというかとてもめんどくさい作業でした。~~もうやりたくないです。~~
そんなわけで今回はJavaScriptライブラリの [IFC.js](https://ifcjs.github.io/info/) を使って解読していきたいと思います。# IFC.js とは
IFC.jsが何かというと、[公式ドキュメント](https://ifcjs.github.io/info/ja/docs/Introduction)より
> IFC.jsは、IFCファイルの読み書きを非常に簡単に行うことができるJavaScriptライブラリです。
とのことです。わざわざ手作業でIFCファイルを読み解く必要はないってことですね!やったー!!
# web-ifcでファイルを読み込む
IFC.jsは `web-ifc`, `web-ifc-three`, `web-ifc-viewer` の3つのレイヤー
彼女の怒りを早急に鎮火。むしろ怒りを遊びに転換したい。〜obnizで早押しゲームつくり〜
# 続・彼女のブチギレ案件
どうもこんにちは。
以前、トイレの蓋を閉め忘れて彼女にブチギレられたので、obnizでアラート機能をつくった者です。https://qiita.com/atoms50/items/81a401fa705937746900
その後、トイレの蓋の閉め忘れはなくなり、トイレ文脈で彼女にキレられることはなくなりました。
一方で、これは根本的な解決ではありません。
彼女がブチギレる火種は生活の中に溢れているのです。
最近だと、こんな事象が発生し、ブチギレられてしまいました。
– 氷結とスルメイカの食べ残しを机に放置してブチギレられたり
– プレゼントでもらった財布をタクシーに置き忘れてブチギレられたり毎度毎度、事象に対して対策をあてていってもキリがありません。
なので、今回は彼女のブチギレに対して根本的な解決をはかりました。# 彼女の怒りの鎮火作業は「業務」
僕にとって、彼女の怒りを鎮火する行為は「業務」です。
鎮火作業において最も重要なことは、炎上する前に、火種を消すことです。 炎上してしまったら最後、取り返しがつかないことになってしまうからです。
Playwright と Artillery によるパフォーマンステスト
# 要約
– DevOps や SRE を実践する人向けに、Playwright による E2E テストを Artillery の負荷掛けシナリオとして利用する手法についてハンズオンを交えて紹介します。
– 課題としては、Playwright で自動生成したスクリプトを手直ししないと難しいパターンがあることを挙げています。
– その他、Tips もあります。# はじめに
[NSSOL Advent Calendar 2022](https://qiita.com/advent-calendar/2022/nssol) の 13 日目にも[投稿](https://qiita.com/BlueTofuchic/items/57e54875d6f45eccb28c)しました、とうふです。
先の記事で軽く説明した通り、私がいま参画している案件では
> E2E テスト用のスクリプトを流用したパフォーマンステストを行なっています。
本記事では、Playwright で作成した E2E テストスクリプトを使って負荷掛けを行うことでパフォーマンステストを実施する手法について紹介します。
Discord jsの最小構成(メモ)
最近またDiscord jsにハマり出したのでメモとしてコードを貼っておきます
discord jsをインストールするコマンド:
“`powershell
npm install discord.js
“`dotenvをインストールするコマンド:
“`powershell
npm install dotenv
“`bot本体
“`index.js
const { Client, GatewayIntentBits } = require(“discord.js”);
require(‘dotenv’).config();const GatewayIntents = [GatewayIntentBits.MessageContent];
const client = new Client({
intents: GatewayIntents,
});client.on(“ready”,(client)=>{
console.log(“Ready!”);
});client.login(process.env.TOKEN);
“`
LINE チャットボットと IBM Cloud Functions でアルバイトのシフトを管理しよう
# はじめに
勤務時間がシフトで決まっている業務に携わっている方(アルバイトなども含みます)、自分のシフトの時間管理はどうしているでしょうか?
働く世代にはほぼスマホが1人1台ずつ行き渡っている現在では、カレンダーアプリなどを使って手動で登録している方や、あえて紙の手帳などに記入している方も多いと思います。
この記事では、自分のシフトの予定を Google カレンダーに自動登録してくれる LINE のチャットボットを個人使用目的で開発します。バックエンドには IBM Cloud Functions を使用します。
# 用意するもの
– LINE アカウント
– IBM Cloud アカウント (無料の範囲内で作成できます)
– Google アカウント (Gmail のメールアドレスがあれば OK)
– アルバイトのシフト表や習い事のスケジュール表(全部または一部が Google カレンダーに登録してあるとします)【注意点】今回作成するアプリ(LINE チャットボット)は、自分または家族などに割り当てられたアルバイトのシフトや習い事のスケジュールを管理するための、個人での
React Native + Expoでのアプリ開発入門
# React Native + Expoでのアプリ開発入門 -setup編
React Nativeでアプリ開発をやってみます。
環境構築してみました。環境:
MacBook (intel)## homebrewのインストール
[Homebrew公式](https://brew.sh/)インストールコマンド
“`
/bin/bash -c “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)”
“`## Nodejsインストール
[Nodejs公式](https://nodejs.org/)
公式からもインストールできますが、homebrewからもインストール可能です。“`brew install node“`
## Watchmanインストール
[watchman公式](https://facebook.github.io/watchman/)
フォルダやファイルを監視して、変更などがあったらリビルドなどのアクションするツールです。“`
CypressでE2Eの世界観にほんの少しだけ触れてみた
## 概要
Cypress初めて触ってみる人向けの資料## 手順
### 準備
#### 作業用ディレクトリ作成し移動
“`sh
mkdir cypress
cd cypress
“`#### yarnの初期化
“`
yarn init -y
“`
#### Cypressのインストール
“`sh
yarn add cypress
“`
#### 初期設定&起動
“`sh
yarn run cypress open
“`#### E2Eを選択
![スクリーンショット 2022-11-11 11.17.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/83409/b3e9e74b-e17c-0f78-4485-8870a7e1d782.png)
![スクリーンショット 2022-11-11 11.17.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/83409/edba444a-76d3
AWS CodeArtifactにPythonパッケージを登録して、実際に使ってみた
この記事は ハンズラボ Advent Calendar 2022 23日目の記事です。
Qiita初投稿となります。よろしくお願いいたします。# CodeArtifactについて
Node.jsのパッケージであればnpm、PythonのパッケージであればPyPIが有名なパッケージリポジトリとしてありますが、CodeArtifactはAWSがフルマネージドで提供する、プライベートリポジトリサービスになります。
# CodeArtifactにパッケージを登録して、使ってみよう!
### 1. CodeArtifactにドメインとレポジトリを作成する
マネジメントコンソール上からドメインとリポジトリを作成します。
ドメインはリポジトリを要素として持つ集合なので、ドメインの作成を先に行ってからリポジトリの作成を行います。ドメイン名をsample-domainとして作成します。
![スクリーンショット 2022-12-19 18.26.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/398443
非技術者がJavaScriptフレームワーク・ライブラリの違いを調べてみた
技術研修を提供しているカサレアルでは、JavaScriptのフレームワーク、ライブラリを学ぶコースをいくつか用意しています。
お客様から研修のご要望を伺う際、「JavaScriptフレームワークのおすすめどれですか?」と相談を受けることもあります。JavaScriptが何かは分かっているものの、数多のJSフレームワーク、ライブラリの違いって何だろう?
いや、そもそもフレームワークとライブラリの違いは?と疑問があったので、調べてみました。## フレームワークとライブラリの違い
フレームワークはWebアプリケーションの
・骨組み
・土台
・ひな形
・設計を再利用でき効率化するものライブラリはWebアプリケーションの
・部品
・汎用性の高いパーツのコレクション
・コードを使い回し効率化を可能にしたもの
・開発効率を上げプログラムを軽くするものあらゆるサイトで調べ、色んな表現が出てきました。
ですが、調べてみると、どれがフレームワークでどれがライブラリなのかという解釈は、人それぞれのように感じました。
というのも、カサレアルではReactやVue.jsをライブラリと紹介して
Jasmine と Mocha の違いは?
昨日は Mocha について調べていきました。
https://qiita.com/kotaro-caffeinism/items/ff3be5354bedc08ea404
これまで私が使ってきたテストフレームワークとして他に「Jamine」があり、Mocha と何が違うのか今ひとつわからなかったため今回は Jasmine について調べてみました。
## Jasmine とは
**BDD(ビヘイビア駆動開発)用の JavsScript テストフレームワークです。** ブラウザ JavaScript と Node.js に対応しています。
BDD は振る舞いの検証に焦点を当てた開発手法であり、TDD(テスト駆動開発)の派生です。「この振る舞いはスペックに合っているか?」を検証するためのテストコードを書いていきます。
Jasmine のサンプルコードを見ていきましょう。
“`js
describe(“A suite”, function() {
it(“contains spec with an expectation”, function() {
NestJS のカスタムログに リクエストID を出力する
こんにちは、株式会社medibaでバックエンドエンジニアをしている @mdbr92 です。
この記事は [mediba Advent Calendar 2022](https://qiita.com/advent-calendar/2022/mediba) の23日目です。
※記事の内容はあくまで個人の発信であり、会社を代表する意見や見解ではありません。この記事では NestJS で API サーバを開発した際にちょっと実装に苦労した、
ログへの リクエストID の出力について書いてみたいと思います。# はじめに
NestJS で API サーバを開発した際、1リクエストに対して複数の箇所で出力されているログを、リクエスト毎に追跡しやすくするために、ログに リクエストID(リクエスト毎に一意なID) を含めるという設計にしました。
[nestjs-pino](https://github.com/iamolegga/nestjs-pino)のような外部パッケージを追加導入すれば実現できそうでしたが、リクエストID の出力という一点に対してパッケージの追加とカスタ
[TypeScript,Jest] JestでオリジナルのMatcherを作ってテストをしよう
# はじめに
こんにちは!
みなさん、jestでテストを書いていて **「xxxっていう値が返ってくるのをテストしたいけど組み込みのメソッドだとテストできない。。どうしよう」** となったことはありませんか?
実は、jestには **`expect.extend`** という関数が用意されていて自分オリジナルの※Matcherを作ることができるんです。(※ **`toBe`,`toHaveBeenCalled`** などテスト書くときに書くあれです。)
本記事では、自分がこの記事を書くきっかけになった **”ある値の型が `特定の型 | null` となるかどうか”** をチェックするMatcherの作成を通して、CustomMatcherの作成方法を解説します。
# 本記事のゴール
**自分だけのCustomMatcherを作成できるようになる**
# 準備
まずはTypeScript x Jestを実行できる環境を作成します。もしそれが面倒でちゃっちゃと試したい場合は、筆者のレポジトリ(https://github.com/ironkicka/jest-custom
Raspberry PiにNode-REDをインストールしてデーモン起動する
## 前置き
11月からIT企業で仕事をしている新人です。元は半導体の会社で働いていました。
当然、Node-REDを初めて触る素人なのですが、遠く離れたお客様の工場で稼働している設備から情報を取得する実験をしたいというとで、Raspberry PiでNode-REDを動かすことになりました。さらに、そのときのことをAdvent Calenderに記事にせよとのことでした。まず、遠隔地にRaspberry Piを設置して、データを取得するということなので、会社の先輩がこのような環境を作りました。
– [Raspberry Piでリモート操作用ルーターを作る](https://qiita.com/NaotakaSaito/items/be29e5926faf20cf5502)
そして、今回私に下されたミッションは
– Raspberry PiにインストールするNode.jsはnvmでインストールする
– Node-REDをインストールする
– インストールしたNode-REDが電源投入後に自動起動するよう、デーモン起動するです。RasbianにはNode-REDがインス
Docker内でnode-modules消してしまって環境が壊れた時の対処法
yarnでインストールしてきたnode_modulesを直接フォルダをぶち消して、そこまで作っていたDocker内の環境が壊れてしまいました。
localhostにアクセスできなかったり、動作がエラーになるなど起きるようになりました。yarnは高速化のために必要なキャッシュをローカルに保存しています。
このせいでDocker内とローカルで差分ができてしまうため、新規にDockerファイルを立ち上げようとするとDocker内で壊れた状態のnode_modulesを再利用されてしまい環境が壊れたままの環境を構築することになってしまいます。キャッシュするディレクトリパスは以下になります。
`yarn cache dir`キャッシュされているnpmリストの確認は以下になります。
`yarn cache list`キャッシュクリアは以下になります。
`yarn cache clean`私の場合はキャッシュクリアのコマンドをDocker内で行うと
下記のように表示されてしまい失敗してしまいました。消す対象が大きいのか、スペックが低いのか。。。“`
rm: cannot r
Symbol Node Maintenance: Monitoring, Backups, Crashes, and Recovery
**Greetings Symbol Community & Fellow Node Operators!**
This article focuses on an area I feel the Symbol Guide is somewhat lacking – node monitoring, backups, crashes, and recovery. The Symbol Guide’s entry on [Running a Symbol Node](https://docs.symbol.dev/guides/network/running-a-symbol-node.html) does a good job covering the basics of getting a node up and running, and the [Maintaining a Symbol Node](https://docs.symbol.dev/guides/network/maintaining-a-symbol-node.html) covers updates and
DenoでNotionのAPIを触ってみる
DenoでもNotionのAPI触ってみたいなーと調べたら、Node.jsのSDKと同じような使い勝手で利用できる非公式SDKがあったので触ってみました。
## 環境
“`bash
$ deno –version
deno 1.29.1 (release, x86_64-apple-darwin)
v8 10.9.194.5
typescript 4.9.4
“`## notion_sdk_deno
執筆次点だと0.3.9が最新の模様です。
– https://deno.land/x/notion_sdk_deno@v0.3.9
– https://github.com/yeukfei02/notion-sdk-deno“`app.ts
import { Notion } from “https://deno.land/x/notion_sdk_deno@v0.3.9/mod.ts”;const notion = new Notion({
token: “APIトークン”,
});const userList = await notion.
VSCodeでPlaywrightによるE2Eテスト自動化をはじめてみよう
今年8月にリリースされたPlaywrightのVSCode拡張を今更ながら深堀りして触ってみました。
本記事では、VSCode上でPlaywrightを使ったテストの生成・実行・デバッグ・結果確認を一通り実行する方法を紹介します。
PlaywrightないしEnd-to-End(E2E)テスト自動化がだいたいどんなものかを知りたい人に見てもらえれば嬉しいです。## はじめに
### Playwrightとは
https://playwright.dev/
Microsoftが開発しているE2Eテスト自動化ライブラリです。
この分野ではSeleniumやCypressといったライブラリが先行していましたが、近年ではビッグテックならではの開発力を背景にPlaywrightが急速にシェアを拡大しているように思います。
事実これらを使い比べてみてもPlaywrightが圧倒的に使いやすく、これからE2Eテスト自動化に取り組んでみたい方にはまず最初にオススメしたいツールになっています。PlaywrightはNode.js(TypeScript/JavaScript)、Python、