Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
ReactとPython/Djangoで何か作りたい
Search
hoda
May 13, 2019
Technology
750
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
280
なぜ私はVimを使うことになったのか
hodanov
2
690
Docker入門ハンズオン.pdf
hodanov
6
2.5k
Other Decks in Technology
See All in Technology
Draft AIエージェントの トークン消費を最小化する 8つの原則
kinopeee
6
1.8k
【Oracle AI SPOTLIGHT ウェビナー】事例から見る!なぜOCIが選ばれたのか ― AI時代のクラウド戦略を紐解く ―
oracle4engineer
PRO
1
120
Snowflake でできることが増えたら、 ABAC が必要になった
kaeton
0
110
Let's Change Our World—Again
snoozer05
PRO
6
710
1週間、Opus封印でお願いします
kintotechdev
0
340
Vue で書く 空間コンピューティング、TresJS と WebXR を使ったXR デバイスのフロントエンド開発
hiranuma
0
120
クラウドサインを止めずに Nuxt へ 次の10年のために先に決めたこと
bengo4com
1
170
シンプルな設定ファイルで実現する AWS IAM Identity Center の ユーザー管理Terraformフレームワークを公開しました / Simplifying AWS IAM Identity Center User Management: An Open-Source Terraform Framework
yamaguchitk333
1
330
Adversary Infrastructure Hunting101
disconinja
0
160
GitHub、使う?使わない?
happysamurai294
0
110
小規模OSSモデルは サイバーセキュリティ業務に どこまで使えるか
bbrbbq
0
310
渡米前の準備を制す!re:Invent 2026徹底準備術 / The Ultimate Preparation Guide for re:Invent 2026
yuj1osm
1
360
Featured
See All Featured
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.3k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
68
59k
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Reflections from 52 weeks, 52 projects
jeffersonlam
356
22k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Deep Space Network (abreviated)
tonyrice
0
390
How to make the Groovebox
asonas
2
2.5k
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
940
Typedesign – Prime Four
hannesfritz
42
3.2k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
590
Everyday Curiosity
cassininazir
0
370
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
500
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の持ち味を活かせるような開発を心 がけます。 がんばるぞい 終わり まとめ