Facebook Lit:Bite
Logo

Lit:Bite

クレジット
制作ノート
アプリの概要
image

アプリ概要

小説エディタアプリとして開発したRe:teratureから公開設定することで、小説をアップロードして閲覧することができる小説閲覧アプリ。気に入った話や作家にマークして一覧にして置いたりコメントを投稿できる。

開発の経緯・目的

折角エディタアプリを開発しているので、そこから簡単に気軽に公開できるサイトがあるといいなと思い、並行して開発を始めた。大手サイトでは登録が必要だったり広告が多かったりするので、試しにWEB公開するためのスペースとして利用できるようにしたかった。

使用技術と選定理由

  • 言語:TypeScript
  • フレームワーク:React.js、Next.js
  • スタイリング:ChakraUI
  • 状態管理:Recoil
  • DB:Supabase

<aside> 💡 技術選定理由

エディタアプリと並行して開発しているため技術セットはそのまま同じものにした。Next.jsではISRにすることで、更新に時間差はできてしまうが軽快な動きを維持できるため良かった。

</aside>

工夫した点・苦労した点

  • 工夫した点 ランキング表示と更新が新しい順とランダム表示とページを作ることで出来るだけ色々な作品が目に留まるようにした。タグを付けて投稿することで、自動的にタグ一覧が増えていくので同じタグや気になるタグで絞込をしやすくした。
  • ランキング表示と更新が新しい順とランダム表示とページを作ることで出来るだけ色々な作品が目に留まるようにした。
  • タグを付けて投稿することで、自動的にタグ一覧が増えていくので同じタグや気になるタグで絞込をしやすくした。
  • 苦労した点 ランキング表示の際アクセス解析にGoogleAnalyticsを利用したがVersion4でAPIを利用する方法の情報が少なく導入に苦労した。ブラウザバックなどで戻った際、元いたスクロール位置でないなど一覧を行ったり来たりする仕様のUXで意識することが多かった。
  • ランキング表示の際アクセス解析にGoogleAnalyticsを利用したがVersion4でAPIを利用する方法の情報が少なく導入に苦労した。
  • ブラウザバックなどで戻った際、元いたスクロール位置でないなど一覧を行ったり来たりする仕様のUXで意識することが多かった。

備考

自身の小説が多いですが、嬉しいことに他にも小説を投稿してくださっている方がいます。

image
シェア
この作品のその他の制作ノート
Lit:Biteについて

もっとみる

dende-hポートフォリオの他の作品
ウェブ
作品を見る
AWS学習記録
ウェブ
作品を見る
恐ろしく速いタイピング
ウェブ
作品を見る
@dende-hのマイページ - Qiita