Next.js API Route: ファイルをサーブする

Next.js API Route: ファイルをサーブする 環境: next: v10.0.1 参考: https://nextjs.org/docs/basic-features/data-fetching#reading-files-use-processcwd https://github.com/vercel/next.js/issues/8251 https://medium.com/@boris.poehland.business/n…

CircleCIでvscode-test

CircleCIでvscode-test vscode-test にサンプルがなかったのでメモ jobs: test: docker: - image: cimg/node:lts-browsers steps: - run: sudo apt update && sudo apt install libxss1 xvfb - run: | export DISPLAY=':99.0' /usr/bin/Xvfb :99 -screen 0 1…

Functional ComponentでforceUpdateをエミュレートする

Functional ComponentでforceUpdateをエミュレートする 参考 https://www.telerik.com/blogs/what-is-render-react-how-do-you-force-it?utm_source=reactdigest&utm_medium=email&utm_campaign=274 https://reactjs.org/docs/hooks-faq.html#is-there-somet…

Rails Active Storage で画像ファイルをHTTPSで配信したい

HTTPSページにて、AWS S3に保存された画像ファイルをActive Storageで配信すると、Mixed contentエラーが発生します。 ref: https://www.mixedcontentexamples.com/Test/NonSecureImage https://www.mixedcontentexamples.com/ デバッガーツールのSecurityタ…

CircleCIでマトリックスビルド

CircleCIでマトリックスビルド 現状CircleCIではマトリックスビルドはサポートされていませんが、実現するための方法がいくつかあります。 matrixキーがサポートされました Configuring CircleCI - CircleCI node v8、v10、v12、それぞれの実行環境でライブ…

CircleCIからnpm packageを公開するためのOrb

作りました。よろしくお願いします。 Orb Registry: npm-publisher GitHub Repo: npm-publisher 使用例 使い方 NPMトークンを取得し、環境変数NPM_TOKENとしてセット。package.jsonの情報に従ってパッケージを公開します。 モジュールのダウンロードやビルド…

配列の積和演算のアルゴリズム

配列の積和演算のアルゴリズム 「特別な配列」が与えられるので積和演算を行って値を返す。「特別な配列」は数値あるいは「特別な配列」をもつ。「特別な配列」内の数値をすべて加算するが、ネストレベルに応じてその和を乗算する。 例えば、 [x, y] → x + y…

二分探索木(binary search tree)から近似値を求める

二分探索木(binary search tree)から近似値を求める 二分探索木のデータとtargetが与えられる。二分探索木のデータの中からtargetの近似値を求める。 例えば次のような二分探索木のデータとtarget 5が与えられるとき、答えは6である。 8 /\ 3 10 /\ \ 1 6 14…

VS Code Extensionの公開を簡単にするCircleCI Orb作りました

VS Code Extensionの公開を簡単にするCircleCI Orb作りました 作りました: https://circleci.com/orbs/registry/orb/uraway/vsce リポジトリ: https://github.com/uraway/vsce 使い方 環境変数としてVSCODE_MARKETPLACE_TOKENにPersonal Access Tokenをセッ…

2つの数の和

2つの数の和 2つ以上のユニークな数字の集合Aの中から、ターゲット(target)の数字の和となる数字のペアを見つけ出す。数字のペアは最大1つある。答えは値が小さい順に並べるとする。 例えばAが1, 10, 5, -1、12、targetが15であれば、答えは10, 5のペアであ…

バイナリサーチ

バイナリサーチ 問: ソートされた数値の配列と数値targetを受け取り、配列中のtargetのインデックスを求める。その際、バイナリサーチを用いること。 アルゴリズム実装 $O(\log n)$ 配列の要素数をnとしたとき、left=0、right=nの変数を作る。また、leftとri…

VPC Peeringを使って、異なるVPCにあるRDSとEC2を接続する

aws

VPC Peeringを使って、異なるVPCにあるRDSとEC2を接続する VPC Peeringとは プライベートIPアドレスを使って、2つのVPC間でトラフィックをルーティングすることができる CIDRが一致または重複するVPC間の接続はできない VPC Peeringを設定する VPC Peeringを…

Palindrome Check (回文チェック) アルゴリズム

Palindrome Check (回文チェック) アルゴリズム 文字列stringを受け取って、回文かどうかをチェックする。すべての文字を比較しないといけないので、どうやっても計算量が$O(n)$以上になるはず。 アルゴリズム実装(1) $O(n)$ 両端から文字が等しいか比較して…

フィボナッチ数列のアルゴリズム

フィボナッチ数列のアルゴリズム 勉強がてらメモ フィボナッチ数列とは 「フィボナッチ数列」とは「前の2つの数を加えると次の数になる」という数列。1番目は0、2番目は1。n番目の数字は(n - 1)番目と(n - 2)番目の数字の和。 例えば、6番目の数は5 (0, 1, …

No such file or directory - bs_fetch:atomic_write_cache_file:chmod

No such file or directory - bs_fetch:atomic_write_cache_file:chmod docker-composeを使ってサーバーとsidekiq両方を動かそうとすると次のようなエラーが出る場合があります: $ docker-compose up app_1 | [12] Puma starting in cluster mode... app_1 |…

CircleCIのorb namespaceをリネーム(あるいは削除)したい

TL;DR 2019/03/20現時点ではnamespaceはCLIからリネームも削除もできない ここからサポートに連絡すればすぐに対応してくれる 表題について namespace を作り間違えたので、リネーム方法を探したところ、ドキュメントに次の一文が: Note: Namespaces cannot …

コンポーネントのマウント時にリクエストし、アンマウント時にキャンセルする axios リクエスト

とりあえず解はこうなった。 ライブラリのバージョン axio 0.18.0 react 16.8.3 react-dom 16.8.3 動作確認はこちら: ボタンクリックでコンポーネントのマウント・アンマウントが切り替えできる。APIリクエスト中にアンマウントされると、下のようなエラーメ…

TypeScript handbook Enums

TypeScript handbook Enums https://www.typescriptlang.org/docs/handbook/enums.html Enums Enums enums では、名前付きの定数群を定義します。その定数群の内容を明示したり、それぞれ異なるケースを簡単に作成することができます。TypeScript では、数値…

Rails 5 API + devise でパスワードのリセット

Rails 5 API + devise でパスワードのリセット 前回: http://uraway.hatenablog.com/entry/2016/07/11/090206 Rails 5 API + devise の資料があんまりなかったのでメモ。前提として devise を使ったユーザー登録、ログイン機能を持っている API を作成してい…

Docker で始める golang 入門

Docker で始める golang 入門 Docker 環境 動作確認済のバージョン: Version 2.0.0.0-mac81 (29211) こちら http://studio-andy.hatenablog.com/entry/go-todo-crud がすごいわかりやすくて良いので、これに沿うような Docker 環境を整えてみる。 まずは何は…

VSCode からはてなブログに投稿できる拡張作りました

VSCodeからはてなブログに投稿できる拡張作りました 作りました marketplace.visualstudio.com 気に入ったらスターください github.com 前に作ったAtom版はこっち github.com 下準備 使用には以下の3つが必要です Hatena ID Blog ID API Key Blog IDとAPI Ke…

S3 + CloudFront の CORS 設定

aws

手順をメモっとく S3 の設定 [Permissions] > [CORS configuration] から以下のように設定を追加: <CORSConfiguration> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> </CORSRule> </CORSConfiguration> CloudFront の設定 [Behavior] > [Cache Based on Selected Request Headers] から Origin ヘッダだけをS3に通す設定を行う: で、…

PWAでオフラインでも使える辞書アプリ作ってみた

いつも英語学習にはアルクの英辞郎の辞書アプリ使ってたんだけど、フィリピンのネットスピードでは使いづらいものがあって、オフラインでも使える辞書アプリ探すかなーと思っていたところ Chrome拡張の高速な英語辞書ツールをつくりました(Mouse Dictionary)…

storybookで@babel7を使う

参考: github.com 環境: "@babel/core": "^7.1.2", "@storybook/react": "^3.4.11", "babel-loader": "^8.0.4", storybookで@babel7を使うために、storybookのwebpack設定を少し上書きする。 .babelrc.js (@babel7に対応したBabel設定ファイル) module.expor…

はてなブログのシンタックスハイライトを jsx に対応させる

やたら重いので消した (2018/10/18) はてなブログのシンタックスハイライトを jsx に対応させる はてなブログのシンタックスハイライトは、2018/08 現在jsxには対応していない。 http://help.hatenablog.com/entry/markup/syntaxhighlight なので、PrismJSを…

TypeScript と Material-UI withStyles

TypeScript と Material-UI withStyles ググって最初に出てきたのを試したけどだめだったが、material-ui のリポジトリ見てたら TypeScript のサンプルがあったので、これを見ながら使ってみる。 インストール まずは material-ui をインストール: ->|bash| …

React v16.3 の Context と Fragment

よく使いそうな Context と Fragment についてメモ。 Context そもそも、 Context はあらゆる階層のコンポーネント間で、データを共有する機能を持ちます。 しかし、v16.3 以前の React における Context には以下の注意書きがありました。 If you want your…

React Component で作る window.confirm 代替品

window.confirm はESLint でエラーが出るし、UI が良くない。なので似たような API で扱うことの出来る window.confirm の代用品を作ってみた。 参考: http://reactkungfu.com/2015/08/beautiful-confirm-window-with-react/ 環境: React (16.1.1), React-Bo…

僕らは JavaScript を知らない - レキシカルスコープとクロージャとガベージコレクション Lexical Scope, Closure and Garbage Collection

参考: https://github.com/getify/You-Dont-Know-JS/blob/master/scope%20%26%20closures/ch2.md https://anond.hatelabo.jp/20070622101313 https://developer.mozilla.org/ja/docs/Web/JavaScript/Closures https://developer.mozilla.org/ja/docs/Web/Jav…

僕らは JavaScript を知らない - データ型と参照 Data Type and Reference

参考 https://github.com/getify/You-Dont-Know-JS/blob/master/types%20%26%20grammar/ch2.md#value-vs-reference https://www.webprofessional.jp/how-javascript-references-work/ https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Globa…