cloudflare workerずっと気になってたのでhelloworldとそのテストを触ってみたメモ 事前にアカウントは作っておいたのでプロジェクト作る所から。 プロジェクトを作る pnpm create cloudflare@latest これを実行するとcliでログインしていなければブラウザが…

chakra uiのテーマ機能を使用しgray.300のような値を特定のカラーコードに変換できるようになっているが、chakra uiのコンポーネントでは無いものに値を渡すに当たってカラーコードハードコードするのも…と考えていた所、ちゃんとカラー文字列をカラーコード…

所属企業のHPのホスティングサービスを引っ越ししようとしたら、最新LTSのnodejsでビルドできなくなっていて会社に相談した所手を入れる時間を確保できたのでライブラリのアップデートなど色々手を入れてみた。 astro.build tl;dr astro簡単に導入できたし、…

健康診断に向かってる途中にtwitter見てたらtanstack-routerが発表されていた。 100% Typesafeと書かれているのが気になってとりあえず試してみることにした。 そこでソース読んだり色々試す前にquickstart動かしてみようと思ったら地味にハマったのでそれの…

prismaのquickstartはすぐにできたので、この環境を0から作ってみる sqliteの説明はないのでDBは適当に選択した www.prisma.io 今回はyarnとesbuild-registerでやる やってみたソース github.com プロジェクトの作成と必要なもののインストール yarn init -y…

google driveの無限ストレージが無くなってしまうのでNasを買ってrcloneで移そうと思ったら NOTICE: xxx/yyy.mp3: Duplicate object found in source - ignoringと言われてgoogle drive上に同じファイルが複数あることがわかった。 どうもアップロードする際…

google calendarのAPIを触っていて特定のタイムゾーンの時間として時間情報をパースする必要があって調べたら、特に情報がなかったのでメモ。 dayjsのtimezoneプラグインを読み込み tz 関数でパースする際にtimezoneを指定する。 day.js.org import * as day…

開発にgoogleapisを使っているとtscが遅くなってしまったのでテストの実行だけでも早くならないかと思い調べるとesbuild-jestとswr-jestというのがあることを知った github.com github.com aws-cdkの@aws-cdk/aws-lambda-nodejsがbuildにesbuildを使っている…

node.jsでes modulesがサポートされた時にやってみようと思ったがts→mjsに変換する方法が無くて諦めたやつができるようになったっぽいので試してみた。 devblogs.microsoft.com 一応試したコードはgithubに上げてある。 github.com インストールと設定 beta…

そんな事あるのかって思ったのでメモ tl;dr node-cronのtask.destory()がなくなっていた 概要 家のラズパイで動いてるプログラムの依存をアップデートしたらnode-cron周りでエラーを吐くようになってしまった。エラーを見るとtask.destory()が呼べなかったら…

javascriptであるオブジェクトから特定のプロパティを除いたオブジェクトが欲しい時にdeleteではなくSpread構文を使って取得し、その際のeslintのlintの対応をしたメモ developer.mozilla.org 特定のプロパティだけを取り出す Spread構文を使ってプロパティ…

元記事 pomb.us 日本語訳 zenn.dev 環境構築 環境自体はreact-scriptsを使用する やってみて Fiberの名前だけ知らなかったものがどういったものかわかった JSX解釈の実装方法を学べた 他の処理を妨げないようにrequestIdleCallbackでループを作って画面を組…

クライアント側で取得したGoogle reCAPTCHA トークンの検証をNest.jsでやろうと思ったら、無駄にハマったのでメモ tl;dr データをapplication/x-www-form-urlencodedで送れ 検証方法 公式のドキュメントで指定されているエンドポイントに対してPOSTでクライ…

gaeにデプロイされているNest.jsプロジェクトで、レスポンスをエッジサーバーにキャッシュさせたい。 tl;dr いい感じのHeader設定すればキャッシュできそう csurf使ってるとset-cookieが邪魔 interceptorでresponseのheaderからset-cookieヘッダーを削除 GAE…

yupのYup.date().required('プロパティは必須です')のようなメッセージを出すと思うんですが、Yup.date()の変換に失敗した場合に出るメッセージの指定方法がぱっとわからなかったのでメモ github.com tl;dr typeErrorを使う そもそもの発端 他の主要ブラウザ…

webhookのverificationでbodyParseされてないraw bodyが必要になって割と困ったのでメモ tl;dr 結局方法3で実装した ダメだったやり方 検索すると一番最初に以下のstack overflowが引っかかって、raw-bodyというnpmモジュールをインストールしてrawbodyを渡…

nest.jsで開発をしていて、webhookを利用したい時に特定のパスだけcsurfチェックを外したい時に公式の説明とかだと「csrfのガードの前に特定のエンドポイントを設定する」方法しか書かれていなくてnestでは使えなかった。 そのため直接app.use(csurf())する…

github.com tl;dr 一旦LogLevelの設定でlogをなくす 起動後Loggerの設定を上書きする きっかけ 最近nest.jsを使っていて、serverless環境で動かす時にgoのechoだとできたんだけど、起動時のログ出るのなんとか抑制できないかなーと思って結構無理やりっぽく…

会社のwebサイトに導入したGoogle Formがsubmitされた時にG Suiteで用意したメーリングリスト（グループ）にメールを送りたかっただけなのに 信じられないくらいハマって時間かかったので、誰かが同じような所でハマった時に助けになればと思いメモ ハマった…

周りでこれからReact始める人とかが増えてきて、以外と知られてないんだな〜ってことがあったのでReactに型をつけるというかTypeScript(以下ts), Flowと prop-typesの関係について書く tl;dr prop-typeはやめとけ tsはいいぞ prop-typesとは 昔はReactのcore…

yuzu441.hateblo.jp parcelでReactのアプリケーション書いてて、画像を動的に取得したい時にやり方が分からず困ったのでメモ やりたかったこと jsonか何かにデータを定義しておいて、そこから画面を組み立てたかった。 課題 静的な画像であればhtml内に含ま…

react nativeにはAsyncStorageというデータの永続化に使用する機能がありますが、今後react nativeのコアから出されてreact-native-community下に移されるみたいです github.com そのため将来的にAsyncStorageを使用しているアプリはこのパッケージに移行し…

最近Reactを素振りするための環境として、前から話題になってたparcelを使ってみたらとても簡単に動作環境作れたのでその紹介 ja.reactjs.org parceljs.org githubに今回のコード等すべて置いといたので、読むの面倒な人はそちらで github.com 環境作成と依…

ちょっとずつしか手が出せてなかったReact.jsをニートになったのを気に学び直している その過程でReact.lazyとSuspense`をwebpackで試したのでそのログ reactjs.org tl;dr コード自体はここに全部おいてある github.com 動作チェック 動かすための方法はREAD…

こんにちは、ソウルジェムが日々濁っているゆずです タイトル通り今回は開発環境をdocker化しようとした話なんだけど結果的に実現できず妥協したので、いい方法知ってる人はtwitterなりで教えていただけると嬉しいです tl;dr ローカルでyarn installして、ビ…

なんかドキュメントとして載っている箇所を見つけられなかった*1 github.com これをダウンロードしてnpm run examplesを実行した結果で動作を確認する 変更方法 examples/src/components/line.jsの中の、datasetsプロパティの中にborderWidthを設定して値を…

最近ちょっと時間ができたのでreact context api触ってみたり、MobX触ってみたりしてます。 ちゃんと書くとMobXか隙間時間でちょこちょこやってたけど、decorator使えるならめっちゃ楽— ゆず (@yuzu_441) 2018年5月15日 しかし会社ではreact + reduxで作られ…

browsersync使ってますか？死ぬ程今更ですが、使ってみたら思ってた以上のことをしてくれた browsersync.io 最初は更新してくれるだけだと思ってた 最初はファイルの変更検知してブラウザリロードしてくれるだけでしょと思ってたら、リロードしてくれる以上…

GWに予定が初日と最終日にしかなくて、いつも通り映画を見て過ごしているのですが 映画見てるだけだと手持ち無沙汰なのでreactでなんかやってみようと思ったけど、create-react-app使いたくなかったのでwebpackの設定とか入ってるテンプレ作った github.com …

今話題のフォーマッターprettierを仕事のプロジェクトに導入したくてtslintとの組み合わせ方について調べた とりあえず必要なものを入れる yarn add -D tslint prettier tslint-plugin-prettier tslint-plugin-prettier github.com Runs Prettier as a TSLin…