UltiMorseのブログ

ソート学習アプリSortShroom🍄を作った

▶ ソート学習アプリSortShroom🍄を使ってみる

はじめに

NHKのピタゴラスイッチで「しめじソート」という企画を見て、キノコを並び替える発想が面白く印象に残りました。これにインスパイアされて、ソート可視化学習アプリ「SortShroom🍄」を作りました。

作成したのは大学のアルゴリズム基礎の授業中。授業内容が簡単だったので、Next.jsの勉強も兼ねて開発しました。AIも活用しつつ、形にすることを優先したので、細かい部分は今後理解していきたいと思っています。

アプリの特徴・機能

  • キノコを並び替えるアニメーション
  • 数やアルゴリズムの種類を設定可能
  • 並べ替え時に音が鳴る
  • 画面イメージ:
    アプリ画面
    アプリ画面のスクリーンショット

▶ ソート学習アプリSortShroom🍄を使ってみる

技術的な話・作ってみて感じたこと

Next.jsは難しく感じました。まずはReactの理解が大事だと痛感。JavaScriptもコピペ中心でやってきたので、TypeScriptまで使うのは無謀でした。フレームワークは「よく使うものを簡単に使える」ものですが、基礎がないと使いこなせないと実感しました。

LLM(生成AI)を使ったコーディングは便利ですが、基礎がないと危険もあると学びました。これからの時代も変わらず、手を動かしながら学ぶことが大切だと思います。

まとめ・リンク

物を作りながら学ぶことで、見えてくるものが多いです。基礎を大切にしつつ、AIも活用していきたいです。

アプリはこちら:
https://sortshroom.vercel.app/

関連記事:信州大学ACSU多要素認証の自動化