Подпишитесь на обновления блога. Введите ваш e-mail:

Вход в систему

Инструментарий разработчика

Данная статья полезна тем, кто хочет начать заниматься (или совсем недавно занимается) разработкой сайтов и php программированием, но не знает с чего начать и какие для этого должны быть инструменты.

Кратко:

1. Установите Denwer (веб-сервер + Система Управления Базами Данных)
2. Установите Notepad++ (простой но очень мощный и удобный текстовый редактор, который имеет подсветку синтаксиса, удобный поиск, смену кодировок и т.д.)
3. Создайте в каталоге вашего сервера ../WebServers/home новую папку, например new_site, в ней папку www, а в папке www уже непосредственно файлы сайта.
4. Запустите сервер.
5. Если вам приходится работать с версткой – используйте плагин FureBug для Mozilla или встроенный в браузеры Chrome и Opera инструмент просмотра и редактирования стилей (правая кнопка в области сайта/просмотр кода элемента).
6. Если вам нужно отлаживать JavaScript – установите плагин FireBug для браузера Mozilla (позволяет просматривать ход исполнения JS сценариев, показывает ошибки JS кода, и как было указано выше, позволяет работать с CSS.)

Подробно:

Шаг 1. Установка Web-сервера (Denwer)

Итак вы решили начать заниматься программированием на php и делать сайты.
Сам по себе браузер не умеет выполнять php-команды. Поэтому если вы создадите файл с расширением *.php, напишите в нем php-код, например такой

  1. $sum = 5+4;<br />
  2. echo $sum;<br />
  3.  

то после открытия такого файла в браузере, вместо ожидаемого результата (цифра 9 на экране) вы увидите непосредственно код, который только что написали.

Для того, чтобы научить ваш компьютер выполнять программу на php необходимо установить web-сервер.

Таким сервером является Apache. Однако если вы попробуете скачать а затем установить Apache у себя на компьютере – скорее всего у вас ничего не получится, т.к. Apache в чистом виде требует тонкой настройки и копания в файлах конфигурации.
Решением проблемы служит комплект Denwer, который легко устанавливается и включает в себя не только уже преднастроенный Apache, но и инструменты для работы с Базами данных, а так же другие полезные штуки.
Скачиваем денвер отсюда.

Установка хоть и осуществляется из консоли, не вызывает затруднений. Замечу лишь, что на одном из этапов установки предлагается выбрать режим запуска сервера: 1 – запускать сервер вместе с ОС, 2 – запускать сервер самостоятельно при необходимости. Несмотря не то, что предлагается выбрать вариант 1, я рекомендую выбирать второй вариант, что позволит запускать сервер лишь тогда, когда он действительно нужен.

Теперь проверим работоспособность. Для этого запустим сервер (ярлык start Denwer на рабочем столе). Если все прошло нормально в правом нижнем углу экрана (в трее) появятся 2 иконки.
Открываем браузер, пишем в строке адреса http://localhost/
Жмём Enter.
Должно появиться сообщение "Ура, заработало!" и собственно страница с информацией о комплекте Denwer.

Шаг 2 Установка текстового редактора Notepad++

Прежде чем перейти к созданию сайта установим удобный текстовый редактор Notepad++. Скачать его можно здесь.
Вы конечно можете редактировать файлы и в обычном блокноте… Хотя нет. Если вы действительно намерены заниматься web-разработкой вы должны пользоваться удобным текстовым редактором, который как минимум имеет подсветку синтаксиса, т.е. понимает что например <body> является не просто набором букв, а html-тегом, и подсвечивает его специальным цветом.

Итак, советую обратить внимание на Notepad++ и установить его. После установки редактор ассоциируется с файлами php, т.е. двойным щелчком файл откроется сразу в Notepad++. Советую ассоциировать редактор с *.css, *.js файлами, и при необходимости с *.html файлами, чтобы их можно было быстро открывать и редактировать.

Шаг 3 Создание локального домена. Запуск сервера

Теперь мы готовы создать наш первый сайт.
Если при установке Denwer вы не меняли путь установки, программа установилась в C:/WebServers
Откроем папку C:/WebServers/home.
Здесь создадим новую папку. Пусть мы хотим создать сайт с доменом first, т.е. мы хотим чтобы наш сайт открывался при переходе в браузере по адресу http://first/.

Важно! При создании новой папки (читай нового сайта) в папке home не забывайте внутри нее создать папку www.

Внутри www создадим файл index.php
В нем пропишем
<?
Echo “Hello World”!
?>
Важно! Если вы создали новый домен (новую папку в ../Webservers/home) при работающем сервере, необходимо перезапустить сервер чтобы домен стал активным.

Итак, перезапускаем сервер (ярлык restart denwer), набираем в браузере http://first/ и видим на экране результат: "Hello World!"

Это значит, что браузер обратился на сервер к домену http://first/. Такой переход равносилен : http://first/index.php
Т.е. сервер автоматически обратился к index.php, увидел что в этом файле размещен php код  между <? …. ?> и выполнил его.
Если же вы хотите сделать запрос на другой файл, нужно явно указать его в адресной строке браузера, т.е. так: http://first/other.php

Работаем с CSS

Для работы со стилями при верстке сайта я использую браузер Chrome. Его плюс в том, что он уже имеет в себе встроенные инструменты, позволяющие просматривать и что важно менять в реальном времени стили для элементов сайта.
Для этого вызываем контекстное меню для нужного элемента и жмем «Просмотреть код».


Работа с JavaScript

Любой программист, работающий с JavaScript, просто обязан иметь в своем распоряжении FireBug. Это бесплатный плагин к браузеру Mozilla Firefox, который позволяет просматривать ход выполнения JS, отображает ошибки, вызовы функций и т.д.
Скачать FireBug можно с официального сайта Mozilla.
Для установки открываем Mozilla, меню «Инструменты/Дополнения», вкладка «Расширения» и переносим в это окошко скачанный установщик FireBug.

Отправить комментарий

Содержимое этого поля является приватным и не будет отображаться публично.
CAPTCHA
Введите код который вы видите на картинке чтобы подтвердить, что вы - человек!