React React Router v7(Remix) に Eslint v9 を設定する
はじめに Qitaのトレンドで以下のような面白い記事を見つけた。 Next.jsがいまいちしっくり来なかったので、試しに公式で勉強してみたところ面白そうだったため使ってみることにした。 使うにあたりEslintの設定をしたかったのだが、Re...
React 
CSS CSSのvar関数で、カラーパレットを作って設定を共有する方法
はじめに 仕事でデザーナーが作成したfigmaのデザインから、ReactでUI実装をしていた時に 顧客からUIがある程度できた段階で、カラーパレットを用意したからデザイン全体の色を変えて欲しいという要望があった。 デザイナー側は、figma...
Docker docker-composeでFastAPIを簡単構築
はじめに 以前Nginxの記事でFastAPIを使ったが、環境構築方法は残していなかったのでメモ。 今回のリポジトリは以下で公開している 実装 構成 今回はdocker-coposeで環境構築を行うため、以下のような構築 FastAPIでの...
DB docker-composeでMySQLの環境構築をした(8.4 LTS版)
はじめに Docker環境で、MySQLをよく構築するが何も考えずに いつもコピペしたいたので、改めて公式ドキュメントを読みつつ理解していく。 まあ、構築自体は色々記事はあるけどだいたい公式ドキュメントのソースがないから 本当にあっているか...
Docker Nginx&オレオレ証明証でNextJS&FastAPIをSSL化&HTTPS通信を行う
はじめに 自分でNext.jsでアプリを作っているときにスマホからPCのIPにアクセスして デザインを確認したい場面があった。 しかし、位置情報を使うアプリだったためスマホからはHTTP通信で位置情報はHTTPS通信を使うため 実行エラーに...
ブログ改造 PRISMとCocoonを使ってHighlighting Code Blockでコードを表示できないときの解決策
Prismを使用してHighlighting Code Blockに言語を追加したい Prism.js,Prism.cssを指定してみたところ なにかデザインが変なように見えたし、スタイルも適用できていないように見えた。 色々調べてみて修正方法がわかったのでメモ。 これで、うまいこと実装が表示されることは確認ができた。
Iphoneアプリ [SwiftUI]Alamofire とSwiftyJSONの使い方をホットペッパーAPIを使って試してみた
はじめに 最近SwiftUIを勉強していて、何か外部ライブラリを使用してみたいと思った。 そこで調査をしいたところ、HTTP通信のライブラリAlamofireとJsonファイルを操作できるSwiftyJSONの存在を知った。 ちょうどホット...
StoryBook StorybookのINITIAL_VIEWPORTSをストーリに指定する
概要 StoryBookのテストを作っているときに、画面サイズをIphone13 miniにしたいなと思った。 その時にどうやって画面サイズって調べるんだ?と思ったのでメモ 指定方法 StorybookのINITIAL_VIEWPORTSの...