<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/">
  <channel>
    <title>ITフリーランスの備忘的なにか</title>
    <link>https://zac-lab.com/</link>
    <description>Recent content on ITフリーランスの備忘的なにか</description>
    <generator>Hugo -- 0.143.0</generator>
    <language>ja</language>
    <lastBuildDate>Wed, 24 Sep 2025 10:26:36 +0900</lastBuildDate>
    <atom:link href="https://zac-lab.com/index.xml" rel="self" type="application/rss+xml" />
    <item>
      <title>お久しぶりの投稿です。最近の興味について。</title>
      <link>https://zac-lab.com/posts/20250924/</link>
      <pubDate>Wed, 24 Sep 2025 10:26:36 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250924/</guid>
      <description>&lt;p&gt;お久しぶりです。しばらくブログの更新が滞ってました。&lt;/p&gt;
&lt;p&gt;本日は雑談回でございます。ゆる～りと続けていきたいと思いますのでよろしくお願いします。&lt;/p&gt;
&lt;h1 id=&#34;新しいpcを購入しました&#34;&gt;新しいPCを購入しました&lt;/h1&gt;
&lt;p&gt;7月に新しいPCを購入しました！今まで最低限のスペックのノートPCを使って開発をしていたのですが、経年劣化により本体が発熱してきたことと、よりスペック高くして重めのアプリも複数立ち上げられるようにしたいなと思い、新たにデスクトップPCを購入しました！&lt;/p&gt;
&lt;p&gt;GALLERIA XA7R-R57-W AMD Ryzen 7 7700搭載モデル、価格は25万円ほど。コスパは結構良い方だと思いますが、個人的にはだいぶ奮発しました(＊ˊ艸ˋ)&lt;/p&gt;
&lt;h1 id=&#34;unityの練習を始めました&#34;&gt;Unityの練習を始めました&lt;/h1&gt;
&lt;p&gt;せっかく奮発してゲーミングPCを買ったので、Unityを使ったゲーム制作などに興味がわいてきました。今まで何冊かの書籍で勉強したことがある程度で、1から自分で作ったことはありません。&lt;/p&gt;
&lt;p&gt;練習のために、初心者におすすめといわれている定番のミニゲームを何個か作りました。&lt;/p&gt;
&lt;p&gt;9月中、1週間に1個のミニゲームを作るのを目標にして取り組んでいました。ある程度満足のいく出来のものもあれば、最後まで作り切らなかったものもありました。&lt;/p&gt;
&lt;p&gt;初めて作った4つのミニゲームを、順番にご紹介したいと思います。&lt;/p&gt;
&lt;h2 id=&#34;1-ブロック崩し&#34;&gt;1. ブロック崩し&lt;/h2&gt;
&lt;iframe src=&#34;https://player.vimeo.com/video/1121405056&#34; width=&#34;640&#34; height=&#34;360&#34; frameborder=&#34;0&#34; allow=&#34;autoplay; fullscreen; picture-in-picture&#34; allowfullscreen&gt;&lt;/iframe&gt;
&lt;p&gt;Unity初心者が一番初めに作ることをお勧めされる、定番ブロック崩しゲームです。
色合いがアレなのは横に置いておいて…。&lt;/p&gt;
&lt;p&gt;以下のような要素を学習することができました。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;コライダー、物理演算&lt;/li&gt;
&lt;li&gt;UIでスコアを表示&lt;/li&gt;
&lt;li&gt;Prefabでブロックを量産&lt;/li&gt;
&lt;li&gt;シーン制御（Title画面、Game画面）&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;単純な物理演算のみだと、ボールが同じところを行ったり来たりしてしまい手が出せなくなってしまったので、若干ボールの軌道を修正するようなスクリプトを仕込むなどしました。&lt;/p&gt;
&lt;h2 id=&#34;2-横スクロールジャンプアクションゲーム&#34;&gt;2. 横スクロールジャンプアクションゲーム&lt;/h2&gt;
&lt;iframe src=&#34;https://player.vimeo.com/video/1121407302&#34; width=&#34;640&#34; height=&#34;360&#34; frameborder=&#34;0&#34; allow=&#34;autoplay; fullscreen; picture-in-picture&#34; allowfullscreen&gt;&lt;/iframe&gt;
&lt;p&gt;いわゆる、マリオ風の横スクロールゲームです。素材は適当にネットから拾ってきたものを使用しました。&lt;/p&gt;
&lt;p&gt;新しい要素としては以下などです。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;入力制御、ジャンプ&lt;/li&gt;
&lt;li&gt;カメラ追従（Cinemachine）&lt;/li&gt;
&lt;li&gt;タイルマップ、ステージ作成&lt;/li&gt;
&lt;li&gt;アニメーション&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;カメラ追従のためにCinemachine、マップ作成のためにタイルマップと、初めての要素が多く、一週間では全然作り切ることができませんでした。。&lt;/p&gt;
&lt;p&gt;パッと見た感じはそれっぽくできてますが、プレイヤーはダミーのまま。敵も行ったり来たりしてほしいところが、途中で止まってしまってます。&lt;/p&gt;
&lt;p&gt;とりあえず要素は理解したので、深追いせずに次のゲームに着手します。&lt;/p&gt;
&lt;h2 id=&#34;3-シューティングゲーム&#34;&gt;3. シューティングゲーム&lt;/h2&gt;
&lt;iframe src=&#34;https://player.vimeo.com/video/1121407366&#34; width=&#34;640&#34; height=&#34;360&#34; frameborder=&#34;0&#34; allow=&#34;autoplay; fullscreen; picture-in-picture&#34; allowfullscreen&gt;&lt;/iframe&gt;
&lt;p&gt;シューティングゲームもUnityの練習としては定番ですね。&lt;/p&gt;
&lt;p&gt;以下の要素を学びました。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;玉発射（instanticate）&lt;/li&gt;
&lt;li&gt;敵出現（Wave制御）&lt;/li&gt;
&lt;li&gt;ライフ管理&lt;/li&gt;
&lt;li&gt;爆発エフェクト&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;ザコ敵1ウェーブ、ザコ敵2ウェーブ→ボス敵ウェーブ、とウェーブ遷移になっています。
ザコ敵のジグザグ動きや、ボス敵の放射状攻撃などのスクリプトは、生成AIを活用して実装しています。
それらしくできたかなと思います。&lt;/p&gt;
&lt;h2 id=&#34;4-落ちものパズルゲーム&#34;&gt;4. 落ちものパズルゲーム&lt;/h2&gt;
&lt;iframe src=&#34;https://player.vimeo.com/video/1121407412&#34; width=&#34;640&#34; height=&#34;360&#34; frameborder=&#34;0&#34; allow=&#34;autoplay; fullscreen; picture-in-picture&#34; allowfullscreen&gt;&lt;/iframe&gt;
&lt;p&gt;落ちものパズル系だと、定番はテトリスやぷよぷよですが、開発時間の関係でもう少し簡単そうなConnect4を作りました。&lt;/p&gt;
&lt;p&gt;ユーザー2名が交互に赤色と黄色のコインを落としていき、先に4つの色を縦・横・ナナメにそろえた方が勝ち、というゲームです。&lt;/p&gt;
&lt;p&gt;以下の要素を学びました。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;グリッド管理&lt;/li&gt;
&lt;li&gt;配列、座標変換&lt;/li&gt;
&lt;li&gt;チェック判定&lt;/li&gt;
&lt;li&gt;効果音&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;コネクト4として二人で遊べるようにできたので、最低限の要素は実装できたかなと思います。
娘と二人で遊んでみましたが結構面白かったですｗ&lt;/p&gt;</description>
      <content:encoded><![CDATA[<p>お久しぶりです。しばらくブログの更新が滞ってました。</p>
<p>本日は雑談回でございます。ゆる～りと続けていきたいと思いますのでよろしくお願いします。</p>
<h1 id="新しいpcを購入しました">新しいPCを購入しました</h1>
<p>7月に新しいPCを購入しました！今まで最低限のスペックのノートPCを使って開発をしていたのですが、経年劣化により本体が発熱してきたことと、よりスペック高くして重めのアプリも複数立ち上げられるようにしたいなと思い、新たにデスクトップPCを購入しました！</p>
<p>GALLERIA XA7R-R57-W AMD Ryzen 7 7700搭載モデル、価格は25万円ほど。コスパは結構良い方だと思いますが、個人的にはだいぶ奮発しました(＊ˊ艸ˋ)</p>
<h1 id="unityの練習を始めました">Unityの練習を始めました</h1>
<p>せっかく奮発してゲーミングPCを買ったので、Unityを使ったゲーム制作などに興味がわいてきました。今まで何冊かの書籍で勉強したことがある程度で、1から自分で作ったことはありません。</p>
<p>練習のために、初心者におすすめといわれている定番のミニゲームを何個か作りました。</p>
<p>9月中、1週間に1個のミニゲームを作るのを目標にして取り組んでいました。ある程度満足のいく出来のものもあれば、最後まで作り切らなかったものもありました。</p>
<p>初めて作った4つのミニゲームを、順番にご紹介したいと思います。</p>
<h2 id="1-ブロック崩し">1. ブロック崩し</h2>
<iframe src="https://player.vimeo.com/video/1121405056" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
<p>Unity初心者が一番初めに作ることをお勧めされる、定番ブロック崩しゲームです。
色合いがアレなのは横に置いておいて…。</p>
<p>以下のような要素を学習することができました。</p>
<ul>
<li>コライダー、物理演算</li>
<li>UIでスコアを表示</li>
<li>Prefabでブロックを量産</li>
<li>シーン制御（Title画面、Game画面）</li>
</ul>
<p>単純な物理演算のみだと、ボールが同じところを行ったり来たりしてしまい手が出せなくなってしまったので、若干ボールの軌道を修正するようなスクリプトを仕込むなどしました。</p>
<h2 id="2-横スクロールジャンプアクションゲーム">2. 横スクロールジャンプアクションゲーム</h2>
<iframe src="https://player.vimeo.com/video/1121407302" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
<p>いわゆる、マリオ風の横スクロールゲームです。素材は適当にネットから拾ってきたものを使用しました。</p>
<p>新しい要素としては以下などです。</p>
<ul>
<li>入力制御、ジャンプ</li>
<li>カメラ追従（Cinemachine）</li>
<li>タイルマップ、ステージ作成</li>
<li>アニメーション</li>
</ul>
<p>カメラ追従のためにCinemachine、マップ作成のためにタイルマップと、初めての要素が多く、一週間では全然作り切ることができませんでした。。</p>
<p>パッと見た感じはそれっぽくできてますが、プレイヤーはダミーのまま。敵も行ったり来たりしてほしいところが、途中で止まってしまってます。</p>
<p>とりあえず要素は理解したので、深追いせずに次のゲームに着手します。</p>
<h2 id="3-シューティングゲーム">3. シューティングゲーム</h2>
<iframe src="https://player.vimeo.com/video/1121407366" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
<p>シューティングゲームもUnityの練習としては定番ですね。</p>
<p>以下の要素を学びました。</p>
<ul>
<li>玉発射（instanticate）</li>
<li>敵出現（Wave制御）</li>
<li>ライフ管理</li>
<li>爆発エフェクト</li>
</ul>
<p>ザコ敵1ウェーブ、ザコ敵2ウェーブ→ボス敵ウェーブ、とウェーブ遷移になっています。
ザコ敵のジグザグ動きや、ボス敵の放射状攻撃などのスクリプトは、生成AIを活用して実装しています。
それらしくできたかなと思います。</p>
<h2 id="4-落ちものパズルゲーム">4. 落ちものパズルゲーム</h2>
<iframe src="https://player.vimeo.com/video/1121407412" width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
<p>落ちものパズル系だと、定番はテトリスやぷよぷよですが、開発時間の関係でもう少し簡単そうなConnect4を作りました。</p>
<p>ユーザー2名が交互に赤色と黄色のコインを落としていき、先に4つの色を縦・横・ナナメにそろえた方が勝ち、というゲームです。</p>
<p>以下の要素を学びました。</p>
<ul>
<li>グリッド管理</li>
<li>配列、座標変換</li>
<li>チェック判定</li>
<li>効果音</li>
</ul>
<p>コネクト4として二人で遊べるようにできたので、最低限の要素は実装できたかなと思います。
娘と二人で遊んでみましたが結構面白かったですｗ</p>
<h1 id="次のステップへ">次のステップへ</h1>
<p>Unityの練習のためにいくつかミニゲームを作成し、2Dゲームについては少しずつ自信がついてきました。
なので次のステップとしては、3Dゲームの方にも着手して行きたいと考えています。</p>
<p>本業の傍らではありますが、焦らずにじっくりと習得していきたいと思います💪</p>
]]></content:encoded>
    </item>
    <item>
      <title>ExpoアプリのターゲットAPIレベルをアップグレードした話</title>
      <link>https://zac-lab.com/posts/20250726/</link>
      <pubDate>Sat, 26 Jul 2025 14:59:54 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250726/</guid>
      <description>Google Play Consoleから送られてきたターゲットAPIレベル更新の通知に対応した記録。Expo SDKのアップグレードから再提出まで、初めての経験をまとめました。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>Expoで開発したAndroidアプリのターゲットAPIレベルをアップグレードしました。今回は、Google Play Consoleから送られてきた通知への対応として、初めて経験した手順を記録として残しておきます。</p>
<h2 id="ことの経緯">ことの経緯</h2>
<p>今年5月に初めてGoogle Play Storeに公開したアプリに関して、Googleから以下のようなメールが届きました。</p>
<p><img alt="Google Play Consoleからの通知メール" loading="lazy" src="/posts/20250726/mail.png"></p>
<p>内容を要約すると、現在のAndroid SDKのバージョンが古いため、8月末までに修正するようにというものでした。</p>
<p>このような内容のメールを受け取ったのは初めてだったので、対応方法を調べながら実際に作業した内容を共有したいと思います。</p>
<h2 id="対応した内容">対応した内容</h2>
<p>最初は生成AIに相談しながら試行錯誤していたのですが、実は公式ドキュメントに完璧に手順が載っていました(・ω・;)　やはり最初から公式ドキュメントを確認すべきでしたね。</p>
<p>参考にしたのは以下の公式ドキュメントです。</p>
<ul>
<li><a href="https://docs.expo.dev/workflow/upgrading-expo-sdk-walkthrough/" target="_blank">Expo SDK のアップグレード</a>
</li>
</ul>
<h3 id="実際の作業手順">実際の作業手順</h3>
<p>大まかな流れは、Expo SDKを最新版にアップグレードした上で、再度ビルドし直してGoogle Play Storeに再提出すれば良いということでした。</p>
<p>以下のコマンドで作業を進めました。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span><span style="color:#75715e"># Expoを最新版にアップグレード</span>
</span></span><span style="display:flex;"><span>npx expo install expo@latest
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># 周辺ツールの整合性を保つため、依存関係をアップグレード</span>
</span></span><span style="display:flex;"><span>npx expo install --fix
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># プロダクション用のAndroidビルドを実行</span>
</span></span><span style="display:flex;"><span>eas build --platform android --profile production
</span></span></code></pre></div><h3 id="ビルド後の作業">ビルド後の作業</h3>
<p>ビルドが完了すると、新しいAABファイル（Android App Bundle）が生成されます。このファイルをGoogle Play Consoleにアップロードして、再提出の審査を申請します。</p>
<p>今回は１時間も経たずに承認されました。</p>
<h2 id="最後に">最後に</h2>
<p>初めての経験だったので最初は面倒だなと思い、重い腰を上げて対応したのですが、実際にやってみると難しいことはなく、サクッと完了できました。</p>
<p>特にExpoを使っている場合は、公式ドキュメントに従えば比較的簡単に対応できるので、同じような状況に陥った方の参考になればと思います。</p>
<p>また、ネットで調べた限り、このような通知は毎年この時期に来るようなので、Google Play Storeの恒例行事の一つかもしれません。今後は事前に対応できるよう、定期的なアップデートを心がけたいと思います。</p>
<p>来年また慌てないように、この記事を残しておきます。</p>
<p>では、また次回の記事でお会いしましょう。</p>
]]></content:encoded>
    </item>
    <item>
      <title>Cloudflare WorkersにNext.jsアプリ(Supabase使用)をデプロイする</title>
      <link>https://zac-lab.com/posts/20250620/</link>
      <pubDate>Fri, 20 Jun 2025 18:24:08 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250620/</guid>
      <description>Cloudflare WorkersにNext.jsアプリをデプロイする際の設定方法とハマったポイントを紹介。Supabaseとの組み合わせでの環境変数設定やCI/CDの構築について解説します。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>先日、新しく作ったWebアプリをCloudflare Workers上にデプロイしました。今回はその際にハマったポイントや設定方法について記録しておきます。</p>
<p>Cloudflare Workersは従来、単純な関数実行基盤という印象でしたが、最近ではNext.jsアプリの本格的なデプロイも可能になっており、非常に魅力的な選択肢となっています。まだまだ日本語の情報が少ないため、今回の経験を共有したいと思います。</p>
<h2 id="cloudflare-pagesからcloudflare-workersへ">Cloudflare PagesからCloudflare Workersへ</h2>
<p>今回、新しいアプリを作成してCloudflareにデプロイしようとしました。今まではCloudflare Pagesを使用していたのですが、新しくプロジェクトを作成しようとしたところ、Cloudflare Workersを使用するように、とのメッセージが表示されました。</p>
<p><img alt="Pagesの開始画面" loading="lazy" src="/posts/20250620/screen1.png"></p>
<p>Cloudflare Workersは、従来の関数実行基盤の枠を超えて、最近ではNext.jsアプリの本格的なデプロイも可能になっており、Cloudflare Pagesとほぼ同等の基盤になってきています。Cloudflareとしても、今後はWorkersの開発に注力していくことを宣言しています。</p>
<p>そこで今回は、Cloudflare Workers上にデプロイを試みました。以下、ハマったポイントなどを詳しく紹介します。</p>
<h2 id="デプロイ手順">デプロイ手順</h2>
<h3 id="プロジェクトにworkers用の設定を追加">プロジェクトにWorkers用の設定を追加</h3>
<p>Cloudflareの公式マニュアルを参考に設定を行いました。</p>
<p><a href="https://developers.cloudflare.com/workers/framework-guides/web-apps/nextjs/" target="_blank">https://developers.cloudflare.com/workers/framework-guides/web-apps/nextjs/</a>
</p>
<p>今回のアプリではSupabaseを組み込んでおり、実行時の環境変数を設定する必要があったため、<code>wrangler.toml</code>ファイルで<code>[vars]</code>セクションを使用して定義しました。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-toml" data-lang="toml"><span style="display:flex;"><span><span style="color:#a6e22e">main</span> = <span style="color:#e6db74">&#34;.open-next/worker.js&#34;</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">name</span> = <span style="color:#e6db74">&#34;my-app&#34;</span>     <span style="color:#75715e"># ここにアプリ名を入力</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">compatibility_date</span> = <span style="color:#e6db74">&#34;2025-03-25&#34;</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">compatibility_flags</span> = [<span style="color:#e6db74">&#34;nodejs_compat&#34;</span>]
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>[<span style="color:#a6e22e">assets</span>]
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">directory</span> = <span style="color:#e6db74">&#34;.open-next/assets&#34;</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">binding</span> = <span style="color:#e6db74">&#34;ASSETS&#34;</span>
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>[<span style="color:#a6e22e">vars</span>]  <span style="color:#75715e"># 実行時の環境変数を定義</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">NEXT_PUBLIC_SUPABASE_URL</span> = <span style="color:#e6db74">&#34;https://XXX.supabase.co&#34;</span>
</span></span><span style="display:flex;"><span><span style="color:#a6e22e">NEXT_PUBLIC_SUPABASE_ANON_KEY</span> = <span style="color:#e6db74">&#34;XXXXXXXXXX&#34;</span>
</span></span></code></pre></div><h3 id="cloudflare-workersの設定">Cloudflare Workersの設定</h3>
<p>GitHubとCloudflare Workersを連携し、ソースコードに変更があった際に自動でデプロイが実行されるようにCI/CDを設定します。</p>
<p>まず、Cloudflare Workersの開始ページから「リポジトリをインポートする」から開始します。</p>
<p><img alt="Workersの開始画面" loading="lazy" src="/posts/20250620/screen2.png"></p>
<p>リポジトリを選択すると、プロジェクトの構成画面に遷移します。</p>
<p><img alt="プロジェクト構成画面" loading="lazy" src="/posts/20250620/screen3.png"></p>
<p>どのブランチの変更を検知するかを選択し、「非本番ブランチのビルド」はチェックを外しました。</p>
<p>ここで重要なポイントが2つあります。</p>
<h4 id="1-ビルドおよびデプロイのコマンドを変更">1. ビルドおよびデプロイのコマンドを変更</h4>
<p><img alt="ビルドおよびデプロイのコマンド" loading="lazy" src="/posts/20250620/screen4.png"></p>
<p>ビルドコマンドには<code>npx opennextjs-cloudflare build</code>を、デプロイコマンドには<code>npx opennextjs-cloudflare deploy</code>を設定します。</p>
<p>デフォルトのコマンドのままでビルドを実行すると、以下のエラーが発生しました。</p>
<pre tabindex="0"><code>✘ [ERROR] The entry-point file at &#34;.open-next/worker.js&#34; was not found.
</code></pre><p>このエラーは、Next.jsアプリをWorkers用にビルドする際に、専用のビルドコマンドが必要なために発生します。<code>opennextjs-cloudflare</code>パッケージが、Next.jsアプリをWorkers環境で動作するように変換してくれます。</p>
<h4 id="2-ビルド変数を設定">2. ビルド変数を設定</h4>
<p><img alt="ビルド変数" loading="lazy" src="/posts/20250620/screen5.png"></p>
<p><code>wrangler.toml</code>の中で<code>[vars]</code>で定義したのは、実行時の環境変数です。今回はクライアント側でもSupabaseを使用する構成にしていたため、ビルド時の環境変数も設定する必要がありました。同じ内容でCloudflare Workersの管理画面から設定しました。</p>
<p>この設定を行わないと、ビルド時に環境変数が存在しないというエラーが発生しました。</p>
<p>その他、細かい点では<code>esbuild</code>パッケージが存在しないというエラーが発生したため、追加でインストールするなどの対応を行い、ようやくデプロイが完了しました。</p>
<h2 id="まとめ">まとめ</h2>
<p>今後よく使用していくであろうCloudflare Workersのデプロイ手順について紹介しました。まだ日本語のドキュメントが少ない印象ですので、この記事が参考になれば幸いです。</p>
<p>特にSupabaseと組み合わせた場合の設定は、環境変数の設定が重要になります。ビルド時と実行時の両方で環境変数を適切に設定することで、スムーズにデプロイできるようになります。</p>
<p>Cloudflare Workersは今後も機能拡張が予定されており、Next.jsアプリのデプロイ先として非常に魅力的な選択肢となっています。ぜひ試してみてください。</p>
]]></content:encoded>
    </item>
    <item>
      <title>AdMobの審査が無事、完了しました</title>
      <link>https://zac-lab.com/posts/20250522/</link>
      <pubDate>Thu, 22 May 2025 14:09:10 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250522/</guid>
      <description>&lt;h2 id=&#34;はじめに&#34;&gt;はじめに&lt;/h2&gt;
&lt;p&gt;&lt;a href=&#34;https://zac-lab.com/posts/20250521&#34;&gt;昨日のポスト&lt;/a&gt;
にも記載しましたが、課題として残っていたAdMobの審査が完了しました。今回は、その承認までの流れをまとめておきます。&lt;/p&gt;
&lt;h2 id=&#34;admob承認までの流れ&#34;&gt;AdMob承認までの流れ&lt;/h2&gt;
&lt;h3 id=&#34;1admobにアプリをリンクする&#34;&gt;1.AdMobにアプリをリンクする&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;AdMobのアプリとGoogle Playストアのアプリを紐づける必要があります。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;AdMobの「アプリ」タブから「すべてのアプリを表示」でアプリを一覧表示し、対象のアプリの「ストアを追加」リンクをクリックします。&lt;/p&gt;
&lt;p&gt;&lt;img alt=&#34;アプリ一覧&#34; loading=&#34;lazy&#34; src=&#34;https://zac-lab.com/posts/20250522/screen1.png&#34;&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;次に、アプリのURLを入力して検索し、アプリを追加します。&lt;/p&gt;
&lt;p&gt;&lt;img alt=&#34;アプリにストア情報を追加する&#34; loading=&#34;lazy&#34; src=&#34;https://zac-lab.com/posts/20250522/screen2.png&#34;&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;ここに表示されるまでに、Google Playストアでアプリが公開されてから丸一日程度かかりました。何週間も表示されない場合は、AdMobのフォーラムに投稿して助けを求めたら解決したというブログ記事をいくつも見つけたため、何日も待つことを覚悟していましたが、思いのほかスムーズに進みました。&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;2app-adstxtを設定する&#34;&gt;2.app-ads.txtを設定する&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;組織サイトのルートパスに、app-ads.txtという名前のファイルを配置する必要があります。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;内容はダッシュボードに記載の内容をコピー＆ペーストするだけです。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;これはアプリごとではなく、アカウントごとに1回実施すればよいようです。&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h3 id=&#34;3admob承認&#34;&gt;3.AdMob承認&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;アプリにストアの情報を追加したら、特に操作せずとも自動的に審査に入りました。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;審査中のステータスになってから2〜3時間後に承認された旨のメールを受け取りました。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;通常、24時間以内に承認されるとのことです。&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id=&#34;さいごに&#34;&gt;さいごに&lt;/h2&gt;
&lt;p&gt;AdMobの審査は思いのほかスムーズに進めることができました。
これにて、Google Playストアにアプリをリリースする一連の手順を理解することができました。
今後は、このアプリを英語化したり海外のストアにも配信してみるのをやってみたいと思います。&lt;/p&gt;</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p><a href="/posts/20250521">昨日のポスト</a>
にも記載しましたが、課題として残っていたAdMobの審査が完了しました。今回は、その承認までの流れをまとめておきます。</p>
<h2 id="admob承認までの流れ">AdMob承認までの流れ</h2>
<h3 id="1admobにアプリをリンクする">1.AdMobにアプリをリンクする</h3>
<ul>
<li>
<p>AdMobのアプリとGoogle Playストアのアプリを紐づける必要があります。</p>
</li>
<li>
<p>AdMobの「アプリ」タブから「すべてのアプリを表示」でアプリを一覧表示し、対象のアプリの「ストアを追加」リンクをクリックします。</p>
<p><img alt="アプリ一覧" loading="lazy" src="/posts/20250522/screen1.png"></p>
</li>
<li>
<p>次に、アプリのURLを入力して検索し、アプリを追加します。</p>
<p><img alt="アプリにストア情報を追加する" loading="lazy" src="/posts/20250522/screen2.png"></p>
</li>
<li>
<p>ここに表示されるまでに、Google Playストアでアプリが公開されてから丸一日程度かかりました。何週間も表示されない場合は、AdMobのフォーラムに投稿して助けを求めたら解決したというブログ記事をいくつも見つけたため、何日も待つことを覚悟していましたが、思いのほかスムーズに進みました。</p>
</li>
</ul>
<h3 id="2app-adstxtを設定する">2.app-ads.txtを設定する</h3>
<ul>
<li>
<p>組織サイトのルートパスに、app-ads.txtという名前のファイルを配置する必要があります。</p>
</li>
<li>
<p>内容はダッシュボードに記載の内容をコピー＆ペーストするだけです。</p>
</li>
<li>
<p>これはアプリごとではなく、アカウントごとに1回実施すればよいようです。</p>
</li>
</ul>
<h3 id="3admob承認">3.AdMob承認</h3>
<ul>
<li>
<p>アプリにストアの情報を追加したら、特に操作せずとも自動的に審査に入りました。</p>
</li>
<li>
<p>審査中のステータスになってから2〜3時間後に承認された旨のメールを受け取りました。</p>
</li>
<li>
<p>通常、24時間以内に承認されるとのことです。</p>
</li>
</ul>
<h2 id="さいごに">さいごに</h2>
<p>AdMobの審査は思いのほかスムーズに進めることができました。
これにて、Google Playストアにアプリをリリースする一連の手順を理解することができました。
今後は、このアプリを英語化したり海外のストアにも配信してみるのをやってみたいと思います。</p>
]]></content:encoded>
    </item>
    <item>
      <title>初めてのAndroidアプリをGoogle Play ストアに公開しました</title>
      <link>https://zac-lab.com/posts/20250521/</link>
      <pubDate>Wed, 21 May 2025 17:20:52 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250521/</guid>
      <description>Expoで開発したAndroidアプリをGoogle Play ストアに初公開した実体験を紹介。ストア掲載情報の設定、審査依頼、AdMob連携まで、個人開発者が知っておくべき公開手順を詳しく解説します。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>これまでいくつかの記事で触れてきましたが、ついに初めてのAndroidアプリをGoogle Play ストアで公開することができました！㊗️</p>
<p>本記事では、Expoで開発したアプリの紹介と、Google Play ストアへの公開手順について詳しく解説します。</p>
<h2 id="アプリの概要">アプリの概要</h2>
<p>🔗 <a href="https://play.google.com/store/apps/details?id=com.gijinlab.unitpricechecker" target="_blank">どっちがおトク？ 単価チェッカー</a>
</p>
<p><img alt="Google Play ストア画面" loading="lazy" src="/posts/20250521/screen19.png"></p>
<p>このアプリは、2つの商品の「価格」と「量」を入力するだけで、どちらの商品がお得かを瞬時に計算して表示します。</p>
<p>初めてのアプリということで、シンプルかつ実用的な機能に絞り、私自身が日常的に使いたいと思えるものを作りました。また、収益化の一環として広告も実装しています。</p>
<p>類似アプリが多数存在する中での審査通過を心配していましたが、問題なく承認されました。キーボードの挙動や画面レイアウトなど、使いやすさを重視して調整を重ねていますので、ぜひインストールしてご利用ください😊</p>
<h2 id="アプリを公開するまでの手順">アプリを公開するまでの手順</h2>
<h3 id="1-easでストア提出用ビルドを作成">1. EASでストア提出用ビルドを作成</h3>
<ul>
<li>
<p>事前に、AdMobの広告ユニットIDを本番用にしておきます。</p>
</li>
<li>
<p>以下のコマンドでストア提出用のビルドを作成します。</p>
</li>
</ul>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>eas build --platform android --profile production
</span></span></code></pre></div><ul>
<li>ビルド完了後、ExpoのダッシュボードからAABファイルをダウンロードします。このファイルは後ほどGoogle Play Consoleでアップロードします。</li>
</ul>
<h3 id="2-google-play-consoleでアプリを作成">2. Google Play Consoleでアプリを作成</h3>
<ul>
<li>
<p>Google Play Consoleのホーム画面から「アプリを作成」をクリックします。</p>
<p><img alt="アプリ作成" loading="lazy" src="/posts/20250521/screen1.png"></p>
</li>
<li>
<p>デフォルトの言語は、（後々は海外マーケットも狙っていきたいとは思いますが、一旦）日本語にしておきます。</p>
</li>
<li>
<p>アプリ/ゲームの区分を選択します。</p>
</li>
<li>
<p>申告事項に同意してアプリを作成します。</p>
</li>
</ul>
<h3 id="3-ストア掲載情報の設定">3. ストア掲載情報の設定</h3>
<p>新規作成したアプリのダッシュボードから、「アプリのセットアップ」＞「アプリに関する情報を提供し、ストアの掲載情報を設定します」のセクションに表示されているタスクを順次対応していきます。
<img alt="タスク一覧" loading="lazy" src="/posts/20250521/screen2.png"></p>
<h4 id="プライバシーポリシーの設定">プライバシーポリシーの設定</h4>
<ul>
<li>
<p>プライバシーポリシーのURLを設定します。
<img alt="プライバシーポリシーの設定" loading="lazy" src="/posts/20250521/screen3.png"></p>
</li>
<li>
<p>今回はCloudflare Pagesを使用して、HTMLファイルで作成したプライバシーポリシーを直接アップロードする形で公開しました。</p>
</li>
</ul>
<h4 id="アプリのアクセス権">アプリのアクセス権</h4>
<ul>
<li>認証が必要な機能がある場合は、事前に認証情報を連携する必要があります。
<img alt="アプリのアクセス権の設定" loading="lazy" src="/posts/20250521/screen4.png"></li>
</ul>
<h4 id="広告の設定">広告の設定</h4>
<ul>
<li>アプリ内での広告表示の有無を申告します。
<img alt="広告の設定" loading="lazy" src="/posts/20250521/screen5.png"></li>
</ul>
<h4 id="コンテンツのレーティング">コンテンツのレーティング</h4>
<ul>
<li>年齢制限に関わるコンテンツの有無を申告します。画面の指示に従って回答を進めます。
<img alt="コンテンツのレーティングの設定1" loading="lazy" src="/posts/20250521/screen6.png">
<img alt="コンテンツのレーティングの設定2" loading="lazy" src="/posts/20250521/screen7.png"></li>
</ul>
<h4 id="ターゲットユーザー">ターゲットユーザー</h4>
<ul>
<li>
<p>アプリの対象ユーザー層を設定します。13歳未満をターゲットとする場合は、より厳格な基準を満たす必要があります。
<img alt="ターゲット ユーザーの設定2" loading="lazy" src="/posts/20250521/screen8.png"></p>
</li>
<li>
<p>今回のアプリは、一人で買い物をする可能性のある中学生以上を想定しているため、13歳以上を対象としています。</p>
</li>
</ul>
<h4 id="データセーフティ">データセーフティ</h4>
<ul>
<li>
<p>収集するデータの種類を申告します。
<img alt="データ セーフティの設定1" loading="lazy" src="/posts/20250521/screen9.png">
<img alt="データ セーフティの設定2" loading="lazy" src="/posts/20250521/screen10.png"></p>
</li>
<li>
<p>今回は広告表示のみで、ユーザーデータの収集は行わないため、「いいえ」と回答しました。</p>
</li>
</ul>
<h4 id="行政アプリ">行政アプリ</h4>
<ul>
<li>行政から配信されるアプリかどうかを申告します。
<img alt="行政アプリの設定" loading="lazy" src="/posts/20250521/screen11.png"></li>
</ul>
<h4 id="金融取引機能">金融取引機能</h4>
<ul>
<li>金融取引機能をもつかどうか、どのような取引か、などを申告します。
<img alt="金融取引機能の設定" loading="lazy" src="/posts/20250521/screen12.png"></li>
</ul>
<h4 id="健康">健康</h4>
<ul>
<li>健康関連の機能があるかどうか、どのような機能か、などを申告します。
<img alt="健康の設定" loading="lazy" src="/posts/20250521/screen13.png"></li>
</ul>
<h4 id="アプリカテゴリと連絡先情報">アプリカテゴリと連絡先情報</h4>
<ul>
<li>アプリのカテゴリ、タグ、およびストアに表示する連絡先情報を設定します。
<img alt="カテゴリ、連絡先情報の設定" loading="lazy" src="/posts/20250521/screen14.png"></li>
</ul>
<h4 id="ストアの掲載情報">ストアの掲載情報</h4>
<ul>
<li>
<p>アプリ名、説明文、アイコン、フィーチャーグラフィック（検索結果一覧などに表示される横長の画像）、スクリーンショット等を設定します。
<img alt="ストアの掲載情報の作成" loading="lazy" src="/posts/20250521/screen15.png">
<img alt="ストアの掲載情報の作成" loading="lazy" src="/posts/20250521/screen16.png">
<img alt="ストアの掲載情報の作成" loading="lazy" src="/posts/20250521/screen17.png"></p>
</li>
<li>
<p>今回は、画像類はPowerPointで作成し、エクスポートしたものを使用しました。</p>
</li>
</ul>
<h3 id="4-審査依頼">4. 審査依頼</h3>
<ul>
<li>
<p>「公開の概要」タブから自動チェックを実行し、問題がなければ審査を依頼します。</p>
</li>
<li>
<p>今回、審査にかかった期間は約3日間でした（最大7日間の可能性あり）。</p>
</li>
<li>
<p>その後、パッケージ名の誤りにより新しいアプリとして再申請を行いましたが、2回目の審査は2〜3時間で完了しました。（ありがたい！！）</p>
</li>
</ul>
<h3 id="5-admobとの連携">5. AdMobとの連携</h3>
<ul>
<li>
<p>AdMobで事前登録したアプリに、Google Play ストアの情報を紐づけます。
<img alt="アプリにストア情報を追加する" loading="lazy" src="/posts/20250521/screen18.png"></p>
</li>
<li>
<p>現在、ストアのURLを入力してもアプリが検索されないという課題が残っています。これはストア側のクローラーの更新に時間がかかるためだと考えられます。数週間待っても解決しない場合は、AdMobのフォーラムで質問したらすぐに解決したという記事がありましたので、しばらく待ってもダメなら同じように対応したいと思います。</p>
</li>
</ul>
<h2 id="さいごに">さいごに</h2>
<p>AdMobの連携に課題は残るものの、初めてのアプリを無事に公開することができました。</p>
<blockquote>
<p>この一歩は、小さい一歩だが、偉大な一歩だ。（By Mick）</p></blockquote>
<p>アプリのリリースを通じて、公開までの一連の手順を理解するという目標を達成できました。次は、データの記録や認証機能の実装にも挑戦していきたいと思います。</p>
]]></content:encoded>
    </item>
    <item>
      <title>個人事業主がGoogle Play Consoleに組織アカウントとして登録してみた</title>
      <link>https://zac-lab.com/posts/20250514/</link>
      <pubDate>Wed, 14 May 2025 17:00:00 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250514/</guid>
      <description>個人事業主がGoogle Play Consoleに組織アカウントとして登録する手順を詳しく解説。D-U-N-S Number取得、バーチャルオフィス契約、組織サイト作成から審査完了までの実体験を紹介します。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>先日、<a href="/posts/20250418/">こちら</a>
の記事で述べたように、Google Playストアに自分が作ったアプリを掲載したいと考えています。事前にディベロッパー登録が必要ですが、個人アカウントだと住所や氏名が世界中に公開されるため、組織アカウントとして登録を行いました。その際の手順をシェアしたいと思います。</p>
<h2 id="手順">手順</h2>
<h3 id="公開用住所の取得">公開用住所の取得</h3>
<ul>
<li>DMMバーチャルオフィス（郵便転送サービス付きで月額660円のミニマムプラン）に申し込みました。</li>
<li>本人確認書類を提出し、当日中に審査が完了しました。</li>
<li>月割り料金はないため、翌月初まで待って支払いするか、月中でも一カ月分を支払うかの選択肢がありました。</li>
<li>4月下旬だったため、ゴールデンウィークを避けるために月中で支払いを行いました。</li>
</ul>
<h3 id="新規電話番号の取得">新規電話番号の取得</h3>
<ul>
<li>POVO2.0を契約しました。</li>
<li>本人確認書類を提出し、当日中に本人確認が完了しました。</li>
<li>現在使用中のスマホに、eSIMとして2枚目のSIMを追加したため、スマホ本体代はかかっていません。</li>
</ul>
<h3 id="開業届の修正申告">開業届の修正申告</h3>
<ul>
<li>開業届は開業時に既に提出済みのため、「事業所の増設」という区分で修正申告を行いました。</li>
<li>e-Taxでの修正申告を試みましたがよくわからなかったため、税務署に紙を直接提出しました。</li>
<li>今まで屋号を取っていませんでしたので、今回、屋号を追加しました。</li>
<li>「新増設、移転後の住所地」には、新しく取得したバーチャルオフィスの住所とPOVOの電話番号を記入しました。</li>
<li>税務署は受領印を押さない運用になったそうで、代わりに当日の日付入りで受領したことが分かる書類を受け取りました。</li>
</ul>
<h3 id="d-u-n-s-numberの取得">D-U-N-S Numberの取得</h3>
<ul>
<li>自分で取得すれば無料でできるようですが、今回は東京商工リサーチに手数料3,300円を支払い、取得を依頼しました。</li>
<li>開業届と受付資料をそれぞれスキャンしてPDF化し、メールで提出しました。</li>
<li>8営業日後にメールが届き、無事取得が完了しました。</li>
</ul>
<h3 id="組織サイトの公開メールアドレス取得">組織サイトの公開＆メールアドレス取得</h3>
<ul>
<li>Googleのディベロッパー登録を進めたところ、組織サイトのURLを入力する欄がありました。こちらは、連絡先メールアドレスとドメインが一致していないといけないとのことでした。</li>
<li>公式な組織サイトはまだ持っていません。また、メールアドレスもアプリ公開用に新しくしたいので、別で新たなドメインを取りました。</li>
<li>組織サイトは新たに用意し、CloudflarePagesにデプロイしました。</li>
<li>メールアドレスは、CloudflareのEmail Routingというサービスを使い、取得したドメインに届いたメールを開発者アカウントのGメールに転送するよう設定しました。（無料で、転送のみ行えるサービスです。送信はできません）</li>
</ul>
<h3 id="組織アカウントの登録">組織アカウントの登録</h3>
<ul>
<li>Google Play Consoleにて、組織アカウントとしてディベロッパー登録を行いました。登録料として、初回のみ$25がかかります。</li>
<li>ディベロッパー名には屋号を設定し、住所と電話番号も公開用に取得したものを登録しました。</li>
<li>組織を証明するための書類として、開業届と受付資料、本人確認資料としてパスポートを使用しました。</li>
<li>「組織を証明するための書類」と「本人（個人）を証明するための書類」はそれぞれ1ファイルしか提出できません。2つ以上ある場合は1ファイルにまとめてアップロードする必要があります。</li>
</ul>
<h2 id="さいごに">さいごに</h2>
<p>無事にディベロッパー登録が完了し、これで自作アプリをGoogle Playストアに掲載する準備が整いました。これからは、先日開発したツールアプリを早速公開する準備を進めていきたいと思います。今回の経験を活かし、今後も新しい挑戦を続けていきますので、応援よろしくお願いします！</p>
]]></content:encoded>
    </item>
    <item>
      <title>React Native(Expo) でAdMobを設定する</title>
      <link>https://zac-lab.com/posts/20250501/</link>
      <pubDate>Thu, 01 May 2025 13:09:53 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250501/</guid>
      <description>React NativeとExpoで開発したAndroidアプリにAdMob広告を実装する手順を解説。react-native-google-mobile-adsライブラリの設定から広告コンポーネントの実装まで、個人開発者向けの実践的なガイドです。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>先日、初めてReact Nativeを触ってみたという<a href="/posts/20250418/">ポスト</a>
をしました。</p>
<p>まずはAndroidアプリを公開したいと考えており、組織アカウントとして登録するためにDUNS Numberの取得申請中でございます。
（東京商工リサーチで申請し、7営業日程たちますが、まだ音沙汰なしです。。）</p>
<p>スマホアプリで収益を得たいと考えていますが、まずは一番ハードルが低そうな広告収入を目指していきます。</p>
<p>今回は、Expoで作ったAndroidアプリに、react-native-google-mobile-adsライブラリを使ってAdMobを設置する手順をご紹介します。</p>
<h2 id="1-admobの設定手順">1. AdMobの設定手順</h2>
<h3 id="google-admobのアカウント作成とアプリ登録">Google AdMobのアカウント作成とアプリ登録</h3>
<p>AdMob（<a href="https://admob.google.com/" target="_blank">https://admob.google.com/</a>
）にアクセスし、ユーザー登録します。</p>
<p>その後、アプリを追加します。</p>
<p><img alt="新しいアプリの設定" loading="lazy" src="/posts/20250501/screen1.png"></p>
<p>プラットフォームは「Android」を選択、まだストアにアプリを公開していないので、「いいえ」を選択。</p>
<p><img alt="アプリ名の設定" loading="lazy" src="/posts/20250501/screen2.png"></p>
<p>アプリの名前を入力し、「アプリを追加」をクリック。</p>
<p><img alt="アプリ作成完了" loading="lazy" src="/posts/20250501/screen3.png"></p>
<p>アプリの作成が完了しました。「完了」をクリック。</p>
<p><img alt="アプリ作成後" loading="lazy" src="/posts/20250501/screen4.png"></p>
<h3 id="広告ユニットの作成">広告ユニットの作成</h3>
<p>次は、広告ユニットを作成します。「広告ユニットを追加」をクリック。</p>
<p><img alt="広告ユニットの作成1" loading="lazy" src="/posts/20250501/screen5.png"></p>
<p>広告のフォーマットがいくつかあります。起動時に全面表示するものだったり、全部見たら報酬を得られる系のものだったり。今回は、単純に画面の一部に広告が表示されればよいため、「バナー」を選択。</p>
<p><img alt="広告ユニットの作成2" loading="lazy" src="/posts/20250501/screen6.png"></p>
<p>広告ユニット名には、自分で識別できるように適当に名前を付けて、「広告ユニットの作成」をクリック。</p>
<p><img alt="広告ユニットの作成完了" loading="lazy" src="/posts/20250501/screen7.png"></p>
<p>広告ユニットの作成が完了したら、アプリIDと広告ユニットIDが表示されるので、コピーしておきます。
（こちらの画像の広告ユニットIDは、すでに無効となっています）</p>
<h2 id="2-expoアプリへの実装">2. Expoアプリへの実装</h2>
<h3 id="ライブラリのインストール">ライブラリのインストール</h3>
<p><code>react-native-google-mobile-ads</code>をインストールします。最新バージョン（v15）をインストールしたところ後続手順でビルドエラーが発生したため、v14でインストールするようにしました。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>npx expo install react-native-google-mobile-ads@14.11.0
</span></span></code></pre></div><h3 id="appjsonの設定">app.jsonの設定</h3>
<p>react-native-google-mobile-adsをインストールすると、app.jsonに&quot;react-native-google-mobile-ads&quot;の記載が追加されていると思います。</p>
<p>その部分を、以下のように修正します。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-json" data-lang="json"><span style="display:flex;"><span>[
</span></span><span style="display:flex;"><span>    <span style="color:#e6db74">&#34;react-native-google-mobile-ads&#34;</span>,
</span></span><span style="display:flex;"><span>    {
</span></span><span style="display:flex;"><span>        <span style="color:#f92672">&#34;android_app_id&#34;</span>: <span style="color:#e6db74">&#34;ca-app-pub-6970209880901801~7980726474&#34;</span>  <span style="color:#75715e">// アプリIDを設定します
</span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span>    }
</span></span><span style="display:flex;"><span>]
</span></span></code></pre></div><h3 id="開発ビルドの作成">開発ビルドの作成</h3>
<p>広告を使用するには、Expo Goのみでは対応できないので、開発ビルドを行う必要があります。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>npx eas-cli build --profile development
</span></span></code></pre></div><p>ビルドが完了したら、表示されているQRコードをスマホで読み取ってリンクに飛び、Installボタンを押してダウンロードおよびインストールを行います。</p>
<p>その後、<code>npx expo start</code>で開発サーバーを起動した上で、アプリを起動しておきます。</p>
<h3 id="広告コンポーネントの実装">広告コンポーネントの実装</h3>
<p>実際に、アプリに広告を配置してみます。</p>
<p>アプリの初回起動時に、SDKの初期化を行う必要があるようです。
とりあえずホーム画面においてuseEffectで初回時のみ初期化するようにしてみました。
もしかしたらもっといいやり方があるかもしれません。
参考までに。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-typescript" data-lang="typescript"><span style="display:flex;"><span><span style="color:#66d9ef">import</span> <span style="color:#a6e22e">mobileAds</span>, { <span style="color:#a6e22e">BannerAd</span>, <span style="color:#a6e22e">BannerAdSize</span>, <span style="color:#a6e22e">TestIds</span> } <span style="color:#66d9ef">from</span> <span style="color:#e6db74">&#39;react-native-google-mobile-ads&#39;</span>;
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e">// アプリの初回起動時にSDKを初期化
</span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span><span style="color:#a6e22e">useEffect</span>(() <span style="color:#f92672">=&gt;</span> {
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">mobileAds</span>()
</span></span><span style="display:flex;"><span>        .<span style="color:#a6e22e">initialize</span>()
</span></span><span style="display:flex;"><span>        .<span style="color:#a6e22e">then</span>(() <span style="color:#f92672">=&gt;</span> {
</span></span><span style="display:flex;"><span>            <span style="color:#a6e22e">console</span>.<span style="color:#a6e22e">log</span>(<span style="color:#e6db74">&#39;AdMob SDK initialized&#39;</span>);
</span></span><span style="display:flex;"><span>        });
</span></span><span style="display:flex;"><span>}, []);
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e">// テスト広告の設定
</span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span><span style="color:#66d9ef">const</span> <span style="color:#a6e22e">adUnitId</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">TestIds</span>.<span style="color:#a6e22e">BANNER</span>;
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e">// バナー広告のコンポーネント
</span></span></span><span style="display:flex;"><span><span style="color:#75715e"></span>&lt;<span style="color:#f92672">BannerAd</span>
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">unitId</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">adUnitId</span>}
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">size</span><span style="color:#f92672">=</span>{<span style="color:#a6e22e">BannerAdSize</span>.<span style="color:#a6e22e">MEDIUM_RECTANGLE</span>}
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">requestOptions</span><span style="color:#f92672">=</span>{{
</span></span><span style="display:flex;"><span>        <span style="color:#a6e22e">requestNonPersonalizedAdsOnly</span>: <span style="color:#66d9ef">true</span>,
</span></span><span style="display:flex;"><span>    }}
</span></span><span style="display:flex;"><span>/&gt;
</span></span></code></pre></div><p>開発時は、テスト広告しか表示してはいけないようです。
本番アプリではTestIds.BANNERの部分を、先ほど取得した広告ユニットIDに差し替えてください。</p>
<p>sizeには、幾つかの種類があります。<code>ANCHORED_ADAPTIVE_BANNER</code>だと横幅いっぱいに広がってくれるため、様々なサイズの端末に対応できるということでおすすめです。</p>
<p>私のアプリには高さが足りないと感じたため、もう少し存在感のある、<code>MEDIUM_RECTANGLE</code>を使ってみました。</p>
<h2 id="まとめ">まとめ</h2>
<p>React Native + Expoで構築するスマホアプリに、AdMob広告を貼る手順をご紹介しました。</p>
<p>色々試行錯誤していた時は、Bare workflowにする必要がある（ネイティブコードをいじる必要がある）という情報も転がっていたのでハマってしまいました。</p>
<p>実際にはBare workflowにする必要はなく、Managed workflowのまま開発を進められました。</p>
<p>おそらく以前は対応していなかったものが後々対されるようになったという感じでしょうかね。</p>
<p>Managed workflowのまま、広告貼れるよというお話でした。</p>
]]></content:encoded>
    </item>
    <item>
      <title>スマホアプリ開発に挑戦：React NativeとExpoで始める個人開発</title>
      <link>https://zac-lab.com/posts/20250418/</link>
      <pubDate>Fri, 18 Apr 2025 11:29:18 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250418/</guid>
      <description>React NativeとExpoを使用したスマホアプリ開発の始め方と、Google Play Consoleでのアプリ公開までの道のりを解説。個人開発者としての挑戦と課題についても紹介します。</description>
      <content:encoded><![CDATA[<h2 id="はじめに">はじめに</h2>
<p>これまでWeb開発を中心に行ってきた私が、新たな挑戦としてスマホアプリ開発に取り組むことにしました。Android StudioやKotlinでの開発経験はあるものの、コード量の多さや学習の難しさから断念した過去があります。しかし、自己啓発と収益化の可能性を考え、まずはAndroidアプリから始めてみることにしました。</p>
<h2 id="技術選定react-native-vs-flutter">技術選定：React Native vs Flutter</h2>
<p>スマホアプリ開発の主要な選択肢として、React NativeとFlutterが挙げられます。X（旧Twitter）で個人開発者の投稿を見ると、Flutterを採用している方が多い印象でした。しかし、Reactの経験がある私にとっては、React Nativeの方が学習コストが低いと判断し、Cursorと共に開発を始めることにしました。</p>
<p>Cursorに最新のReact Nativeドキュメントを読み込ませて、順に一緒にやってもらいました。余談ですが、今後新しい技術がでてきたら、とりあえずドキュメントを読ませてハンズオンを一緒にやってみるのが一番早いのかなと思ってます。</p>
<p>最新のドキュメントを読んではいたものの、古いコマンドを提案してきていたようで途中でうまく起動せず、結局ドキュメントで最新のコマンドを探して打つという・・（笑）まああるあるですね。</p>
<h2 id="react-native--expoでの開発の流れ">React Native + Expoでの開発の流れ</h2>
<p>細かい話は省略しますが、ざっくりと開発の流れを記載します。</p>
<h3 id="1-初期セットアップ">1. 初期セットアップ</h3>
<p>Expoを使用することで、開発のハードルを大幅に下げることができました。VSCodeで開発できる点も大きなメリットです。以前はAndroid Studioが必要でしたが、その重さと待ち時間の長さがネックでした。</p>
<p>プロジェクトの作成は以下のコマンドで簡単に行えます。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>npx create-expo-app@latest
</span></span></code></pre></div><p>その後、以下のコマンドで開発サーバーを起動します。（tunnelオプションを付けないとExpo Goアプリがブルースクリーンになりました）</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>npx expo start --tunnel
</span></span></code></pre></div><p>驚くほどReactと開発体験が似てますね。すばらしい。</p>
<h3 id="2-expo-goでの開発">2. Expo Goでの開発</h3>
<p>そしてExpo GoアプリをGoogle Play ストアから探してインストールします。
（Expoでアカウント登録もしました）</p>
<p><code>npx expo start</code> でターミナルに表示されたQRコードを、Expo Goアプリから起動したスキャナで読み取ると、デフォルトアプリが動き出します。</p>
<p>コードを修正すると、ホットリロードでスマホ側に即座に修正が反映されます。</p>
<p>以前は、実機で確認するには毎回ビルドして転送コードでファイルを転送して、というのが必要だった記憶があるので、スピーディーにできるようになりましたね。</p>
<p>開発自体も、コンポーネントをどんどん配置していくという流れがReactの開発と非常によく似ています。これほどスムーズにWebアプリ開発からスマホアプリ開発に移行できるとは。食わず嫌いせずにもっと早くやってればよかったです。</p>
<p>実際の仕様決めやコード実装は、生成AIと協働で進めていきます。まずはシンプルなアプリを作って公開するまでの一連の手順を経験してみたいと思います。</p>
<h3 id="3-開発ビルドの作成">3. 開発ビルドの作成</h3>
<p>ある程度開発が進んでくると、Expo Goだけでは対応できなくなってくるので、ちゃんとビルドして実機で動かせるようにする必要があります。
ドキュメントでは、唐突に「Development Build」を作る的な話になるので、最初は混乱しました。
要するに、Expo Goアプリというのは、Expoの開発体験をお試しできるように作られた、プレビュー用のアプリという位置付けのようです。</p>
<p>標準的な機能しか対応しておらず、ちょっとコミいったことをしようと思ったら、改めてビルドして実機にインストールして動作させる必要があります。</p>
<p>開発ビルドをゲットするには、プロジェクトに<code>expo-dev-client</code>ライブラリを追加した上で、EASというビルド用のツールを使います。</p>
<p>下記コマンドにより、Androidアプリの開発用にビルドを作成できます。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>eas build --platform android --profile development
</span></span></code></pre></div><p>ビルドの時間は10～15分程かかりました。
ビルドが終了したら、スマホでExpoの開発者ページに飛んでファイルをダウンロードして実行すると、勝手にインストールが開始されます。
（ビルドは時間が長いので、途中でターミナルを閉じても問題ないようです。しばらくしてからExpoの開発者ページに飛べば、インストールのボタンが表示されています。）</p>
<p>開発ビルドを動作させるには、Expo Goと同様、起動コマンドが必要になります。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>npx expo start --tunnel
</span></span></code></pre></div><p>Expo Goの時と同じコマンドですが、プロジェクトに<code>expo-dev-client</code>がインストールされていれば、開発ビルドが使用するサーバーが自動的に立ち上がるようです。</p>
<p>ビルドの待ち時間は長いですが、開発ビルドもExpo Goと同様、基本的にはコードを修正したらホットリロードでリアルタイム反映されるので、開発体験としてそれほど変わりません。
なので、一度Expo Goでの開発を経験したら、次回からは最初からDevelopment Buildを使って開発を進めるでもいいかなと思いました。</p>
<p>ただ、アプリの設定に関わるようなこと（ロゴマークなどの変更なども含めて）を変えた場合には、毎回ビルドしなおさないと反映されないようです。</p>
<h3 id="4-内部配布用ビルドの作成">4. 内部配布用ビルドの作成</h3>
<p>内部配布用のビルドは以下のコマンドで作成できます。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>eas build --platform android --profile preview
</span></span></code></pre></div><p>上記コマンドを実行し、ビルドが完了するまで待つと、インストール用のURLが発行されます。
リンクを知っている人だけが、各自の実機にアプリをインストールできるようになるというわけです。</p>
<h3 id="5-ストア提出用ビルドの作成">5. ストア提出用ビルドの作成</h3>
<p>そして、いよいよストア提出用のビルド。</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>eas build --platform android --profile production
</span></span></code></pre></div><p>同様にしばらく待つと、開発者ページにダウンロードのボタンが表示されます。</p>
<h2 id="google-play-consoleでの課題">Google Play Consoleでの課題</h2>
<p>アプリの公開を目指す中で、Google Play Consoleでの登録時に思いがけない課題に直面しました。</p>
<h3 id="個人情報の公開問題">個人情報の公開問題</h3>
<p>ストア提出用のアプリは準備OK！これをGoogle Play Consoleからアップロードして審査を通れば晴れてストアに公開できるはず、と思ったのですが、思いがけない弊害がありました。</p>
<p>まず、開発者として登録するためには最初に払いきりの$25を支払う必要があります。
これは想定していたのですが、アカウントの登録をしていると、氏名や住所が公開されるとあるじゃないですか。</p>
<p>確かに数年前にアカウント確認が厳しくなるという話は聞いていたのですが、住所まで公開されるとは把握しておらず。</p>
<p>ざっと調査したところによると、開発者アカウントは、組織アカウントか個人アカウントのいずれかを選択する必要があるようです。以下、あくまでもご参考まで。</p>
<p><strong>組織アカウントの場合：</strong></p>
<ul>
<li>氏名＋住所が公開される</li>
<li>氏名は屋号でもOK（ただし公式に政府が発行した資料、もしくは公共料金の領収証などを提出する必要がある）</li>
<li>DUNS（ダンズ）ナンバーを取得し、申請する必要がある。（ナンバーは東京商工リサーチのサイトから取得できる）</li>
</ul>
<p><strong>個人アカウントの場合：</strong></p>
<ul>
<li>有料コンテンツ販売しているアカウントであれば、氏名＋住所が公開される</li>
<li>無料のみならば、氏名と国のみ公開される</li>
<li>テスト要件が厳しくなっている。20名で14日間クローズドテストを実施しないと、アプリの申請ができないようになっているらしい。</li>
</ul>
<p>ちなみに、有料コンテンツ販売しているアカウントとは、「有料アプリやアプリ内購入が可能なアプリ」になるそうで、AdMob広告のみの場合は該当しないようです。
ただし、過去に一度でも（テストのためであっても）報酬を受け取るように有効化したアカウントについては有料扱いみたいです。</p>
<p>また、これは全く知らなかったのですが、個人アカウントだとテスト要件が厳しくなっています。
20人にインストールしてもらうとなると、かなり厳しい印象。
みんなでクローズドテストを乗り切ろう的なコミュニティはあるようですが、他人の開発した、どんな悪意あるコードが埋め込まれてるか分からないアプリなんてインストールしたくないよなぁ、と思ってしまいました。（インストールしてもらうためには、自分も協力しないとなわけで。）</p>
<h3 id="今後の対応策">今後の対応策</h3>
<p>個人開発者が締め出されているといわれていますが、皆さんブログなどで対応策を発信してくださっていて、本当にありがたい。今のところ、以下の対応をとろうと考えています。</p>
<ol>
<li>
<p><strong>バーチャルオフィスで公開用の住所を取得する</strong></p>
<ul>
<li>DMMバーチャルオフィス（郵便転送サービス付きで660円/月のミニマムプランがよさそう）を契約する</li>
</ul>
</li>
<li>
<p><strong>新規に電話番号を取得する</strong></p>
<ul>
<li>POVO2.0を契約する</li>
<li>基本的には受電のみなら0円、半年に一度数百円程度の有料トッピングを購入する必要がある</li>
<li>現在使っているスマホでデュアルSIMが対応できたので、eSIMとして追加する</li>
</ul>
</li>
<li>
<p><strong>開業届を修正申告する</strong></p>
<ul>
<li>すでに提出はしていますが、現在は屋号を使っていないので、新しく屋号を登録します</li>
<li>事業所の新設として申請します。（通常、申請する必要はないですが、あえて印鑑付きの書面が欲しいので）</li>
<li>e-Taxでもとれるけど、印鑑あった方が後々楽なので、管轄の税務署に出向こうと思います。（腰が重い…）</li>
</ul>
</li>
<li>
<p><strong>組織アカウントとして登録する</strong></p>
<ul>
<li>上記対策を実施後、組織アカウントとして登録予定</li>
</ul>
</li>
</ol>
<h2 id="さいごに">さいごに</h2>
<p>スマホアプリの開発においてはまだまだヒヨッコの開発者ですが、なんとか安全にストア公開まで持っていけるように頑張ります！
詳細な対策の進捗については、また別の記事で報告させていただきます。</p>
]]></content:encoded>
    </item>
    <item>
      <title>タロットアプリを公開しました。</title>
      <link>https://zac-lab.com/posts/20250331/</link>
      <pubDate>Mon, 31 Mar 2025 13:32:25 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250331/</guid>
      <description>Next.jsとCloudflare Pagesで開発したタロット占いアプリの制作過程を紹介。CursorエディタとGemini2.0 Flash Liteを活用した開発体験と、生成AIの実装について解説します。</description>
      <content:encoded><![CDATA[<h2 id="タロット占いアプリ">タロット占いアプリ</h2>
<p><img alt="タロット占いアプリのホーム画面" loading="lazy" src="/posts/20250331/screen.png"></p>
<p>🔗 <a href="https://tarotfortune.zac-lab.com/" target="_blank">アプリへのリンク</a>
</p>
<p>かねてより興味があったタロット占いのアプリを作ってみました。
1枚でサクッと占ったり、10枚でじっくり占うこともできます。</p>
<p>このアプリを作った経緯としましては、最近うちの子供がタロット占いにハマっておりまして、カードの意味を覚えたり、カードを組み合わせてどのように解釈するか、といったところの練習になるといいなと思い開発しました！</p>
<p>アドバイスの部分は、生成AIを使って自然な文章で提案してくれるようにしました。</p>
<h2 id="技術的なこと">技術的なこと</h2>
<p>以前公開した<a href="https://typing.zac-lab.com/" target="_blank">タイピング練習用のアプリ</a>
の基本構成と同じ、Next.js＆Cloudflare Pagesを採用しています。
ほどんと同じなので、異なる部分のみ記載したいと思います。</p>
<p>ちなみにこちらは現時点（2025年3月末時点）のものであり、まだまだ改善点がありますので変わる可能性ありです。</p>
<h3 id="nextjsのapiルート">Next.jsのAPIルート</h3>
<p><a href="https://typing.zac-lab.com/" target="_blank">タイピング練習用アプリ</a>
においては、フロントエンドのみの構成でした。
今回のアプリでは、生成AIのエンドポイントをたたく必要があったため、セキュリティのためにAPIルートを使用しました。
Cloudflare Pagesにデプロイすると、自動的にCloudflare Functionsとして動作させることができました。</p>
<p>ただ途中、ビルドがうまく通らなかったので、Next.jsのバージョンを15→14に落としました。</p>
<h3 id="cursoraiコードエディタ">Cursor（AIコードエディタ）</h3>
<p>月$20の課金をして、Cursorを導入してみました。
ものすごい速さで画面を作り上げてくれて、驚愕です。。
結構メンタルやられるレベルで速いですねww</p>
<p>バージョンは0.47.8を利用。
直近アップデートがあり、これまではComposerとChatが分かれていたところのUIが、統合されたようです。
チャットでのやり取りの中で、適宜Agent（自動でコーディングしてくれるモード）とAsk（質問モード）を使い分けられるようになっています。コンテキストが分断されることなく使い分けられるのがとてもいいですね。</p>
<h3 id="生成aigemini20-flash-lite">生成AI（Gemini2.0 Flash Lite）</h3>
<p>初めて自作アプリの中に生成AIを組み込んでみました。
今のところは無料枠で全く問題ないです。</p>
<p>使ってみた感想としては、ドメイン制限やレートリミット、入力文字のサニタイジングなど、結構考えることが多かったです。
普段の業務では、組織内で使うアプリに組み込む程度で、悪意を持ったプロンプトへの対応を想定していないことが多いため、勉強になりました。</p>
<h2 id="まとめ">まとめ</h2>
<ul>
<li><a href="https://tarotfortune.zac-lab.com/" target="_blank">タロット占いアプリ</a>
を公開しました。</li>
<li>Cursorを使った開発の速度は爆上がり！！</li>
<li>アプリに生成AIを積極的に組み込んでいきたいです。</li>
</ul>
]]></content:encoded>
    </item>
    <item>
      <title>Cursorエディタを使ってみた感想：AI時代の開発体験</title>
      <link>https://zac-lab.com/posts/20250317/</link>
      <pubDate>Mon, 17 Mar 2025 17:14:25 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250317/</guid>
      <description>AI搭載エディタCursorの使用体験と、Claude 3.7 Sonnetの性能についての考察。AIと共に開発する新しい働き方と、そのメリット・デメリットについて紹介します。</description>
      <content:encoded><![CDATA[<p>最近、Cursorというエディタを使い始めたので、その感想を少し書いてみます。</p>
<h2 id="cursorとの出会い">Cursorとの出会い</h2>
<p>これまでAIツールに課金することにあまり積極的ではなかったのですが、Cursorの2週間無料体験を試してみたところ、思いのほか便利で、そのまま課金してProプランに移行することにしました。</p>
<h2 id="すごいのはcursorというよりclaude-37-sonnet">すごいのはCursorというよりClaude 3.7 Sonnet</h2>
<p>実際のところ、Cursorそのものよりも、裏で動いているClaude 3.7 Sonnetの性能に驚かされます。このレベルのAIを定額で使えるというのは、開発者にとってはありがたい限りですね。</p>
<h2 id="文脈理解力について">文脈理解力について</h2>
<p>コードの文脈をよく理解して、適切な提案をしてくれるのが印象的です。要件を伝えるだけで、それなりに使えるコードを出力してくれることも多いです。将来的には要件定義の部分までAIがサポートしてくれるようになるかもしれません。</p>
<p>現状は、新規開発はとても良いけど、既存コードがある場合の改修ではまだ人間の出番はありそうです。（複数の情報ソースを照らし合わせて仕様の整合性を保つなど）</p>
<h2 id="生産性と疲労のバランス">生産性と疲労のバランス</h2>
<p>Cursorを使うと確かに開発は早くなります。ただ、実際にガッツリ使ってみると思いのほか脳が疲れます・・・。</p>
<p>AIが次々と情報やコードの提案を出してくれるのですが、それを確認して選別するだけでも結構な労力が必要になります。</p>
<p>1日中Cursorを使って開発していると、翌日はちょっと休みたくなるくらい疲れることがあります。情報が多すぎて頭が追いつかなくなる感覚ですね。</p>
<h2 id="働き方の変化">働き方の変化</h2>
<p>この体験から、古代ギリシャの社会構造を思い出しました。昔は奴隷が労働をして、上級階級の人々は思索に時間を使っていたわけですが、AIの発展で私たちも単純作業から解放され、もっと考えることに集中できる時代が来るのかもしれません。</p>
<p>ただ、今はまだその過渡期で、AIと一緒に働くことで得られるメリットと、それに伴う新しいタイプの疲労感のバランスをとることが課題です。うまく活用できるよう、少しずつ慣れていきたいと思います。</p>
]]></content:encoded>
    </item>
    <item>
      <title>個人開発アプリでデータベースを使いたい。</title>
      <link>https://zac-lab.com/posts/20250217/</link>
      <pubDate>Mon, 17 Feb 2025 16:48:16 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250217/</guid>
      <description>個人開発アプリでのデータベース選定について、個人的に視点で解説。</description>
      <content:encoded><![CDATA[<h2 id="新しく作りたいアプリについて">新しく作りたいアプリについて</h2>
<p>先日、<a href="https://typing.zac-lab.com/" target="_blank">タイピングアプリ</a>
をリリースしました。</p>
<p>こちらはこちらでまだ改善の余地ありですが、新しくアプリ作っていきたいと思います！</p>
<p>うちの子どもたちが、昨年から家庭内で会社を立ち上げまして、親を相手に商売を始めました( ´∀｀ )</p>
<p>お手伝いチケットを紙で手作りして、何枚かつづりで売ってくれます。</p>
<p>例えば、「マッサージ10分券を10枚つづりで〇円」、「夕食作り代行券を5枚つづりで〇円」、のような感じです。</p>
<p>親としてはとても助かってます✨</p>
<p>子どもとしても、前金でお金を受け取れるのでモチベーションが維持できるみたいです。</p>
<p>趣味でほしいものがあったら、あのお手伝いを〇回すれば買える・・のように逆算できるので良いですね。</p>
<p>ただ、チケットを作ったり授受したりするのが徐々に（お互いに）面倒くさくなってきたので、電子化したいという娘からの要望でした。</p>
<p>できれば通知機能とかを備えたスマホアプリ化したいのですが、一旦はMVPを備えたWebアプリとして実装してみたいと思います。</p>
<p>（スマホ用アプリは、テスト的に作ったことはありますが、実際にストアにリリースしたことはありません。おいおいやっていきたいです！）</p>
<h2 id="データベースを選ぶ">データベースを選ぶ</h2>
<p>前回のタイピングアプリではデータベースを使用しませんでした。</p>
<p>今回作るアプリではデータベースが必要になります。</p>
<p>一旦は家庭内で使うだけだけど、よさそうなら一般公開できると嬉しい。</p>
<p>個人開発で無料から始められるデータベースサービスをいくつかピックアップしてみました。</p>
<ul>
<li>
<p>Firestore（FirebaseのDB）</p>
<ul>
<li>以前使ったことがある。・・が、NoSQLのツボをいまいちつかめなかった記憶がある。</li>
</ul>
</li>
<li>
<p>Supabase</p>
<ul>
<li>Firestoreの代替サービスという位置づけらしい。最近はこちらの方が人気がある模様</li>
<li>RDBが使えるので違和感なく使えそう</li>
</ul>
</li>
<li>
<p>Neon</p>
<ul>
<li>PlanetScale（以前無料で使えてた）の代替として使っている記事がいくつかあった</li>
</ul>
</li>
<li>
<p>Cloudflare D1（CloudflareのDB）</p>
<ul>
<li>SQLiteベースのデータベース。</li>
<li>SQLiteとは、単一のファイルにどんどんデータを書き込んでいく方式のDB。簡易利用向け</li>
</ul>
</li>
</ul>
<h2 id="cloudflare-d1を使ってみる">Cloudflare D1を使ってみる</h2>
<p>アプリをCloudFlare Pagesにデプロイしようと思っているので、まずは相性のよさそうなCloudflare D1を使ってみようと思います。</p>
<p>SQLiteは以前軽く学習目的で触ったことがあって、その時はあまり意識してなったのですが、実際にアプリに組み込もうと思うと結構制約が出てきそうです。</p>
<p>大規模な集計ができなかったり、同時並行で読み書きができなかったり、あたりでしょうか。</p>
<p>実際に無料枠で使ってみて、支障があるなら別のサービスに切り替えるようにしてみます。</p>
<h3 id="課金体系と無料枠について">課金体系と無料枠について</h3>
<p>D1の使用料金は、読み書きの行数（レコード数）と、保存されているデータの容量で決まるようです。</p>
<p>また、制限を超えるとクエリが実行できなくなって、課金すれば制限を解除できるとのこと。</p>
<p>途中で勝手に課金が始まる訳ではないのは良いですね。</p>
<p>無料枠は以下の通り。</p>
<ul>
<li>読み取り行数：500万/日</li>
<li>書き込み行数：100,000/日</li>
<li>ストレージ：5GB</li>
</ul>
<p>読み取り行数は、スキャンが走ったレコードの件数がカウントされる。1000件のレコードが入ったテーブルをフルスキャンすると1000とカウントされ、結合などでスキャンが走るとその件数分カウントされる。</p>
<p>適切にインデックスをはると節約できるようですが、インデックス更新は書き込み件数にカウントされる、と。</p>
<p>最初は慣れるまで時間かかるかな。実際にテーブルいくつか作ってみただけで何回かクエリ発行されてました。</p>
<h3 id="実際に作ってみる">実際に作ってみる</h3>
<p>実際にDBとテーブルを作ってみました。</p>
<p>Cloudflareダッシュボード、「ストレージとデータベース」→「D1 SQLデータベース」→「作成」でデータベースを作成。</p>
<p>名前を入れるだけで作れました。</p>
<p>次にDBの中にテーブルを作成します。</p>
<p>列の型（タイプ）では、以下の4つしか選べませんでした！</p>
<ul>
<li>text（文字列）</li>
<li>integer（整数）</li>
<li>real（小数）</li>
<li>blob（ファイル類）</li>
</ul>
<p>日付とか、真偽値とか、もろもろtextに突っ込む形のようです。SQLiteってこんな感じなのね～。</p>
<p>これをPagesとかWorkersとかで使うとかなりシームレスに使えるのかな？</p>
<p>大きな支障がない限りはこのまま進めてみます。</p>
<p>次回へ続く。</p>
]]></content:encoded>
    </item>
    <item>
      <title>タイピングアプリを公開しました。</title>
      <link>https://zac-lab.com/posts/20250209/</link>
      <pubDate>Sun, 09 Feb 2025 09:29:49 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250209/</guid>
      <description>Next.jsとCloudflare Pagesを使用して開発したタッチタイピング学習アプリの制作過程と技術選定について解説。生成AIを活用した開発体験と、今後の展望についても紹介します。</description>
      <content:encoded><![CDATA[<h2 id="まじめに学ぶタッチタイピング">まじめに学ぶタッチタイピング</h2>
<p>🔗 <a href="https://typing.zac-lab.com" target="_blank">アプリへのリンク</a>
</p>
<p>🔗 <a href="https://typing.zac-lab.com/about" target="_blank">アプリに対する思いはこちらに記載しました。</a>
</p>
<p>このアプリは、子どもたちにタッチタイピングを効率的に習得してほしいという思いで開発しました。</p>
<p>必要最低限の内容で、スピーディーに学ぶことができます。</p>
<p>ここでタッチタイピングを習得したら、寿司打のスコアもアップするかも！？</p>
<h2 id="技術構成">技術構成</h2>
<p>アプリを公開するにあたり、以下の技術を使用しました。</p>
<h3 id="開発環境使用言語">開発環境・使用言語</h3>
<ul>
<li>Visual Studio Code</li>
<li>Next.js</li>
<li>TypeScript</li>
<li>App Router</li>
<li>Tailwind　CSS</li>
</ul>
<p>今回はフロントエンドのみの構成としました。</p>
<h3 id="ソース管理">ソース管理</h3>
<ul>
<li>Github</li>
</ul>
<h3 id="デプロイ">デプロイ</h3>
<ul>
<li>Cloudflare Pages</li>
</ul>
<p>Githubのブランチを指定すると、自動でビルド＆デプロイまでしてくれます。</p>
<p>今回初めて使いましたが、非常に便利です！！</p>
<p>個人レベルでは無料プランで十分です。</p>
<p>ビルド回数が月500回までの制限があるので、そこだけ意識しています。</p>
<p>デプロイ先の選定にあたっては、以下を考慮しました。</p>
<ul>
<li>商用利用できること（広告はったりしたい）
<ul>
<li>無料プランだと商用利用できないところが多い。</li>
</ul>
</li>
<li>従量課金ではなく定額であること
<ul>
<li>いつの間にか金額が増えてた！を気にしたくない。</li>
</ul>
</li>
</ul>
<p>上記の条件を満たしていれば課金しても良かったのですが、無料プランで対応できたのはありがたいです。</p>
<h3 id="ドメイン取得">ドメイン取得</h3>
<ul>
<li>Cloudflare Register</li>
</ul>
<p>今後アプリ増やしていきたい思いですが、アプリごとにドメインをとるか、サブドメインで分けて増やしていくかは悩んだところ。</p>
<p>一旦はサブドメインを増やしていくこととし、評判良いものができたら切り出してアプリ固有のドメインをとる方向でいくことにしました。</p>
<p>長く使っていく想定なので、ドメインを原価提供してくれているCloudflare Registerを利用することとしました。</p>
<h3 id="アクセス分析">アクセス分析</h3>
<ul>
<li>Cloudflare Web Analytics</li>
<li>Hotjar</li>
</ul>
<p>アクセス分析=Google Analytics の頭でいましたが、Cloudflare Web Analyticsというものを知り、そのまま使うこととしました。</p>
<p>こちらはあくまでサーバー側に届いたリクエストを分析するというものなので、Google Analyticsと得られる情報は異なるようです。</p>
<p>とりあえずPV数など簡易な情報が得られればよいので、採用することにしました。</p>
<p>Hotjarは、画面レコーディングやヒートマップ（画面のどこが頻繁にクリックされるか等）などを提供してくれるサービスです。</p>
<h3 id="その他">その他</h3>
<ul>
<li>
<p>今回、認証やDBは使用していません。ユーザー登録なしのシンプル構成としました。</p>
</li>
<li>
<p>アプリ内のメニューをどこまで進んだかを保存するために、ローカルストレージを使用しています。</p>
</li>
<li>
<p>ChatGPTにコード生成を助けてもらってます。課金はせずに、ブラウザの無料版のみ使用。課金するタイミング完全に見失ってる。</p>
</li>
<li>
<p>画面のスケッチとかはしないタイプの人間です。実装しながら画面作ってます。</p>
</li>
<li>
<p>アプリの中で使っている画像については、娘にお絵描きしてもらいました。</p>
</li>
</ul>
<h2 id="所要時間">所要時間</h2>
<p>2024年の年末あたりから着手し始め、お正月にぼちぼち開発していたのですが、公開までには全部合わせて1ヵ月くらいでした。</p>
<p>アプリの開発自体はAIが助けてくれたので比較的スムーズに行きましたが、デプロイ先の選定や、周辺で使うサービスの選定などに少し時間をかけました。</p>
<h2 id="今後について">今後について</h2>
<p>ちゃんと生成AIに課金して、アプリ作ってもらうのを試したいですね。</p>
<p>以下、試してみたいプロダクト。</p>
<h3 id="cursorカーソル">Cursor(カーソル)</h3>
<p>VSCodeからフォーしたエディタで、会話しながらコードを修正してくれる模様。</p>
<p>対象のソースを指定して、これに対して修正してという指示ができるのは便利そう。</p>
<p>操作感がVSCodeと変わらないのはよさそうだけど、エディタかえるのは正直ハードルが高い。</p>
<p>移行はよさそうでも、帰ってくるのがしんどそう。</p>
<h3 id="clineクライン">Cline（クライン）</h3>
<p>VSCodeの拡張機能でカーソルと同じようなことができる？という程度の理解です。</p>
<p>カーソルよりよさそうかなーという印象なので試してみたいです。</p>
<h3 id="boltnewボルト">bolt.new（ボルト）</h3>
<p>言葉でアプリの説明を定義すると、全自動で勝手に作ってくれるというものらしい。</p>
<p>良いという噂は聞くけど、どうだろう？</p>
<p>自動生成されたコードの可読性とかメンテナンス性については気になるところ。</p>
]]></content:encoded>
    </item>
    <item>
      <title>㊗️ブログ開設。使った技術について。</title>
      <link>https://zac-lab.com/posts/20250205/</link>
      <pubDate>Wed, 05 Feb 2025 19:50:55 +0900</pubDate>
      <guid>https://zac-lab.com/posts/20250205/</guid>
      <description>HugoとPaperModを使用した静的サイトブログの構築方法と、CloudFlare Pagesでのホスティングについて解説。個人開発に向けた技術選定のポイントと、今後の展望についても紹介します。</description>
      <content:encoded><![CDATA[<h2 id="ブログを始めます">ブログを始めます。</h2>
<p>以前、WordPressでブログを書いていたことがあります。</p>
<p>次第に書く頻度が落ちてきて、サーバー代払うのがもったいなく感じるようになったのでやめてしまいました。</p>
<p>今回は、維持費を抑えてまた再開してみます！</p>
<h2 id="構成要素">構成要素</h2>
<p>以前のブログでは、Xserverでドメイン＆サーバーを取って、WordPressを動かしていました。</p>
<p>今回の構成では以下を使用しました。</p>
<ul>
<li>Hugo（静的サイトジェネレーター）</li>
<li>PaperMod（Hugoのテンプレート）</li>
<li>CloudFlare Pages（ビルド＆ホスティング）</li>
<li>Github（ソース管理）</li>
<li>CloudFlare Register（ドメイン取得）</li>
</ul>
<p>以下、それぞれの構成要素について詳述します。</p>
<h3 id="hugo">Hugo</h3>
<ul>
<li>以前のWordPressではDBとPHPサーバーが必要となるので、ちょっとオーバースペック気味でした。今回は簡単に作りたい。</li>
<li>後述のCloudFlare Pagesで動かしたい。</li>
<li>マークダウンで書けると嬉しい。</li>
</ul>
<p>上記のような理由から適切な手段を探していたところ、静的サイトジェネレーターというものを見つけました。</p>
<p>マークダウンファイルから事前にHTML化しておいて、リクエストがきたらそのページを表示するだけ、という仕組みのようです。</p>
<p>WordPressのようにリクエストに応じてDBアクセスしてその場でページを作り上げる仕組みと違い、表示速度が速いようです。</p>
<p>シンプルで分かりやすくてよさそう！！</p>
<p>いくつかあるものから、Goでできていてビルド速度が速いと評判のHugoを使ってみることにしました。</p>
<p>Hugoではテンプレートが多数用意されているので、好きなものを選びます。</p>
<h3 id="papermod">PaperMod</h3>
<p>いくつもあるテンプレートの中から、PaperModというものを選んでみました。</p>
<p>このテンプレートの選んだポイントは以下の通りです。</p>
<ul>
<li>Githubのスター数を見て、人気が高めだった。</li>
<li>Githubで最終更新日が新しめで、長く放置されていない。（人気があってもすでに公開停止されているものが結構あった）</li>
<li>カテゴリー表示やタグ表示など、必要十分の機能を備えていた。（テンプレートによってはカテゴリー表示やタグ表示に対応していないものもあるようです）</li>
</ul>
<h3 id="cloudflare-pages">CloudFlare Pages</h3>
<p>こちらは既に個人開発のアプリで利用しており、簡単にデプロイできることが分かっているため是非使いたいということで採用しました。</p>
<p>無料枠の中で十分使用できています。</p>
<h3 id="github">Github</h3>
<p>こちらは定番。</p>
<p>CloudFlare PagesはGithubのリポジトリとブランチを選択するだけで、自動的にビルド＆デプロイができます。</p>
<p>また、ブランチに変更があったら自動的に最新化してくれるため、CI/CDを個別に書く必要なし！</p>
<p>ありがたすぎる。</p>
<h3 id="cloudflare-register">CloudFlare Register</h3>
<p>今回はここだけ課金してます。</p>
<p>最近、ドメイン代がどんどん高くなってますよね・・。</p>
<p>CloudFlare Registerではドメインを原価提供してくれているそうです。</p>
<p>他のドメイン管理サービスではキャンペーン価格で初年度無料などあるため単純に比較はできないのですが、長く運用するとしたらそんな大差ないだろうと、こちらを選びました。</p>
<p>サービスをまとめた方が運用がラクかなとも思いました。</p>
<p>お名前ドットコムでも別のドメイン持ってますが、正直、サイトが見づらくてあまり好きではないです。</p>
<h2 id="最近の興味関心">最近の興味・関心</h2>
<p>前からずっとやってみたかったこととして、個人開発にチャレンジしてみようと思ってます。</p>
<p>生成AIが登場し、個人での開発はだいぶハードルが下がってきた印象です。</p>
<p>加えて気軽に使えるBaaSなどお仕事の中で使う機会が増え、自信がついてきたというのもあります。</p>
<p>今年から業務の稼働時間を減らしたので、空いた時間でちょこちょこ開発していきたいと思います。</p>
<p>ライスワークとライフワーク、バランスよくいきたいですね。</p>
]]></content:encoded>
    </item>
    <item>
      <title>個人開発</title>
      <link>https://zac-lab.com/development/</link>
      <pubDate>Wed, 05 Feb 2025 00:00:00 +0000</pubDate>
      <guid>https://zac-lab.com/development/</guid>
      <description>運営者が開発した個人アプリの一覧と、今後の開発予定のアイディアを紹介します。タッチタイピング学習アプリやタロット占いアプリなど、様々なプロジェクトを掲載しています。</description>
      <content:encoded><![CDATA[<h2 id="個人開発したアプリ">個人開発したアプリ</h2>
<p>以下は、個人開発したアプリの一覧です。これからどんどん増えていく予定です。お楽しみに！！</p>
<h3 id="どっちがおトク-単価チェッカー"><strong>どっちがおトク？ 単価チェッカー</strong></h3>
<p>🔗 <a href="https://play.google.com/store/apps/details?id=com.gijinlab.unitpricechecker" target="_blank">Google Play ストアへのリンク</a>
</p>
<p><img alt="どっちがおトク？ 単価チェッカー" loading="lazy" src="/posts/20250521/screen19.png"></p>
<p>このアプリは、2つの商品の「価格」と「量」を入力するだけでどちらの商品がお得かを瞬時に計算して表示する、Android向けアプリです。</p>
<p>初めてストアでリリースした、個人的に思い入れのあるアプリです。初めてのスマホアプリということで、シンプルかつ実用的な機能に絞り、私自身が日常的に使いたいと思えるものを作りました。</p>
<h3 id="画像圧縮ツール"><strong>画像圧縮ツール</strong></h3>
<p>🔗 <a href="https://image-compressor.zac-lab.com/" target="_blank">アプリへのリンク</a>
</p>
<p><img alt="画像圧縮ツール" loading="lazy" src="/development/screen1.png"></p>
<p>このアプリは、ブラウザのみで画像を圧縮できるツールです。ファイルを外部送信することが無いので、安全に処理することができます。</p>
<p>このアプリを作った経緯としては、最近はやっているVibe Codingというスタイルでの開発を意識的にやってみようと思ったこと、かつ、私がよく使っている画像圧縮Webアプリが外部サーバーへの送信をしていて抵抗があったので、自分で作ってみようと思ったことです。</p>
<p>Vibe Codingは雰囲気コーディングと言われており、コードは書かず、AIに指示して作ってもらう、作りたいものを伝えて雰囲気でやってみる、みたいなイメージの開発スタイルです。</p>
<h3 id="まじめに学ぶタッチタイピング"><strong>まじめに学ぶタッチタイピング</strong></h3>
<p>🔗 <a href="https://typing.zac-lab.com" target="_blank">アプリへのリンク</a>
</p>
<p>このアプリは、子どもたちにタッチタイピングを効率的に習得してほしいという思いで開発しました。必要最低限の内容で、スピーディーに学ぶことができます。ここでタッチタイピングを習得したら、寿司打のスコアもアップするかも！？</p>
<h3 id="タロット占い"><strong>タロット占い</strong></h3>
<p>🔗 <a href="https://tarotfortune.zac-lab.com/" target="_blank">アプリへのリンク</a>
</p>
<p><img alt="タロット占いアプリホーム画面" loading="lazy" src="/posts/20250331/screen.png"></p>
<p>このアプリは、うちの子どもがタロット占いにハマっているので、占いを楽しみつつカードの意味などを覚えられると良いなと思い作りました。生成AIを使っているので、それっぽい解釈やアドバイスを受け取ることができます。</p>
<h2 id="アイディアベース">アイディアベース</h2>
<p>まだまだアイディアの段階。少しづつ形にしていきたいものの一覧です。</p>
<h3 id="図書館の返却日リマインダー"><strong>図書館の返却日リマインダー</strong></h3>
<p>TimeTreeに自動登録したいけど、APIがサービス終了している模様。。</p>
<h3 id="つらいお悩みを吐露できるsns"><strong>つらいお悩みを吐露できるSNS</strong></h3>
<p>つらい時代ですからね。</p>
<h3 id="お手伝いチケットを管理するアプリ">お手伝いチケットを管理するアプリ</h3>
<p>家の中でお手伝いチケットの現物をやりとりしているのですが、紙で作るのめんどくさいという意見を受けて、作りたいです。</p>
]]></content:encoded>
    </item>
    <item>
      <title>About</title>
      <link>https://zac-lab.com/about/</link>
      <pubDate>Tue, 19 Mar 2024 00:00:00 +0000</pubDate>
      <guid>https://zac-lab.com/about/</guid>
      <description>ITフリーランスとして活動する運営者のプロフィールと、このサイトの目的について紹介します。技術記事、フリーランスとしての経験談、個人開発プロジェクトの情報を発信しています。</description>
      <content:encoded><![CDATA[<h2 id="このサイトについて">このサイトについて</h2>
<p>「ITフリーランスの備忘的なにか」は、技術的な知見や開発体験を共有するためのブログです。</p>
<h3 id="主なコンテンツ">主なコンテンツ</h3>
<ul>
<li>技術記事</li>
<li>フリーランスとしての経験談</li>
<li>個人開発プロジェクトの紹介</li>
</ul>
<h2 id="運営者について">運営者について</h2>
<p>千葉県在住、アラフォーITエンジニアのmickが運営しています。三児の母として、子育てと仕事の両立を目指しながら、フリーランスとして活動しています。</p>
<h3 id="経歴">経歴</h3>
<ul>
<li>
<p>IT企業での開発経験</p>
<ul>
<li>茨城県出身で県内の大学を卒業後、都内の受託開発会社でSEとして13年程勤務しました。</li>
<li>コーディング→設計→チームマネジメント→コンサル といったキャリアパスを進みました。</li>
</ul>
</li>
<li>
<p>フリーランスとしての活動</p>
<ul>
<li>会社員時代はシステム開発工程の上流を担当することが多かったのですが、コードを書いて自分で作りたいという思いが強く、フリーランスとして独立しました。</li>
<li>現在は月の3-4割程度の時間でクライアントワークを行い、その他の時間で新しい技術の習得や個人開発を嬉々として進めています。</li>
</ul>
</li>
</ul>
<h3 id="スキルセット">スキルセット</h3>
<ul>
<li>プログラミング
<ul>
<li>現在は、Python, JavaScriptをメインに使うことが多いです。</li>
</ul>
</li>
<li>開発全般
<ul>
<li>業務整理から課題抽出、対策検討、そしてシステム設計まで幅広く経験してきました。</li>
</ul>
</li>
<li>プロジェクトマネジメント 等</li>
</ul>
<p>小さなツールやアプリを作って、非効率業務をサクッと自動化したい思いであります🫡</p>
<h2 id="お問い合わせ">お問い合わせ</h2>
<p>ご質問やお問い合わせは、以下のメールアドレスまでお願いします。</p>
<p>Eメール : <a href="mailto:zac.lab.contact@zohomail.jp">zac.lab.contact@zohomail.jp</a>
</p>
<h3 id="対応について">対応について</h3>
<ul>
<li>通常5営業日以内に返信いたします。</li>
<li>込み入ったご相談の場合は、2週間程度お時間をいただく場合があります</li>
</ul>
<p>※ スパムメール対策のため、件名に「サイトからの問い合わせ」と入れていただけますと幸いです。</p>
]]></content:encoded>
    </item>
    <item>
      <title>プライバシーポリシー</title>
      <link>https://zac-lab.com/privacy/</link>
      <pubDate>Tue, 19 Mar 2024 00:00:00 +0000</pubDate>
      <guid>https://zac-lab.com/privacy/</guid>
      <description>当サイトのプライバシーポリシーについて説明します。個人情報の取り扱い、Cookieの使用、外部サービスの利用について詳しく記載しています。</description>
      <content:encoded><![CDATA[<h2 id="プライバシーポリシー">プライバシーポリシー</h2>
<h3 id="1-適用">1. 適用</h3>
<p>本プライバシーポリシーは、「ITフリーランスの備忘的なにか」（以下「本サイト」といいます）の利用について定めるものです。</p>
<h3 id="2-個人情報の収集">2. 個人情報の収集</h3>
<p>本サイトの主機能では、個人情報を収集いたしません。</p>
<p>ただし、以下の情報を収集・保存することがあります：</p>
<ul>
<li>アクセスログ</li>
<li>お問い合わせ情報</li>
</ul>
<h3 id="3-cookieおよび外部サービスの利用">3. Cookieおよび外部サービスの利用</h3>
<p>本サイトでは、サービス向上のため、以下の外部サービスを使用しています：</p>
<ul>
<li><strong>Cloudflare Web Analytics</strong>：サーバーログによる利用状況の分析</li>
<li><strong>Google Analytics（GA4）</strong>：利用状況の分析</li>
<li><strong>Microsoft Clarity</strong>：ユーザー行動分析</li>
</ul>
<p>これらのサービスではCookieを使用し、個人を特定できない形で情報を収集する場合があります。</p>
<p>各サービスのプライバシーポリシーについては、各社の公式サイトをご確認ください。</p>
<h3 id="4-収集した情報の利用目的">4. 収集した情報の利用目的</h3>
<p>収集した情報は、以下の目的で利用します：</p>
<ul>
<li>サービスの提供・運営</li>
<li>利用状況の分析によるサービス改善</li>
<li>ユーザーサポート</li>
</ul>
<h3 id="5-情報の第三者提供">5. 情報の第三者提供</h3>
<p>法令に基づく場合を除き、収集した情報を第三者に提供することはありません。</p>
<h3 id="6-プライバシーポリシーの変更">6. プライバシーポリシーの変更</h3>
<p>本ポリシーの内容は、予告なく変更される場合があります。</p>
<h3 id="7-お問い合わせ">7. お問い合わせ</h3>
<p>プライバシーポリシーに関するお問い合わせは、以下のメールアドレスまでお願いします。</p>
<p>Eメール : <a href="mailto:zac.lab.contact@zohomail.jp">zac.lab.contact@zohomail.jp</a>
</p>
]]></content:encoded>
    </item>
    <item>
      <title>利用規約</title>
      <link>https://zac-lab.com/terms/</link>
      <pubDate>Tue, 19 Mar 2024 00:00:00 +0000</pubDate>
      <guid>https://zac-lab.com/terms/</guid>
      <description>当サイトの利用規約について説明します。サイトの利用条件、禁止事項、免責事項など、利用に関する重要な事項を記載しています。</description>
      <content:encoded><![CDATA[<h2 id="利用規約">利用規約</h2>
<h3 id="1-適用">1. 適用</h3>
<p>本規約は、「ITフリーランスの備忘的なにか」（以下「本サイト」といいます）の利用に関する条件を定めたものです。</p>
<p>ユーザーは本規約に同意した上で本サイトを利用するものとします。</p>
<h3 id="2-利用条件">2. 利用条件</h3>
<p>本サイトは一般のユーザーを対象とし、年齢制限は設けておりません。</p>
<p>ユーザーは以下の行為を行わないものとします：</p>
<ul>
<li>不正アクセスやサービスへの攻撃、システムに負荷をかける行為</li>
<li>他のユーザーや第三者の著作権、プライバシー、その他の権利を侵害する行為</li>
<li>公序良俗に反する行為</li>
<li>運営者の許可なく営利目的で本サイトを利用する行為</li>
<li>その他、運営者が不適切と判断する行為</li>
</ul>
<h3 id="3-免責事項">3. 免責事項</h3>
<p>本サイトは、提供する情報や機能の正確性、完全性、適合性を保証するものではありません。</p>
<p>ユーザーが本サイトの利用により被った損害について、運営者は一切の責任を負いません。</p>
<h3 id="4-サービスの変更終了">4. サービスの変更・終了</h3>
<p>運営者は、ユーザーに通知することなく、本サイトの内容を変更または終了することがあります。</p>
<p>本サイトの終了に伴い、ユーザーに生じた損害について責任を負いません。</p>
<h3 id="5-規約の変更">5. 規約の変更</h3>
<p>運営者は、必要に応じて本規約を変更することがあります。</p>
<h3 id="6-準拠法裁判管轄">6. 準拠法・裁判管轄</h3>
<p>本規約の解釈および適用に関しては、日本法を準拠法とします。</p>
<p>本サイトに関する紛争は、運営者の所在地を管轄する裁判所を専属的な第一審の裁判所とします。</p>
<h3 id="7-お問い合わせ">7. お問い合わせ</h3>
<p>利用規約に関するお問い合わせは、以下のメールアドレスまでお願いします。</p>
<p>Eメール : <a href="mailto:zac.lab.contact@zohomail.jp">zac.lab.contact@zohomail.jp</a>
</p>
]]></content:encoded>
    </item>
  </channel>
</rss>
