pyenvを利用してvenvで作成した仮想環境内のPythonバージョン

venvで作成したPythonの仮想環境内にインストールされているバージョンを変更してみました。

続きを読む »

Tailwind CSSで任意のメディアクエリを指定する

Tailwind CSS

Tailwind CSSでは簡単にメディアクエリの指定が可能です。

続きを読む »

Tailwind CSSでdisabled

Tailwind CSS

Tailwind CSSでdisabled属性がついた要素に対してスタイルを当てたい場合には、disabled擬似クラスを利用して指定を行います。

続きを読む »

Vue.jsでコンポーネントの要素をpropsによって切り替える

Vue.png

Vue.jsでボタンコンポーネントなどを作成する場合、ユースケースに応じてHTMLの実体をa要素とbutton要素と切り替えたいケースというのが発生します。

続きを読む »

Nuxt3でESLintの設定をする

Nuxt3

案件でNuxt3のESLint設定をすることがあったので手順をメモしておきます。

続きを読む »

Next.jsのAPI RoutesでAuth0の認可を実装する

Next.js+Auth0-1.png

Auth0は認証・認可の仕組みを提供してくれるIDaaS(Identity as a Service)です。

続きを読む »

AstroでgetStaticPathsで指定したpropsをTypeScriptの型推論で型情報を取りだす

AstroでgetStaticPathsで指定したpropsを型推論で取りだす

AstroでgetStaticPathsの返り値としてpropsが指定できます。

続きを読む »

VSCodeでSveltKitのPrettierのフォーマッティングをエディタ保存時に適用する

SveltKitでVSCodeの自動フォーマッティングを有効にする

SveltKitでVSCodeのPrettierの自動フォーマッティングを有効にするにはプロジェクトのルートに .vscodeディレクトリを配置して、その中のsettings.jsonに以下の記述を追加する。

続きを読む »

Cloudflare PagesにSvelteKitをデプロイする際のNodeバージョン

Cloudflare PagesにSvelteKitをデプロイする際のNodeバージョン

Cloudflare PagesにSvelteKitで作成したアプリケーションをデプロイする際のNodeバージョンでハマってしまったのでちょっとメモ

続きを読む »

Next.js + TypeScriptでgetStaticPropsの型を定義する方法

Next+TypeScript.png

Next.js + TypeScript においてgetStaticPropsの型を定義する方法はいくつか存在します。

続きを読む »

株式会社トゥーアールの2021年を振り返る

今年の最終営業日なので一年を振り返ってみたいと思います。

続きを読む »

Jestでマークダウンを読み込みテストをする

Jest

業務でマークダウンパーサーを作成していてJestでmockデータのマークダウンを読み込もうとするとエラーになりました。

続きを読む »

next/routerを利用しているコンポーネントのテストを行う

Next

next/routerを利用しているコンポーネントを単体でテストする場合にはNext Routerのモックを事前に作成しておく必要があります。

続きを読む »

Github Actionsのキャッシュ機能を利用してNext.jsのデプロイを高速化

Github Next

Next.jsのアプリケーションのデプロイにGithub Actionsを利用していたところ以下のような警告が出ているのに気づきました。

続きを読む »

Next.js のStorybookでSassを利用する(webpack5対応)

Storybook + Next.js

Next.js で Storybookを利用しようとした際にsass-loaderがエラーを出したのでまとめてみました。

続きを読む »

AWS CloudFrontで特定ディレクトリを別のS3ストレージを割り当てる

AWS CloudFrontを利用すれば特定ディレクトリを別のS3ストレージを割り当てることができます。

続きを読む »

Nuxt.js / Next.jsで作成したサイトをGitHub ActionsでAWS S3にデプロイする

GitHub Actionsを利用するとNuxt.jsやNext.jsなどで作成したWebアプリケーションを簡単にAWS S3にデプロイすることができます。

続きを読む »

AWS CloudFront FunctionsでBasic認証を設定する

これまでAWSのS3にアップした静的ファイルにBasic認証を設定するには CloudFront経由でLambda@EdgeでBasic認証を指定する必要がありましたがCloudFront Functionsの登場によって、CloudFront Functionsを利用して少しだけ簡単に設定できるようになりました。

続きを読む »

AWS SAM のtemplate.yamlをdeploy環境ごとに切り替える

develop や staging 、 productionなどの複数の環境で template.yaml を変更したいことがあります。

続きを読む »

AWS Lambda(Node.js)でJimpを使って画像のバリデーションを行う

Node.jsでバリデーションを行うには sharpがよく利用されますが、libvipsで書かれたsharpは環境によってはうまくインストールできないことがあります。

続きを読む »

記事一覧