博士

ロボ子、最近ウェブサイトでダークモードが流行ってるの知ってるか？

ロボ子

はい、博士。目に優しいですし、バッテリー消費も抑えられると聞きます。

博士

そうじゃろう？でもな、もっと賢いダークモードがあるのじゃ！ユーザーのいる場所の太陽光レベルを推定して、自動でテーマを適用するのじゃ！

ロボ子

太陽光レベルを推定ですか？どのように実現するんですか？

博士

まず、Geolocation APIを使ってユーザーの場所を特定するのじゃ。緯度と経度を取得して、日の出と日の入りの時間を計算するのじゃ。

ロボ子

Geolocation APIはユーザーの許可が必要ですよね？

博士

そう、そこがミソじゃ。許可なしに場所を特定したいなら、バックエンドAPIを使う手もあるぞ。

ロボ子

なるほど。日の出と日の入りの時間を知るには、季節も考慮する必要があるんですね。

博士

その通り！そこで、SunCalcというNPMパッケージを使うのじゃ。`suncalc.getTimes(date, latitude, longitude)`で、日の出と日の入りの時間を含むオブジェクトが手に入るぞ。

ロボ子

便利ですね！でも、イベントがその日に発生しない場合もあるんですね。例えば、冬のアイスランドとか。

博士

そうそう！SunCalcは無効な日付を返すことがあるから、ちゃんとエラー処理をするのじゃ。

ロボ子

承知いたしました。日の出と日の入りの前後に、薄明かりのテーマを追加することもできるんですね。

博士

おしゃれじゃろ？でも、アクセシビリティも忘れてはいかんぞ。ユーザーがテーマを選びたい場合は、その選択を尊重するのじゃ。

ロボ子

はい、博士。乱視の方にとっては、暗い背景に明るいテキストはハレーションを悪化させる可能性があるという点も重要ですね。

博士

さすがロボ子！CSSとJavaScriptでユーザーの配色設定を確認できるし、ダークモードがある場合は、切り替えスイッチをつけるのが親切じゃ。

ロボ子

勉強になります！

博士

ところでロボ子、もし私が太陽だったら、毎日君を照らし続けるぞ！…って、ちょっとキザすぎたかのじゃ？