Webアプリや作品を公開するのにサーバが欲しいな！！と思っていたのですが、
遊びでサーバをわざわざ契約するのもな。。。と悩んでおりました。。。
そんな時、TwitterでWeb作成やWeb開発されている方が「xfree」をお勧めしており、
どんなものか？？
と調べてみたところ制限はありますが無料で使用できるとのこと！！
自分が欲しいレベルではあったので早速使用してみることにしました。
■xfreeとは？
エックスサーバーが提供する無料のサーバ環境です。
https://www.xfree.ne.jp/
機能は3つ用意されておりそれぞれ、
・HTMLサーバー機能
・PHP・MySQLサーバー機能
・WordPressサーバー機能
となります。
エックスサーバーが運営していることもあり、安定性が高く無料レンタルサーバーの中では早めの部類にあたるようです。
一方で、、、
サポートっ非対応、SSL非対応、容量が1GB～2GBとかなり少ない
といったデメリットもあります。
まぁ、お試しに使う分には十分なのですが本格的に運用するならエックスサーバーの本家を利用してね！ってことですね！！
自分はお試しで使う分で十分なのでまずはxfreeを登録。
動的なWebブラウザ・アプリを作ってみたいのと、PHPも使ってみたかったので、
PHP・MySQLサーバー機能
を選択しました。
■xfreeでのPHP・MySQLサーバー機能を利用するまでの手順
まずは機能を利用するまでのアカウント作成や登録の手順です。
といっても、、、
無料レンタルサーバー新規お申し込み
を選択すると確認用メールアドレスを記載する欄が出るので
メールアドレス入力⇒送信
を行うと、アカウント登録用のURLが送られてくるので必要事項を入力しアカウントを登録。
その後、登録したアカウントでログインすると、ログイン画面で先ほどの3つの機能が選択できるので、
利用したい機能に対して「利用を開始する」を選択
これで利用できる状態になるかと思います。
アカウント登録は一般的な流れですし、ログイン後の手順もワンクリックなので細かい記載は割愛しますが、
詳細はこちらにまとまっておりますのでご参考に。
https://www.xfree.ne.jp/manual/man_order_user.php
■PHP・MySQLサーバー機能を使ってみる
では次にPHP・MySQLサーバー機能の使い方を簡単にまとめておきます。
まずドメイン名ですが、
サーバー利用開始時時点ですでにドメイン名が1つ登録されております。
登録済みドメイン名ですが、
「ドメイン設定」
で確認可能です。
次にxfreeサーバーとのファイルダウンロードやアップロードですが、FTPでのやり取りが用意されております。
FTPアカウントですが、
「FTPアカウント設定」
を押下いただくとアカウント名が表示されます。
こちらのアカウント名を利用して、
http://アカウント名
でWebブラウザにアクセスしてみてください。
こちらのような画面が表示されるかと思います。
こちらのファイル群ですが、先ほどのFTPアカウント設定から、
WebFTP欄のログインから入ることが出来ます。
ログインするとファイルマネージャー画面が立ち上がるかと思います。
こちらでファイル編集やローカルで編集したファイルのアップロードが行えるのですが、、、
正直作業しづらい。。
ということで普段コードを書くのに利用しているvscodeを用いてftpサーバーとの同期を試みることにしました。
■VSCodeでftpサーバーとの同期手順
ftpサーバーとの同期を行うにあたり、拡張機能である
SFTP
を用います。
拡張機能タブを選択の上、検索欄に"sftp"を入力すると
SFTPがトップに出るかと思いますのでこちらをインストールします。
次に同期を行うftpサーバの情報を登録します。
同期をとりたいフォルダをvscode上で開いた状態で、
表示タブ⇒コマンド パレットを選択 or Ctrl + Shift + pを押下
すると入力windowが表示されるので、
sftp:config
を入力⇒Enterキー押下します。
すると該当フォルダに
sftp.json
ファイルが生成されているかと思います。
こちらに必要事項を記載ください。
【name】
識別名になります。
【hostname】
先ほどのxfree管理パネルにてドメイン設定を選択すると記載されている"ドメイン名"を記載下さい。
【protocol】
"ftp"と記載。
【username】
先ほどのxfree管理パネルにて、FTPアカウント設定を選択すると表示される
"アカウント名"
を記載ください。
【password】
FTPのパスワードですが、先ほどのxfree管理パネルにて
FTPアカウント設定⇒編集を選択すると、
パスワード入力欄が出るので登録すると設定したパスワードに変更されます。
そして先ほど登録したパスワードをsftp.jsonに書き込めばOKです。
これで設定が完了です。
ここで、VSCode上でフォルダを選択せずにコマンド パレット上で、
sftp:config
を入力すると下記エラー画面(と言いますかフォルダを選択してくださいメッセージ)が表示されますので、
同期させたいフォルダをVSCode上で開いておいてください。
SFTP expects to work at a folder.
これで同期を行うための設定が完了しました。
では試しにxfreeサーバー上からファイル一式をダウンロードしてみます。
先ほどのコマンド パレット上で、
sync Remote -> Local
と入力もしくは選択を行います。
すると、先ほどのnameで設定した名前が選択項目に登場するので選択。
するとダウンロードが始まり、しばらくするとファイル一式がローカルにダウンロードされるかと思います。
逆にファイルをアップロードしたい場合には、
sync Local -> Remote
と入力もしくは選択を行えばOKです。
