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
Ajax in React with axios
Search
takanorip
November 04, 2016
Technology
720
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Ajax in React with axios
takanorip
November 04, 2016
More Decks by takanorip
See All by takanorip
今さら理解するウェブフォントver.2026
takanorip
3
770
AI-Slopなデザインを生まないためのデザインプロセス戦略
takanorip
10
6.3k
「見せる」登壇資料デザインの極意
takanorip
7
1.8k
Design System Documentation Tooling 2025
takanorip
3
3.1k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
1
1.4k
Tools for Design Engineers other than LLM in the LLM era
takanorip
1
920
Bulletproof Design System with TypeScript
takanorip
7
5.4k
Eleventy3.0 で始める爆速個人ブログ開発!
takanorip
0
320
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
6
1.2k
Other Decks in Technology
See All in Technology
『SAR衛星データ解析入門』のご紹介とその応用
syuchimu
0
120
Conditional PED-ANOVA: Hyperparameter Importance in Hierarchical & Dynamic Search Spaces
pfn
PRO
0
130
USB PDを使ってスマホを労わりたい
raspython3
0
180
DGX Spark でどこまでハッキングができるのか?
kash1064
3
1.3k
スプシの手作業からの解脱 ~更新はClaude Codeに、見せ方と使い方はGASアプリに任せる~
kentarofujii
0
150
その Valkey 使いこなしていますか?
onk
PRO
5
1.5k
大型犬好きによるPugの紹介
yamanoku
1
160
Classmethod Company Deck
satoshi7
1
680
子育てエンジニアの可処分時間が減っても成長を諦めない戦い方
sudoakiy
6
4.6k
⾮構造化データを価値に変える AI エージェント基盤とその組織
ivry_presentationmaterials
0
190
初海外で注意すべきこと12選!!!安全快適なre:invent生活にするために
yuuuuuuu168
1
160
"優秀な誰か"の下位互換にならないために
yut0naga1_fa
1
1.8k
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Are puppies a ranking factor?
jonoalderson
2
4.1k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.2k
Scaling GitHub
holman
464
140k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
3k
Java REST API Framework Comparison - PWX 2021
mraible
34
9.8k
Exploring anti-patterns in Rails
aemeredith
4
540
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
56k
For a Future-Friendly Web
brad_frost
184
10k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
232
55k
Amusing Abliteration
ianozsvald
1
350
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
63
46k
Transcript
Ajax in React with axios @React&React Native入門者の会
自己紹介 • 大木尊紀(@takanorip) • 株式会社フォーデジットデザイン • フロントエンドエンジニア
今日話すこと
Reactで PromiseなAjaxやってみた という話
前提
React = Library (React ≠ FrameWork)
Ajaxは自前で 実装する必要がある
主な実装方法
jQuery
jQueryによる実装
Ajaxだけで使うには jQueryは重すぎ…
Promise ES2015
Promise • 非同期処理を抽象化したオブジェクト • ES2015で実装された • 書き方が統一されている • 詳しくは→JavaScript Promiseの本
axios
axios • Promise based HTTP client for the browser and
node.js • PromiseベースのHTTPクライアント • IEでもPromise使えるようになる
How To Use
How To Use 1. HFU ͰGETϦΫΤετ 2. σʔλऔಘޙʹUIFO Λ࣮ߦ 3.
Τϥʔͷ߹ DBUDI Λ࣮ߦ
ײ • jQueryʹ͘ΒͯεοΩϦ͔͚ΔͷͰخ͍͠ • JSONPରԠͯ͠ͳ͍ͷͰΫϩευϝΠϯରԠ ͢Δࡍҙ͕ඞཁ (I have decided not
to support JSONP as part of axios.) ということらしい…