We will see how to use the FileZilla FTP client to transfer your HTML pages to a Web server.
|
|
This presentation shows how to use the Filezilla FTP client to transfer files to and from a remote server, and how it fits into the Web development process.
We also use FTP as an example of a client-server application with standard protocol.
|
FTP is a Web development tool, but the technology can be used for many applications.
|
|
This presentation covers FTP technology and its use in the Web development process.
|
Review: a Web client and Web server carry on an HTTP conversation.
|
|
We’ve looked at the conversation between a Web client and a Web server.
The conversation follows the rules of the HTTP protocol.
HTTP governs the retrieval of Web pages from the server.
In this presentation, we’ll look at Internet file transfer, another client-server application.
|
An FTP client and FTP server carry on an FTP conversation.
|
|
We connect a file transfer protocol (FTP) to an FTP server and copy files back and forth.
We will use FTP to transfer HTML Web pages we create to a server.
FTP is also handy for file backup.
The formal conversation between an FTP client and an FTP server is defined by the file transfer protocol.
|
There are many FTP clients, and we will use FileZilla because it is free and easy to use.
|
|
There are many FTP clients.
One is Filezilla, which we will use in this presentation.
All FTP clients have similar capability and are easy to use.
I chose Filezilla because it is open source and there is portable version available.
|
Web designers start with wire-frame diagrams, and you should make one when learning to use a new program.
|
|
Here is a wire frame diagram of the screen layout.
Study this overview, then let’s step through making a connection to a server and transferring a file.
|
The client and server are not yet connected so the remote directory is blank.
|
|
Here we see the screen with the local directory displayed.
There is no listing on the right because we have not yet connected to a server.
|
Establishing a connection
|
|
To connect to a remote host, you must supply the domain name, user name, and password.
Leave the Port field blank unless you have been told that the typical default port has been changed.
Since you often connect to the same server, there is a one-click command for re-connecting to the last server you used.
|
Precaution display.
|
|
One often uploads revised versions of a file that is already on the server.
As a precaution, Filezilla will display this dialog if you are about to overwrite a file.
Don’t just press OK without checking the dates and file sizes to be sure you want to proceded.
|
File transfer progress is shown near the bottom of the screen.
|
|
Pending transfers and transfer progress are shown in the window at the bottom of the screen.
In this figure, only one file is being transferred, but you can configure Filezilla to transfer several files.
|
The user interface is flexible. You can adjust the screen layout.
|
|
We have shown this screen layout in the presentation, but the user interface can be adjusted.
For example,
|
You also decide which windows to hide or display.
|
|
You can hide or display windows using the View command.
I’ve hidden the status window at the bottom of the screen in this example.
|
As a Web developer, I keep a duplicate or mirror copy of my site on both the Web server and my laptop.
|
|
A Web developer keeps a mirror copy of the site his or her client system and on the server.
You make changes or create new pages on the client, then upload them to the server.
That way you can debug quickly, even if you are not online.
You also have a backup copy of your Web site on your development machine and a backup of the development machine on the Web site.
If one is destroyed, it can be restored with a single FTP upload or download.
|
We’ve seen the purpose of FTP and covered its operation.
|
|
FTP is a well established Internet protocol, and Filezilla is a well-known FTP client.
We looked at the Filezilla user interface, as shown in this wire-frame diagram, and saw how to connect to and transfer files to a server.
|
Self study questions
|
|
|
Where to get Filezilla.
|
|
|
Links
|
|
|
