Upgrade to Pro — share decks privately, control downloads, hide ads and more …

データ分析者にとってのDjango: StreamlitやDashとの比較

ksnt
October 07, 2023
730

データ分析者にとってのDjango: StreamlitやDashとの比較

DjangoCongress JP 2023登壇資料

ksnt

October 07, 2023
Tweet

Transcript

  1. データ分析者にとっての
    Django: StreamlitやDashと
    の比較
    Takayuki Kaisen
    [email protected]
    @ksnt0215
    DjangoCongress JP 2023

    View full-size slide

  2. 発表の概要 • 自己紹介
    • Djangoとわたし
    • StreamlitとDashとわたし
    • DjangoとStreamlitとDash
    • Jupyter notebook上でDashを使う
    • StreamlitおよびDjangoで生成AIアプリ
    • まとめ

    View full-size slide

  3. 注意
    Djangoの不便だなとおもうとこ
    ろを話したりすることもあるか
    もしれませんが、Django初学者
    ゆえの知識不足から来ていたり
    することもあるかとおもいます
    間違ったことを話していたら
    ご教示ください m(_ _)m

    View full-size slide

  4. お前だれよ?

    View full-size slide

  5. データ分析職
    の中での私の
    立ち位置
    • 大きく分けて3つの名前(役割名)
    • データエンジニア、データサイエンティスト、
    データアナリスト
    • データエンジニアはデータ分析基盤をつくる
    • データサイエンティストはアルゴリズムを開

    • データアナリストは…
    • 私の所属していた会社ではデータアナリストはUS
    側ではデータエバンジェリストとも呼ばれる
    • 顧客対応(お客さんと一緒にデータの有効な
    活用方法を議論、データ分析の結果を報告)
    • データの分析(pandas, geopandas, scikit-learn,
    QGIS)
    • SaaSを提供
    • Djangoを使用
    • エンジニアチームが主導

    View full-size slide

  6. データアナリストの
    仕事
    • データの確認
    • データのクリーニング・ラングリング
    • 機械学習
    • 可視化
    • 報告書作成
    • 報告
    • 納品

    View full-size slide

  7. データ分析職のた
    めの道具
    • データ分析
    • Jupyter notebook
    • Python(pandas, scikit-learn)
    • (Streamlit, Dash)
    • ChatGPT

    View full-size slide

  8. Djangoとわたし
    • 前職を退職し以前から興味があった職業訓練校へ
    • Webエンジニアを目指すコース
    • 2023年7月〜9月末(3か月)
    • 学んだこと: コンピュータ基礎、HTML、CSS、SQL、Python、Django
    • 毎日赤坂にあるビルの一室で授業・演習
    • 一冊Djangoの本を読んでみた!
    • MTV(MVT?)
    • クラスベースビュー, 関数ベースビュー

    View full-size slide

  9. 職業訓練校でDjangoを学ぶ – いいね機能
    の実装
    9
    • 「いいね」機能の実装を行ってみた
    • ChatGPTに訊きつつ実装

    View full-size slide

  10. 職業訓練校でDjangoを学ぶ – いいね機能
    の実装
    10
    class ArticlePost(models.Model):

    likes = models.ManyToManyField(CustomUser, verbose_name='likes’, related_name='article_post')
    def like_post(request, post_id):
    post = ArticlePost.objects.get(pk=post_id)
    user = request.user
    if user in post.likes.all():
    post.likes.remove(user)
    post.likes_count -= 1
    else:
    post.likes.add(user)
    post.likes_count += 1

    View full-size slide

  11. 職業訓練校でDjangoを学ぶ – いいね機能
    の実装
    11

    {% csrf_token %}
    {% if user in record.likes.all %}
    style="color:blue" id="heart-icon">Unlike
    {% else %}
    style="color:red" id="heart-icon">Like
    {% endif %}

    View full-size slide

  12. Djangoに持っていたイメージ
    • 難しい
    • なんかファイルがたくさんあってコワい
    • たくさんコードを書かなければいけない
    • すぐには動かない
    • 大規模開発向き

    View full-size slide

  13. Djangoを学んでみて感じたイメージ
    • 難しいは難しい(初学者が学ぶハードルが高い)
    • ファイルはたくさんある(プロジェクトを作成するとたくさんファイルができ
    る)
    • そこそこコードを書く
    • すぐには動かない(ex. Hello, World的アプリケーション)
    • 大規模開発向き?

    View full-size slide

  14. Streamlitと
    Dashと
    わたし
    14

    View full-size slide

  15. Streamlitと
    Dashと
    わたし(1)
    • Dashとの出会い
    • Python for Shinyとの触れ込み (2018年頃)
    • もともとRユーザー
    • ラクしてWebアプリを作成したい(データ
    分析に注力したい)
    • ドキュメントの翻訳をしたり
    • Streamlitとの出会い
    • Courseraで講義を発見
    • 使ってみると超簡単にフロントエンドが書
    ける・デプロイできる
    • pydeckが使えた
    • PyCon JP 2020チュートリアルでも使用

    View full-size slide

  16. Streamlitと
    Dashと
    わたし(2)
    • 書き方は似ている
    • たぶん競合
    • どちらも簡単にデータ駆動のwebアプリ
    を作成できる
    • Dashにはまとまった情報
    を得ることができる日本語
    の本がある

    View full-size slide

  17. Streamlitと
    Dashとわた
    し(3)
    • Streamlitの利点
    • Snowflakeが買収
    • Snowflakeとの連携
    • データ分析職にとってのSnowflakeの存在感
    • Tableauと組み合わせて使うこともできる
    • https://docs.streamlit.io/knowledge-
    base/tutorials/databases/tableau

    View full-size slide

  18. DjangoとDashとStreamlit
    • DashやStreamlitはJupyter notebookと親和性が高い
    • この後ライブコーディングで紹介(DashをJupyter notebookと併用)
    • DjangoをJupyter notebookで使う方法もある
    • https://medium.com/ayuth/how-to-use-django-in-jupyter-notebook-
    561ea2401852

    View full-size slide

  19. DjangoとDashとStreamlit
    • DjangoにReactを組みあわせる < DjangoにDashを組み合わせる < Dashのみでつ
    くる
    • イマドキのフロントエンドづくりがカンタン!
    • django-plotly-dashというパッケージがあるのでDjangoとDashの組み合わせは可能だ
    が使うのは調べた限りでは大変そう
    • DashはHTMLになれている人がコンポーネントをつくっていくと便利(Reactだと
    大変)
    • 「DashからReactへ」という道もよいのでは?(for データ分析のひとたち)
    • React (for フロントエンドの人)

    View full-size slide

  20. Jupyter notebookを
    使って
    DashでWebアプリ
    的なものをつくる
    https://github.com/plotly-dash-
    book/events/blob/main/20201205/da
    sh/plotly_dash_hands_on.ipynb
    注) グラフが表示されないときはコマンドライン
    で以下を実行してください。
    $ jupyter labextension install jupyterlab-plotly
    $ jupyter labextension install @jupyter-widgets/jupyterlab-manager plotlywidget

    View full-size slide

  21. Streamlitの
    使いどころ
    • 生成AIアプリ
    • LLMアプリ
    • ダッシュボード作成
    • プロトタイプ作成

    View full-size slide

  22. 生成AIアプリ(OpenAIのAPIを使
    う)をStreamlitで作ってみる
    import streamlit as st
    import openai
    openai.api_key = "YOUR_API_KEY“
    prompt = st.chat_input("どんな画像が欲しいですか?")
    if prompt:
    response = openai.Image.create(
    prompt=prompt,
    n=1,
    size="512x512"
    )
    image_url = response['data'][0]['url']
    st.image(image_url)

    View full-size slide

  23. 生成AIアプリ(OpenAIのAPIを使
    う)をStreamlitで作ってみる
    $ streamlit run app.py

    View full-size slide

  24. 生成AIアプリ(OpenAIのAPIを使う)
    をDjangoで作ってみる(1)
    プロジェクトおよびアプリ作成
    $ django-admin startproject
    gaiproject
    $ python .¥manage.py startapp
    chatapp

    View full-size slide

  25. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(2)
    - settings.pyの編集
    #settings.py
    INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    ‘chatapp’, # アプリの登録
    ]

    View full-size slide

  26. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(3)
    - プロジェクトのurls.pyの編集
    # project_name/urls.py
    from django.contrib import admin
    from django.urls import path, include
    urlpatterns = [
    path('admin/', admin.site.urls),
    path('chatapp/', include('chatapp.urls')), # chatappの
    URLインクルード
    ]

    View full-size slide

  27. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(4)
    - アプリのurls.pyを編集
    # yourapp/urls.py
    from django.urls import path
    from . import views
    urlpatterns = [
    path('', views.chatbot_view,
    name='chatbot_view'),
    ]

    View full-size slide

  28. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(5)
    - Viewを記述
    # chatapp/views.py
    from django.shortcuts import render
    import openai
    openai.api_key = “YOUR_API_KEY“
    def chatbot_view(request):
    if request.method == 'POST':
    prompt = request.POST.get('prompt', '')
    if prompt:
    response = openai.Image.create(
    prompt=prompt,
    n=1,
    size="512x512"
    )
    image_url = response['data'][0]['url']
    return render(request, 'chatbot.html', {'image_url': image_url})
    return render(request, 'chatbot.html')

    View full-size slide

  29. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(6)
    - テンプレートを記述





    Chatbot Image Generator


    Chatbot Image Generator

    {% csrf_token %}
    どんな画像が欲しいですか?
    required>


    {% if image_url %}

    {% endif %}


    View full-size slide

  30. 生成AIアプリ(OpenAIのAPIを使
    う)をDjangoで作ってみる(7)
    - GitHubへのリンク
    https://github.com/ksnt/django_
    congress_2023/tree/main/django/
    gaiproject

    View full-size slide

  31. まとめ
    31
    • 本格的なWebアプリケーションをつくるならDjango
    • プロトタイプ的なWebアプリケーションでよいのなら
    StreamlitやDashという選択も考えるとよいかも
    • データ分析に注力したいときにはStreamlitやDashという選
    択肢もありかも

    View full-size slide

  32. Special Thanks,
    32
    小川英幸さん (はんなりプログラミング)

    View full-size slide