2022-04-01から1ヶ月間の記事一覧
QwikというReactに似た書き方で開発できるMPAフレームワークのお話を聞いたので自分でも調べてみる qwik.builder.io この前読んだJackさんの記事でもそうだが、いまのSPAには色々課題がある NavigationAPIはその課題の解決策の一つであるが uga-box.hatenabl…
下の本を読んでテンプレートリテラル型を知らなかったのでメモ プロを目指す人のためのTypeScript入門 安全なコードの書き方から高度な型の使い方まで Software Design plus作者:鈴木 僚太技術評論社Amazon あったらいいのにと思っていた構文だが、v4.1（約2…
ChromaticでVRT環境をつくった uga-box.hatenablog.com ただ、プルリクを作って前回ビルドとの差分をみてみると毎回全部のファイルが新規作成のようになっていて前回ビルドとの差分が表示されない おそらく対象ブランチがデフォルトでmainになっているが、自…
前々から気になっていたFigmaのStorybookと連携できるプラグインを試してみる www.figma.com これをやるにはChromaticにStorybookがパブリックにホスティングされている必要がある やり方は以下にまとめた uga-box.hatenablog.com これをみてやってみる www.…
Qiitaの@xrxoxcxoxさんと同じモチベーションでChromaticを試してみた qiita.com ChromaticはStorybookを利用したクラウドベースのツールチェーンで、主にVRT（ビジュアルリグレッションテスト）などに使われる www.chromatic.com さっそくやってみる まずは…
JackさんのNavigation APIの記事を読んで痺れた blog.jxck.io Navigation APIとは SPA（シングルページアプリケーション）の履歴管理について、既存のwindow.historyAPIを使った方法ではいくつかの問題がある 例えば、iframeの中の遷移履歴も含まれてしまっ…
最近のSEO対策では、そのサイトの信頼度も重要な指標になることを知った uga-box.hatenablog.com このとき、ちゃんと会社を証明するためにSSL証明書もOVかEVにしておくとよいみたいだが、それぞれ何かパッと説明できなかったのでまとめる ３種類の証明書 kno…
去年の記事だが下の記事を読んで最近のSEO対策をキャッチアップしたい web-kanji.com 自分の知識ではコンテンツの質と量の両方が大切で、誰も読まないようなページをたくさん用意しないことがよいと思っている 具体的にはGoogle Botが読みやすく、ちゃんとア…
iPhone SafariをMacでデバッグしたことはあったが、Android Chromeをしたことがなかったため調べた まずは、ただPCにケーブルでつなげればよいわけではなく設定が必要 developer.android.com 設定画面からUSBデバッグをONにする 以下の記事で知ったのだが、…
あるサイトでクリックしたらクリップボードに保存することをJavaScriptで実装していたが、その時のAPIが非推奨になっているのに気づいたので更新したい 非推奨になっているAPIはこれ document.execCommand("copy”) developer.mozilla.org これを以下の書き方…
作ったGifをFigmaで確認したい ただ、貼り付けだけでは動かないのでプラグインを入れる必要があった www.figma.com Gif画像そのものをFigmaで作りたい場合はGiffyCanvasというのが良いみたい www.figma.com note.com
今まで何でなかったのかが不思議だがGitで管理しているファイルを削除したときに、そのファイルをいつ消したのか、なぜ消したのかを調べるときにどうしたら良いのかがわからなかった Gitコマンドでやる方法を知ったのでメモ $ git log -- <ファイルPath> 単…
Lombokを使っていて、あるクラスに@BuilderをつけてBuilderパターンでインスタンス生成した projectlombok.org このインスタンスをcloneして、あるプロパティの値だけを上書きしたくなったので方法を調べた @Builder(toBuilder = true) @Builderのアノテーシ…
Google Java App Engine Standardのスタンダード環境がオープンソースになったことを知った cloud.google.com App Engine Javaランタイムをオープンソース化することで、ローカル開発環境、オンプレなどでAppEngine環境を必要な場所で実行できるようにするこ…
あるライブラリに対して<optional> true</optional>と<scope>provided</scope>を両方設定しているモジュールがあり、どちらもユーザーが任意に使用することを意味するものだと思っていたので、両方を設定する意味の違いがわらなかったので調べた optional= true <optional> true</optional>はあるモジュール内の任意の…
LombokとMapStructを同時に使う場合に注意が必要といのを知った Lombokよりも後に動くAnnotation Processorから、Lombokで自動生成されたBuilderが見えなくなっているとのこと github.com なのでpom.xmlで先にmapstruct-processorの依存を書いて、次にlombok…
次のようなグロナビをマークアップしている このとき、ある理由でこのグロナビに対してword-break: break-allとline-break: anywhereのスタイルをあてたら Safariのみ次のように表示崩れがおこった 幅が狭くなりsvgをposition: absoluteで右寄せにしているの…
Adobe DTMというタグマネージャーのときはそうなっていなかったが、Adobe Launchというタグマネージャーにサービスが移行してからダウンロードされるスクリプトがminifyされるようになった JSのダウンロードサイズが減るので嬉しいのだが、検証時にデバッグ…
LaunchというAdobeのタグマネージャーを利用している Launchでは管理するタグを修正した場合、公開フローに沿ってビルドして、テストして、実稼動用に承認するプロセスがある experienceleague.adobe.com 上記のページより拝借した図 このとき実稼動用に承認…
非同期APIのレスポンスの結果を表示するコンテンツがある このときレスポンスが表示されるまでスピナーを表示しておいてローディン中であることをユーザーに伝えているのだが、これがちゃんと表示されているかをテストしたい いままでChromeのネットワークス…
カスタマイズしたJackson2ObjectMapperBuilderを介して、ObjectMapperを独自の設定にすることができた これでどこで使っても同じ設定になるわけだが、悲しいことにある外部APIのレスポンスだけ期待とは違うことに気づいた 具体的にはプロパティ名がLOWER_CAM…
