Closed3

秒単位表示の時計画面 作成、Astro + Cloudflare pages

knaka Tech-Blogknaka Tech-Blog

概要

Astro 3 + Cloudflare pagesで、秒単位表示の時計表示を作成する

  • win11の、タスクバーの時計表示が小さく、あまり見えないので
  • 時計表示を自作する事にしました。

環境

  • Astro 3
  • React
  • Cloudflare pages

作成したコード

https://github.com/kuc-arc-f/astro3_5pg

  • 関連のパス、下記
    * /clock

knaka Tech-Blogknaka Tech-Blog

  • pages/clock/App.tsx
  • setTimeout: timer起動する
  • moment.js で、時刻の表示生成する
App.tsx
    const timer_func = async function(){
        const now = moment();
        mTimeStr = now.format("HH:mm:ss");
        updateTimestap();
        timeout_next();
    };    
    //
    function timeout_next(){
        mTimeoutId = setTimeout(timer_func, 1000 );
    } 
このスクラップは2023/09/18にクローズされました