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
蔵書管理アプリを作り直した
Search
Tiny Mouse
November 14, 2022
Programming
1.1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
蔵書管理アプリを作り直した
DevFest Nagoya 2022/11/14
浜松IT合同勉強会 2022/12/3
Tiny Mouse
November 14, 2022
More Decks by Tiny Mouse
See All by Tiny Mouse
今年がんばったこと
tinymouse
0
82
今年がんばったこと
tinymouse
0
130
【LT会】インプット・アウトプットどうしてる?
tinymouse
0
60
今年がんばったこと
tinymouse
0
190
.NET MAUI+Blazor を使ってみた
tinymouse
0
210
【LT会】この技術書がすごい
tinymouse
1
210
Windows アプリの開発手段の選択肢をまとめてみた
tinymouse
0
180
蔵書管理アプリを作りました
tinymouse
0
680
Google Apps Script アプリを配付する
tinymouse
0
140
Other Decks in Programming
See All in Programming
【SRE NEXT 2026 Lunch Session】一人目専任SREの立ち上げを加速する ― AIと進めたオンボーディングで2分を0.04秒にした話
pkshadeck
PRO
0
2.9k
Go言語とトイモデルで学ぶTransformerの気持ち / fukuokago23-transformer
monochromegane
0
140
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
4
1.7k
GitHubCopilotCLIのスラッシュコマンドを自作してみる
htkym
0
100
琵琶湖の水は止められてもNet--HTTPのリトライは止められない / You might be able to stop the water flow of Lake Biwa but you can't stop Net::HTTP retries
luccafort
PRO
0
430
AI時代の仕事技芸論〜ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ(スクフェス仙台 2026バージョン)
kuranuki
0
690
エンジニアにデザインハーネスを 〜デザインプロセスを規定するためのハーネス〜 / Design harness from an engineer's perspective
rkaga
2
1.6k
Prismを使った型安全な暗号化_関数型まつり2026
_fhhmm
0
150
jsmini JavaScript Engine を作ってみた話
yosuke_furukawa
PRO
0
160
【やさしく解説 設計編・中級 #6】良いアーキテクチャとは ~ 一本の登り道の、行き先 ~
panda728
PRO
0
180
フィードバックで育てるAI開発
kotaminato
1
120
【やさしく解説 設計編 #1】「ドメイン駆動」と「実装駆動」ってなに? 〜設計の考え方を、たとえ話で学ぼう〜
panda728
PRO
1
120
Featured
See All Featured
How Software Deployment tools have changed in the past 20 years
geshan
0
34k
Reality Check: Gamification 10 Years Later
codingconduct
0
2.2k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
410
Documentation Writing (for coders)
carmenintech
77
5.4k
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
260
First, design no harm
axbom
PRO
2
1.2k
Code Review Best Practice
trishagee
74
20k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2.2k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
220
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
Transcript
Tiny Mouse 蔵書管理アプリを作り直した DevFest Nagoya 2022 2022/11/14
n @tinymouse_jp n SI 企業の SE n 日曜プログラマ n 二児の父
n 静岡県浜松市出身 n 東京都品川区在住。名古屋市在住。 n Windows 愛用。iPhone Android スマホ n Android の会浜松支部、Hamamatsu.js 、 よちよちサンデープログラミングの会(名古屋) Tiny Mouse 自己紹介
蔵書のリストを作りたい l 置き場所(どの部屋かどの書棚か)記録し たい l 多量の蔵書を一気に登録したい(読んだ都 度でなく既存の蔵書を登録する) l スマホで入力してパソコンで管理したい
そんな蔵書管理ソフトが見つからない ないなら作るか 置き場所ごとに一気に登録できる スマホで入力してパソコンで管理できる
蔵書管理アプリを作る HTML+JavaScript+Cordova フロントエンドは・・
蔵書管理アプリを作る Onsen UI+jQuery+Vue.js フロントエンドは・・
蔵書管理アプリを作る Google Spreadsheet データベースは・・
蔵書管理アプリを作る Google Apps Script バックエンドは・・
サーバサイドに Google Apps Script を使う GET メソッド、POST メソッドを受けて JSON などでレスポンスできる
https://sites.google.com/view/tinymouse-zoshodaicho 蔵書管理アプリを作った
フロントエンドに Cordova を使う ストアを使わないと導入できない
フロントエンドにブラウザを使う 「ウェブアプリとして公開」機能を使う
https://sites.google.com/view/tinymouse-zoshodaicho 蔵書管理アプリを作り直す
蔵書管理アプリを作り直す JavaScript のコードはそのまま使う
バーコード表示を読んで登録する
ウェブアプリでバーコード読取する
Qiita に書いた https://qiita.com/tinymouse/items/6aa75c30f828fe3f0c42 ウェブアプリでバーコード読取する
バーコード表示がある とは限らない
ISBN コードを OCR できるようにする
ウェブアプリで OCR する
Qiita に書いた https://qiita.com/tinymouse/items/ec3a6dfae0b334c95894 ウェブアプリで OCR する
iOS の Safari でカメラ画像を表示できない Android の Chrome 、FireFox で OK
なのに iOS の Safari 、Chrome でエラー Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
mediaDevices.getUserMedia() と iOS の Safari でハマった Qiita に書いた https://qiita.com/tinymouse/items/8b82f3578e167627d209
https://sites.google.com/view/tinymouse-zoshodaicho 蔵書管理アプリができた
苦労したこと n 使っていて、バグとか見つけたり、改善内容と か気づくと、修正するためプログラミングしてし まって、肝心の蔵書の登録できない
サーバサイドは開発者のリソースを使う よくあるウェブアプリとサーバサイドアプリ
開発者のプログラム一式を利用者に配付する
GAS のコードやドライブのオブジェクトを配付する ボタン一つでコピーして公開する処理したい
Qiita に書いた https://qiita.com/tinymouse/items/352aa8582b6c2ef1ddf0 GAS のコードやドライブのオブジェクトを配付する
実は・・ 以前に書いたコードが動かなくなった 直した この顛末だけで 一つの発表になる
実は・・ 事前に Google アカウントの 設定を変更して貰わないといけない
実は・・ 処理の途中で実行を承認して貰わないといけない
実は・・ 配付できたスクリプトの 実行を承認して貰わないといけない
苦労したこと n 他のユーザの Google ドライブにプログラム を配付して使用して貰うのが一苦労