メインコンテンツへスキップ
見出し画像

毎日書いた結果を、自分なりに分析したくて「積み上げノート」を作った|おはようカノジョ #52

    はじめに

    「おはようカノジョ」は、AIイラストの彼女が毎朝7:30にいってらっしゃいを言ってくれるXアカウント。

    noteのダッシュボードって便利だけど、フォロワー数の推移グラフがないのが地味に不便だった。

    「今何人」は分かるけど、「いつ増えたか」が分からない。
    記事を書いて反応を見たいのに、増えたのか減ったのか、昨日の数字すら思い出せない。


    作ろうと思った経緯

    毎日投稿を続けていると、気になることが出てくる。

    「今日はスキがいっぱいもらえた」「フォロワーさんが増えた気がする」
    でも、どの記事が効いたのか分からない。
    昨日の数字すら覚えてない。

    手軽に取れるフォロワー数を記録して、どういう記事に興味を持ってもらえるのか知りたいと思った。

    職業柄、WEBアプリがどういうAPIを叩いているかは見る癖がある。
    noteのクリエイターページにアクセスしたとき、裏で呼ばれているAPIを見つけた。
    フォロワー数などの情報がJSONで返ってくる。
    これは使えそう。

    # こういうURLにアクセスすると、クリエータページのデータがJSONで返ってくる
    https://note.com/api/v2/creators/ユーザID
    
    例:hasyamoの場合
    https://note.com/api/v2/creators/hasyamo

    このAPIを元に、簡単なWEBページを作ろうと思った。

    最初はGitHub Actionsで毎日自動取得する仕組みを作った。
    これで自分用としては完成。

    でも、ふと思った。
    「AIイラスト界隈のnoteユーザーにも使ってほしいけど、GitHubはハードル高いよな…」

    forkして、設定変えて、Actionsの権限設定して…って、エンジニア以外には厳しい。

    そこで発想を変えた。
    データをブラウザ内に保存すれば、forkなしで誰でも使えるのでは?

    PWA(Progressive Web App)にして、URLにアクセスするだけで使えるツールを作ることにした。


    作ったもの

    「積み上げノート」というPWAを作った。

    noteのフォロワー数を記録して、推移をグラフで見れるツール。
    iPhoneのホーム画面に追加すると、ほぼアプリみたいに使える。

    画像
    ホーム画面のアイコン
    画像
    ダッシュボード画面

    何ができるか

    開くとこんな感じ。

    • 現在のフォロワー数(大きく表示)

    • 前日比・週間・月間・累計の増減

    • フォロワー推移の折れ線グラフ

    • 日次増減の棒グラフ
      (増えた日は緑、減った日は赤)

    • 直近の記録テーブル

    画像
    グラフ画面
    画像
    直近の記録テーブル

    「今すぐ更新」ボタンを押すと、最新のフォロワー数を取得して記録に追加される。 毎日1回押すだけで、勝手にデータが溜まっていく。


    6日間使ってみた結果

    1/26から記録を始めて、今日で6日目。

    136人 → 146人で、週間+10人。

    日次の増減を見ると、1/29だけマイナス1になってる。 この日は何を投稿したっけ…と振り返るきっかけになる。

    逆に1/27は+4。この日の記事が効いたのかもしれない。

    こういう「なんとなく」が「数字」で見えるようになった。
    ただ、フォロワー数が減っているのも視覚化されるので、諸刃の剣でもある。


    技術的な話

    中身はシンプル。

    • HTML/CSS/JavaScript(フレームワークなし)

    • Chart.js(グラフ描画)

    • localStorage(データ保存)

    • PWA(ホーム画面に追加できる仕組み)

    noteの非公式APIからフォロワー数を取得してる。
    ブラウザから直接APIを叩くとCORSでブロックされるので、Cloudflare Workersでプロキシを作った。

    データはスマホのブラウザ内に保存される。
    サーバーには何も送らないので、使っている人以外誰もデータを見れない。


    注意点

    localStorageはブラウザのデータを消すと一緒に消える。 また、iOSのSafariは7日間アクセスがないとデータが自動削除される仕様がある。

    ただ、このツールは毎日開いて更新する想定なので、普通に使っていれば問題ない。
    7日以内にアクセスすれば期限は延長される。

    万が一に備えて、設定画面からJSONでエクスポートできるようにした。 消えてもインポートすれば復元できる。


    公開してます

    GitHub Pagesで公開してるので、誰でも使える。

    使い方は簡単で、

    1. URLにアクセス

    2. 自分のnoteクリエイターIDを入力(note.com/xxx のxxxの部分)

    3. 毎日開いて「今すぐ更新」を押す

    「ホーム画面に追加」すると、アプリみたいに使える。

    iPhoneの場合: Safariで開いて、共有ボタン(□に↑のアイコン)→「ホーム画面に追加」

    Androidの場合: Chromeで開いて、右上のメニュー(︙)→「ホーム画面に追加」または「アプリをインストール」

    注意点として、ブラウザで開いた場合とホーム画面から開いた場合でデータは別になる。 途中で切り替える場合は、設定画面からエクスポート→インポートでデータを引き継げる。


    今後やりたいこと

    記事の投稿日とフォロワー増減を紐付けて、「どの記事がフォロワー獲得に効いたか」を分析できるようにしたい。

    今はデータを溜めてる段階。
    しばらく使ってみて、改善点が見えてきたら追加していく。


    noteにない機能は、作ればいい。

    AIに手伝ってもらえば、週末だけで動くものができる。
    Claude Code様々です。

    もし使ってみて「こういう機能があるといいな」と思ったら、コメントで教えてもらえると嬉しい。


    この記事が参加しているマガジン

    【むぎ屋】note×AI活用推進マガジン

    AIを活用した記事作成やリサーチなど、AI×noteの実践を共有するマガジン。


    👉「おはようカノジョ」は @ohayo_kanojo で毎朝7:30に投稿しています。


    #個人開発
    #開発日記

    #生成AI
    #プログラミング
    #記録
    #実体験
    #朝活

    #アカリウム

    あなたへのおすすめ