PHP を使用してネイティブ モバイル アプリを構築する方法

React Native フレームワークを通じて PHP を使用してネイティブ モバイル アプリを構築します。これにより、開発者は PHP を使用してネイティブな外観とパフォーマンスを備えたアプリケーションを構築できます。実際のケースでは、React Native と PHP サーバーを使用して簡単なカウンター アプリケーションを作成しました。アプリ内でボタンをクリックすると、PHP サーバーの API が呼び出されてカウントが更新され、更新されたカウントがアプリに表示されます。

PHP を使用してネイティブ モバイル アプリケーションを構築する方法

はじめに

PHP とはa 人気のあるサーバー側スクリプト言語ですが、ネイティブ モバイル アプリケーションの構築にも使用できることはあまり知られていません。人気のクロスプラットフォーム モバイル アプリケーション フレームワークである React Native を使用すると、開発者は PHP を使用してネイティブのルック アンド フィールを持つ高性能アプリケーションを作成できます。

実践的なケース: シンプルなカウンター アプリケーションを構築する

ステップ 1: React Native プロジェクトを作成する

mkdir counter-app
cd counter-app
npx react-native init CounterApp --template react-native-template-typescript

ステップ 2: PHP サーバーに api.php ファイルを作成します#

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json");

$data = json_decode(file_get_contents("php://input"));

if (isset($data->operation)) {
  switch ($data->operation) {
    case "increment":
      $count = (int) file_get_contents("count.txt") + 1;
      break;
    case "decrement":
      $count = (int) file_get_contents("count.txt") - 1;
      break;
    default:
      $count = (int) file_get_contents("count.txt");
      break;
  }
  file_put_contents("count.txt", $count);
  echo json_encode(["count" => $count]);
}
?>

#ステップ 3: App.tsxx

// Import React and useState
import React, { useState } from 'react';

// Create the main app component
const App = () => {
  // Initialize state for count
  const [count, setCount] = useState(0);

  // Handle increment and decrement button clicks
  const handleIncrement = () => {
    fetch('http://localhost:3000/api.php', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({ operation: 'increment' }),
    })
      .then(res => res.json())
      .then(data => setCount(data.count))
      .catch(error => console.error(error));
  };

  const handleDecrement = () => {
    fetch('http://localhost:3000/api.php', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({ operation: 'decrement' }),
    })
      .then(res => res.json())
      .then(data => setCount(data.count))
      .catch(error => console.error(error));
  };

  // Render the main app
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Counter Application</Text>
      <Text style={styles.count}>{count}</Text>
      <TouchableOpacity style={styles.button} onPress={handleIncrement}>
        <Text style={styles.buttonText}>+</Text>
      </TouchableOpacity>
      <TouchableOpacity style={styles.button} onPress={handleDecrement}>
        <Text style={styles.buttonText}>-</Text>
      </TouchableOpacity>
    </View>
  );
};

export default App;

ステップ 4 に API への呼び出しを追加します: アプリケーションを実行します

npx react-native run-ios

アプリケーションをテストします

アプリケーションの実行中に、ボタンをクリックしてカウントを増減します。 Web ブラウザで http://localhost:3000/api.php の API ルートにアクセスすると、サーバーへのリクエストを表示できます。

以上がPHP を使用してネイティブ モバイル アプリを構築する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。