【Next.js】マンガ試し読みサービス Webアプリ開発のフロントエンド開発支援

Index- もくじ -

マンガを閲覧・投稿できる会員制Webアプリケーションのフロントエンド開発を支援させていただきました。

マンガの閲覧自体はアカウントがなくても可能ですが、アカウントを作成することでマンガの投稿やブックマークなどの機能が使えるサービスです。

初期リリースまで4ヶ月、リリース後3ヶ月

今回は5人ほどのチームに入り、開発支援させていただきました。
フロントエンドが私一人だったので幅広く担当させていただきました。

2022年10月にNext.js v13がリリースされましたが、issueの挙がり具合を調べ開発スピードへの影響を考慮しv12で開発をしています。

漫画Webアプリサービスということで、画像を多く使用しWebマーケティング施策が不可欠だったため、SEOを考慮し表示速度パフォーマンスやバンドルサイズに気をつけ開発を行いました。

機能のみの提供でスタイリングがされていないmaterialUI Baseを取り入れ、開発スピードの助けになってもらいながらstyled-componentsで独自のスタイリングをあてられるようにしています。

ユーザーはいいねをしたくなること、作者はいいねをされてモチベーションが上がることのサイクルができることを目指し、いいねのアクションをした際にLottieを使用してSVGアニメーションを取り入れました。

リリース少し前からTwitterのAPI制限が出ており、Twitter連携で認証できなくなるトラブルに見舞われながらも着手後4ヶ月でリリースになりました。

リリース後は運用要望として出てきた、管理画面側の機能拡充やユーザー閲覧画面における改良と追加開発を行いました。

デザインリソースが不足していたため、開発途中からは画面デザインを兼任してサポートさせていただきました。

4.5

開発の紅一点。projectの進行には欠かせない花でした。一方、開発における体力は"屈強さ"を思わせるほどの一言に尽きます。