Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Flaskを利用したWebアプリ開発に必要な知識と開発の進め方について
Search
Takagi Yuto
March 15, 2025
Technology
0
37
Flaskを利用したWebアプリ開発に必要な知識と開発の進め方について
Flaskでのアプリ開発におけるviewsやtemplates等のディレクトリ構成とそれらの役割や、Webアプリへのアクセスにおける種類と脆弱性, 開発フローをまとめました。
Takagi Yuto
March 15, 2025
Tweet
Share
More Decks by Takagi Yuto
See All by Takagi Yuto
センシングデータ解析8班 投球データ分析
yut0takagi
0
6
センシングデータ解析8班 走行データ分析
yut0takagi
0
9
1on1forEngineer 髙木悠人 中央大学
yut0takagi
0
2
Other Decks in Technology
See All in Technology
猫でもわかるS3 Tables【Apache Iceberg編】
kentapapa
2
210
[新卒向け研修資料] テスト文字列に「うんこ」と入れるな(2025年版)
infiniteloop_inc
13
42k
250510 StepFunctionのテスト自動化始めました vol.1
east_takumi
1
230
ソフトウェアテスト 最初の一歩 〜テスト設計技法をワークで体験しながら学ぶ〜 #JaSSTTokyo / SoftwareTestingFirstStep
nihonbuson
PRO
2
160
Vibe Coding Tools
ijin
1
260
20250514 1Passwordを使い倒す道場 vol.1
east_takumi
0
130
分解し、導き、託す ログラスにおける“技術でリードする” 実践の記録
hryushm
0
340
Global Azure2025(GitHub Copilot ハンズオン)
tomokusaba
2
800
Google Cloud Next 2025 Recap 生成AIモデルとマーケティングでのコンテンツ生成 / Generative AI models and content creation in marketing
kyou3
0
250
Amplifyとゼロからはじめた AIコーディング。失敗と気づき
mkdev10
1
130
newmo の創業を支える Software Architecture と Platform Engineering
110y
5
540
計測による継続的なCI/CDの改善
sansantech
PRO
7
1.4k
Featured
See All Featured
Producing Creativity
orderedlist
PRO
344
40k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Rebuilding a faster, lazier Slack
samanthasiow
81
9k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Speed Design
sergeychernyshev
29
940
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
5
570
Optimising Largest Contentful Paint
csswizardry
37
3.2k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.7k
The Cost Of JavaScript in 2023
addyosmani
49
7.8k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
710
Building Adaptive Systems
keathley
41
2.5k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Transcript
Flaskアプリの概要
アジェンダ 1. ディレクトリ構成 2. Webアプリの仕組みについて 3. 開発の流れ
ディレクトリ構成
ディレクトリ構成について 【基本的なディレクトリ構成】 wsgi.py application_ver2 ├── __init__.py ├── __pycache__ ├── config
├── forms ├── models ├── static ├── templates └── views 【開発で触れるディレクトリ】 1. Templates 2. Views 3. Forms 4. models
Viewsについて 【役割】 URLと表⽰されるHTMLを紐づける役割 【書き⽅について】(例: https://localhost:5000/homeの場合)
Templatesについて 【役割】 HTMLファイルを格納する役割 【レイアウトの使⽤について】 1. 共通部分とメイン部分で分けて定義する。 2. 共通部分については、基本的に触れない 3. 共通部分はLayoutに格納
4. 学⽣,塾関連,学校関連,全体共通で分別して格納
Formsについて 【役割】 サイトで⼊⼒箇所がある場合に、その形式をPythonのclassで定義する。 【書き⽅について】(例: ログインフォームの場合) 1. ⼊⼒箇所は、emailとpasswordの2つ 2. EmailはStingField(⽂字列)でDataRequired(⼊⼒必須),Emailとして認識します 3.
PasswordはPasswordField(⼊⼒すると**に変化)で、⼊⼒必須と認識します。
Modelsについて 【役割】 ユーザデータ(ログイン要件以外)や組織データをデータベースとしてどのように保存するかをクラスで定義する。 【書き⽅について】 ※Modelsを変更すると、データベース形式が崩れるので、影響範囲が⼤きいです。 そのため、変更は基本的に⾏わないでください。 各機能で新規に定義する場合には、連絡ください。
Webアプリの仕組み
Webアプリの仕組みについて サーバー リクエスト レスポンス こんなデータがほしい︕ (/homeにアクセス等) どうぞ︕(HTMLファイル等)
リクエストの種類について サーバー リクエスト(GET) ホームページにアクセスしたい リクエスト(POST) ログイン認証をしたい (アクセスと同時にユーザーデータを送信する)
開発の流れ
開発の流れ 1. Viewsで関数を定義し、HTMLファイルと接続する 基本的に、各機能におけるドメインは、あらかじめ決めて設定してあります。 2. Views関数内の処理を記述する GETとPOSTで別々に記述する TRY,EXCEPT等の例外処理をすべてに適⽤することで、セキュリティ脆弱性に関わるエラーを防⽌ 3. HTMLファイルを記述し、css等が反映されているか確認する
Block contentsとendblock内に記述する