Программа для редактирования сайта на хостинге

Codeby web-security — новый курс от Codeby Security School

Представляем вашему вниманию новый курс от команды The Codeby — «Тестирование Веб-Приложений на проникновение с нуля». Общая теория, подготовка рабочего окружения, пассивный фаззинг и фингерпринт, Активный фаззинг, Уязвимости, Пост-эксплуатация, Инструментальные средства, Social Engeneering и многое другое. Подробнее .

Идея редактировать файлы прямо на хостинге не кажется хорошей, если речь идёт о реальном рабочем сервере.

С другой стороны, сколько раз возникает необходимость обновить какой-то файл, внести в него правки. Например, однажды загрузив свои скрипты (самописная CMS) я обнаружил, что один из них не работает, из-за более старой версии PHP. Ошибку пришлось устранять «на бегу», т. е. я правил файл на локалхосте, сохранял его, копировал на сервер, проверял, возвращался к файлу на локалхосте для дополнения и исправления. Работа заняла не так уж много времени (т. к. всё нужно было сделать именно быстро), но операций перезаписывания с локалхоста на сервер я сделал предостаточно через медленный до нудности FTP.

Ещё одним хорошим примером может стать изучение, программирование прямо на сервере в Интернете — в боевых условиях. С учётом копеечной стоимость хостинга, это вполне могут себе позволить даже начинающие разработчики на PHP. Из плюсов — не нужно возиться с локальным сервером, все проекты при переустановки Windows не теряются, не нужно беспокоится о безопасности Apache.

В общем, свои резоны в этой идее есть. Сейчас я объясню, как это реализовать.

На локальной машине нам нужен редактор. Я предпочитаю NetBeans — универсальный комбайн, который обладает огромным количеством удобных фукнций. Для веб-разработчиков я не знаю ничего лучше. Всё, что я программирую, я делаю в NetBeans. Ссылки на скачивание и общий обзор вы найдёте в моём стареньком обзоре по NetBeans. Для тех, кто сидит на Linux есть намного более свежая статья «Как установить NetBeans и Java на Linux».

В общем, я исхожу из того, что NetBeans у вас уже установлен.

Я буду показывать на примере хостинга Хостлэнд, на других хостингах всё очень похоже.

Открываем NetBeans и выбираем «Создать проект». Там где «Категории» выбираем PHP. А в «Проекты» выбираем «Приложение PHP с удалённого сервера»:

В следующем окне придумываете имя проекту.

Укажите папку источников, где будут размещены файлы на локальном компьютере.

Выберите версию PHP. Выбирайте версию, которая у вас установлена на хостинге!

Нажимаем «Далее» и перед нами открывается вот такое окно:

Всё нормально, мы настроем подключения сейчас. Для этого нажимаем кнопку с надписью «Управление…».

Откроется новое окно. В поле «Имя подключения» вписываем любое имя. Там где «Тип подключения» оставляем без изменений, т. е. FTP. Нажимаем ОК.

При регистрации хостинга вам пришлют необходимые данные, в том числе для FTP. Я ввожу свои данные. Нужно заполнить «Имя узла», «Имя пользователя» и «Пароль». Остальное можно не менять.

Paranoid — курс от Codeby Security School

Представляем вашему вниманию курс от команды codeby — «Комплекс мер по защите персональных данных, анонимности в интернете и не только» Подробнее .

Когда готово, нажмите «Проверить подключение» и, если всё в порядке, то сохраните подключение.

Мы вернулись к прежнему окну:

У нас ошибка « Недопустимый URL-адрес проекта ». Всё верно, ведь мы ещё не прописывали никакой адрес.

Если в настройках FTP вы выбрали корневой каталог, то в поле «URL-адрес проекта» введите просто ваш домен (например, в моём случае это был бы codeby.net). Но я выбрал поддомен, поэтому я вводу адрес поддомена test2.codeby.net

У нас имеется строчка «Выгрузить каталог», в которой по умолчанию установлено «/» – это не то, что нам нужно.

Путь, где лежат файлы сайта, у каждого свой. Покажу на примере домена codeby.net. Файлы сайта лежат в каталоге

/codeby.net/blogs/htdocs/www/

Если мы хотим тестовый сайт разместить в поддомене, чтобы к нему можно было бы обратиться по адресу test2.codeby.net, тогда мне нужно сохранить файлы тестового сайта по этому пути

/codeby.net/blogs/htdocs/test2/

Если вам не всё понятно с поддоменами, то обратитесь к статье «Настройка поддоменов на локальном сервере (locahost’е) и на хостинге» там всё довольно подробно расписано.

Поменяйте начальный каталог в соответствии с вашими данными:

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

Происходит проверка, если всё в порядке, то появится подобное окошечко:

Всё уже готово, попробуем отредактировать существующий файл. В процессе редактирования ничего не происходит, но как только мы нажали «Сохранить», то в фоне, практически незаметно для нас файл загружается на сервер. При этом мы можем продолжать редактировать этот или другие файлы.

Поддерживаются все текстовые файлы, которые так или иначе связаны с сайтом и с сервером. При этом их синтаксис подсвечивается, а если нажать Ctrl+Пробел, то появляются всплывающие подсказки.

Также удобно редактировать файлы вроде .htaccess. Попробуйте сами — уверен вам понравится.

Я показывал на примере хостинга от Хостлэнд (отличный хостинг, все свои сайты я размещаю именно там). Если по какой-то причине у вас ещё нет хостинга для ваших сайтов, то обязательно его заведите. При регистрации по этой ссылке вы получите бесплатный месяц, домен в подарок и другие скидки.

Безопасная сделка с гарантом Сodeby

Каждый веб дизайнер и кодер нуждается в хорошем редакторе веб страниц для создания и редактирования HTML, CSS и JavaScript кода. Notepad (Windows) и TextEdit (Mac) — отличные инструменты для начала, но вскоре по мере накопления опыта работы захочется использовать более солидный и удобный инструмент.

Существует сотни отличных редакторов, среди которых можно подобрать подходящий, однако многие из них являются платными. А если не хочется нарушать авторское право, а бюджет не располагает средствами на покупку коммерческого продукта? В данной статье рассматриваются несколько отличных бесплатных редакторов.

Если говорить о категориях, то редакторы веб страниц можно разделить на две группы:

  • WYSIWYG редакторы. Это графические редакторы, которые позволяют строить макет страницы и задавать стили визуально, как в хорошо известном текстовом процессоре MS Word. Они являются удобным инструментом для построения дизайна страницы, хотя, как известно каждому опытному веб дизайнеру, код все равно придётся «причесывать» для достижения отличного результата.
  • Текстовые редакторы. Это инструмент для непосредственного редактирования HTML и CSS кода. Некоторые редакторы имеют общее назначение и в них нет специальных опций поддержки веб кода. Другие специализированы для использования веб языков, таких как HTML, CSS, JavaScript и PHP, и имеют встроенные свойства для быстрого ввода HTML тегов, CSS свойств, и так далее. Многие из таких редакторов позволяют просматривать веб страницу в отдельном окне.

KompoZer — отличный выбор, если вам нужен визуальный редактор в условиях ограниченного бюджета

KompoZer — это единственный WYSIWYG редактор в списке. Очень многие считают, что это лучший из бесплатных редакторов WYSIWYG, доступных на сегодняшний день. Это редактор с открытым исходным кодом, который является потомком почтенного Netscape Composer. Вы можете редактировать страницы в трёх режимах:

  • Режим WYSIWYG. Позволяет визуально редактировать страницу и элементы разметки.
  • Объединенный режим. Очень удобный режим, когда вам нужно детально разобраться с разметкой определенного элемента.
  • Режим кода. Позволяет редактировать исходный код страницы как в текстовом редакторе. (К сожалению, нет свойства автозавершения тегов HTML или других способов ускорения ввода тегов.)

Можно легко просмотреть страницу в редакторе, как она будет выглядеть в браузере.

KompoZer поддерживает все элементы HTML, включая изображения, таблицы и формы. В нем также есть встроенный редактор CSS для модифицирования стилей, менеджер сайта работы с файлами на вашем сайте, и свойство «Опубликовать» для загрузки сайта через FTP.

В отличие от других WYSIWYG редакторов, KompoZer старается сохранить вашу разметку. насколько это возможно. Конечно, он выглядит не так презентабельно, как коммерческие редакторы (например, Dreamweaver), но его очень просто освоить и , если нужно обеспечить визуальное редактирование веб страниц в условиях урезанного бюджета, то это отличный выбор.

Komodo Edit — хороший редактор, простой в освоении, но мощный и расширяемый

Komodo Edit — это редактор с открытым исходным кодом, основанный на коммерческом продукте Komodo IDE (Интегрированная среда разработки). Это легко расширяемая система, благодаря использованию поддержки расширений, подобной той, которая используется в Firefox, и большому количеству доступных расширений.

Хотя это и редактор общего назначения, он поддерживает HTML и CSS, и имеет свойство контекстного автозаполнения HTML тегов и свойств CSS, а также коллекцию вставок кода для различных элементов HTML. Для того, чтобы получить максимум от использования Komodo, нужно установить расширение HTML Toolkit, которое содержит такие чудесные свойства как, автозакрытие тегов, предварительный просмотр вида CSS, и генератор временного текста.

Komodo Edit позволяет просматривать редактируемые страницы в любом установленном браузере, или использовать встроенный браузер в отдельном окне, так что можно редактировать и видеть результат изменений одновременно.

Редактор имеет встроенную функцию загрузки файлов на сайт (FTP, FTPS, SFTP, или SCP), а также вы можете чудненько группировать ваши файлы с помощью опции менеджера проекта.

Очень полезная функция Code > Select Block. Она выделяет текущий основной блок HTML, например, текущий закрытый элемент div или ul . Очень удобная функция, когда нужно выделить целую секцию на странице для копирования или перемещения.

В редакторе Komodo Edit есть очень много мощных и полезных функций, такие как использование регулярных выражений для поиска/замены, возможность выполнять внешние команды, и так далее. К счастью, редактор обладает также хорошей справочной системой, которая позволяет легко освоить всю мощьKomodo Edit.

Aptana Studio — это полноценная интегрированная среда разработки веб приложений с большим набором плагинов. Хотя вы можете использовать ее только как редактор HTML/CSS/JavaScript кода

Aptana Studio — полноценная среда разработки веб приложений, которая особенно хорошо подходит для работы с Ajax. Она позволяет редактировать HTML, CSS и JavaScript файлы, и много других языков веб программирования поддерживаются плагинами. Также возможно предварительно просматривать динамические веб приложения с использованием встроенного сервера Jetty Web.

Редактор Aptana отлично обрабатывает HTML и CSS: автозавершение кода CSS и HTML, и прекрасная подсветка кода. В действительности, автозаполнение HTML очень функционально для бесплатного редактора: теги HTML автоматически закрываются и всплывающие подсказки содержат информацию по синтаксису.

Aptana имеет отличную систему управления проектом, которая позволяет хранить все файлы вместе и использовать загрузку на сайт через FTP, SFTP и FTPS.

С другой стороны, Aptana — это достаточно большая программа, с огромным количеством настроек, плагинов и опций, которое может напугать новичка. Она также может быть иногда очень неповоротливой и нестабильной. (Другой незначительный пустячок: стандартное сочетание клавиш для открытия файла — Control/Command-O — вместо этого открывает окно Outline!)

Несмотря на недостатки, Aptana Studio является отличным выбором в том случае, если вам нужна полноценная Web IDE, и ее также можно использовать как простой редактор HTML/CSS/JavaScript.

Notepad++ — отличная замена для Notepad из Windows. Несмотря на то, что у него нет такого набора опций, как у других редакторов, он отлично подходит для редактирования HTML, CSS, JavaScript и других файлов с кодом

Notepad++ — это редактор с открытым исходным кодом, который является отличной заменой Windows Notepad. Он поддерживает вкладки и подсветку синтаксиса HTML и CSS.

Он имеет отличную систему поиска и замены, которая включает поддержку регулярных выражений и поиск по списку файлов.

Notepad++ имеет также систему плагинов, позволяющую расширять возможности редактора дополнительными опциями, например, загрузкой через FTP.

Другие полезные для веб разработчика функции:

  • Сравнение файлов
  • Встроенная функция HTML Tidy (инструмент для переформатирования и проверки HTML кода)
  • Горячие клавиши для просмотра документа в основных браузерах

PSPad — другой редактор общего назначения для Windows с большим набором функций полезных для HTML и CSS кодеров

Как и Notepad++, PSPad — редактор общего назначения для Windows. У него есть опции подсветки синтаксиса и автозавершения, и он хорошо подходит для редактирования HTML и CSS кода. Среди встроенных функций есть:

  • Переформатирование и проверка кода с помощью HTML Tidy
  • Предварительный просмотр в браузере
  • Преобразование форматированного текста в HTML и обратно
  • Преобразование CSS файла во встроенный код и обратно.

Особенно стоит выделить функцию, которая недоступна во многих других редакторах — это преобразование HTML кода в сжатый HTML код , что уменьшает объем ваших веб страниц для ускорения загрузки.

PSPad также имеет встроенный FTP клиент и систему записи макро команд.

jEdit — это кросс-платформенный редактор текста с мощными функциями макро команда и плагинов. Установите плагин XML, если вам нужно редактировать веб страницы

jEdit — это редактор текста с открытым исходным кодом, написанный на Java. С положительной стороны он великолепно работает под Windows, Mac OS X и Linux. С другой, отрицательной стороны интерфейс редактора неуклюжий с нестандартными виджетами, диалогами и горячим клавишами. Однако, если вы сможете преодолеть недостатки интерфейса, то увидите, что jEdit — это отличный редактор с большими возможностями.

jEdit имеет все функции, которые можно ожидать от подходящего редактора, включая подсветку синтаксиса и макросы. Однако, чтобы усилить jEdit в сфере веб кодирования, нужно установить плагин XML (это легко сделать, выбрав меню Plugins > Plugin Manager, нажав на закладку Install и выбрав XML plugin). Данный плагин добавляет функции автозавершения HTML и CSS, браузер DOM, аутентификацию кода и другие.

TextWrangler — это легкий редактор общего назначения. Несмотря на отсутствие специальных функций для веб разработки, его можно использовать для работы с веб страницами.

TextWrangler — разработан компанией Bare Bones Software как простой текстовый редактор общего назначения, и у него нет многих специальных веб функций. Но несмотря на это. он отлично подходит для несложного редактирования HTML, CSS, JavaScript и PHP кода.

Некоторые замечательные свойства TextWrangler:

  • Подсветка синтаксиса HTML, CSS, JavaScript и других языков веб программирования
  • Мощная, легкая в использовании функция поиска/замены с поддержкой регулярных выражений
  • Функция навигации: быстрый переход к любому элементу HTML, селектору CSS, или функции JavaScript в редактируемом файле
  • Встроенная поддержка работы с файлами по протоколу FTP
  • Поддержка AppleScript для автоматизации общих задач редактирования

Vim определенно сложен для освоения, но если вы преодолеете трудности, то никогда не захотите вернуться обратно!

Дедушка редакторов текста для программистов Vim (прямой потомок редактора vi) — это консольный редактор текста с открытым кодом. Он устанавливается редактором по умолчанию в почти всех разновидностях Unix, включая Linux и Mac OS X. Также редактор доступен для использования в Windows и многих других системах.

Vim не является системой, которую можно поставить и начать использовать сразу, до этого никогда не имев с ней дела. Большинство команда редактирования включают странные сочетания наподобие :wq и / . Он также имеет три режима редактирования: режим вставки, в котором вводится текст; визуальный режим для выделения текста; и командный режим для ввода команд. Такое функционирование является наследием Unix тех дней, когда не было ни окон ни мышки.

Почему он попал в список? Если вы освоите его, то убедитесь в его быстроте и мощности. С помощью нескольких команд можно за несколько секунд сделать то, что в других редакторах может занять минуты.

существует большое количество макросов и плагинов для Vim, которые облегчают работу с кодом HTML, CSS и JavaScript, включая подсветку синтаксиса, автозавершение, HTML Tidy, и просмотр в браузере. Вот большой список полезных ссылок:

Если вы не можете работать с окном терминала, то Vim имеет графическую реализацию под названием gvim, которая имеет в своем составе удобные окна и меню.

gedit — простой, но удобный для использования редактор. Вы можете использовать плагины для превращения его в веб редактор

gedit — редактор по умолчанию для графической среды GNOME, которая широко используется на Linux системах. Редактор отлично работает в Windows и Mac OS X. Загрузить программу можно с домашней страницы.

gedit имеет простой интерфейс и легок в использовании. Вы можете настроить редактор под собственные нужды с помощью большого числа плагинов. Для разработки веб приложений будут полезны следующие плагины:

Fraise — интуитивный редактор для Mac, с набором функций, достаточных для веб редактирования

Как и TextWrangler и gedit, Fraise — чудесный легкий редактор, который приятно использовать. Он является ответвлением от редактора Smultron. Он относительно новый и у него нет нормального веб сервера. В настоящее время он поддерживается только в Mac OS X 10.6 (Snow Leopard), то есть, если вы используете версию 10.5, то вам придется загрузить Smultron.

Fraise имеет несколько чудесных опций для веб редактирования:

  • Подсветка кода для HTML, CSS, JavaScript, PHP и нескольких других языков программирования.
  • Команду Close Tag( Command-T ) для закрытия текущего тега. Это реально сохраняет время при вводе списков.
  • Удобный предварительный просмотр встроенным браузером (с использованием WebKit), с очень удобной опцией Live Update? которая обновляет браузер как только изменилась разметка и CSS на редактируемой странице.
  • Опцию Advanced Find, которая поддерживает поиск/замену с использованием регулярных выражений.
  • Поддержка блоков для быстрого ввода тегов HTML и свойств CSS.
  • Некоторые удобные команды для манипулирования текстом, такие как проверка HTML и конвертация символов в элементы HTML.

Fraise стоит изучить, если вы используете Mac и вам нужен удобный редактор с большими возможностями, чем встроенный TextEdit.

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: www.elated.com/articles/10-fantastic-free-web-page-editors/
Перевел: Сергей Фастунов
Урок создан: 13 Августа 2010
Просмотров: 314399
Правила перепечатки

Проект готов, Все проверено на локальном сервере OpenServer и можно переносить сайт на хостинг. Вот только какую компанию выбрать? Предлагаю рассмотреть хостинг fornex.com. Отличное место для твоего проекта с перспективами бурного роста.

Создание вебсайта — процесс трудоёмкий, требующий слаженного взаимодействия между заказчиком и исполнителем, а также между всеми членами коллектива, вовлечёнными в проект. И в этом очень хорошее подспорье окажет онлайн платформа Wrike.

Подборка из нескольких десятков ресурсов для создания мокапов и прототипов.

Небольшая подборка провайдеров бесплатного хостинга с подробным описанием.

Ни для кого не секрет как в MySQL реализовать массовый INSERT, а вот с UPDATE-ом могут возникнуть сложности. Чтобы не прибегать к манипуляциям события ON_DUPLICATE можно воспользоваться специальной конструкцией CASE … WHEN … THEN.