Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
読書記録サービス yondako をつくった
Search
arrow2nd
November 19, 2024
How-to & DIY
0
69
読書記録サービス yondako をつくった
arrow2nd
November 19, 2024
Tweet
Share
More Decks by arrow2nd
See All by arrow2nd
StotybookからはじめるVRT -個人開発編-
arrow2nd
1
1.9k
Other Decks in How-to & DIY
See All in How-to & DIY
Within the team, I grow as a tester and continuously pursue product quality
camel_404
6
2.7k
JAWS-UG Community Upadate - JAWS-UG 熊本
awsjcpm
2
170
AWSコミュニティプログラムとJAWS-UGアップデート / JAWS-UG函館 勉強会 vol.14
awsjcpm
2
150
エンジニアになって2年間で学んだこと
kaiphoenix
0
210
活動振り返りと生成AIによるコード生成の試み
covao
0
110
M5Stackを使ってSズキの魔改造モンスターマシンを作ってみた
syumme01
0
230
バーチャルバナナとリアルバナナ #iotlt #TouchDesigner
n0bisuke2
0
180
こんなにあるの? 最近のIPAトレンドを ざっくりまとめてみた
watany
4
1k
AWS User Community - JAWS-UG/AWS ユーザーコミュニティのご紹介
awsjcpm
1
230
JAWS-UG Fukuoka - AWS re:Invent 2024 re:Cap AWS Community Perspective
awsjcpm
2
190
AWS Summit Japan 2025 個人的参加レポート
midnight480
0
170
M5Stickと超小型エッジAIカメラ「AITRIOS」
hoshinoresearch
0
530
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Into the Great Unknown - MozCon
thekraken
40
2.1k
Designing for Performance
lara
610
69k
Making Projects Easy
brettharned
120
6.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.7k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
Scaling GitHub
holman
463
140k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Transcript
読書記録サービス yondakoをつくった arrow2nd / #さくらのマイクロコミュニティ (Webサービス開発者の会) #15
arrow2nd といいます あろーって読むことが多いです ちょっと株式会社でフロントエンドエンジニア として働いています 自己紹介
はなすこと 50 サービス概 20 開# %0 デザイ 30 やってよかったこÉ Ç0
今後やりたいこと
サービス概要
yondakoって? よんだことをわすれないための読書記録サー ビス コミュニティ機能や感想などの機能はなく、 読書状況の記録のみに特化
なんでつくったの? G 積読しがち E G 読みかけで日にちが経って、どの本を読んでたか忘れ G 既存の読書記録サービスは機能が多い 「今読んでる本」をシンプルに管理したい!
デモ! https://yondako.com/
開発
開発期間 & 2024/5 ... 開発開# & 2024/7 ... HonoX →
Next.js 移行 & 2024/8 ... リリース → 約3ヶ月。7〜8月の間にガッと作った
使用技術 フロントエンド Node.jsの代わり データベース Cloudflare D1 インフラ Cloudflare Pages Cloudflare
Access 認証 Auth.js テスト Playwright
書籍API https://ndlsearch.ndl.go.jp/help/api 検索用API (OpenSearch) → 書籍の情報源 書影API → 書籍の書影
書籍API https://ndlsearch.ndl.go.jp/help/api R 無2 R リクエストの制限が厳しくな8 R 書籍の収録数が豊富。同人誌までカバー R 新刊の反映に時間がかかs
R レスポンスが XMb R 商用利用の場合申請が必要 良いところ 気になるところ
書籍API 記事も書いた https://zenn.dev/chot/articles/24ea6186c029b0
デザイン
実装までの流れ É 手書き É Figma "É 実装
感じたこと ' 先にデザインを固めた方が開発効率が良 ' Storybookがあると細かい調整がしやすい → けど、最初からこれをするのは難しい…
ブラッシュアップ: Before
ブラッシュアップ: After
ブラッシュアップ: 書籍カード 読んでない 読みたい 読んだ コミック ARIA完全版 [ARIA The MASTERPIECE]
3巻 天野こずえ | マッグガーデン カバーイラスト&カラー扉は描き下ろし!雑誌連載当時の カラーページを再現!全巻300ページオーバーの大ボリュー ム! s 文字を減らしてすっきりさせた s カードにすることで、並べた際の一覧性が上がった 背表紙くらいの情報量に
ブラッシュアップ: その他UI 選択中の表現を統一 背景色はメインカラー (茶) / アイコンはfilled 「読」をひらがなに 画数が多くて固い印象がした ライブラリ
キーワードで探す 読む本 読んだ本 すきな本
スマホ対応 アプリっぽい雰囲気に なるべく下部にボタン類を配置 ボトムバーやドロワーを使う 片手で操作しやすいように
やってよかったこと
記事を書いたこと https://zenn.dev/arrow2nd/articles/4367a3be5cbdb6
記事を書いたこと 意外と読まれた ユーザーも増えた!
日報で作業ログを残したこと E エラーの解決など、忘れたころに また遭遇しがA E 記事を書く時の材料にも → 時系列で残るので経緯が分かって ふり返りやすい
今後やりたいこと
新刊をすぐ登録できるように 国立国会図書館に納入される必要があるので、 数日前に発売された書籍が登録できない → 出版情報登録センターの情報を使うなどを検討中
検索ページが寂しい あまりにも何もない…… 新着書籍とか並べたいかも
バーコード検索の安定性向上 スマホを機種変したら動かなくなった S Pixel 8 なら動いて3 S iPhone 持ってないので検証不足 InitError
NotReadableError: Could not start video source
https://github.com/yondako/yondako GitHubで公開しています
ご静聴ありがとうございました!