search

hushianasan / DIS_Company

2 stars 0 forks source link

UIの検討 #5

Closed hushianasan closed 1 year ago

hushianasan commented 1 year ago

到達目標

  1. コンソールでの動作に落とし込む
  2. ノーコードでのWeb動作に落とし込む
  3. 適当にHTML, CSS書いてどうにかする
  4. AI使って適当にWebUIを自動生成する
hushianasan commented 1 year ago

コンソールでの動作は自信あり。 汎用性のあるコードを書き、ノーコード, Webでの動作を出来るように落とし込むことが鍵になると考える。

hushianasan commented 1 year ago

どう合わせてコード書けばいいかちょっと気になる

hushianasan commented 1 year ago

9 #10 #11 の根幹がこのIssueになる。

ひとまず1を採用する。１をどう汎用性のあるコードにするか。 CLIのみの移植性のないコードを書くのは正直釈然としない。 @igz0 @ddcgm63a すみません助言お願いします。

  1. コンソールでの動作に落とし込む

＞＞安牌

  1. ノーコードでのWeb動作に落とし込む

＞＞@igz0 がやめとけって。コード書いてから迷宮入り可能性大。

  1. 適当にHTML, CSS書いてどうにかする

＞＞Webを円滑に書けるなら。避けるのが安牌。 私の書くコードと接地面に合うWebを軽率に書いてくれる人がいない。無理。

  1. AI使って適当にWebUIを自動生成する

＞＞多分無理がある。ChatGPTを使って書くならありだが詰む可能性大。

hushianasan commented 1 year ago

時間がないので#11 #9 をつまみ食いして調査と手を動かす。

ddcgm63a commented 1 year ago

これは難しいですね。グラフ表示が必要ということでPython系統のフレームワークを選定しようかと思いましたが、 Django、Flaskあたりがエラーなく構築できるノウハウがないです。同時にエラーなくデプロイできるノウハウも持ってないと言えます。（わたしの知識不足ですね）

わたしならNext.jsでアプリケーションを作成、Versel(ホスティングサービス)にデプロイ、デプロイしたアプリケーションのURLを成果物として提出します。

Next.jsの選定理由は ・ページペースのルーティングで、ルーティングが他フレームワークと比べて簡単 ・SSR（サーバーサイドレンダリング）可能 ・Verselとの強力タッグでインフラ環境構築の時間を省略→実装時間を確保したい ・グラフはReact系統と相性のいいライブラリに描画させればいけるでしょ（楽観）

気になる点としては ・いきなりJSX記法はキツいのでは ・MVCモデル(Angular)のほうが、普通のHTMLとCSSが使えるので、わかりやすいのでは ・しかしAngularでグラフ…ハマるか…？ ・Next.jsでもAngularでも、業務時間が8×5=40時間あっても、作業が終わるか自信ないボリューム感

として悶々と悩んでいます。

今回データはAPIから取ってくるだけなので、フロントエンドの作業ばかりかと考えてます。 （DB作ったり、API作らんでいいって意味。）

あとはigz0お兄さんにバトンタッチです。 全然違うアプローチがあるかも。 むしろあってくれ。

補記：期限が期限なので、わたしならテスト駆動は切り捨てます。 (READMEにあったので)

hushianasan commented 1 year ago

@ddcgm63a 氏が言わんとすることは理解しました。

これは難しいですね。グラフ表示が必要ということでPython系統のフレームワークを選定しようかと思いましたが、 Django、Flaskあたりがエラーなく構築できるノウハウがないです。同時にエラーなくデプロイできるノウハウも持ってないと言えます。

＞＞Python3で特別完結する必要もないのではと考えます。 正直わたしもそこまで経験があるわけでもないので（眠たいし）、調査の方進めます。#3 CLIも現在ちょこっと書いてます。

@igz0 お兄さん昨日のまっ昼間から今日の深夜にかけてアルコールをぶち込んでるからダメかもしれない・・・。

igz0 commented 1 year ago

補記：期限が期限なので、わたしならテスト駆動は切り捨てます。

完全に同意です。テストコード書く時間はないです。

わたしならNext.jsでアプリケーションを作成、Versel(ホスティングサービス)にデプロイ、デプロイしたアプリケーションのURLを成果物として提出します。

私自身がやるなら、@ddcgm63a さんと同じく 同じくこの選定をすると思います。 ですが、React・Next.jsのキャッチアップ時間を考えると@husianasan にとって不可能に近いです。

新しく言語・フレームワークをキャッチアップする時間がないということを考慮に入れ

にするのがいいと思います。

hushianasan commented 1 year ago

テスト駆動開発, @ddcgm63a 氏の考え承知しました。 いまCLIと調査に着手しています。

igz0 commented 1 year ago

@hushianasan @ddcgm63a [imo] 優先順位としては、CLIの調査よりまずスクレイピングに着手した方がいいかもです。

理由としては、

です。

hushianasan commented 1 year ago

@igz0 @ddcgm63a imo🍠🥔!!!!👏

hushianasan commented 1 year ago

これを完成の優先順位として改めました。グラフはひとまず置いておきましょう。 私のミスで気象庁非公式のJSONは一部情報を引っ張れない事が判明しました。 @igz0がはっちゃけすぎてChatGPT4とGitHub Copilotを使ってScraperを秒速で書いた事についてはここのIssueでのみ私は目を瞑りましょう。

import requests
from bs4 import BeautifulSoup
import pandas as pd
from datetime import datetime
import time
from urllib.parse import urlencode

# スクレイピング部分
def scrape_weather_data(year, month,block_no):

    # 西条の場合はURLを変更
    if block_no == '0958':
        base_url = 'https://www.data.jma.go.jp/obd/stats/etrn/view/daily_a1.php'
    else:
        base_url = 'https://www.data.jma.go.jp/obd/stats/etrn/view/daily_s1.php'

    params = {
        'prec_no': '73',
        'block_no': block_no,
        'year': year,
        'month': month,
        'day': '',
        'view': 'p1'
    }

    # Webページを取得
    response = requests.get(base_url, params=params)
    response.raise_for_status()

    # BeautifulSoupでHTMLを解析
    soup = BeautifulSoup(response.content, 'html.parser')

    # テーブルを探す
    table = soup.find("table", class_="data2_s")

    if table is None:
        full_url = f"{base_url}?{urlencode(params)}"
        print(f"テーブルが見つかりませんでした。: {year}/{month} {full_url}")

        # テーブルの中身がなかった場合にデバッグ用にHTMLを保存
        # with open(f"weather_{year}_{month}.html", mode="w") as f:
        #     f.write(str(soup))

        return []

    # 行を抽出
    trs = table.find_all("tr")

    data_list = []
    for tr in trs:
        tds = tr.find_all("td")
        if len(tds) == 0:
            continue

        # 降水量
        prec = tds[3].text

        # 平均気温
        avg_temp = tds[6].text

        # 最低気温
        min_temp = tds[7].text

        # 最高気温
        max_temp = tds[8].text

        row_data = [year, month, prec, avg_temp, min_temp, max_temp]
        data_list.append(row_data)

    return data_list

# 現在の年と月を取得
current_year = datetime.now().year
current_month = datetime.now().month

# 直近1年のデータを取得するための年月リストを生成 (現在の月は除外)
dates = []
current_month -= 1  # 現在の月を除外
if current_month == 0:
    current_month = 12
    current_year -= 1

for _ in range(12):
    dates.append((current_year, current_month))
    current_month -= 1
    if current_month == 0:
        current_month = 12
        current_year -= 1

# 松山・宇和島・西条の観測地点番号と名称
block_info = {
    '47887': '松山',
    '47892': '宇和島',
    '0958':  '西条'
}

#出力データ
weather_data = []

for block, location in block_info.items():
    for year, month in dates:
        data = scrape_weather_data(year, month, block)
        # time.sleep(0.1)
        for row in data:
            row_data = [location] + row  # 地点名をデータに追加
            weather_data.append(row_data)

# pandasを使用してデータフレームに変換
df = pd.DataFrame(weather_data, columns=['Location', 'Year', 'Month', 'Precipitation', 'Average Temp', 'Min Temp', 'Max Temp'])
print(df)