サービスURL

https://leaf-record.vercel.app

サービス概要

メモ帳感覚で記録をとりGitHubへコミットできる草生やしアプリです。

作成経緯

オンラインプログラミングスクールRUNTEQにて、「ミニアプリweek」という短期間でアプリを作るイベントがあります。バグOK、一機能だけでもOKとゆるめのイベントで応募するために作成したものです。
4/22に開発を開始、4/26にリリースしたので制作期間は5日ほどですが、そのあとも順次ブラッシュアップしています。

機能紹介

アプリの仕様上、基本機能はすべてログインしなければ使えません。
今回は前回作成したアプリの反省としてレスポンシブ対応をしています。
PWA対応しているので、ネイティブアプリっぽくも使えます。

トップ画面PC	トップ画面SP
アプリ説明と仕様上の注意を記載しました。	メニューボタンは指の届きやすい下側に配置しました

リポジトリ一覧画面PC	リポジトリ一覧画面SP
すべてのリポジトリではなく、アプリを通じて作成したリポジトリのみ表示しています。	SP用にレイアウト調整をしました。

記録画面PC	記録画面SP
左カラムでファイル作成・選択ができます。記録を上から下に取るので、視線誘導的にファイル削除・ファイル名変更・コミットを下部に配置しています。	ファイル操作やコミットをすべて下部のボタンから操作できるようにしました。

技術スタック

使用技術

カテゴリ	技術
フロントエンド	Next.js14(App Router), Tailwind CSS, shadcn/ui
バックエンド	Rails7.1.3
データベース	PostgreSQL
開発環境	Windows, WSL2, Docker
インフラ	Vercel, Render.com
その他（フロントエンド）	Axios, Recoil
その他（バックエンド）	Octokit, DeviseTokenAuth, OmniAuth

ER図

その他

Qiitaに記事を書きました。
【個人開発】メモ帳感覚で使えるGitHub草生やしアプリ「Leaf Record ～大草原不可避～」を作りました【Next.js×Rails】