こんにちはTERUです。
フリーランスでWEB制作(コーディング と ディレクション業務)をしています。
読者の悩み
- FileZillaの使い方について詳しく知りたい
「FileZilla」は、ローカル環境(自分のPC)とサーバ環境でファイルをやり取りするためのFTPツールです。
基本的に、FTPツールはホームページ(WEBサイト)の公開や編集を行う際に必要になります。
特にWEB制作の作業をやられてる方には必須のツールなので、本記事では初心者向けに詳しく解説します。
本記事の信頼性
- フリーランスとしてWordPress案件を中心としたWeb制作を仕事にしている
- Web制作会社にてディレクターの経験もあり
- 普段からWeb制作でFileZillaを使用している
FTPクライアント「FileZilla」とは?
FileZillaとは、サーバーとファイルの送受信(ダウンロード・アップロード)をするために利用するFTPソフトウェアの一つです。
Wikipediaでは下記のように記載されてます。
File Transfer Protocol(ファイル・トランスファー・プロトコル、FTP、ファイル転送プロトコル)は、コンピュータネットワーク上のクライアントとサーバの間でファイル転送を行うための通信プロトコルの一つである。
フリー百科事典『ウィキペディア(Wikipedia)』
FTPとは、クライアントとサーバー間でファイルをやり取りするために使うプロトコル(通信規約)のことです。
つまり「FileZilla」は、このFTPと呼ばれる通信規約を用いて、サーバー間とファイルのやり取りができるソフトウェアです。
- フリーソフトなため、無料で利用できる。
- 日本語対応している。
- 設定情報の引き継ぎが簡単にできる
- MacとWindowsのどちらでも利用できる。
簡単にクライアントとサーバー間でファイルの受け渡しができるので、web制作に関わらず、幅広い用途で利用されています。
人気のレンタルサーバー がサポート
下記のレンタルサーバーが、 FileZillaの利用をサポートしています。
3社とも人気のレンタルサーバーで、個人や会社で利用する場合も問題ありません。
FTPクライアント「FileZilla」のインストール
FTPクライアント「FileZilla」をダウンロードする
公式サイトからFileZillaをダウンロードします。
手順①:FileZillaの公式ページへアクセスします。
手順②:「Download FileZilla Client」に各OS毎の設定ファイルが表示されているので、自分のPCに合ったバージョンをダウンロードしましょう。
Macの場合は一択ですが、Windowsの場合32ビットと64ビットの2種類あるので注意しましょう。
自分のPCが32ビットなのか64ビットなのか確認する方法
Windowsの場合も、インストールの画面に違いがあるだけで使い方はMacと変わりません。
FTPクライアント「FileZilla」をインストールする
OSによってインストールは下記の2パターンあります。
- FileZillaインストール(Macの場合)
- FileZillaインストール(Windowsの場合)
各OSの手順について1つずつ説明します。
FileZillaインストール(Macの場合)
手順①:ダウンロードしたファイルをダブルクリックします。
手順②:FileZilla.appが表示されるので、「アプリケーション」にドラッグ&ドロップします。
手順③:「アプリケーション」にFileZilla.appがコピーされているのを確認します。
以上でFileZillaのインストール(Macの場合)は完了です。
FileZillaインストール(Windowsの場合)
手順①:ダウンロードしたファイルをダブルクリックします。
手順②:「I Agree」をクリックして次に進みます。
手順③:アクセス権の設定ですが、デフォルトのまま「Next」をクリックして次に進みます。
手順④:コンポーネントの選択ですが、ここもデフォルトのまま「Next」をクリックして次に進みます。
手順⑤:インストール場所の選択ですが、ここもデフォルトで「Next」をクリックして次に進みます。※デフォルトインストール先:「C:¥ProgramFiles¥FileZillaFTPClient」
手順⑥:「Install」をクリックします。
手順⑦:「Finish」をクリックします。
以上でFileZillaのインストールは完了です。
「FileZilla」の使い方
ここでは、具体的に「FileZilla」の使い方について説明します。
説明するのは下記の項目になります。
FileZillaの操作画面について
FileZillaの操作画面はシンプルです。
大きくは2つの要素で構成されています。
ローカル環境(自分のPC) | 左側パネル |
サーバー環境 | 右側パネル |
左側がローカル環境(自分のPC)で右側が接続するサーバ環境になります。
左側のパネル上下でフォルダ選択画面(ディレクトリツリー)とフォルダ内画面に分かれます。
その他にも上下にパネルが用意されていますので説明します。
メッセージログ | サーバへの接続状況のログが表示されます。 |
転送ステータス | ダウンロード・アップロードの進捗状況が表示されます。 |
サーバーに接続する方法
FileZillaを使ってサーバに接続する方法を説明します。
手順②:「サイトマネージャー」画面が表示されるので、「新しいサイト」をクリックします。
手順③:右側の画面でサーバへの接続情報を入力し、「接続」をクリックします。
▼サーバーへの接続情報は以下になります。
プロトコル | 「FTP-ファイル転送プロトコル」を選択します。 |
ホスト | 接続するサーバーのホスト名を入力します。 |
ポート | 空白でOKです。デフォルトで21番ポートが使用されます。 |
暗号化 | 「使用可能なら明示的なFTP over TLSを使用」を選択します。 |
ログオンタイプ | 「通常」を選択します。 |
ユーザー | サーバーに接続するためのFTPユーザー名を入力します。 |
パスワード | サーバーに接続するためのFTPパスワードを入力します。 |
※ホスト、ユーザー、パスワードは、接続するサーバによって変わります。
接続情報の確認方法については、下記の記事にまとめています。
ファイルのダウンロード方法
ファイルのダウンロード方法について説明します。
手順①:右側パネルでダウンロードしたいファイルを選択し、左側パネルにドラッグ&ドロップします。
※ここでは、「logo.png」ファイルを選択しています。
手順②:左側パネルにダウンロードしたファイルが表示されているのを確認します。
以上でファイルのダウンロードは完了です。
複数のファイルやフォルダも同時にダウンロード可能です。
ファイルのアップロード方法
ファイルのアップロード方法について説明します。
結論、ダウンロードと反対の操作をするだけです。
手順①:左側パネルでアップロードしたいファイルを選択し、右側パネルにドラッグ&ドロップします。
※ここでは、「logo.png」ファイルを選択しています。
手順②:右側パネルにアップロードしたファイルが表示されているのを確認します。
以上でファイルのアップロードは完了です。
複数のファイルやフォルダも同時にアップロード可能です。
ファイルの編集方法
ファイルの編集をするパターンは、大きく2つあります。
ただ、操作方法は、どちらも同じなので簡単に覚えられます。
- ローカル環境のファイルを編集するパターン
- サーバー環境のファイルを編集するパターン
本記事の手順は「ローカル環境のファイルを編集するパターン」を説明します。
手順①:左側パネルで編集したいファイルを右クリックし、「編集」をクリックします。
手順②:テキストエディタ〜が表示されるのでファイル内容を編集し、保存を行います。
手順③:FileZillaでポップアップ画面が表示され、保存したファイルをアップロードするかどうかを選択します。
FTPで接続されているサーバー領域(右側パネルに表示されている領域)にファイルがアップロードされます。
事前に、アップロードしたいディレクトリまで表示しておく必要があるので注意が必要です。
ローカル環境のファイルは保存されただけで、アップロードされません。
サーバー環境のファイルを直接編集することも可能です。
実際、修正案件では、直接サーバー環境上のファイルを編集することはよくあります。
編集方法は同じでサーバー領域(右側パネル)から対象ファイルを選択して行うだけです。
サーバー環境のファイルは、編集する際にローカル環境の一時領域に保存されます。
編集完了後にファイルをアップロードすることで、修正が反映されます。
ファイルの権限を変更する方法
ファイルの権限を変更する方法も簡単です。
手順①:対象ファイルを右クリック→「パーミッションの変更」を選択します。
手順②:パーミッション変更のポップアップ画面が表示されるので、設定した権限にチェックをしてOKを選択します。
※ここでは、権限を600→400に変更します。
手順③:対象ファイルの権限(パーミッション)が変更されていることを確認して、作業完了です。
【おまけ】「FileZilla」のおすすめ設定3選
「FileZilla」をより使いやすくするためのおすすめ設定を3つご紹介します。
- ダブルクリックでファイル編集
- 接続情報のインポート・エクスポート
- タイムスタンプ情報の維持
ダブルクリックでファイル編集
デフォルト設定では、ファイルを開く際に、「右クリック」→「編集」を選択しなければいけません。
作業を効率化するために、ダブルクリックでファイルを開くように設定します。
手順①:メニューバーから「編集」 → 「設定」 をクリックします。
手順②:設定画面の「ファイルリスト」から「ファイルをダブルクリックした時のアクション」を「表示/編集」に変更します。
手順③:次に「ファイルの編集」から、「カスタムエディタを使用」を選択し、普段利用している任意のエディタまでのパスを設定します。
※ここでは、Mac環境でVSCodeを指定しています。
以上で設定は完了です。これで、ファイルのダブルクリックからエディタ編集が可能になります。
接続情報のインポート・エクスポート
「FileZilla」では、簡単に接続情報や設定情報の移行が可能です。
PCを買い替えた時など、利用する場面は限定的ですが、覚えておくと便利です。
今回は、接続情報のインポート・エクスポート方法について説明します。
エクスポートの方法
手順①:メニューバーから「ファイル」 → 「エクスポート」 をクリックします。
手順②:「エクスポートの設定」画面が表示されるので、「〜エントリーをエクスポート」にチェックをしてOKをクリックします。
手順③:名前と保存場所を設定して「保存」をクリックします。
接続情報が記載されたXMLファイルが出力されます。
以上でエクスポート作業は完了です。
インポートの方法
次にインポート作業の方法です。移行先のFileZillaで実施してください。
手順①:メニューバーから「ファイル」 → 「インポート」 をクリックします。
手順②:インポートするXMLファイルを選択して「開く」 をクリックします。
手順③:「サイトマネージャーエントリー」が選択されているのを確認して「OK」 をクリックします。
以上でインポート作業は完了です。
タイムスタンプ情報の維持
最後に「タイムスタンプ情報の維持」について説明します。
デフォルト設定の場合、ダウンロードした日時がファイルの更新日時になり、どのファイルを更新したかわかりづらい問題があります。
設定を変更することで、サーバー内の更新日時を維持したままファイルをダウンロードすることができます。
手順①:メニューバーから「転送」 → 「転送したファイルのタイムスタンプを維持」 をクリックします。
以上で完了です。
まとめ
今回は、FTPクライアント「FileZilla」の使い方について解説しました。
他にもWEB制作でよく利用するツールについて、下記の記事にまとめています。
以上です。お疲れ様でした!