Python ‣ てんハロ｜未経験エンジニアのIT学習ログ https://it-bokenki.com Hello Worldから、今日も生きてる Tue, 22 Jul 2025 14:22:04 +0000 ja hourly 1 https://wordpress.org/?v=6.9.4 https://it-bokenki.com/wp-content/uploads/2025/06/cropped-ブログ　アイコン-32x32.png Python ‣ てんハロ｜未経験エンジニアのIT学習ログ https://it-bokenki.com 32 32 【初心者向け】Pay.jpとは？クレカ決済を爆速導入できるサービスを解説！特徴・使い方・実装例まとめ https://it-bokenki.com/2025/07/22/pay-jp/ https://it-bokenki.com/2025/07/22/pay-jp/#respond Tue, 22 Jul 2025 14:22:03 +0000 https://it-bokenki.com/?p=5089 ※当サイトはアフィリエイト広告を利用しています。商品リンクにはプロモーションを含む場合があります。 未経験でも気軽に！サブスク型プログラミングスクール【Freeks】 困ってた自分に届けたい話 「クレジットカード決済をサ […]

The post 【初心者向け】Pay.jpとは？クレカ決済を爆速導入できるサービスを解説！特徴・使い方・実装例まとめ first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]> ※当サイトはアフィリエイト広告を利用しています。商品リンクにはプロモーションを含む場合があります。

未経験でも気軽に！サブスク型プログラミングスクール【Freeks】

困ってた自分に届けたい話

「クレジットカード決済をサイトに組み込みたい…でも難しそう」
いざ調べてみると、知らない英語・セキュリティの話・カード情報の取り扱いなど、何をどうすればいいか混乱…。


そんなときに出会ったのが 「Pay.jp（ペイジェーピー）」。
コード数行で決済ができるようになり、「え、こんなに簡単でいいの？」と驚き。

てんハロ運営者
てんハロ運営者

この記事は、同じように困っていた方への備忘録兼シェアとして書いています。

Pay.jpとは？

Pay.jp は、クレジットカード決済を簡単に導入できる日本発の決済サービスです。

  • Visa / Mastercard / JCB / AMEX などに対応
  • JavaScriptやAPI経由で簡単に組み込み可能
  • セキュリティ対策もばっちり（PCI DSS準拠）
    PCI DSS：クレジットカード情報を安全に扱うための世界共通のルール
  • 日本語ドキュメント完備＆開発者向けにやさしい

どんなときに使うの？

たとえばこんな場面で使えます。

  • ECサイトで商品を購入するときの決済
  • サブスク（月額課金）サービスの実装
  • 会員登録＋決済を一括で処理
  • アプリ内課金のバックエンド処理　など

なぜPay.jpが選ばれているのか？

クレジットカード決済サービスはたくさんありますが、「使いやすさ」「サポートの手厚さ」「日本向けかどうか」などで違いがあります。

以下は、Pay.jpと他の代表的なサービスを比較した表です。

項目Pay.jpStripeSquareKomoju
開発元日本アメリカアメリカ日本
日本語サポート◎（完全対応）△（一部対応）△（やや弱め）◎（完全対応）
導入のしやすさ◎（数行で完結）○（高機能だが設定が複雑）○（ノーコード寄り）○（初期設定が少し複雑）
カード情報の取り扱い不要◎（トークン化でOK）◎（同様）◎（同様）◎（同様）
決済手数料（参考）3.0%〜3.6%〜3.25%〜3.6%〜
定期課金対応◎◎△（回数券などで代用）◎
日本の決済文化への対応◎（コンビニ払い・銀行振込など）△（海外寄り）△（海外寄り）◎（多様な支払い手段）
管理画面の使いやすさ◎（直感的で見やすいUI）○（多機能だがやや複雑）○○

実装内容

実際の流れ（1回課金）

  1. ユーザーがカード情報を入力（Pay.jsを使ってトークン化）
  2. トークンをバックエンド（Python/Nodeなど）に送る
  3. バックエンドがトークンを使ってPay.jp APIで課金

👉 自分のサーバーでカード番号を扱わないから、セキュリティ的にも安心！

Pay.jpを利用するために必要なものは？

  • Pay.jpのアカウント：無料で登録OK
  • 公開鍵（フロント用）と秘密鍵（バックエンド用）のAPIキー：Pay.jpのダッシュボードで取得
  • JavaScript or バックエンド（Python, PHP, Nodeなど）の知識少し

デモで見る「1回課金」の実装イメージ

【初心者向け】Pay.jpとは？クレカ決済を爆速導入できるサービスを解説！

🖥️ フロントエンドの実装（Next.js）

tsxファイルで、トークン作成後にAPI呼び出しを行います。

下記の「✅ 1つ渡せばOK」のコードですが、cardNumber 要素だけを createToken に渡しても、同じ elements インスタンスから作られ、かつ mount() された要素が揃っていれば、Pay.jp 側で裏側で統合されて処理されます。

"use client";
import { useEffect, useRef } from "react";
import { createCharge } from "@/lib/api/charge";

export default function CardForm() {
  const numberRef = useRef<any>(null);
  const expiryRef = useRef<any>(null);
  const cvcRef = useRef<any>(null);

  useEffect(() => {
    const payjp = Payjp("pk_test_********");
    const elements = payjp.elements();

    numberRef.current = elements.create("cardNumber");
    expiryRef.current = elements.create("cardExpiry");
    cvcRef.current = elements.create("cardCvc");

    numberRef.current.mount("#card-number");
    expiryRef.current.mount("#card-expiry");
    cvcRef.current.mount("#card-cvc");
  }, []);

  const handleSubmit = async () => {
    const payjp = Payjp("pk_test_********");
    const result = await payjp.createToken(numberRef.current); // ✅ 1つ渡せばOK

    if (result.error) {
      alert("カード情報が正しくありません");
    } else {
      const token = result.id;
      await createCharge({ token, amount: 1000 });
    }
  };

  return (
    <>
      <div id="card-number" />
      <div id="card-expiry" />
      <div id="card-cvc" />
      <button onClick={handleSubmit}>支払う</button>
    </>
  );
}

tsファイルで、クライアントコンポーネントで取得したトークンと、金額をFastAPIサーバーへ安全に送信するためのAPI呼び出し関数

type ChargePayload = {
  token: string;
  amount: number;
};

export const createCharge = async (
  payload: ChargePayload
): Promise<"ok" | "error"> => {
  try {
    const res = await fetch(`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/charge`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify(payload),
    });
    return res.ok ? "ok" : "error";
  } catch (e) {
    return "error";
  }
};

🧪 バックエンドの実装（FastAPI）

Pay.jpのPython SDKを使って、受け取ったトークンを使い課金処理をします。
事前準備でPay.jpが提供しているPython用のSDK（ソフトウェア開発キット）を pip install payjp とコマンド実行してインストールしましょう。

import payjp
from fastapi import FastAPI, Request

payjp.api_key = "sk_test_********"  # 秘密鍵を設定

app = FastAPI()

@app.post("/api/charge")
async def charge(request: Request):
    body = await request.json()
    token = body["token"]
    amount = body["amount"]

    try:
        charge = payjp.Charge.create(
            amount=amount,
            currency="jpy",
            card=token
        )
        return {"status": "success", "charge_id": charge.id}
    except payjp.error.PayjpError as e:
        return {"status": "error", "message": str(e)}

なぜトークン化はフロントで行う？

  • クレジットカード番号は絶対にバックエンドに送ってはいけない（セキュリティリスク）
    →クレジットカード番号は PCI DSS などの厳しいルールに則って管理する必要があり、サーバーで直接扱うと大きなセキュリティリスクになります。そのため、Pay.jsを使ってトークン化（疑似的なカード情報への変換）を行い、サーバーではそのトークンだけを扱うことで、セキュリティを保ちながら決済処理ができます。
  • Pay.jsがカード番号をトークンに変換してくれる（createToken）
  • 自分のサーバーではトークンしか扱わないため、安心・安全

実装注意ポイントまとめ

  • 公開鍵（pk_test_〜）はフロントで使う
  • 秘密鍵（sk_test_〜）はバックエンドで使う
  • カード番号などはトークン化され、自分のサーバーでは触れない仕組みになっている（PCI DSS対応）
  • 開発モードではテストカード 4242 4242 4242 4242 が使える（有効期限やCVCは適当でOK）
    テストカード一覧

他のAPI連携の記事はこちらです！

Next.jsでログイン機能を実装｜NextAuth.jsでID・パスワード認証対応
Next.js アプリにログイン機能を追加したい方へ。NextAuth.js を使った ID・パスワード認証、セッション管理、コールバック設定までやさしく解説。
it-bokenki.com

【初心者向け】Mailpitで開発中のメール送信を安全にテストする方法【Docker + Next.js対応】
開発中のメール送信テスト、毎回Gmailを使っていませんか？Mailpitを使えば、ローカル環境でメールの送信・確認が簡単＆安全にできます。DockerとNext.jsを使った導入手順を初心者向けに解説します。
it-bokenki.com

初心者におすすめなのはどれ？

条件おすすめサービス
はじめて決済を導入する人✅ Pay.jp
海外展開も視野に入れている場合✅ Stripe
店舗＋ネットで使いたい✅ Square
コンビニ払いや多様な支払いを取り入れたい✅ Komoju
てんハロ運営者
てんハロ運営者

おつかれさまでした！

The post 【初心者向け】Pay.jpとは？クレカ決済を爆速導入できるサービスを解説！特徴・使い方・実装例まとめ first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]> https://it-bokenki.com/2025/07/22/pay-jp/feed/ 0 【初心者OK】FastAPI×MySQLをDockerで連携！Pythonで爆速開発する方法 https://it-bokenki.com/2025/07/10/fastapi/ https://it-bokenki.com/2025/07/10/fastapi/#respond Wed, 09 Jul 2025 15:32:30 +0000 https://it-bokenki.com/?p=4594 未経験でも気軽に！サブスク型プログラミングスクール【Freeks】 困ってた自分に届けたい話 ・・・いや、はじめてのPython開発でそれ言う！？フォルダ構成？DB接続？何もわからん！ でも、調べまくって、なんとか Fa […]

The post 【初心者OK】FastAPI×MySQLをDockerで連携！Pythonで爆速開発する方法 first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]>

未経験でも気軽に！サブスク型プログラミングスクール【Freeks】

困ってた自分に届けたい話

上司
上司

FastAPIで、フロントから送られた
名前・メールアドレス・パスワードをMySQLに登録しておいて

・・・いや、はじめてのPython開発でそれ言う！？
フォルダ構成？DB接続？何もわからん！

でも、調べまくって、なんとか FastAPI × MySQL × Docker で爆速開発できました。

てんハロ運営者
てんハロ運営者

この記事は、同じように困っていた方への備忘録兼シェアとして書いています。

使用した技術スタック

  • FastAPI（Python製の軽量Webフレームワーク）
  • MySQL（データベース）
  • Docker Compose（複数のコンテナをまとめて起動）
  • Next.js（フロントエンド／フォーム送信で使用）

プロジェクト構成

【初心者OK】FastAPI×MySQLをDockerで連携！Python開発環境を最速構築する方法

FastAPI × Docker 開発環境のセットアップ

環境変数（.env.local）の設定方法

環境変数をルート直下に .env.local として作成します。（開発環境で実行するため）
Dockerコンテナ間通信では DB_HOST を MySQL サービス名にします。

DB_HOST=
DB_PORT=
DB_NAME=
DB_USER=
DB_PASSWORD=

Docker（MySQL × FastAPI 連携）の書き方

対象ファイル：docker/docker-compose.yml

MySQLとFastAPIを同時に立ち上げるDocker Compose設定です。

すでにMySQLの設定がある場合は、FastAPIの定義だけ追加してください。

version: '3'
services:
  mysql:
    image: mysql:8.0
    ... # 詳細は別記事へ

  FastAPI:
    build:
      context: ..　　// Dockerfile がある位置を指定
      dockerfile: docker/Dockerfile
    container_name: 任意のコンテナ名
    ports:
      - "8000:8000"
    volumes:
      - ../backend:/app
    env_file:
      - ../.env.local
    depends_on:　　// 「このアプリは mysql が先に起動していないとダメだよ」という意味
      - mysql

MySQLの設定方法は下記の記事をチェックしてください。

DockerでMySQLをローカル構築｜Mac対応・CLI操作と文字化け対策も解説
DockerでMacにMySQLの開発環境を一瞬で構築！Apple Silicon対応のインストール手順、docker-compose.ymlと.env連携、utf8mb4設定、ターミナル操作でのDB作成まで初心者にもわかりやすく解説しています。
it-bokenki.com

FastAPIアプリ起動設定

対象ファイル：docker/ Dockerfile

FastAPIアプリの起動手順を定義する Dockerfile を用意します。

⚠️ 注意点

  • 大文字スタートの Dockerfile というファイル名でなければいけない
  • 拡張子は 不要・つけてはいけない（.txtや.pyなどはNG）
// Pythonの軽くて早いバージョンを指定
FROM python:3.10-slim

// 実行時に.pycファイルを作らないように設定（大量にできてGitに上げれなくなる）
ENV PYTHONDONTWRITEBYTECODE=1

// コンテナ内で作業するディレクトリを作成
WORKDIR /app

// ホスト側の ./backend フォルダを、コンテナ内の /app に丸ごとコピー
COPY ./backend /app

// requirements.txt をコピーして、必要なライブラリをインストール
COPY ./backend/requirements.txt .

RUN pip install --upgrade pip
RUN pip install -r requirements.txt

// アプリを起動
CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000", "--reload"]

requirements.txt の作成とバージョン管理

対象ファイル：backend/requirements.txt

Pythonパッケージのインストール一覧を記述します。

下記のコマンドで、Dockerで一括で自動インストールすることができます。

pip install -r requirements.txt

🌱 豆知識

パッケージ名しか書いていない場合：常に最新バージョンがインストールされる（試作段階・練習中向け）

fastapi
uvicorn
SQLAlchemy
PyMySQL
python-dotenv

バージョンを指定している場合：誰が使っても同じ環境になる（チーム開発・本番運用向け）

fastapi==0.116.0
uvicorn==0.35.0
SQLAlchemy==2.0.41
PyMySQL==1.1.1
python-dotenv==1.1.1

.gitignore の設定でGitをクリーンに保つ

対象ファイル：.gitignore

Pythonのをインストールすると自動生成ファイルができて、Gitにそのまま上げると大変なことになります。
下記のように設定すると、Gitに不要なファイルが混ざらなくなります。おすすめです。

# バーチャル環境除外
venv/

# Pythonのバイトコードキャッシュを無視
__pycache__/
*.pyc
*.pyo
*.pyd

テーブル作成

事前に users テーブルを作っておきましょう。DockerのMySQL内で作成できます。

作成方法については、下記の記事をご覧ください。

Drizzleとは？TypeScriptで型安全にSQL・マイグレーションを管理する方法
Drizzle ORMを使って、TypeScriptで型安全にSQLやマイグレーションを管理する方法をわかりやすく解説。初期設定からスキーマ定義、リレーション設定まで丁寧に紹介！
it-bokenki.com
DockerでMySQLをローカル構築｜Mac対応・CLI操作と文字化け対策も解説
DockerでMacにMySQLの開発環境を一瞬で構築！Apple Silicon対応のインストール手順、docker-compose.ymlと.env連携、utf8mb4設定、ターミナル操作でのDB作成まで初心者にもわかりやすく解説しています。
it-bokenki.com

Next.jsで登録フォームを作成

下記は登録フォームの registerForm.tsx の内容の内容です。
register/page.tsx で呼び出すと、下記の画像のような登録フォームになります。

"use client";

import { useState } from "react";

export default function RegisterForm() {
  const [form, setForm] = useState({
    name: "",
    email: "",
    password: "",
  });

  const [message, setMessage] = useState("");

  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    setForm({ ...form, [e.target.name]: e.target.value });
  };

  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
    try {
      const res = await fetch("http://localhost:8000/registration", {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify(form),
      });

      const data = await res.json();
      if (res.ok) {
        setMessage("登録成功！ ユーザーID: " + data.user_id);
      } else {
        setMessage("登録失敗: " + (data.detail || "エラーが発生しました"));
      }
    } catch (error) {
      console.error("エラー:", error);
      setMessage("通信エラーが発生しました");
    }
  };

  return (
    <form onSubmit={handleSubmit} className="space-y-4 max-w-md mx-auto mt-10">
      <div>
        <label htmlFor="name" className="block font-medium mb-1">
          お名前
        </label>
        <input
          id="name"
          name="name"
          placeholder="例：山田 太郎"
          value={form.name}
          onChange={handleChange}
          required
          className="border px-3 py-2 w-full"
        />
      </div>

      <div>
        <label htmlFor="email" className="block font-medium mb-1">
          メールアドレス
        </label>
        <input
          id="email"
          name="email"
          placeholder="例：taro@example.com"
          type="email"
          value={form.email}
          onChange={handleChange}
          required
          className="border px-3 py-2 w-full"
        />
      </div>

      <div>
        <label htmlFor="password" className="block font-medium mb-1">
          パスワード
        </label>
        <input
          id="password"
          name="password"
          placeholder="半角英数字8文字以上"
          type="password"
          value={form.password}
          onChange={handleChange}
          required
          className="border px-3 py-2 w-full"
        />
      </div>

      <button
        type="submit"
        className="bg-blue-600 text-white px-4 py-2 rounded w-full"
      >
        ユーザー登録
      </button>

      {message && <p className="mt-4 text-sm text-gray-700">{message}</p>}
    </form>
  );
}
【初心者OK】FastAPI×MySQLをDockerで連携！Python開発環境を最速構築する方法

FastAPIのバックエンド側の実装

各ファイルの役割

ファイル内容
backend/db.pyDB接続の設定を記述
backend/main.pyFastAPIの本体とCORS、ルーティング設定
backend/models/user.pyusersテーブル定義（UUID、カラムなど）
backend/schemas/user.pyPydanticで受け取りバリデーション
backend/utils/common_fields.py登録時の共通フィールドを自動付与
backend/routers/registration.pyPOSTでデータ受取→DB保存処理

db.py：DB接続設定

.env.local を読み込んで DB に接続する準備をする

from sqlalchemy import create_engine // DBとの接続エンジンを作るための関数
from sqlalchemy.orm import sessionmaker, declarative_base
from dotenv import load_dotenv  // .envファイルから環境変数を読み込むための関数
import os // 環境変数を取得するための標準ライブラリ

// ルートの.env読み込み
load_dotenv(dotenv_path=".env.local")

DB_HOST = os.getenv("DB_HOST")
DB_PORT = os.getenv("DB_PORT")
DB_NAME = os.getenv("DB_NAME")
DB_USER = os.getenv("DB_USER")
DB_PASSWORD = os.getenv("DB_PASSWORD")

// データベース接続用のURLを作成
DB_URL = f"mysql+pymysql://{DB_USER}:{DB_PASSWORD}@{DB_HOST}:{DB_PORT}/{DB_NAME}?charset=utf8mb4"

// 接続準備
engine = create_engine(DB_URL)
SessionLocal = sessionmaker(bind=engine, autocommit=False, autoflush=False)
Base = declarative_base()

main.py：アプリ起動とCORS設定

FastAPIアプリを起動し、CORS設定とルーター登録を行います。

Next.js開発環境で実行しているので、今回はhttp://localhost:3000を指定（ここは環境変数設定にしたほうがいいかもです）

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware 　// 別ドメインからのアクセスを許可するための設定
from routers import registration

// FastAPIアプリケーションの本体を作成
app = FastAPI()

// CORS（クロスオリジン）設定を追加：別のドメインからアクセスを許可する
app.add_middleware(
    CORSMiddleware,
    allow_origins=["http://localhost:3000"],  // フロントエンド（Next.js）からのアクセスを許可
    allow_credentials=True,  // クッキーなどの認証情報を含めた通信を許可
    allow_methods=["*"],  // GETやPOSTなど、すべてのHTTPメソッドを許可
    allow_headers=["*"],  // すべてのリクエストヘッダーを許可（認証トークンなど）
)

// APIの処理を追加（今回はregistration.pyのルーター）
app.include_router(registration.router)

models/user.py：ユーザーテーブル定義

SQLAlchemyで userテーブル 構造を定義します。主キーは UUID を自動生成。

import uuid
from sqlalchemy import Column, String, Boolean, DateTime
from db import Base

class Users(Base):
    __tablename__ = "users"

    user_id = Column(String(36), primary_key=True, default=lambda: str(uuid.uuid4()))
    name = Column(String(100), nullable=False)
    email = Column(String(100), nullable=False, unique=True)
    password = Column(String(255), nullable=False)
    updated_by = Column(String(100))
    updated_at = Column(DateTime)

uuidについて、もっと知りたい方は下記の記事をどうぞ！

UUIDとは？主キーに使われる理由と連番との違いをわかりやすく解説
UUIDはなぜ主キーに使われるのか？連番との違いやメリット・デメリット、UUIDの種類（v1〜v5）まで初心者向けにやさしく解説。PythonでのUUIDの生成方法も紹介します。
it-bokenki.com

schemas/user.py：バリデーション用スキーマ定義

フロントから送られてくる入力値（name, email, password）をバリデーションします。

from pydantic import BaseModel

class UserCreate(BaseModel):
    name: str
    email: str
    password: str

utils/common_fields.py：共通項目の自動付与

updated_by や updated_at などの共通項目を自動で付与します。

from datetime import datetime, timezone, timedelta

def generate_common_fields():
    jst_now = datetime.now(timezone(timedelta(hours=9)))
    return {
        "updated_by": "system",
        "updated_at": jst_now,
    }

routers/registration.py：登録処理ルーターの作成

POSTされた情報をDBに保存するルーターです。辞書展開でスキーマ＋共通フィールドを結合します。

from fastapi import APIRouter, Depends
from sqlalchemy.orm import Session　　// DBとのやりとりの型（Session）を指定
from db import SessionLocal
from models.user import Users
from schemas.user import UserCreate
from utils.common_fields import generate_common_fields

router = APIRouter()

// データベースとの接続を一時的に確立して、使い終わったら自動で切るための仕組み
def get_db():
    db = SessionLocal()  // DB接続を開始
    try:
        yield db　　 // データを登録・検索
    finally:
        db.close()　// DB接続を終了
        
@router.post("/registration")
def create_user(user: UserCreate, db: Session = Depends(get_db)):
    common_fields = generate_common_fields()

    db_user = Users(
        **user.dict(),
        **common_fields
    )

    db.add(db_user)
    db.commit()

    return {"message": "登録成功"}

※ここで辞書化の記事をつくっていれよう！

トラブル対応：ログでFastAPIのエラーを確認する方法

ログをリアルタイムで監視するには、以下のコマンドを使いましょう。

-f は --follow の略で「ログを継続して追いかける」オプションです。

docker logs -f コンテナ名
てんハロ運営者
てんハロ運営者

おつかれさまでした！

The post 【初心者OK】FastAPI×MySQLをDockerで連携！Pythonで爆速開発する方法 first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]> https://it-bokenki.com/2025/07/10/fastapi/feed/ 0 初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】 https://it-bokenki.com/2025/07/10/fastapi-setup/ https://it-bokenki.com/2025/07/10/fastapi-setup/#respond Thu, 10 Jul 2025 11:48:30 +0000 https://it-bokenki.com/?p=4580 未経験でも気軽に！サブスク型プログラミングスクール【Freeks】 困ってた自分に届けたい話 ・・・いや、FastAPIって何？PythonでWebサーバー作ったことないけど！？何から始めればいいの…？ でも、調べてみた […]

The post 初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】 first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]>

未経験でも気軽に！サブスク型プログラミングスクール【Freeks】

困ってた自分に届けたい話

上司
上司

FastAPIでAPIサーバー立てて。仮想環境つくって、動かして。

・・・いや、FastAPIって何？PythonでWebサーバー作ったことないけど！？
何から始めればいいの…？

でも、調べてみたら、意外とコマンドだけでサクサク環境構築できる。
「さすが爆速APIフレームワーク」って言われるだけある！

環境構築に不安がある方でも、手順どおりに進めれば5分でAPIが動くはず。

てんハロ運営者
てんハロ運営者

この記事は、同じように困っていた方への備忘録兼シェアとして書いています。

FastAPIとは？

ひとことで言うと、「爆速でAPIが作れるPython製フレームワーク」です。

🧩 特徴

  • 少ないコードで、読みやすく整理されたAPIが作れる
  • 自動でAPIの説明書（ドキュメント）を作成してくれる
  • 入力ミスを事前にチェックできる仕組みがある
  • 処理速度が速く、ストレスが少ない
  • 書き方が直感的で覚えやすい
  • 機能を後から追加しやすく、拡張性が高い

前提：Pythonがインストールされていること

まず、ターミナルで以下のコマンドを実行し、Pythonが使える状態か確認しましょう。

python3 --version

# 実行結果
Python 3.9.6

バージョンが 3.x 系であればOKです。
もし command not found と出る場合は、MacにPythonをインストールする手順を先に確認してください。

FastAPI 環境構築手順

STEP 1：VSCodeで拡張機能をインストール

以下の2つの拡張機能をインストールしておくと、開発がスムーズになります。

  • Python：Microsoft公式のPython拡張機能
  • Pylance：コード補完とエラーチェックを強化する拡張機能

STEP 2：プロジェクトフォルダを作成

例として、backend/ フォルダ内で作業を進めます。

mkdir backend
cd backend

STEP 3：仮想環境を作成＆有効化（Macの場合）

# 仮想環境作成
python3 -m venv venv

# 仮想環境の有効化
source venv/bin/activate

プロンプトが (venv) と表示されれば、仮想環境が有効になっています。

STEP 4：FastAPIと実行サーバーをインストール

FastAPIを実際に動かすには、まず2つのパッケージをインストールするだけでOKです。

pip install fastapi uvicorn

このコマンドを実行するだけで、FastAPIを動かすのに必要な最低限の環境が整います。

👉 インストールされる主なパッケージ

① fastapi：PythonでAPIを簡単に作るためのツール

  1. 「こういうURLにアクセスされたら、こう返すよ！」っていうルールを書く
  2. 入力ミスがあったら、自動で「それ間違ってるよ」って教えてくれる
  3. 作ったAPIの説明書を自動でつくってくれる

② uvicorn：FastAPIを動かすサーバー

  1. 作ったAPIを動かすための土台（サーバー）になる
  2. サーバーを起動すると、ブラウザで http://localhost:8000 を開くだけで結果を見られる
  3. http://localhost:8000/docs にアクセスすれば、ボタン付きのテスト画面でAPIを試せる

FastAPIを実行するにはこの2つだけで一通りの動作確認が可能です。
データベース連携やセキュリティ対策などをする場合は、追加でパッケージを入れていきます
（例：sqlalchemy, pydantic[email], python-jose など）。

STEP 5：main.py を作成してAPI定義

このコードは「ルートURLにアクセスしたらJSONでメッセージを返すだけ」の最小APIです。

from fastapi import FastAPI

app = FastAPI()

@app.get("/")
def read_root():
    return {"message": "Hello FastAPI!"}

STEP 6：APIを起動

以下のコマンドで開発サーバーを起動します。

uvicorn main:app --reload

STEP 7：動作確認リンク

以下のURLにアクセスして、FastAPIが動いているか確認しましょう。

URL内容
http://localhost:8000{"message": "Hello FastAPI!"} が表示される
http://localhost:8000/docsボタンでAPIを試せる画面
開発中に「このAPIちゃんと動くかな？」って確認するときに使う
http://localhost:8000/redoc読む専用のAPI説明ページ
「どんなAPIがあるか知りたいな〜」って一覧で見たいときに使う

実際の画面

▶ http://localhost:8000 の表示画面

初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】

▶ http://localhost:8000/docs の表示画面

初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】

▶ http://localhost:8000/redoc

初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】

ここまでできれば、FastAPIのローカル開発環境は完成です。
あとはルーティングを増やしたり、DBとつないだり、自由にAPI開発を進めていけます。

🔧 開発に活用する具体的な実装例はこちらで紹介しています

【初心者OK】FastAPI×MySQLをDockerで連携！Pythonで爆速開発する方法
初心者でも安心！FastAPIとMySQL、Dockerを使ってユーザー登録APIを構築する手順をわかりやすく解説。Next.jsとの連携方法や環境構築、登録フォームの実装まで丁寧に紹介します。
it-bokenki.com

てんハロ運営者
てんハロ運営者

おつかれさまでした！

The post 初心者向け：FastAPIの環境構築ガイド【5分でAPIが動く】 first appeared on てんハロ｜未経験エンジニアのIT学習ログ.

]]> https://it-bokenki.com/2025/07/10/fastapi-setup/feed/ 0