Web

Glitch で PHP を使う方法

投稿日:2019年9月18日 更新日:

1. はじめに

Glitch は正式にPHPをサポートしていませんが、ほんの少しの設定変更により、PHPが使えるようになります。

2. 手順

(1) プロジェクトを作成します。

実際はどの雛型を使ってもよいのですが、ここでは「hello-webpage」を選択してプロジェクトを作成します。

(2) glitch.json ファイルを作成します。

[New File] ボタンを押して、glitch.json ファイルを新規に作成します。ファイルの中身としては、以下を入力します。

{
  "install": "composer install",
  "start": "php -S 0.0.0.0:8080",
  "watch": {
    "ignore": [
      "logs"
    ]
  }
}
  • php コマンドの -S オプションで、PHPのビルトインWebサーバーを起動しています。本来このWebサーバーは本番用として使うものではないので、あまりよいやり方ではありません。
  • PHPのビルトインWebサーバーは、index.php ファイルがあれば自動的に読み込んでくれます。

(3) composer.json ファイルを作成します。

[New File] ボタンを押して、composer.json ファイルを新規に作成します。ファイルの中身としては、以下を入力します。

{
    "require": {}
}

このファイルの存在は必須ではありませんが、ないと Logs 内に以下のメッセージが出力されます。

Composer could not find a composer.json file in /app
To initialize a project, please create a composer.json file as described in the https://getcomposer.org/ "Getting Started" section
[Tools] – [Logs] を開いたところ

(4) index.php ファイルを作成します。

[New File] ボタンを押して、index.php ファイルを新規に作成します。ファイルの中身としては、以下を入力します。

<?php
echo 'Hello!';

この時点で、プレビュー画面には index.php の出力内容が表示されます。

もちろん、Live App のURLにアクセスしても、PHPが出力した内容が表示されるはずです。

※ このとき、編集画面上に見えている index.html, script.js, style.ccs は 使っていません。

3. おわりに

ポイントは、

glitch.json ファイルの start プロパティで、お好みのWebサーバーを起動させることができる

という部分です。今回の方法で PHP を使うのは、正式にサポートされているわけではありませんが、この柔軟性の高さは Glitch の魅力の1つです。

※ 今回紹介した方法はあくまでテスト用途が目的であり、本番用では使用しないでください(参照:PHP: Built-in web server – Manual)。

📂-Web

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

Google

Googleマップで調べた経路をホーム画面に追加する (Android)

Android版の Googleマップで調べた経路は、ホーム画面にアイコンとして追加することができます。 手順は以下となります。 Google マップで調べた経路をホーム画面に追加する手順 (1) G …

Web

GitHub 上の Jupyter Notebooks を Binder で(実行可能な状態で)共有する

GitHub 上の Jupyter Notebooks を Binder で(実行可能な状態で)共有する方法について説明します。

Web Vitals

Webページ読み込み高速化に対する<script>タグのdefer/async属性について

Webページ読み込み高速化に対する<script>タグのdefer/async属性について書いています。

Web Vitals

<script>タグのdefer/async属性について(その2:実例)

script タグの属性によって、JavaScript ファイルがどのように読み込まれるのか、3パターンを実際のWebページを使って比べます。

Web Vitals

highlight.js のハイライト処理を Web Workers で実行する

highlight.js のハイライト処理を Web Workers で実行する方法を紹介します。