蔵書管理アプリを作っています

 蔵書管理アプリを作っています

0ab16037033e1851fb4a1d44687b5426?s=128

Tiny Mouse

March 22, 2019
Tweet

Transcript

  1. Tiny Mouse 蔵書管理アプリを作っています Hamamatsu.js 2019/3/22

  2. n @tinymouse_jp n SI 企業の SE n 日曜プログラマ n 二児の父

    n 静岡県浜松市出身 n 東京都品川区在住。名古屋市在住。 n Windows 愛用。iPhone Android スマホ n Android の会浜松支部、よちよち Android の会、 Hamamatsu.js Tiny Mouse 自己紹介
  3. 蔵書のリストを作りたい l 置き場所(どの部屋かどの書棚か)記録し たい l 多量の蔵書を一気に登録したい(読んだ都 度でなく既存の蔵書を登録する) l スマホで入力してパソコンで管理したい

  4. そんな蔵書管理ソフトが見つからない ないなら作るか 置き場所ごとに一気に登録できる スマホで入力してパソコンで管理できる

  5. 蔵書管理アプリを作る Google Spreadsheet データベースは・・

  6. 蔵書管理アプリを作る Google Apps Script バックエンドは・・

  7. Google Apps Script n Google が提供 n JavaScript ベースのスクリプト言語 n

    クラウド環境で開発し実行できる n Google Spreadsheet などを操作するオブジェクトが用 意されている n Google ドキュメントの変更などのイベント、予め指定さ れたスケジュール、外部からの指示などで実行できる
  8. スプレッドシートにデータを追加する var header = SpreadsheetApp.getActiveSpreadsheet().getRangeByName('header'); var columns = header.getValues()[0]; var

    sheet = header.getSheet(); var index = cell.getRow() - header.getRow(); if (!info.uuid) { info.uuid = Utilities.getUuid(); } for (prop in info) { if (columns.indexOf(prop) < 0) continue; header.getCell(1, 1).offset(index, columns.indexOf(prop)).setValue(info[prop]); }
  9. ISBN から書籍情報を取得する var url = 'http://iss.ndl.go.jp/api/opensearch?isbn=' + isbn; var info

    = {}; try { var response = UrlFetchApp.fetch(url); if (!response) { return null; } var xml = XmlService.parse(response.getContentText()); if (!xml) { return null; } var items = xml.getRootElement().getChildren("channel")[0].getChildren("item"); info.jan = isbn; if (items.length == 0) { return null; } items.forEach(function(item){ var title = item.getChildText("title", namespaceDc); var creators = item.getChildren("creator", namespaceDc);
  10. ISBN から書籍情報を取得する l 国立国会図書館のデータベースサービス →CD や DVD の情報が登録されていない l 楽天ブックスのデータベースサービス

    →登録して API キーを貰う必要あり l Amazon の検索ページ →スクレイピングする。やりすぎるとブロックされる
  11. ウェブ API を公開する

  12. POST メソッドを受けてデータ処理する function doPost(e) { // 指定されたJANコードを取得 var jan =

    e.parameters.jan[0]; // 入力されたJANコードから情報を取得 var info = getInfo(jan); // 指定された「置場」をセット info.location = e.parameters.location[0]; // 取得した情報をシートの最終行にセット addInfo(info); // 取得した情報をJSONデータで返信 return ContentService.createTextOutput(JSON.stringify({ result: "info added", jan: jan, info: info })).setMimeType(ContentService.MimeType.JSON);
  13. スプレッドシートからデータを取得する var header = SpreadsheetApp.getActiveSpreadsheet().getRangeByName("header"); var columns = header.getValues()[0]; var

    sheet = header.getSheet(); var range = sheet.getRange(header.getRow() + 1, header.getColumn(), sheet.getLastRow() - header.getRow(), header.getLastColumn() - header.getColumn() + 1); var values = range.getValues(); var found = values.filter(function(element, index, array) { return element.some(function(element, index, array) { return (element.toString().toLowerCase().indexOf(keyword.toLowerCase()) > -1); }); }); var result = []; found.forEach(function(item){ var buf = {}; for (var n = 0; n < columns.length && n < item.length; n++) { buf[columns[n]] = item[n]; } result.push(buf); });
  14. GET メソッドを受けて値を返す function doGet(e) { // 指定されたキーワードを取得 var keyword =

    e.parameters.keyword[0]; // 指定したキーワードでシートから情報を検索 var infos = findInfos(keyword); if (!infos) { return ContentService.createTextOutput(JSON.stringify({ result:"no info", keyword:keyword })).setMimeType(ContentService.MimeType.JSON); } // 取得した情報をJSONデータで返信 return ContentService.createTextOutput(JSON.stringify({ result:"info found", keyword:keyword, infos:infos })).setMimeType(ContentService.MimeType.JSON); }
  15. サーバサイドに Google Apps Script を使う 「ウェブアプリケーションとして公開」 GET メソッド、POST メソッドを受けて JSON

    などでレスポンスできる
  16. 蔵書管理アプリを作る HTML+JavaScript+Cordova フロントエンドは・・

  17. Cordova アプリでバーコード読取

  18. 蔵書管理アプリを作る Onsen UI+jQuery+Vue.js フロントエンドは・・

  19. 蔵書管理アプリを作った

  20. 蔵書管理アプリを作った

  21. 蔵書管理アプリを作った Google Apps Script はいいよ!