Web基礎

Webアプリケーション開発の基礎概念を学びます。

Webの仕組み

クライアントとサーバー

┌─────────────┐         HTTP         ┌─────────────┐
│  クライアント │  ──── リクエスト ────→ │   サーバー   │
│  (ブラウザ)   │  ←──── レスポンス ──── │  (Rustアプリ) │
└─────────────┘                      └─────────────┘

• クライアント: ブラウザやアプリ。リクエストを送信
• サーバー: リクエストを受け取り、レスポンスを返す

HTTPプロトコル

HTTPリクエスト

GET /users/123 HTTP/1.1
Host: api.example.com
Content-Type: application/json
Authorization: Bearer token123

{リクエストボディ}

構成要素:

1. メソッド: GET, POST, PUT, DELETE など
2. パス: /users/123
3. ヘッダー: メタ情報
4. ボディ: 送信データ（POST/PUTなど）

HTTPレスポンス

HTTP/1.1 200 OK
Content-Type: application/json

{"id": 123, "name": "Taro"}

構成要素:

1. ステータスコード: 200, 404, 500 など
2. ヘッダー: メタ情報
3. ボディ: レスポンスデータ

HTTPメソッド

ステータスコード

2xx: 成功

4xx: クライアントエラー

5xx: サーバーエラー

REST API

RESTful APIは、HTTPを使ってリソースを操作する設計パターンです。

REST設計の原則

1. リソース指向: URLはリソースを表す（動詞ではなく名詞）
2. HTTPメソッドで操作を表現: GET/POST/PUT/DELETE
3. ステートレス: 各リクエストは独立

REST APIの例

# ユーザー一覧を取得
GET /users

# 特定のユーザーを取得
GET /users/123

# 新しいユーザーを作成
POST /users
Body: {"name": "Taro", "email": "taro@example.com"}

# ユーザーを更新
PUT /users/123
Body: {"name": "Taro", "email": "new@example.com"}

# ユーザーを削除
DELETE /users/123

URLの設計

# 良い例（名詞、複数形）
GET /users
GET /users/123
GET /users/123/posts
GET /posts?author=123

# 悪い例（動詞が入っている）
GET /getUsers
POST /createUser
GET /getUserById/123

JSON

Web APIでよく使われるデータ形式です。

JSON形式

{
  "id": 123,
  "name": "Taro",
  "email": "taro@example.com",
  "age": 25,
  "active": true,
  "tags": ["rust", "web"],
  "address": {
    "city": "Tokyo",
    "zip": "100-0001"
  }
}

RustでのJSON処理（serde）

#![allow(unused)]
fn main() {
use serde::{Deserialize, Serialize};

#[derive(Debug, Serialize, Deserialize)]
struct User {
    id: u32,
    name: String,
    email: String,
}

// JSONからRustの構造体へ
let json = r#"{"id": 1, "name": "Taro", "email": "taro@example.com"}"#;
let user: User = serde_json::from_str(json).unwrap();

// Rustの構造体からJSONへ
let json_output = serde_json::to_string(&user).unwrap();
}

Webアプリケーションの種類

1. APIサーバー（バックエンド）

クライアント ──JSON── APIサーバー ── データベース

• JSONでデータをやり取り
• フロントエンドと分離
• 今回学ぶのはこれ

2. サーバーサイドレンダリング（SSR）

ブラウザ ←─HTML─ サーバー ── データベース

• サーバーでHTMLを生成
• 従来型のWebアプリ

3. 静的サイト + API

ブラウザ ←─HTML/JS─ 静的ファイル
    │
    └──JSON── APIサーバー

• HTML/JSは静的配信
• データはAPIから取得

Rustでの Web開発

主要なWebフレームワーク

このカリキュラムでは Axum を使用します。

なぜAxumか

• tokioチームが開発（非同期との相性が良い）
• 型システムを活かした安全な設計
• モダンなRustの機能を活用
• 活発なコミュニティ

まとめ

確認テスト

次のドキュメント: 02_axum_intro.md