Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Ajax in React with axios

Avatar for takanorip takanorip
November 04, 2016
Technology
710
0

Ajax in React with axios

Avatar for takanorip

takanorip

November 04, 2016

More Decks by takanorip

See All by takanorip
「見せる」登壇資料デザインの極意
Avatar for takanorip takanorip
3
790
Design System Documentation Tooling 2025
Avatar for takanorip takanorip
3
2.6k
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
Avatar for takanorip takanorip
1
1k
Tools for Design Engineers other than LLM in the LLM era
Avatar for takanorip takanorip
1
730
Bulletproof Design System with TypeScript
Avatar for takanorip takanorip
7
5k
Eleventy3.0 で始める爆速個人ブログ開発！
Avatar for takanorip takanorip
0
280
Webフォント選定の極意！フォントの基本から最新トレンドまで徹底解説
Avatar for takanorip takanorip
6
1.1k
効果的な管理画面を デザインをするために 避けるべき5つの罠
Avatar for takanorip takanorip
15
7.8k
社内管理画面のデザインもプロダクトデザイン
Avatar for takanorip takanorip
5
2.2k

Other Decks in Technology

See All in Technology
「強制アップデート」か「チームの自律」か？エンタープライズが辿り着いたプラットフォームのハイブリッド運用/cloudnative-kaigi-hybrid-platform-operations
Avatar for みずほリサーチ&テクノロジーズ株式会社 先端技術研究部 mhrtech
0
160
データモデリング通り #5オンライン勉強会： AIに『ビジネスの文脈』を教え込むデータモデリング
Avatar for データ横丁 datayokocho
0
220
Vision Banana: Image Generators are Generalist Vision Learners
Avatar for Kazuyuki Miyazawa kzykmyzw
0
340
変化の激しい時代をゴキゲンに生き抜くために 〜ストレスマネジメントのススメ〜
Avatar for KAKEHASHI kakehashi
PRO
5
1.2k
ボトムアップ限界を越える - 20チームを束る "Drive Map" / Beyond Bottom-Up: A 'Drive Map' for 20 Teams
Avatar for 株式会社カオナビ kaonavi
0
170
フロントエンドの相手が変わった - AIが加わったWebの新しいインターフェース設計
Avatar for azukiazusa azukiazusa1
33
11k
クラウドネイティブ DB はいかにして制約を 克服したか？ 〜進化歴史から紐解く、スケーラブルアーキテクチャ設計指針〜
Avatar for hacomono Inc. hacomono
PRO
6
850
Oracle Base Database Service 技術詳細
Avatar for oracle4engineer oracle4engineer
PRO
15
100k
20260516_SecJAWS_Days
Avatar for Takuya Yonezawa takuyay0ne
1
210
Modernizing Your HCL Connections Experience: Visual Report to chain, Profile Enhancements, and AI Integration
Avatar for Wannes Rams wannesrams
0
300
そのSLO 99.9%、本当に必要ですか？ 〜優先度付きSLOによる責任共有の設計思想〜 / Is that 99.9% SLO really necessary? Design philosophy of shared responsibility through prioritized SLOs
Avatar for VTRyo vtryo
0
500
鹿野さんに聞く！CSSの最新トレンド Ver.2026
Avatar for tonkotsuboy_com tonkotsuboy_com
6
2.8k

Featured

See All Featured
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.7k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
82
6.2k
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
Avatar for Marco Roth marcoroth
1
33
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.9k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
75
12k
Google's AI Overviews - The New Search
Avatar for Barry Adams badams
0
1k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
250
1.3M
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
2.9k
WENDY [Excerpt]
Avatar for Tessa Abrams tessaabrams
10
37k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.6k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
130
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
870

Transcript

  1. Ajax in React with axios @React&React Native入門者の会

  2. 自己紹介 • 大木尊紀（@takanorip） • 株式会社フォーデジットデザイン • フロントエンドエンジニア

  3. 今日話すこと

  4. Reactで PromiseなAjaxやってみた という話

  5. 前提

  6. React = Library (React ≠ FrameWork)

  7. Ajaxは自前で 実装する必要がある

  8. 主な実装方法

  9. jQuery

  10. jQueryによる実装

  11. Ajaxだけで使うには jQueryは重すぎ…

  12. Promise ES2015

  13. Promise • 非同期処理を抽象化したオブジェクト • ES2015で実装された • 書き方が統一されている • 詳しくは→JavaScript Promiseの本

  14. axios

  15. axios • Promise based HTTP client for the browser and

    node.js • PromiseベースのHTTPクライアント • IEでもPromise使えるようになる

  16. How To Use

  17. How To Use 1. HFU ͰGETϦΫΤετ 2. σʔλऔಘޙʹUIFO Λ࣮ߦ 3.

    Τϥʔͷ৔߹͸ DBUDI Λ࣮ߦ

  18. ײ૝ • jQueryʹ͘Β΂ͯεοΩϦ͔͚ΔͷͰخ͍͠ • JSONPରԠͯ͠ͳ͍ͷͰΫϩευϝΠϯରԠ ͢Δࡍ͸஫ҙ͕ඞཁ (I have decided not

    to support JSONP as part of axios.) 　 ということらしい…