はてぶ・Qiita・Zennのトレンド記事を紹介
JSなしでdialogタグを制御できるbuttonタグのcommand属性を試してみた
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、buttonタグの新しい属性であるcommand属性を使用して、JSなしでdialogタグを制御する方法をご紹介します。 なお、本稿の内容は2025年6月9日時点のHTML Living Standardと各ブラウザ
htmxのリクエストトリガーに別の要素のイベントを指定する方法 🔖 1
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、htmxのリクエストトリガーに別の要素のイベントを指定する方法をご紹介します。 htmxとは 実現したいこと hx-triggerのfrom:*で別の要素のイベントをトリガーに指定できる まとめ 参考文献 htmxと
textarea要素のサイズ変更を提供する方向を制御する方法 🔖 1
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、textarea要素のサイズ変更を提供する方向を制御する方法をご紹介します。 実現したいこと CSSプロパティのresizeで制御が可能 注意点 Tailwind CSSの場合 まとめ 参考文献 実現したいこと 冒頭
カスタムURLスキーム実装時に詰まったこと (スキームの指定について) 🔖 1
こんにちは。エキサイトでアプリエンジニアをしている岡島です。 最近、FlutterアプリでDeepLinkをカスタムURLスキームで実装する機会がありました。そのとき、動作確認のデバッグ用コマンドではカスタムURLスキームからアプリが起動するのですが、TestFlightで配布し
htmxでAJAXリクエスト時に送信されるパラメータをフィルタリングする方法 🔖 1
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、htmxでAJAXリクエスト時に送信されるパラメータをフィルタリングする方法をご紹介します。 なお、本稿の内容は v2.0.4(2025年4月28日時点の最新版)のhtmxを前提とします。 htmxとは 実現したいこ
Tailwind CSSでグラデーション背景をスタイリングする方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Tailwind CSSでグラデーション背景をスタイリングする方法をご紹介します。 なお、本稿ではv4.1(2025年4月21日時点の最新版)のTailwind CSSを前提とします。 実現したいこと Tailwin
SpringBootのapplication.ymlのデータをenumにマッピングする方法(SpringBoot)
エキサイト株式会社メディアプラットフォーム事業エンジニアの佐々木です。 Javaのenumは大変便利でかなり活用していますが、SpringBootなどのDIコンテナと絡めたときに、enumはDIできないのでapplication.ymlなどの環境ごとの動的データが使用できないこと
【Flutter × Riverpod】AsyncValueのvalue / valueOrNull / requireValueの違い
こんにちは。エキサイトでアプリエンジニアをしている岡島です。 今回はFlutterでRiverpodを利用する時に扱うAsyncValueの3つのプロパティ AsyncValue.value AsyncValue.valueOrNull AsyncValue.requireVal
Thymeleafのヘルパー関数を@Componentで実装する
エキサイト株式会社メディアプラットフォーム事業部エンジニアの佐々木です。テンプレートエンジンの関数のみだと足りないのでSpringBootの@Componentを使用して拡張します。 コード まとめ コード 現在時刻を返すだけの簡単なヘルパー関数を作ってみます。コードはJavaで
Tailwind CSSでスペーシングのベースサイズをカスタマイズする方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Tailwind CSSでスペーシングのベースサイズをカスタマイズする方法をご紹介します。 なお、本稿ではv4.1(2025年4月14日時点の最新版)のTailwind CSSを前提とします。 実現したいこと スペー
Alpine.jsでページ内で一意になる文字列を生成する方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Alpine.jsでページ内で一意になる文字列を生成する方法をご紹介します。 実現したいこと Alpine.jsの$idマジックが便利 x-id属性と組み合わせるとグルーピングができる まとめ 参考文献 実現したいこ
高速なテンプレートエンジンJTEをSpringBootで試す
エキサイト株式会社メディアプラットフォーム事業部エンジニア佐々木です。SpringBootのデファクトのテンプレートエンジンはThymeleafだと思いますが、JTEというテンプレートエンジンもここ最近Spring Initilizrで選べるようになりました。 プリコンパイルでき
[htmx] hx-triggerを使ってinfinitScrollを実装する方法[Java/Spring Boot]
はじめに こんにちは、新卒2年目の岡崎です。今回はhx-triggerを使ってinfinitScrollを実装する方法を紹介します。 環境 gradle ------------------------------------------------------------ Gr
【Flutter】flutter_flavorizrを用いて環境分けをする
こんにちは。エキサイトでアプリエンジニアをしている岡島です。 今回は、Flutterプロジェクトで環境ごとに設定を分けて開発・ビルドしたい場合に便利なツール、flutter_flavorizrを用いた環境構築方法を紹介したいと思います。 本記事では、開発(dev)、ステージング(
Tailwind CSSでbackground-sizeとbackground-positionの両方を任意の値で設定する方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Tailwind CSSでbackground-sizeとbackground-positionの両方を任意の値で設定する方法をご紹介します。 実現したいこと background-sizeとbackground-p
こんにちは、エキサイトでエンジニアをしている吉川です。 先日3/14(金)に社内イベントの「テクデザBeer Bash」を開催したので、運営視点でレポートを書いていきます。 テクデザBeer Bashとは Beer Bashとはbeer(ビール)+ bash(にぎやかなパーティー
htmxを使ってbuttonを押した際に別のページを表示する方法
はじめに こんにちは、新卒2年目の岡崎です。今回は、htmxを使ってbuttonを押した際に別のページを表示する方法を紹介します。 環境 gradle ------------------------------------------------------------ Gra
PHPで特殊文字をエスケープする方法 なぜ特殊文字をエスケープする必要があるのか PHPで特殊文字をエスケープする方法 コードの解説 最後に PHPで特殊文字をエスケープする方法 初めまして、新卒2年目の岡崎です。今回は、PHPでHTMLタグなどに使われる特殊文字をエスケープする
Tailwind CSSに標準搭載されているリセットCSSを無効にする方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Tailwind CSSに標準搭載されているリセットCSSを無効にする方法をご紹介します。 実現したいこと Preflightを無効にする方法 独自のリセットCSSを設定する まとめ 参考文献 実現したいこと 冒頭、
【Flutter】Chopperを用いてGitHubのAPIから検索結果を取得してみる
こんにちは。エキサイトでアプリエンジニアをしている岡島です。今回は業務でChopperというライブラリを使用したので、Chopperの基礎を説明しながら、GitHubのAPIで検索結果を取得するまでを記事にしていこうと思います。GitHubのAPIの仕様については省略します。 C
SpringBootのBeanスコープを@Scopeで使い分ける
エキサイト株式会社エンジニアの佐々木です。SpringBootのBeanスコープのデフォルトはSingletonですが、@Scopeを利用して使い分けていこうと思います。 Beanスコープとは? singleton request session prototype single
Google Ad Manager(GAM)でサードパーティクリエイティブのクリック数が取得できない場合の対処法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Google Ad Managerでサードパーティクリエイティブのクリック数が取得できない場合の対処法をご紹介します。 前提 実現したいこと クリックをトランキングするにはマクロの挿入が必要 クリックがトラッキングで
Tailwind CSSでHTML属性に対する疑似クラスのスタイリングをする方法
こんにちは。エキサイトでデザイナーをしている齋藤です。 今回は、Tailwind CSSでHTML属性に対する疑似要素のスタイリングをする方法をご紹介します。 実現したいこと Tailwind CSSで擬似クラスを指定する方法 注意点 CSS Tailwind CSS まとめ 参
【iOS/Android】環境別にAdMobのネイティブ広告バリデーターを非表示にする方法
こんにちは。エキサイトでアプリエンジニアをしている岡島です。 今回は、Google AdMobのネイティブ広告のバリデーターについて、環境別に表示非表示を切り替える方法を共有したいと思います。 本記事では環境設定に、Android は productFlavors を使用し、iO