Slide 1

Slide 1 text

React+FastAPIでの 簡単なWebアプリ作成 @izuna385

Slide 2

Slide 2 text

サマリ ● 最近やってたこと ○ 課題意識 ● 作ったもの ○ arxiv-checker.click ○ リポジトリ:https://github.com/izuna385/arxiv-checker ○ 発表が終わったら一旦VM落とします。

Slide 3

Slide 3 text

最近の課題意識 ● 自身の専門のみで解ける課題が非常に小さいこと ● 自然言語処理だけ出来たとしても、お客様の課題を解くのは難しい ● バックエンド以外の領域に手を広げて、課題解決の手段を広げたい。

Slide 4

Slide 4 text

具体的に言うと ● 例:たくさんテキストを持っているお客様 大量のテキストを分析して、マーケティングに役立てたい。

Slide 5

Slide 5 text

よくある例 お客様のデータを 持ち帰る 分析する

Slide 6

Slide 6 text

よくある例 お客様のデータを 持ち帰る 分析する サービスにつながらない

Slide 7

Slide 7 text

自分が今やっていることと、やりたいこと ・なんとかして、分析したノウハウをサービスにしたい。

Slide 8

Slide 8 text

自分が今やっていることと、やりたいこと ・なんとかして、分析したノウハウをサービスにしたい。 frontend backend DB

Slide 9

Slide 9 text

自分が今やっていることと、やりたいこと ・なんとかして、分析したノウハウをサービスにしたい。 frontend backend DB

Slide 10

Slide 10 text

自分が今やっていることと、やりたいこと ・なんとかして、分析したノウハウをサービスにしたい。 frontend backend 業務でやっていること DB

Slide 11

Slide 11 text

インフラ 自分が今やっていることと、やりたいこと ・なんとかして、分析したノウハウをサービスにしたい。 frontend やりたいこと backend 業務でやっていること DB

Slide 12

Slide 12 text

今日紹介するもの ● arxiv-checker.click (デプロイ:GCE, DNS解決: Route53) ● リポジトリ: https://github.com/izuna385/arxiv-checker ● バックエンドでarXivを叩いて、データを加えて結果をフロントに返すだけのアプリ。

Slide 13

Slide 13 text

バックエンド側の処理 ● FastAPIを用いて、内部で論文が扱うタスクと固有表現を抽出 request backend (container) frontend (container) Docker-compose

Slide 14

Slide 14 text

工夫した点 ● 開発環境と本番環境用でDockerfileを分離 ○ 本番環境用にはnginxもfrontend側のイメージに追加

Slide 15

Slide 15 text

工夫した点 ● バックエンドのテストを動く仕様書として実装 ○ pytest でテスト可能で、かつ各テストの目的が関数名で分かる

Slide 16

Slide 16 text

詰まった点・改善点 ● https化出来ていない。証明書を用意できていない。 ● スケール出来るサービスではない。 ● フロントの実装が弱い。

Slide 17

Slide 17 text

今後勉強しなくてはいけないこと ● フロントエンド ● Webの仕組み ○ なぜhttpで通って、https化を別途行わなくてはいけないのか? ● アクセス量に対してスケールする仕組み ○ k8s