PHP 短期集中コース: シンプルな通貨コンバーター-PHPチュートリアル-php.cn

ホームページ

バックエンド開発

PHPチュートリアル

PHP 短期集中コース: シンプルな通貨コンバーター

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Aug 05, 2024 pm 07:16 PM

PHP crash course: Simple Currency Converter

ユーザーが外部 API から取得したリアルタイムの為替レートを使用して通貨を換算できるようにする PHP ベースの通貨換算ツール。このツールは、PHP、HTML、jQuery、AJAX、JSON、ブートストラップ、CSS、および MySQL で構築されています。このアプリケーションは、正確な通貨換算を提供し、ユーザーフレンドリーなインターフェイスで結果を表示するように設計されています。

トピック: php、mysql、ブログ、ajax、ブートストラップ、jquery、css、通貨変換、外部 API 統合、API 統合

段階的な解決策

1. ディレクトリ構造

simple-currency-converter/
│
├── index.html
├── db/
│   └── database.sql
├── include/
│   ├── config.sample.php
│   └── db.php
├── assets/
│   ├── css/
│   │   └── style.css
│   └── js/
│   │   └── script.js
├── src/
│   ├── fetch-rates.php
│   ├── convert.php
│   └── get-currencies.php
├── README.md
└── .gitignore

2.データベーススキーマ

db/database.sql:

CREATE TABLE `exchange_rates` (
   `id` int(11) NOT NULL AUTO_INCREMENT,
   `currency` varchar(3) NOT NULL,
   `rate` decimal(10, 4) NOT NULL,
   `timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
   PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;


CREATE TABLE currencies (
   id INT AUTO_INCREMENT PRIMARY KEY,
   code VARCHAR(3) NOT NULL,
   name VARCHAR(50) NOT NULL
);

INSERT INTO currencies (code, name) VALUES
('USD', 'United States Dollar'),
('EUR', 'Euro'),
('GBP', 'British Pound'),
('JPY', 'Japanese Yen'),
('BDT', 'Bangladesh Taka'),
('AUD', 'Australian Dollar');

3.設定ファイル

構成設定 (include/config.sample.php)

<?php
// Database configuration
define('DB_HOST', 'localhost'); // Database host
define('DB_NAME', 'currency_converter'); // Database name
define('DB_USER', 'root'); // Change if necessary
define('DB_PASS', ''); // Change if necessary

// API configuration
define('API_URL', 'https://api.exchangerate-api.com/v4/latest/');
define('API_KEY', 'your_api_key_here');
?>

4. データベース接続を構成します

データベース接続の確立 (include/db.php)

<?php
include 'db.php';

// Database configuration
$dsn = 'mysql:host='.DB_HOST.';dbname='.DB_NAME;
$options = [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
    PDO::ATTR_EMULATE_PREPARES   => false,
];

// Create a new PDO instance
try {
    $pdo = new PDO($dsn, DB_USER, DB_PASS, $options);
    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); // Set error mode to exception
} catch (PDOException $e) {
    echo 'Connection failed: ' . $e->getMessage(); // Display error message if connection fails
}
?>

5. HTML と PHP の構造

HTML 構造 (index.html)

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Currency Converter</title>
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
   <link rel="stylesheet" href="assets/css/styles.css">
</head>
<body>
<div class="container">
   <h2 class="text-center">Currency Converter</h2>
   <form id="currency-form">
      <div class="form-group">
         <label for="amount">Amount:</label>
         <input type="number" class="form-control" id="amount" placeholder="Enter amount" required>
      </div>
      <div class="form-group">
         <label for="from_currency">From:</label>
         <select class="form-control" id="from_currency">
            <!-- Options will be loaded dynamically -->
         </select>
      </div>
      <div class="form-group">
         <label for="to_currency">To:</label>
         <select class="form-control" id="to_currency">
            <!-- Options will be loaded dynamically -->
         </select>
      </div>
      <button type="submit" class="btn btn-primary">Convert</button>
   </form>
   <div id="result" class="alert alert-success" style="display:none;"></div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script src="assets/js/script.js"></script>
</body>
</html>

6. JavaScript と AJAX

AJAX 処理 (assets/js/script.js)

$(document).ready(function() {
   // Fetch exchange rates and populate the select options
   $.ajax({
      url: 'src/fetch-rates.php',
      method: 'GET',
      dataType: 'json',
      success: function(data) {
         if (data.status === 'success') {
            populateCurrencyOptions();
         }
      }
   });

   function populateCurrencyOptions() {
      $.ajax({
         url: 'src/get-currencies.php',
         method: 'GET',
         dataType: 'json',
         success: function(data) {
            if (data.status === 'success') {
               var options = '';
               console.log(data.currencies)
               $.each(data.currencies, function(index, currency) {
                  options += '<option value="' + currency.code + '">' + currency.name + '</option>';
               });
               $('#from_currency, #to_currency').html(options);
            }
         }
      });
   }

   // Handle form submission
   $('#currency-form').on('submit', function(e) {
      e.preventDefault();
      var amount = $('#amount').val();
      var fromCurrency = $('#from_currency').val();
      var toCurrency = $('#to_currency').val();

      $.ajax({
         url: 'src/convert.php',
         method: 'POST',
         data: {
            amount: amount,
            from_currency: fromCurrency,
            to_currency: toCurrency
         },
         dataType: 'json',
         success: function(data) {
            if (data.status === 'success') {
               $('#result').html('Converted Amount: ' + data.converted_amount).show();
            } else {
               $('#result').html(data.message).show();
            }
         }
      });
   });
});

説明:

スタイル設定には Bootstrap を使用し、AJAX リクエストには jQuery を使用します。
$('#currency-form').on('submit', ...): フォームの送信を処理し、AJAX リクエストを src/convert.php に送信します。
$.ajax({...}): データをサーバーに送信し、応答を処理します。

7. バックエンド PHP スクリプト

為替レートの取得 (src/fetch-rates.php)

<?php
require '../include/db.php';

// Fetch exchange rates from the external API
$apiUrl = API_URL . "USD"; // Replace with your API endpoint

$response = file_get_contents($apiUrl);
$data = json_decode($response, true);

if ($data) {
    // Clear existing rates
    $stmt = $pdo->prepare("TRUNCATE TABLE exchange_rates");
    $stmt->execute();

    // Insert new rates
    $stmt = $pdo->prepare("INSERT INTO exchange_rates (currency, rate) VALUES (:currency, :rate)");
    foreach ($data['rates'] as $currency => $rate) {
        $stmt->execute(['currency' => $currency, 'rate' => $rate]);
    }

    echo json_encode(['status' => 'success', 'message' => 'Exchange rates updated successfully.']);
} else {
    echo json_encode(['status' => 'error', 'message' => 'Failed to fetch exchange rates.']);
}
?>

説明:

file_get_contents($apiUrl): API からデータを取得します。
json_decode($response, true): JSON データを連想配列にデコードします。
INSERT INTO current_rates ... ON DUPLICATE KEY UPDATE: データベースに通貨レートを挿入または更新します。

通貨変換ロジック (src/convert.php)

<?php
require '../include/db.php';

$amount = $_POST['amount'];
$fromCurrency = $_POST['from_currency'];
$toCurrency = $_POST['to_currency'];

// Fetch the exchange rate from the database
$stmt = $pdo->prepare("SELECT rate FROM exchange_rates WHERE currency = :currency");
$stmt->execute(['currency' => $fromCurrency]);
$fromRate = $stmt->fetchColumn();

$stmt->execute(['currency' => $toCurrency]);
$toRate = $stmt->fetchColumn();

if ($fromRate && $toRate) {
    // Convert the amount
    $convertedAmount = ($amount / $fromRate) * $toRate;
    echo json_encode(['status' => 'success', 'converted_amount' => number_format($convertedAmount, 2)]);
} else {
    echo json_encode(['status' => 'error', 'message' => 'Conversion failed.']);
}
?>

説明:

$_POST['amount']、$_POST['from_currency']、$_POST['to_currency']: AJAX リクエストからパラメータを取得します。
SELECT 為替レート FROM 通貨レート WHERE 通貨 = ?: データベースから為替レートを取得します。
金額を変換して JSON レスポンスを返します。

通貨名と通貨コード (src/get-currency.php)

<?php
require '../include/db.php';
$stmt = $pdo->query('SELECT code, name FROM currencies');
$data = [];
while ($row = $stmt->fetch()) {
    $data[] = ['code' => $row['code'], 'name' => $row['name']];
}
echo json_encode(['status' => 'success', 'currencies' => $data]);
?>

説明:

SELECT コード、名前 FROM 通貨: データベースから通貨名とコードを取得します。
JSON レスポンスを返します。

6. CSS スタイル

CSS スタイル (assets/css/style.css)

body {
   padding-top: 50px;
}

.container {
   max-width: 600px;
   margin: 0 auto;
}

ドキュメントとコメント

include/config.php: データベース設定が含まれており、PDO と API configur を使用して MySQL に接続します。
index.php: HTML 構造を備えたメインページ。スタイリング用のブートストラップが含まれています。
assets/js/script.js: 投稿の読み込みと保存のための AJAX リクエストを処理します。 DOM 操作と AJAX には jQuery を使用します。
- AJAX 呼び出しを行うために jQuery を使用します。
- #result div に結果を表示します。
assets/css/style.css: アプリケーションの基本的なスタイル。
- 背景色とコンテナの幅を設定します。
src/fetch-rates.php: データベースから投稿を取得し、JSON として返します。
- API から為替レートを取得します。
- 変換結果をデータベースに保存します。
- 結果を JSON 形式で返します。
src/get-currency.php: ID の存在に基づいて投稿の作成と更新を処理します。
- 結果を JSON 形式で返します。
src/convert.php: 変換リクエストを処理し、API と対話します。
- 入力データを検証します。
- API から為替レートを取得します。
- 変換結果を計算してデータベースに保存します。
- 結果を JSON 形式で返します。

このセットアップでは、基本的でありながら機能的な通貨換算ツールと詳細なコメントと説明が提供されます。必要に応じて API URL とデータベース設定を調整してください。実際に使用する場合は、エラー処理やセキュリティ対策を追加することもできます。

リンクを接続

このシリーズが役立つと思われた場合は、GitHub で リポジトリ にスターを付けるか、お気に入りのソーシャルネットワークで投稿を共有することを検討してください。あなたのサポートは私にとって大きな意味を持ちます!

このような役立つコンテンツがさらに必要な場合は、お気軽にフォローしてください:

LinkedIn
GitHub

ソースコード

以上がPHP 短期集中コース: シンプルな通貨コンバーターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

ホットトピック

Laravel チュートリアル

1605

PHP チュートリアル

1510

276

Related knowledge

PHP変数スコープは説明されています Jul 17, 2025 am 04:16 AM

PHP変数スコープの一般的な問題とソリューションには次のものが含まれます。1。グローバル変数は関数内でアクセスできず、グローバルキーワードまたはパラメーターを使用して渡す必要があります。 2。静的変数は静的で宣言され、1回のみ初期化され、値は複数の呼び出し間で維持されます。 3. $ _GETや$ _POSTなどのハイパーグローバル変数は、任意の範囲で直接使用できますが、安全なフィルタリングに注意を払う必要があります。 4.匿名関数は、使用キーワードを使用して親スコープ変数を導入する必要があり、外部変数を変更する場合は、参照を渡す必要があります。これらのルールを習得すると、エラーを回避し、コードの安定性が向上するのに役立ちます。

PHPでコードをコメントします Jul 18, 2025 am 04:57 AM

PHPコメントコードには3つの一般的な方法があります。1。//＃を使用して1行のコードをブロックすると、//を使用することをお勧めします。 2。使用/.../複数の行でコードブロックをラップするには、ネストすることはできませんが交差することができます。 3. / if（）{}を使用するなどの組み合わせスキルコメントロジックブロックを制御するか、エディターショートカットキーで効率を改善するには、シンボルを閉じることに注意を払い、使用時にネストを避ける必要があります。

PHPコメントを書くためのヒント Jul 18, 2025 am 04:51 AM

PHPコメントを書くための鍵は、目的と仕様を明確にすることです。コメントは、「何が行われたのか」ではなく「なぜ」を説明する必要があり、冗長性や単純さを避けてください。 1.読みやすさとツールの互換性を向上させるために、クラスおよびメソッドの説明にdocblock（/*/）などの統合形式を使用します。 2。JSジャンプを手動で出力する必要がある理由など、ロジックの背後にある理由を強調します。 3.複雑なコードの前に概要説明を追加し、手順でプロセスを説明し、全体的なアイデアを理解するのに役立ちます。 4. TodoとFixmeを合理的に使用して、To Doアイテムと問題をマークして、その後の追跡とコラボレーションを促進します。優れた注釈は、通信コストを削減し、コードメンテナンスの効率を向上させることができます。

クイックPHPインストールチュートリアル Jul 18, 2025 am 04:52 AM

to installphpquickly、usexampponwindowsorhomebrewonmacos.1.onwindows、downloadandinstallxampp、selectcomponents、startapache、andplacefilesinhtdocs.2

PHPの学習：初心者向けガイド Jul 18, 2025 am 04:54 AM

tolearnphpefctivially、startbysettingupalocalserverenvironmentusingtoolslikexamppandacodeeditorlikevscode.1）instalxamppforapa Che、mysql、andphp.2）useocodeeditorforsyntaxsupport.3）testyoursetup withasimplephpfile.next、Learnpbasicsincludingvariables、ech

PHPはAIインテリジェント音声アシスタントPHP音声相互作用システムの構築を呼び出す Jul 25, 2025 pm 08:45 PM

ユーザー音声入力がキャプチャされ、フロントエンドJavaScriptのMediareCorder APIを介してPHPバックエンドに送信されます。 2。PHPはオーディオを一時ファイルとして保存し、STTAPI（GoogleやBaiduの音声認識など）を呼び出してテキストに変換します。 3。PHPは、テキストをAIサービス（Openaigptなど）に送信して、インテリジェントな返信を取得します。 4。PHPは、TTSAPI（BaiduやGoogle Voice Synthesisなど）を呼び出して音声ファイルに返信します。 5。PHPは、音声ファイルをフロントエンドに戻し、相互作用を完了します。プロセス全体は、すべてのリンク間のシームレスな接続を確保するためにPHPによって支配されています。

AIと組み合わせてPHPを使用してテキストエラー修正PHP構文検出と最適化を実現する方法 Jul 25, 2025 pm 08:57 PM

AIによるテキストエラーの修正と構文最適化を実現するには、次の手順に従う必要があります。1。Baidu、Tencent API、またはオープンソースNLPライブラリなどの適切なAIモデルまたはAPIを選択します。 2。PHPのカールまたはガズルを介してAPIを呼び出し、返品結果を処理します。 3.アプリケーションにエラー修正情報を表示し、ユーザーが採用するかどうかを選択できるようにします。 4.構文の検出とコードの最適化には、PHP-LとPHP_CODESNIFFERを使用します。 5.フィードバックを継続的に収集し、モデルまたはルールを更新して効果を改善します。 AIAPIを選択するときは、PHPの精度、応答速度、価格、サポートの評価に焦点を当てます。コードの最適化は、PSR仕様に従い、キャッシュを合理的に使用し、円形クエリを避け、定期的にコードを確認し、Xを使用する必要があります。

PHPを使用してソーシャル共有機能を構築する方法PHP共有インターフェイス統合プラクティス Jul 25, 2025 pm 08:51 PM

PHPでソーシャル共有機能を構築するコア方法は、各プラットフォームの要件を満たす共有リンクを動的に生成することです。 1.最初に現在のページまたは指定されたURLおよび記事情報を取得します。 2。urlencodeを使用してパラメーターをエンコードします。 3.各プラットフォームのプロトコルに従って、共有リンクをスプライスおよび生成します。 4.ユーザーがクリックして共有できるように、フロントエンドにリンクを表示します。 5.ページ上のOGタグを動的に生成して、コンテンツディスプレイの共有を最適化します。 6. XSS攻撃を防ぐために、必ずユーザーの入力を逃がしてください。この方法は、複雑な認証を必要とせず、メンテナンスコストが低く、ほとんどのコンテンツ共有ニーズに適しています。

See all articles

PHP 短期集中コース: シンプルな通貨コンバーター

段階的な解決策

1. ディレクトリ構造

2.データベーススキーマ

3.設定ファイル

4. データベース接続を構成します

5. HTML と PHP の構造

6. JavaScript と AJAX

7. バックエンド PHP スクリプト

6. CSS スタイル

ドキュメントとコメント

ホットAIツール

Undress AI Tool

Undresser.AI Undress

AI Clothes Remover

Clothoff.io

Video Face Swap

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック