Предыдущий ролик Следующий ролик  

Видео урок: Загрузка сайта

Основы веб-дизайна

Независимо от выбранного вами хостинга на некотором этапе вам придется загружать файлы из локальной среды разработки на действующий веб-сервер. В этом видео я покажу вам несколько способов размещения контента в интернете, выбор которых осуществляется на основании типа имеющегося аккаунта на хостинге. Если вы пользуетесь услугами хостинговой службы, CMS или другой платформой для ведения блога, то есть вероятность, что писать и загружать контент вы будете напрямую, через панель администратора вашего сайта. В таких случаях вы либо генерируете контент путем ввода его в имеющийся редактор, либо загружаете контент с помощью встроенного загрузчика файлов.

Несомненно на вашем компьютере будет храниться локальная копия сайта, за исключением тех случаев, когда вы самостоятельно устанавливаете и запускаете CMS. В этом случае вам просто нужно будет следовать инструкциям платформы по генерации и загрузке контента. Если вы пользуетесь услугами хостинговой компании, то есть вероятность, что вам придется загружать контент самостоятельно. Я предоставлю вам лишь краткий обзор некоторых возможных вариантов загрузки сайта на хостинговый сервер. Если вы смотрели некоторые предыдущие видео этого курса, то, окажется, что эта панель вам уже знакома, поскольку это панель Диспетчера файлов моего веб-сервера.

На данный момент я работаю с сайтом desolve.org. Как известно, до этого мы говорили о том, как просматривать содержимое сайта и управлять файлами. Помимо этого вы можете загружать и скачивать файлы. Итак, если бы мне нужно было скачать несколько файлов на локальный компьютер, то я мог бы выделить один из этих файлов и выбрать раздел "Download" (Скачать). Если бы мне потребовалось загрузить файл на сервер, то я мог бы просто выбрать раздел "Upload" (Загрузить). В результате мне был бы предоставлен интерфейс, позволяющий выбрать файл и загрузить его на сервер. Хотелось бы отметить пару моментов.

Во-первых, чтобы загрузить файл в конкретный каталог, нужно находиться в этом каталоге. Поэтому, если, например, у меня есть подкаталог с названием "resources", и мне нужно загрузить в него некий файл, то сначала необходимо открыть этот каталог, а потом уже загружать в него файл. Этот Диспетчер файлов может оказаться неудобным с точки зрения загрузки и скачивания большого количества файлов и папок, и так называемых "сложных" структур. Конечно, это довольно простой способ. Любой хостинговый сервер может предоставить вам такую возможность, но, с другой стороны, это не самый простой способ.

Еще один вариант - заполучить FTP-клиент, который можно запустить на своем компьютере и использовать впоследствии для закачки и скачивания файлов. На сегодняшний день в некоторые интегрированные среды разработки встраиваются различные FTP-клиенты. Например, в Dreamweaver встроен хороший FTP-клиент. Но можно использовать не только встроенные клиенты. Итак, я закрою ненадолго наш Диспетчер файлов и кое-что расскажу вам об управлении файлами. Перейдем прямо в раздел FTP-аккаунтов. Помимо всего прочего в этом разделе можно создавать новые FTP-аккаунты для разных пользователей.

К примеру, обратите внимание, что уже создан аккаунт под названием "james@desolve.org". Здесь можно задавать и изменять пароли, изменять норму, т.е. количество файлов, которое разрешено загружать и скачивать, удалять аккаунты. По сути, это каталог, в который мне разрешено загружать файлы. Таким образом, если мне нужно ограничить доступ какого-либо члена команды, например, мне нужно, чтобы указанный пользователь мог загружать и скачивать файлы только из конкретного каталога, то сделать это можно, создав соответствующие аккаунты. Это первое, что нужно сделать при использовании FTP-клиента. Чтобы использовать FTP-аккаунт, его нужно сначала активировать на сервере.

Таким образом, если скачать FTP-клиент и указать его для определенного сайта, к которому у вас нет доступа, то вы не сможете его активировать. Поэтому сначала нужно создать соответствующие FTP-аккаунты. Сейчас я продемонстрирую вам работу FTP-клиента на примере. Возьмем FTP-клиент под названием "FileZilla". Вообще FTP-клиентов очень много. Если вы займетесь поиском FTP-клиентов, то найдете по крайней мере дюжину таких клиентов. Некоторые из них бесплатные, а вот за пользование другими приходится платить. FileZilla - один из бесплатных клиентов. Мне он правда очень нравится. И пользуюсь я только этим клиентом.

Слышал, что некоторым он не нравится, потому что они считают его неудобным. Но тут уж как и во всем остальном - если ты к чему-то привык, то у тебя не возникает с этим сложностей. Принцип действия практически всех FTP-клиентов один и тот же. Нажмем вот сюда, чтобы открыть список всех моих серверов. Как видите, в этом случае я пользуюсь только одним сервером. Назову-ка я его в честь того сайта, для которого он будет использоваться, т.е. назову его "desolve". Таким образом, если я хочу создать какой-то сервер или подключиться к нему, мне необходимо вроде как сохранить его. В этом случае, если я планирую создать новый сайт, я создам новый сервер, для которого уже будет задана вся эта информация.

Я уже проделывал это с сервером "desolve". Ага, не нравится, что я не ввел имя хоста? Так почему бы нам не удалить этот сервер? Возможно, вы заметили, что все эти поля уже были заполнены. Может вам интересно, откуда берется эта информация? Помните, когда вы настраивали FTP-аккаунт, вы сталкивались с большинством из этих данных? Ваш логин - это то имя пользователя, которое вам нужно ввести. Устанавливаемый вами здесь пароль используется и для сервера. И что действительно интересно, если перейти к аккаунту james@desolve.org и щелкнуть по ссылке "Configure FTP client" (Конфигурация FTP-клиента), то мы увидим конфигурационный файл для FileZilla, который можно скачать, и файл Cyberduck для Mac OS, который тоже можно скачать. Кроме того, прямо здесь приведена некоторая информация. Например, вот сервер, который я планирую использовать, а вот порт, который я тоже буду использовать. Таким образом, бОльшую часть этой информации можно получить из данных о самом сервере. Если после ввода всех этих данных нажать кнопку "Connect" (Подключиться), то это окно закроется, и будет выполнено подключение к серверу. В правой части окна находится панель. Давайте расширим окно, чтобы вы могли видеть, о чем я говорю.

Готово. Итак, в правой части окна ведется работа с удаленным сайтом. Т.е. все эти файлы находятся на сервере. Левая часть окна предназначена для работы с локальным сайтом. В качестве каталога размещения файлов указано то место на жестком диске, куда я сохраняю свои рабочие файлы во время разработки сайта. В этом примере файлы располагаются на моем рабочем столе. Обычно я не сохраняю файлы на рабочий стол, но, как известно, это всего лишь пример. Итак, здесь представлены файлы моего действующего локального сайта. Если мне нужно что-то изменить, например, файл favicon.ico, страницу contact.htm или что-то подобное, то все, что мне нужно сделать, - перетащить этот файл в соответствующий каталог, и этот файл добавится на сервер. Предположим, есть.. ну не знаю... например, изображение, которое нужно загрузить на сервер. Я открою каталог _images. Допустим, нужно заменить файл contest.jpg новым файлом. Перетащим этот файл вот сюда. Поскольку в этом каталоге уже есть такой файл, на экране появляется окно, в котором необходимо указать, что делать дальше. Выберу вариант "Overwrite" (Заменить). В результате файл будет заменен, и я увижу соответствующее сообщение. К примеру, когда загружается целый сайт, на это уходит больше времени.

Но при этом файлы подготавливаются, анализируются, а затем передаются на сервер. Все, что я сделал, - загрузил файл contest.jpg в каталог _images, просто перетащив его туда. Все просто. Получается, что такие FTP-клиенты легко находить, легко устанавливать и легко конфигурировать. Но на самом деле есть еще более простой способ работы с хостинг-аккаунтами. Давайте вернемся к нашей панели управления. Прокрутим страницу вот до этого элемента под названием "Web Disk" (Веб-диск). Не все хостинги обладают такой опцией, но вы обязательно найдете что-то очень похожее.

По сути, Веб-диск позволяет монтировать веб-сайт подобно тому, как монтируется любой жесткий диск. Впоследствии файлы в него можно перетаскивать прямо из обозревателя. Для этого нужно выполнить те же действия, что и при создании FTP-аккаунта: создать совершенно новый аккаунт, установить для него пароль, указать соответствующий каталог, а затем нажать кнопку "Create" (Создать). Как видите, я уже создал один веб-диск для аккаунта james@desolve.org. После создания такого веб-диска необходимо скачать файл, который, по сути, является конфигурационным файлом. В этом файле содержится скрипт, который запускается, а затем устанавливает соединение с сервером.

Мне нравится, что в этом случае используется протокол SSL. В результате передаваемые вами файлы будут зашифрованы и защищены. И это здорово. В случае использования FTP тоже можно обеспечить некоторый уровень безопасности. Рекомендую воспользоваться этой возможностью. Потому что, если вы загружаете свой сайт, находясь, например, в кофейне, кто-нибудь может перехватить эту информацию, так как она в этом случае никак не засекречена. Вряд ли такое может случиться, но кто знает. Итак, каков же принцип работы веб-диска? Как видите, у меня есть небольшой защищенный веб-диск desolve.org.

Если я нажму на него, то получу запрос на разрешение запуска скрипта. После этого меня попросят ввести имя аккаунта и пароль. Введем эти данные. Нажмем кнопку "Connect" (Подключиться). После установки соединения перейдем в поисковик или, в случае использования стационарного компьютера, - в обозреватель. Как видите, справа вмонтирован новый диск - desolve.org. Если открыть этот диск, то окажется, что это и есть мой сайт. Теперь я могу работать с ним, как с любым другим каталогом или жестким диском. Могу перетаскивать файлы. Быстро, просто и безопасно, даже слишком просто.

Нужно быть очень, очень аккуратным. Не забывайте, что вы работаете с действующим сайтом, поэтому любые изменения или удаления файлов, сделанные мною здесь, выполняются и на сервере. Таким образом довольно легко загружать и скачивать файлы. Но прежде чем что-то сделать, нужно хорошенько все обдумать. Конечно, в случае использования подобных FTP-клиентов старые копии файлов на удаленном сервере заменяются новыми. Поэтому большинство пользователей предпочитает использовать системы контроля версий, например, SVN или Git. В случае использования Git необходимо подключить его к своему серверу, а затем выполнить так называемый "коммит" (commit). В результате изменения будут передаваться на сервер через Git. Благодаря этому вы можете отслеживать версии и изменения на вашем сайте, а также откатывать его более ранние версии в случае возникновения проблем. Тем не менее, настройка взаимодействия с такой системой контроля версий, как Git, может быть сложной задачей. Обычно такая настройка выполняется не в привычном графическом интерфейсе, а в командной строке. Если же вы все-таки решите использовать такую систему, как Git, тщательно изучите принцип ее работы и научитесь свободно ею пользоваться. А затем уже можете применять ее в существующих проектах.