てんハロ運営者

バグヲ

API通信っていろいろあって混乱するんだけど、
axiosってなにが便利なの？

てんハロ運営者

こんなあなたにピッタリな記事👇

• axiosってなに？
• axiosとfetchの違いは？
• API通信がよくわからない

がまぁまぁわかります！

Instagramフォロワー数9,500人を越える人気のもち・大福店 えにかいたもち

async/awaitとPromiseの違いとは？

非同期処理が難しいと感じている方へ。async/await・Promise・try/catch の基本をやさしく解説します。

it-bokenki.com

axiosとは？

axios は、JavaScriptでAPI通信（サーバーとのやり取り）を簡単に行うための外部ライブラリです。

シンプルなコードで通信が実現できます。

例：

• Webページを開いたときにユーザー情報を取得したい
• 入力フォームからデータをサーバーに送りたい

axiosは何ができるの？

axiosを使うと、以下のような操作が簡単にできます。

• GETリクエスト（データを取得）
• POSTリクエスト（データを送信）
• JSONデータの自動変換
• エラー処理（HTTPステータスも catch できる）
• タイムアウトやリトライの設定
• リクエストヘッダーの共通管理

axiosとfetchの違いは？

初心者にとって混乱しやすいのがここ。実は、JavaScriptには標準の通信手段として fetch という関数もあります。

同じGET処理をaxiosとfetchで書くと？

// fetch版
fetch("https://api.example.com/users")
  .then(res => res.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

// axios版
import axios from "axios";

axios.get("https://api.example.com/users")
  .then(res => console.log(res.data))
  .catch(err => console.error(err));

// fetch版
fetch("https://api.example.com/users")
  .then(res => res.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

// axios版
import axios from "axios";

axios.get("https://api.example.com/users")
  .then(res => console.log(res.data))
  .catch(err => console.error(err));

axiosとfetch どっちを使えばいいの？

✅️ 学習や練習なら fetch でもOK
ライブラリ不要で軽い

✅️ 実務やチーム開発なら axios をおすすめ
冗長な処理を減らせて、保守しやすく、失敗しづらい

2025年現在でも、ReactやVueなどの現場ではaxiosがよく使われています。

axiosの使い方

axiosインストール方法

npm install axios
# または
yarn add axios

基本的な使い方（GET/POST）

axiosを使って、サーバーからデータを取得（GET）・送信（POST）する例です。
res.data でサーバーからのデータにアクセスできます。
エラーが起きたときは .catch() で内容を確認できます。

// GETリクエスト
axios.get("/api/user")
  .then(res => console.log(res.data))
  .catch(err => console.error(err));

// POSTリクエスト
axios.post("/api/user", { name: "太郎" })
  .then(res => console.log(res.data))
  .catch(err => console.error(err));

まとめ

• axiosは、JavaScriptでAPI通信を行うための便利なライブラリ
• fetchよりも書きやすく、実務で使いやすい工夫がたくさん
• 初心者はまず「GETでデータ取得 → .then(res.data)」を覚えればOK！

てんハロ運営者

おつかれさまでした！

The post axiosとは？初心者でもわかる使い方・fetchとの違いを解説 first appeared on てんハロ｜未経験エンジニアのIT学習ログ.