java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!
TRANSCRIPT
![Page 1: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/1.jpg)
JavaScriptと REPOTEN-APIで かんたんPDF出力
アプリを作ってみた!ThinReports.ORG
![Page 2: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/2.jpg)
お話すること
• Single-page Application(SPA)で役に立つかもしれない?JavaScriptでPDFを表示する方法。
![Page 3: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/3.jpg)
自己紹介
• 前田 稔(@minoru_maeda)
• 島根県から参加
• OSS PDF生成ツールThinReportsの開発者
![Page 4: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/4.jpg)
Singel-page Application って?
• 単一ページによるWebアプリケーション
• ページ内容はJavaScriptで切り替える
• サーバとのやりとりはAjaxとかでやる
![Page 5: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/5.jpg)
かんたんPDF出力アプリで使うもの
• PDFへ埋め込むデータの送信PDFの取得、表示(クライアント側)
• HTML5 + JavaScript
• 動的なPDFの生成(サーバ側)
• REPOTEN-API
![Page 6: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/6.jpg)
REPOTEN-API って?
• 動的なPDFを作ってくれるWEB API
• 第6回フクオカ Ruby大賞 特別賞受賞
• 中でThinReportsが使われている
![Page 7: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/7.jpg)
REPOTEN-API って?
![Page 8: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/8.jpg)
かんたんPDF出力アプリのデモ
• 領収書を作ってくれるWebアプリケーション
• 金額を入力すればOK
![Page 9: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/9.jpg)
かんたんPDF出力アプリのデモ
• デモアプリのURL
• http://p.tl/MvLG
• デモアプリのソースコード
• http://p.tl/JK9p
![Page 10: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/10.jpg)
かんたんPDF出力アプリの仕組み1. REPOTEN-API
へ金額を送る準備
2. PDFを受け取った時は新規ウィンドウで開くと定義する
3. 入力された金額をREPOTEN-APIへ送り、PDFを受け取る
![Page 11: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/11.jpg)
Let’s Enjoy Programming!
![Page 12: Java scriptとrepoten apiでかんたんpdf出力アプリを作ってみた!](https://reader030.vdocuments.net/reader030/viewer/2022020218/5596dc4a1a28abd06a8b4785/html5/thumbnails/12.jpg)
ご清聴ありがとうございました。