mu-suke

<h2 id="%E3%82%B4%E3%83%BC%E3%83%AB">
<a class="header-anchor-link" href="#%E3%82%B4%E3%83%BC%E3%83%AB" aria-hidden="true"></a> ゴール</h2>
<ul>
<li>selector内で非同期の処理をしている際に途中でatomの更新があった際に処理を中断できること</li>
</ul>
<h2 id="%E8%AA%B2%E9%A1%8C%E7%82%B9">
<a class="header-anchor-link" href="#%E8%AA%B2%E9%A1%8C%E7%82%B9" aria-hidden="true"></a> 課題点</h2>
<ul>
<li>以前までは以下のように書いていた処理をrecoilではどう書けば良いのかわかっていない</li>
<li>selector内の非同期処理を中断する方法がわからない</li>
</ul>
<h2 id="%E7%92%B0%E5%A2%83">
<a class="header-anchor-link" href="#%E7%92%B0%E5%A2%83" aria-hidden="true"></a> 環境</h2>
<table>
<thead>
<tr>
<th>ツール・ライブラリ</th>
<th>用途</th>
<th>バージョン</th>
</tr>
</thead>
<tbody>
<tr>
<td>React</td>
<td>フロントエンドのJSライブラリ</td>
<td>18.2.0</td>
</tr>
<tr>
<td>Recoil</td>
<td>クライアント状態管理ライブラリ</td>
<td>0.7.5</td>
</tr>
<tr>
<td>Next.js</td>
<td>Reactのフレームワーク</td>
<td>12.2.5</td>
</tr>
<tr>
<td>node.js</td>
<td>フロント、サーバーサイドの実行環境</td>
<td>16.15.0</td>
</tr>
</tbody>
</table>
<h2 id="%E5%8F%82%E8%80%83%E8%B3%87%E6%96%99">
<a class="header-anchor-link" href="#%E5%8F%82%E8%80%83%E8%B3%87%E6%96%99" aria-hidden="true"></a> 参考資料</h2>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__369a5cda2e699" src="https://embed.zenn.studio/card#zenn-embedded__369a5cda2e699" data-content="https%3A%2F%2Frecoiljs.org%2Fdocs%2Fbasic-tutorial%2Fselectors%2F" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://recoiljs.org/docs/basic-tutorial/selectors/" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://recoiljs.org/docs/basic-tutorial/selectors/</a></p>


ツール・ライブラリ	用途	バージョン
React	フロントエンドのJSライブラリ	18.2.0
Recoil	クライアント状態管理ライブラリ	0.7.5
Next.js	Reactのフレームワーク	12.2.5
node.js	フロント、サーバーサイドの実行環境	16.15.0