表札


MENU


qr_code
当サイトのQRコード


リンク

富士岡中学校同期会 土狩囃子保存会
フルーツメール

リフォーム情報

最近、記憶能力が低下気味のため、ホームページ公開に関する備忘録です。
何かのヒントになれば良いかと思います。
サーバの選択 ホームページを公開する拠点(ファイルを置く場所)を決定する。
ドメイン名 ホームページの名前を決定する。

Windows11
ローカル環境構築
Windows11に無償アップグレートしたら、localhostに接続できなくなりました。
環境を最新版にアップグレードしたので、今後のことを考えWindows PCにローカル環境を 構築する手順をまとめてみました。
構築するWebサーバは、インストールする手間のないnginxです。そこでPHPを動作させています。
頻繁に使用しないので、nginxとphpはコマンド(batファイル)で起動/停止するようにしています。
今回の問題は、PHPの起動が失敗していたためでした。PHPの起動確認ができ無事localhostへの接続もできました。
【構築手順】
  1. nginxのダウンロード
  2. nginx.confの修正
  3. phpのダウンロード
  4. php.iniの作成と初期設定
  5. 起動/停止用batファイルの作成
  6. 接続確認
nginxとPHPは、ダウンロードファイルを解凍して任意のフォルダに格納するだけです。
nginxのダウンロードとnginx.confの修正はこちらを参照してください。
phpのダウンロードとphp.iniの修正はこちらを参照してください。
nginxとphpをコマンド起動/停止します。
【nginxの起動】
  start d:\nginx\nginx.exe
【nginxの停止】
  d:\nginx\nginx.exe -s stop

【PHPの起動】
  start d:\nginx\php\php-cgi.exe -b 127.0.0.1:9000
  nginxと連携するPHPのexeは、php-cgi.exeです。nginxと連携するために-b 127.0.0.1:9000を指定します。
【PHPの停止】
  taskkill /f /IM php-cgi.exe

上記コマンドを記述したbatファイルを作成し、nginxとPHPを起動させるようにします。
起動用batファイル名;start_nginx.bat
ファイル内容は、以下
@ECHO OFF
cd d:\nginx
start d:\nginx\nginx.exe
start d:\nginx\php\php-cgi.exe -b 127.0.0.1:9000
EXIT
複数のPHPを配置し切り分けることも可能です。その場合は、php-cgi.exeのパスを変更する のみです。
Windows10までは、PHP起動時/bオプションを付加していましたが、Windows11では起動しなくなり 原因究明に四苦八苦していました。/bオプションが原因と至りましたので/bオプションを削除する ことにより問題なく起動できました。原因詳細は、調査していません。
停止用batファイル名:stop_nginx.bt
ファイル内容は、以下
@ECHO OFF
cd d:\nginx
d:\nginx\nginx.exe -s stop
taskkill /f /IM php-cgi.exe
EXIT

Win10
localhostが認識しない
Win10に無償アップグレートしたら、localhostに接続できなくなりました。
firefoxで、localhostに接続すると真っ白(0バイト)なページが表示される。
ググッたところ、Win10では初期設定でIIS機能が有効となっていることが原因でした。
【対処方法】
 タスクバーの一番左に表示されているアイコンを右クリック
 →コントロールパネル
 →プログラム
 →Windows機能の有効または無効
 →インターネットインフォメーションサービスのチェックを外す
 →OKボタンをクリック

swiper設置 画像スライド機能追加のため、新機能を追加しました。
jquery前提のbxsriderを使用しているのですが、jquery不要でスライド機能が実現できるということで取り入れてみました。
ダウンロードファイル内の以下のファイルをサイトに設置(アップロード)することで動作可能となります。
      swiper.min.js(場所:dist/js内)
      swiper.min.css(場所:dist/css内
playground内に、index.htmlがあります。この内容を変更するだけスライド機能が実装できます。オートスライド機能は実装されていません ので、別途実装する必要があります。また、demo内に多くのサンプルが存在します。今回は、demo内のサンプルを改造して実装してみました。
サンプルコードですが、スライドする部分が文字となっているため実装イメージがわかないものもあります。

PC引越し PCの電源がはいりにくくなってかなり経ちます。OFFICE2010のサポート終了もあって重い腰を動かしました。
新しいPCにOS/各種ソフトのインストールや設定が面倒なので現在使用しているHDDの内容をまるごと引越しすることにしました。
jquery不要でスライド機能が実現できるということで取り入れてみました。