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
ReactとPython/Djangoで何か作りたい
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
hoda
May 13, 2019
Technology
720
1
Share
ReactとPython/Djangoで何か作りたい
Python入門者の集い #8
https://python-nyumon.connpass.com/event/113338/
のLT資料です。
hoda
May 13, 2019
More Decks by hoda
See All by hoda
Stable Diffusion楽しいぞい というお気持ちの共有
hodanov
0
270
なぜ私はVimを使うことになったのか
hodanov
2
660
Docker入門ハンズオン.pdf
hodanov
6
2.5k
Other Decks in Technology
See All in Technology
AIプラットフォームを運用し続けるための可観測性
tanimuyk
4
1.1k
脅威をエンジニアリングの糧にして:恐怖を乗り越えた先にあったもの / Turn threats into fuel for engineering: what lay beyond overcoming fear
nrslib
1
380
Gradle×GitHub_ActionsでCI時間を約50%短縮 ジョブ分割の設計と落とし穴 / Cutting CI Time by ~50% with Gradle and GitHub Actions: Job-Splitting Design and Pitfalls
takatty
0
620
JJUG CCC 2026 Spring AI時代の開発こそ標準化を武器に! ― 方式・プロセス・プラットフォームの標準化
s27watanabe
2
690
関西に縁あるMicrosoft MVPsが語るCopilotの未来
kasada
0
1k
さきさん文庫の書籍ができるまで
sakiengineer
0
340
TROCCOで始めるクラウドコストを民主化するためのFinOps
tk3fftk
3
560
新規事業を牽引する技術選定 〜フルスタックTypeScript開発の実践事例〜
nullnull
2
260
先取りMaven4 ~16年ぶりのメジャーアップデート、その進化とは?~
ogiwarat
0
140
AIを「創る」と「使う」の循環 — HRテックが実践するリアルなAI組織実装
taketo957
0
1.1k
美味しいスイスチーズを作ろう🧀🐭
taigamikami
1
230
サプライチェーンセキュリティの空白地帯 - 信頼できる”依存性”の未来を考える
rung
PRO
2
650
Featured
See All Featured
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
320
The Invisible Side of Design
smashingmag
302
52k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
250
1.3M
Making the Leap to Tech Lead
cromwellryan
135
9.9k
From π to Pie charts
rasagy
0
200
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Optimising Largest Contentful Paint
csswizardry
37
3.7k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
160
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
1
530
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2k
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
Marketing to machines
jonoalderson
1
5.3k
Transcript
ReactとPython/Django で何か作りたい
Whois - 職業:Webエンジニア - 業務経験: Python/DjangoベースのWebアプリ改修・開発支援など (Pythonはまだまだスキル不足。お勉強中) - Twitter:@1031hoda
今日お話しすること 新しいフロントエンド技術のキャッチアップのために、Reactや Vue.jsとPython/Djangoで何か作りたい →試してみました!
Reactってなに。。?Djangoって? - React: UIを構築するためのJavaScriptのライブラリ 仮想DOMとかJSXとか謎の技術を使っている。。 - Django: Pythonベースのフルスタック型フレームワーク Ruby on
Railsの翌年(2005)にリリース
構成...Dockerで3つのコンテナに分離 (フロントとバック、DB) JSON形式の REST API データ ベース JSONデータを 拾って整形 Django
React Postgres
謎のWebアプリが完成しました。。! ← Inputタグに文 字を入力してボ タンをポチると 下の表に情報 が追加されま す。。!
工夫した点 - フロントエンド側(React)ではAxiosをimportし、Webページの再読み込み無しで データを更新 - バックエンド側(Python)ではDjango REST Frameworkというライブラリを使用して Web APIを構築
- フロントエンドとバックエンドは完全に独立しており、ドメインが異なる。そのため django-cors-headersライブラリを使用し、クロスドメインでのRequestを許可してい る。 ソースコード: https://github.com/hodanov/react-django-postgres-sample-app
- Reactは難しかったです(小並感) ReactやVue.jsの登場により、業界全体でフロントエンド主体の 開発にシフトしているようです。DjangoやRailsのようなフルスタッ ク型のフレームワークを使う場合もJSON形式のWeb APIを返す 方法をとり、ReactやVue.jsの持ち味を活かせるような開発を心 がけます。 がんばるぞい 終わり まとめ