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
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
hoda
May 13, 2019
Technology
710
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
260
なぜ私はVimを使うことになったのか
hodanov
2
640
Docker入門ハンズオン.pdf
hodanov
6
2.4k
Other Decks in Technology
See All in Technology
AgentCoreとLINEを使った飲食店おすすめアプリを作ってみた
yakumo
2
270
20260323_データ分析基盤でGeminiを使う話
1210yuichi0
0
210
CloudFrontのHost Header転送設定でパケットの中身はどう変わるのか?
nagisa53
1
230
不確実性と戦いながら見積もりを作成するプロセス/mitsumori-process
hirodragon112
1
160
SaaSに宿る21g
kanyamaguc
2
180
Oracle AI Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
4
1.3k
AI時代のオンプレ-クラウドキャリアチェンジ考
yuu0w0yuu
0
670
第26回FA設備技術勉強会 - Claude/Claude_codeでデータ分析 -
happysamurai294
0
190
OPENLOGI Company Profile for engineer
hr01
1
61k
Zephyr(RTOS)でOpenPLCを実装してみた
iotengineer22
0
160
MCPで決済に楽にする
mu7889yoon
0
160
脳が溶けた話 / Melted Brain
keisuke69
1
1.1k
Featured
See All Featured
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
470
Automating Front-end Workflow
addyosmani
1370
200k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
310
Prompt Engineering for Job Search
mfonobong
0
240
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
64
54k
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
79
What does AI have to do with Human Rights?
axbom
PRO
1
2.1k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
Building the Perfect Custom Keyboard
takai
2
720
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
The Spectacular Lies of Maps
axbom
PRO
1
660
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の持ち味を活かせるような開発を心 がけます。 がんばるぞい 終わり まとめ