Установка локального сервера XAMPP и WordPress. Как установить локальный сервер (XAMPP)

XAMPP - сборка Web-сервера, в которой содержится набор приложений для полноценного функционирования сайта. При этом не требуется настройка каждого компонента по отдельности.

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

Проект кроссплатформенный, а это значит, что он одинаково хорошо работает на популярных платформах: Windows, Linux, Mac OS. Само название XAMPP – аббревиатура, которая расшифровывается следующим образом:

  • X – обозначает, что сборка будет работать на всех операционных системах;
  • Apache – веб-сервер, поддерживающий основные версии ОС, гибко настраиваемый и надёжный;
  • MySQL – одна из самых известных систем управления базами данных;
  • PHP – язык программирования, поддерживаемый почти всеми хостинг-провайдерами и лидер среди языков, используемых для создания веб-сайтов;
  • Perl – лёгкий в освоении язык программирования, который, к тому же, поддерживает модули сторонних разработчиков.

Эта сборка отлично подойдёт начинающим веб-программистам. В ней есть всё, что может понадобиться для комфортной работы.

Виртуальный хостинг сайтов для популярных CMS:

Где скачать?

Скачать XAMPP можно как с официального сайта, так и со сторонних ресурсов. Последнее крайне нежелательно, так как возможны проблемы в виде вирусов, кейлоггеров и дополнительно установленных программ.

В самом крайнем случае можно воспользоваться крупными сайтами-архивами, если в статусе файла стоит «проверено» и отзывы в целом положительные.

Проходим на официальный сайт сборки по адресу https://www.apachefriends.org . При нахождении в диапазоне IP-адресов стран СНГ произойдёт автоматический редирект на русскую версию сайта.

Следующий шаг – выбор операционной системы. Так как мы работаем в Windows, то и выбираем версию для этой ОС. Обратите внимание, что последние версии программы работают только с новыми операционными системами –Vista и выше, под XP или 2003 он просто не запустится.

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

Установка XAMPP на ОС Windows.

Запускаем инсталлятор и на стартовом окне жмём кнопку «Next».

Появится окно выбора устанавливаемых компонентов. Серым цветом отмечены неактивные чекбоксы (обязательные компоненты программы). Остальные – активны, но мы не будем ничего убирать, а оставим, по умолчанию. «Next».

Программа установки предложит выбрать место установки. По умолчанию это диск C:\. Соглашаемся. «Next».

Программа сообщит, что готова к установке и после нажатия кнопки «Next» запустится процесс распаковки.

Локальный сервер и firewall.

Брандмауэр Windows предложит разрешить или запретить доступ к программе.

Если инсталлятор скачан с официального сайта, разрешаем.

Завершаем установку и настройку.

Для запуска программы сразу после завершения установки осталось выполнить следующие действия:

  1. Оставить флажок «Запустить контрольную панель после завершения установки».
  2. Жмем «Finish».

Проверка работоспособности модулей и компонентов.

После завершения установки откроется панель управления XAMPP.

Сразу же запускаем MySQL. Брандмауэр опять попросит разрешить или запретить программе доступ в сеть. Разрешаем.

Поочерёдно проверяем состояние Apache и MySQL. Для этого нажимаем кнопки «Admin» (1 и 2), после чего в браузере должны открываться панели управления сервера и базы данных.

Панель управления:

Скрипт для работы с базами данных PhpMyAdmin:

Проверяем работоспособность основных служб. Для этого рекомендуем в директории C:\Xampp\htdocs создать папку test. В блокноте напишите предложенный вариант коротенького скрипта на PHP и сохраните под именем index.php:

Теперь в любом браузере пройдите по адресу: http://localhost/test и, если всё сделано правильно, вы увидите надпись «Good Job».

На этом установка web-сервера XAMPP завершена.

Ниже я постараюсь рассказать подробно, как происходит настройка сервера XAMPP и создание новой базы данных. Разбор типичных ошибок вынесен в отдельную статью Проблемы при установке XAMPP . Настройка завершится после того, как мы создадим пробный сайт на XAMPP .

Необязательное

1.1. Наверно пришло время создать папку для вашего сайта, ведь все «телодвижения» мы производим лишь ради создания сайта на вашем домашнем компьютере. Вы можете создать ее, где хотите, но я создал ее в корне диска D: и назвал ее designfornet , что почти совпадает с именем этого сайта, но без точки и тире.

Почему нельзя использовать для домашнего сайта имена с расширением существующих зон интернета, например, . com или . ru ?

По той причине, что любой ваш браузер будет искать ваш сайт mysite . ru или мой design-for . net , не внутри вашего компьютера, а в большом Интернете.

Итак, запомним правила для имен внутри компьютера:

– без расширений или используя несуществующие зоны, например, можно назвать сайт mysite .local потому, что зоны .local не существует;

Без пробелов в одно слово (точка и тире можно).

Обычно для примера используют нейтральные имена homesite или mysite , но, раз вы находитесь на моем сайте, то я думаю, имя designfornet более уместно, так как позволяет получить преемственность со статьей , в которой речь идет о создании домашнего сайта.

По-большому, имя нам нужно произвольное – лишь бы как-то назвать папку, куда мы будем копировать нулёвые файлы.

1.2. Я советую Новичкам сразу сделать копию папки xampp где-нибудь в другом месте, а в случае фатальной ошибки – заменить всю папку или отдельный файл из сохраненной копии. Так можно сэкономить время, которое пошло бы на удаление и переустановку.

Как раз для этого пригодится наша новая папка designfornet (homesite ). Надо просто перетащить всю папку xampp (из диска C: ) правой кнопкой мыши на/в созданную папку сайта designfornet и выбрать «Копировать».

1.3. Еще более разумный подход состоит в следующем:

1.3.1. так как в процессе настройки мы будем вносить изменения лишь в некоторые файлы, поэтому для ускорения доступа к ним, лучше сразу установить ярлыки этих файлов на Рабочем столе.

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

1.4. Поставьте рабочий браузер главным. У себя Я установил FireFox браузером по умолчанию, как самый массовый. Установите в его настройках автоматическое определение кода UTF-8.

Сегодня у FireFox есть преимущества перед Opera и Internet Explorer: Опера стала тяжеловатой и «раздувается» при многочасовом использовании. Ослика IE используют лишь для проверки вида свежеиспеченного сайта. Ghrom догоняет по полярности FireFox среди «масс», так как имеет хорошую скорость, но еще достаточно «голый» из-за отсутствия полезных плагинов, например, политика его хозяина запрещает воровать скачивать видеоролики.

1.5. Начинающему веб мастеру для ковыряния в кодах потребуется «правильный» текстовый редактор, называемый так по той причине, что он не вносит форматирование в тексты. Поэтому нельзя использовать программу Word. Блокнот, встроенный в Windows, для редактирования кодов так же не годится. После прочтения статьи Правильные редакторы кодовых файлов надо установить на вашем компьютере Notepad++ .

Изучаем XAMPP Control Panel Application

2.1. Если вы продолжаете процесс установки веб сервера XAMPP, то окно контрольной панели XAMPP Control Panel Application еще перед вами. Если закрыли, то панель надо активировать через её ярлык.

Рис.1 Окно контрольной панели XAMPP Control Panel Application

Я надеюсь, что вы уже имеете или достали из папки C:\xampp на рабочий стол нужные ярлыки: xampp_start.exe , xampp_stop.exe , xampp-control.exe . Клик по последнему приведет к раскрытию той же панели.


Чтобы вытащить ярлык надо открыть папку C:\xampp и правой кнопкой мыши потянуть ярлык на рабочий стол компьютера. После того как вы его отпустите в появившемся меню выбрать сроку «Создать ярлык».

2.2. В нижней части панели мы можем узнать о версиях панели и операционной системы, установленной на вашем компьютере, месте расположения директории самого Ксампа и его инсталлятора, и статусном состоянии панели - Check OK (запущена).

Рис.2 Нижняя часть окна панели показывает статус каждого компонета

2.3. Много, о чем я здесь пишу, не представляет интереса, потому что после настройки мы уже никогда сюда не вернемся.

В самой верхней строке панели мы видим две кнопки «Service… » и «SCM… ». При помощи первой мы можем запустить XAMPP Control Panel Application как службу на своем компьютере. Вторая переносит нас на окно, в котором можно найти все службы, запущенные на нашем компьютере.

2.4. Обычно рекомендуют запускать XAMPP в качестве службы, что устраняет некоторые неприятности с совместимостью. Меня, однако, напрягает работа серверных программ, когда я не работаю с сайтом. Веб сервер у меня не имеет выхода в Интернет, поэтому я его компоненты запускают лишь по мере надобности. Тем более мне нет нужды запускать его контрольную панель в виде службы Windows.

2.5. Левый ряд квадратных полей (окошек) с именами Svc как раз позволяет запускать отдельные компоненты Ксампа в виде служб. Второй столбик на панели перечисляет эти компоненты. Чтобы они не включались и не работали постоянно вместе с Windows - оставляйте эти поля пустыми .

2.6. Третий столбик состоит из кнопок запуска – Start . Мы уж договорились, что для нас важными являются Apache и MySql , а ftp–клиент FileZilla и почтовый клиент Mercuri нам пока не нужны.

2.7. Нажмем на кнопку Start напротив Apache . Если все нормально установилось, то загорится зеленая кнопка с надписью Running (запущено), а надпись Start сменится на Stop .

Подобным образом запускаем два основных компонента веб сервера – Apache и MySql .

Рис.3 После запуска компонента можно видеть не только его статус, но занятый им порт

2.8. В зависимости от версии вид Контрольной панели может отличаться, обычно наличием или отсутствием кнопок в самом правом столбце. По этой причине варианты настройки могут несколько отличаться. Я думаю, вы просто пропустите пункты, которые не касаются вашей версии XAMPP

В более ранних версиях XAMPP присутствуют кнопки «Shell », «Setup », «Port-Check ».

2.9. Вспоминаем, что для нас веб-сервер XAMPP - программа проходная. Мы опробовать скрипты на нем не будем, как только установим, так сразу и забудем. Поэтому с кнопками надо только познакомимся, так как пользоваться ими, если и придется, то только разок. Если у вас некоторых кнопок нет, то пропускаете соответствующие пункты статьи.

2.10. Кнопка «Shell » - запускает командную строку Windows, работать в которой для пользователя этой операционной системы несколько непривычно, а новичкам – тем более.

2.11. Кнопка «Setup » возвращает нас к пункту установки через командную строку, когда можно включить или выключить любой модуль XAMPP выставкой определенного числа. Можно использовать, если у вас включен лишний модуль (Perl ). Вас сюда еще вернут, если что-то будут не так, как хочет установщик программы.

2.12. Кнопка «Port-Check » проверяет свободен или занят порт 80 , необходимые для работы сервера Apache . Порт 80 часто используют некоторые службы Windows, но чаще всего порт 80 занимает такая популярная программа, как Skype .

Если у вас занят порт 80 другой программой, то не запустится ядро вебсерера XAMPP - программа сервер Apache . О том как освободить порт 80 вы можете узнать в статье Проблемы при установке XAMPP . После открытия порта 80 вернитесь к данной статье для продолжения настройки Ксампа.

2.13. Последний ряд кнопок носит вспомогательный характер, потом вы сами их можете понажимать ради интереса.

Наc больше интересуют кнопки Admin в одном ряду с запущенными компонентами.

При первом запуске может появиться окно, в котором можно выбрать язык для XAMPP. Русского там нет – поэтому выбираем английский – English .

Рис.4 Окно для выбора языка

2.14. Когда вы нажмете на кнопку Admin в ряду с Apache , то запустится ваш основной браузер, в окне которого вы увидите страницу приветствия «» с адресом http://localhost/xampp/ .

Рис.5 Страница приветствия XAMPP

2.15. Текст под приветствием «Welcome to XAMPP for Windows! » нам малоинтересен, но в строке «For OpenSSL support please use the test certificate with https://127.0.0.1 or https://localhost » нам предлагают перейти по ссылке и получить сертификат, а заодно выполнить идентификацию адресов в браузере.

Кликаем по первой ссылке https://127.0.0.1 . Пока браузер не знает адрес XAMPP он считает соединение недоверенным. После перехода в браузере выбираем «Я понимаю риск » и нажимаем на «Добавить исключения ».

Рис.6 Пробираемся через установки браузера, чтобы внести страницу XAMPP в исключения

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

Рис.7 В браузере делаем исключение для адреса XAMPP

2.16. Остальную настройку мы будем выполнять, переходя по ссылкам, которые находятся в левой колонке (сайдбаре) на страницах XAMPP.

Главными для нас будут «Status », «Security », phpMyAdmin ». Любознательные могут посмотреть остальные ссылки сами.

2.17. Для перехода к управляющей утилите XAMPP надо кликнуть по ссылке phpMyAdmin . Откроется страница, в центре которой имеется форма для заполнения двух полей: первое поле для ввода названия базы нашего сайта, второе - для кодировки.

Рис.9 На странице phpMyAdmin нам надо заполнить два поля.

2.18. Вставляем в первом поле, над которым написано Новая база данных , имя своего сайта designfornet (я думаю, логично, что имя базы совпадает с именем сайта).

Для заполнения второго поля есть указатель в конце прямоугольника формы, по нажиму на который появится список кодировок. Надо опуститься до строки utf8_generai-ci и, кликнув по ней, закрепить эту кодировку в форме.

Рис.10 В пустые поля вставляем имя и выбираем кодировку база

Рис.11 Подтверждение о создании базы disignfornet

2.20. Следом нам надо создать пользователей этой базы и задать им пароли доступа. Нажмем на ссылку Привилегии вверху страницы.

Рис.12 Страница со списком предустановленных пользователей

Как оказывается, XAMPP уже создал нам пару пользователей с одинаковыми именами root .

Собственно, это один пользователь в двух лицах , но система будет нам активировать одно лицо по ссылке 127.0.0.1 , а другое - по localhost .

2.21. Для создания пароля первому пользователю root кликаем по значку «Редактировать» в крайнем столбце «Действие». В открывшейся странице опускаемся до блока «Изменить пароль».

Рис.13 Блок «Изменить пароль»

У себя я использовал пароль в виде того же имени «root », что делает его самым простым.

Пользователи, которые собирается открывать XAMPP для Интернета могут генерировать сложный пароль, для чего есть кнопка внизу.

2.22. После клика по кнопке «OK» появится страница с подтверждением создания пароля для первого root .

Рис. 14 Окно с подтверждение о создании пароля

2.23. Для создания пароля для второго пользователя нажимаем на ссылку Привилегии вверху страницы. Кликаем по значку «Редактировать» и повторяем процедуру создания пароля.

Рис.15. Повторяем регистрацию пароля для второго root

Как видите и для него я выставил пароль root , совпадающий с его именем.

Рис.16 Пароль выставляем тот же - root

2.24. После установки паролей для root вернемся по ссылке Привилегии , где в списках мы можем обнаружить лишних пользователь, которых надо удалить. Выставляем напротив такого пользователя галочку и выбираем действие «Удалить выделенных пользователей».

Рис. 17 Страница со списком пользователей

После всех телодвижений у нас должно остаться три пользователя: pma (пользователь от системы) и два одинаковых - root , с одинаковыми паролями.

2.25. Теперь для сохранения всех наших установок требуется перезагрузить XAMPP, для чего находим на Рабочем столе ярлык xampp_stop.ex e. После клика по нему появиться и исчезнет черное окно командной строки. Следом надо кликнуть по ярлыку xampp_start.exe и закрыть черное окно с предупреждением, чтобы мы запускали Start перед Stop. Однако проще запустить Apache и MySql через кнопки Контрольной панели XAMPP и сразу перейти по «Admin »

2.26. Нажимаем на Контрольной панели кнопку «Admin » для повторного входа в XAMPP. Переходим по ссылке Status на страницу, в которой видны запущенные компоненты.

Рис. 18 Страница Status

2.27. Намного интереснее страница по ссылке Security , на которой мы видим предупреждения о проблемах с компонентами XAMPP. Все проблемы, касающиеся нас, я выделил на рисунке в прямоугольники. Как видно, одну проблему мы преодолели.

Рис. 19 Страница Security

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

Суть проблемы в свободном доступе из внешней сети, для решения которой следует перейти по ссылке http://localhost/security/xamppsecurity.php , расположенной под таблицей с предупреждениями.

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

Рис.20 Страница Security console MySQL & XAMPP

2.29. После выставки паролей требуется перезагрузить XAMPP. Повторяем все как в пункте 2.25. и переходим по ссылке Security для проверки оставшихся проблем.

Рис.21 Страница Security после установки паролей

Как видно из Рис.21 основные компоненты запущены и для них созданы пользователи с правами доступа.

Другое дело, что я везде вставлял любимое root , так как на домашнем компьютере нет смысла создавать сложные пароли. Я уже писал, что XAMPP не предназначен для промышленного использования, а в домашней сети сложные пароли только создают дополнительные сложности.

Как я сказал в начале статьи, настройку веб сервера XAMPP мы закончим после создания пробного сайта.

Для этого вам нужно будет перейти к статье Сайт на XAMPP.

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


Зачем устанавливать WordPress на локальный компьютер?

Перед тем, как узнать «как» это сделать, давайте разберемся «зачем» это нужно и чем оно поможет в работе с сайтом на WordPress.

Быстрая передача файлов

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

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

Вы узнаете о WordPress больше

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

Разработка в автономном режиме перед загрузкой изменений

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

Создание личного автономного блога

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

Как видите, причин для установки WordPress на локальный компьютер множество. А теперь давайте разберемся, как это можно сделать, причем совершенно бесплатно.

Локальная установка WordPress с помощью XAMPP

Для использования WordPress на своем компьютере, сначала нужно скачать бесплатное программное обеспечение XAMPP . Это среда PHP разработки, хоть и есть много других возможностей для использования WordPress локально, но это является лучшим.

Шаг 1. Загружаем XAMPP

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

Шаг 2. Устанавливаем XAMPP

После загрузки соответствующего файла начните установку двойным щелчком мыши.

В процессе установки оставьте стандартные настройки и нажмите «Далее».

Когда дойдет до выбора папки для сохранения XAMPP, можно выбрать папку по умолчанию либо создать новую. Если вы не знаете, как лучше сделать, выберите первый вариант.

Ждем, пока XAMPP установится, чтоб перейти к следующему шагу.

Шаг 3. Запускаем XAMPP

Когда XAMPP установлен на ваш компьютер, выберите «Начать загрузку панели управления сейчас» и нажмите «Готово».

После этого нажмите «Start» для Apache и MySql:

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

Чтоб проверить, все ли сделано правильно, откройте браузер и перейдите по этому адресу:

http://localhost

Если XAMPP настроен правильно, то вы должны увидеть следующее:

Шаг 4. Создаем базу данных для WordPress

Так как WordPress использует базу данных, то нам нужно ее создать перед установкой WordPress. Это делается очень просто и всего в несколько шагов.

Для начала переключитесь на панель управления, нажмите на кнопку «Админ», а затем на «Старт» для MySql:

После этого в вашем браузере должна открыться админ-панель phpMyAdmin:

Здесь нажмите на «Databases», введите название вашей БД (любой набор латинских символов) и нажмите на кнопку «Создать». Так как вы можете создать несколько БД и произвести несколько установок WordPress на свой компьютер. Главное, дайте такое имя для БД, чтобы потом не перепутать, к какому сайту оно относится.

Когда вы увидите сообщение, подтверждающее создание базы данных, можете переходить к следующему шагу.

Шаг 5. Загружаем WordPress

Перейдите на wordpress.org и скачайте последнюю версию WordPress . После загрузки zip-файла, перенесите его туда, где вы установили XAMPP и сохраните в папке «htdocs ».

Затем разархивируйте этот файл, кликнув на него правой кнопкой мыши и выбрав «Извлечь в текущую папку»:

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

Шаг 6. Настраиваем WordPress

Мы практически все сделали. Осталось только отредактировать и переименовать один файл. В каталоге WordPress, который вы только что создали, найдите файл wp-config-sample.php и откройте его с помощью текстового редактора, например Notepad++ :

Отредактируйте данные в выделенной области в соответствии с названием базы данных, которую вы создали в шаге 4.

Сохраните файл и переименуйте его на wp-config.php , удалив –sample из его названия.

Шаг 7. Устанавливаем WordPress

Чтобы установить WordPress, введите в браузере адрес: http://localhost/wordpress/ , где «wordpress» является названием папки, которую вы создали в шаге 5. После загрузки страницы отобразится следующее:

Затем введите необходимые данные, нажмите на «Установить WordPress», после чего на вашем компьютере появится установленный WordPress в автономном режиме.

Если вы хотите установить темы или плагины, вы можете cделать это через админку WordPress, как бы вы это делали в онлайн режиме, или же можно скопировать файл в соответствующие папки на вашем компьютере:

  • Темы: c:\xampp\htdocs\wordpress\wp-content\themes
  • Плагины: c:\xampp\htdocs\wordpress\wp-content\plugins

Если вы не можете получить доступ к WordPress автономно по этим ссылкам, убедитесь, что XAMPP активен и запущены Apache и MySql.

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

Что же такое локальный сервер и зачем он нам нужен?

Локальный сервер - это набор программ, которые позволяют разрабатывать сайт на локальном компьютере без подключения к Интернету. Он аналогичен серверам, которые расположены у хостеров. Если вы создаете сайт используя только html-страницы с дизайном CSS, то никакой локальный сервер вам не нужен. Но если сайт динамичный, т.е. создан с использованием Php, Perl, MySQL, скриптов и т.д., то для его отладки и тестирования понадобится локальный сервер.

Часть 1. Установка XAMPP

Я уже писал о том, что мы будем использовать в качестве локального сервера XAMPP. Переходим по этой ссылке и выбираем XAMPP для нашей платформы. Моя операционная система Windows (у вас наверное тоже), поэтому жмем на XAMPP for Windows и попадаем на страницу, где находим следующий блок:

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

Русского языка в инсталляторе нет, поэтому оставляем английский, жмем «ОК».

Жмем «Next».

Здесь нам предлагают выбрать, куда мы будем устанавливать XAMPP, оставляем без изменений. Жмем «Next».

Здесь нам предлагают выбрать устанавливаемые компоненты. Оставляем как есть, жмем «Install».

Через пару-тройку минут инсталяция закончена. Жмем «Finish». У нас загружается вот такое окошко, которое называется контрольной панелью, а на рабочем столе появляется значок XAMPP.

Если панель не загрузилась, то для ее загрузки щелкаем по значку. Здесь мы будем запускать и останавливать серверы Apache и MySQL. Для старта сервера необходимо нажать на кнопку «Start». Нажимаем и вот что у вас должно получиться:

Мы будем запускать только Apache и MySQL. Как видно из скриншота, Apache использует 80 порт . Этот же порт по умолчанию использует Скайп и если у вас загружен Скайп и порт 80 занят, то Apache не загрузится. Поэтому идем в Скайп: Инструменты->Настройки->Дополнительно->Соединение и убираем галочку с «Использовать порты 80 и 443 в качестве входящих альтернативных» . Ну и в заключении хочу добавить, что для остановки сервера мы будем нажимать кнопку «Stop». Но пока оставляем все загруженным. Кстати, загрузку, остановку и перезагрузку XAMPP можно осуществлять и с помощью специальных приложений, которые находятся в папке C:\xampp\ это xampp_start.exe , xampp_stop.exe и xampp_restart.exe .

Настройка XAMPP

Установка не должна была вызвать каких-то затруднений. Переходим к настройке. Запускаем серверы Apache и MySQL и замечаем в строке Apache кнопку «Admin» , жмем на нее. Загружается такое окошко:

Русский язык к сожалению не представлен, выбираем английскую версию, как самый универсальный вариант. Но вы можете выбрать другой понравившийся вам язык. Попадаем сюда:

Это и есть веб-интерфейс XAMPP. Нам здесь важны два пункта. Первый - это Security :

здесь находятся настройки безопасности. Если перейти по ссылке http://localhost/security/xamppsecurity.php можно будет задать пароль для администратора баз данных MySQL и там же можно установить пароль на директорию XAMPP для ограничения доступа из локальной сети:

Я пока не буду задавать здесь пароли, вы же действуйте на свое усмотрение.

Создаем базу данных MySQL

Второй важный нам пункт это phpMyAdmin . Заходим и попадаем на следующую страницу:

Вот ради этого мы и городили весь наш огород. phpMyAdmin — веб-приложение для администрирования MySQL, а MySQL - это система управления базами данных, а наш будущий сайт - это и есть та самая база данных, которой будет управлять MySQL. Кажется, я тут все понятно изложил, а в подробности можно пока особо не вникать. Сюда мы зашли только по одной причине - у нас пока еще нет базы данных, так давайте ее создадим. Каждая база данных должна иметь свое уникальное название, я уже придумал название для нашей базы данных, предлагаю назвать ее site . Выбираем закладку «Базы данных», внизу в окошке «Новая база данных» пишем site, в окошке «Сравнение» выбираем utf8_general_ci - это кодировка для нашей базы. Жмем «Создать».

Создаем пользователя базы данных MySQL

Теперь нам нужно назначить пользователя для только что созданной базы. Идем в «Привилегии»

Жмем на «Добавить нового пользователя» и заполняем следующие поля:

Имя пользователя - любое слово состоящее из английских букв

Хост - Localhost

Пароль - любое сочетание английских букв и цифр

Многие начинающие веб-мастера для простоты запоминания и пароль, и имя пользователя делают таким же, как название базы данных, в нашем случае это было бы site. Это оказывается огромной прорехой в безопасности. Поэтому, когда будете создавать собственный сайт не поленитесь придумать другое имя пользователя, а пароль сгенерируйте с помощью кнопки «Генерировать», распечатайте и сохраните в надежном и безопасном месте. Вот пример такого заполнения:

Но так как у нас с вами обучающий курс, я поступлю как самый настоящий начинающий веб-мастер, которым, кстати, и являюсь, и заведу имя пользователя и пароль site .

Назначаем привилегии пользователю базы данных MySQL

Теперь необходимо назначить привелегии созданному пользователю, в Глобальных привелегиях жмем «Отметить все» и говорим «Ok».

Часть 2. Настройка виртуальных хостов

Редактируем файл httpd-vhosts.conf

Как, еще не все? - спросите вы, увы, нет, подходим к самому интересному. Для того чтобы мы могли просматривать в браузере свой сайт, необходимо настроить виртуальный хост. Для этого мы отправимся редактировать файл C:\xampp\apache\conf\extra\httpd-vhosts.conf. Открываем файл с помощью Notepad++ или обычным блокнотом. Сейчас в этом файле имеется некоторая информация, все строки которой начинаются с #. Мы ее не трогаем, а ниже добавляем следующий код:

NameVirtualHost 127.0.0.1


ServerName localhost
ServerAdmin admin@localhost

Здесь мы указываем имя виртуального хоста и описываем локальный хост. Теперь нам надо добавить данные, чтобы заработал наш сайт. Наш сайт будет называться также, как мы назвали базу данных - site , но названия сайта и базы данных не обязательно должны совпадать. Конечно, наш сайт должен будет называться что-то типа www.site.ru, но нам нет необходимости указывать полное имя сайта, так как это название будет использоваться только на нашем локальном компьютере, а нам нет нужды писать лишние буквы, поэтому и назовем его просто site. Под тем кодом, который мы только что добавили, добавляем еще код:


ServerName site
ServerAlias www.site
ServerAdmin [email protected]
DocumentRoot "C:/xampp/htdocs/site/www/"
ErrorLog "C:/xampp/htdocs/site/logs/error.log"
CustomLog "C:/xampp/htdocs/site/access.log" combined

AllowOverride All
Order allow,deny
Allow from all

ServerName site - Название нашего сайта, которое можно писать без.ru
ServerAlias www.site - Альтернативное название сайта
ServerAdmin [email protected] - Почта администратора ресурса
DocumentRoot "C:/xampp/htdocs/site/www/" - Папка с файлами сайта
ErrorLog "C:/xampp/htdocs/site/logs/error.log" - Журнал ошибок
CustomLog "C:/xampp/htdocs/site/access.log" combined - Журнал посещений

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

Редактируем файл hosts

Осталось добавить наш сайт в базу данных доменных имен нашей операционной системы Windows. Для этого в Windows 7 заходим в папку C:/Windows/ и находим в ней файл notepad.exe , выделяем его и жмем правую кнопку мыши, выбираем «Запуск от имени администратора», затем Файл >> Открыть выбираем папку C:/Windows/Sistem32/drivers/etc/ а в поле «Имя файла» руками вбиваем слово hosts . Если все сделали правильно, откроется файл hosts. В нем будет некоторая информация, также закомментированная решеткой #. Ниже добавляем следующую конструкцию:

127.0.0.1 site

Если будете создавать еще сайт, скажем site2, не забываем добавлять в этот файл:

127.0.0.1 site2

Делаем почтовую заглушку sendmail для XAMPP

Для того, чтобы иметь возможность просматривать письма при тестировании формы обратной связи, необходимо сделать так называемую почтовую заглушку. Делается это следующим образом, открываем Notepad++, создаем новый документ, выбираем синтаксис PHP а кодировку UTF-8, затем помещаем в этот документ следующий код:

//папка в которую будем складывать почту
define("DIR","c:/xampp/tmp/sendmail/");

//получаем из потока тело письма
$stream = "";
$fp = fopen("php://stdin","r");
while($t=fread($fp,2048))
{
if($t===chr(0))
break;
$stream .= $t;
}
fclose($fp);

//Сохраняем в файл
$fp = fopen(mkname(),"w");
fwrite($fp,iconv("UTF-8","CP1251",$stream));
fclose($fp);

//Функция присвоения имени файлу
function mkname($i=0)
{
$fn = DIR.date("Y-m-d_H-i-s_").$i.".eml";
if (file_exists($fn))
return mkname(++$i);
else return $fn;
}

Сохраняем файл под именем sendmail.php в папку C:\xampp\sendmail\. Затем в папке C:\xampp\tmp\ создаем папку sendmail .

В файле php.ini (C:\xampp\php) заменяем строчку:

Sendmail_path = "C:\xampp\sendmail\sendmail.exe -t"

на строчку:

Sendmail_path = C:\xampp\php\php.exe c:\xampp\sendmail\sendmail.php

Перезапускаем XAMPP. Если вы все сделали правильно, все отправленные письма можно будет просмотреть в папке C:\xampp\tmp\sendmail\. Но пока у нас нет обратной связи, поэтому, будем проверять тогда, когда ее создадим.

Создание папки для нашего сайта

Мы столько уже сделали, придумали название, даже прописали пути к нашему сайту, а до сих пор даже не создали для него папку. Настала пора этим заняться.

Все сайты, которые мы будем делать, мы будем размещать в папке C:/xampp/htdocs/. Теоретически, не обязательно использовать именно эту папку, можно использовать любую другую, но для этого надо будет изменить пути в файле httpd-vhosts.conf. Но мы не будем отходить от традиций. Давайте создадим нашу папку site в папке htdocs . А теперь в папке C:/xampp/htdocs/site/ создадим еще две папки: www и logs . В папке www будут находиться все фалы нашего сайта, которые мы будем потом переносить на хостинг. Папка logs будет содержать два файла - журнал ошибок и журнал посещений.

Ну вот, собственно, и все. На этом наш первый урок можно считать оконченным. Я засек время, которое мне понадобилось на то, чтобы проделать все, что описано в этом уроке. У меня получилось примерно 10 минут. Добавим время на скачивание дистрибутива XAMPP, ну пусть 5 минут. Итого, получается, что наше первое занятие мы выполнили за 15 минут. Время на ознакомление с материалом я не учитываю, так как наш слоган "Сайт за один день!" подразумевает не обучение этому процессу за один день, а время, за которое мы создадим сайт. До встречи на следующем уроке.

Я уже писал о том, что мы будем использовать в качестве локального сервера XAMPP. Переходим по этой ссылке и выбираем XAMPP для нашей платформы. Моя операционная система Windows (у вас наверное тоже), поэтому жмем на XAMPP for Windows и попадаем на страницу, где находим следующий блок:

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

Русского языка в инсталляторе нет, поэтому оставляем английский, жмем «ОК».

Жмем «Next».

Здесь нам предлагают выбрать, куда мы будем устанавливать XAMPP, оставляем без изменений. Жмем «Next».

Здесь нам предлагают выбрать устанавливаемые компоненты. Оставляем как есть, жмем «Install».

Через пару-тройку минут инсталяция закончена. Жмем «Finish». У нас загружается вот такое окошко, которое называется контрольной панелью, а на рабочем столе появляется значок .

Если панель не загрузилась, то для ее загрузки щелкаем по значку. Здесь мы будем запускать и останавливать серверы Apache и MySQL. Для старта сервера необходимо нажать на кнопку «Start». Нажимаем и вот что у вас должно получиться:

Мы будем запускать только Apache и MySQL. Как видно из скриншота, Apache использует 80 порт . Этот же порт по умолчанию использует Скайп и если у вас загружен Скайп и порт 80 занят, то Apache не загрузится. Поэтому идем в Скайп: Инструменты->Настройки->Дополнительно->Соединение и убираем галочку с «Использовать порты 80 и 443 в качестве входящих альтернативных» . Ну и в заключении хочу добавить, что для остановки сервера мы будем нажимать кнопку «Stop». Но пока оставляем все загруженным. Кстати, загрузку, остановку и перезагрузку XAMPP можно осуществлять и с помощью специальных приложений, которые находятся в папке C:\xampp\ это xampp_start.exe , xampp_stop.exe и xampp_restart.exe .

Настройка XAMPP

Установка не должна была вызвать каких-то затруднений. Переходим к настройке. Запускаем серверы Apache и MySQL и замечаем в строке Apache кнопку «Admin» , жмем на нее. Загружается такое окошко:

Русский язык к сожалению не представлен, выбираем английскую версию, как самый универсальный вариант. Но вы можете выбрать другой понравившийся вам язык. Попадаем сюда:

Это и есть веб-интерфейс XAMPP. Нам здесь важны два пункта. Первый – это Security :

здесь находятся настройки безопасности. Если перейти по ссылке http://localhost/security/xamppsecurity.php можно будет задать пароль для администратора баз данных MySQL и там же можно установить пароль на директорию XAMPP для ограничения доступа из локальной сети:

Я пока не буду задавать здесь пароли, вы же действуйте на свое усмотрение.

Создаем базу данных MySQL

Второй важный нам пункт это phpMyAdmin . Заходим и попадаем на следующую страницу:

Вот ради этого мы и городили весь наш огород. phpMyAdmin - веб-приложение для администрирования MySQL, а MySQL – это система управления базами данных, а наш будущий сайт – это и есть та самая база данных, которой будет управлять MySQL. Кажется, я тут все понятно изложил, а в подробности можно пока особо не вникать. Сюда мы зашли только по одной причине – у нас пока еще нет базы данных, так давайте ее создадим. Каждая база данных должна иметь свое уникальное название, я уже придумал название для нашей базы данных, предлагаю назвать ее site . Выбираем закладку «Базы данных», внизу в окошке «Новая база данных» пишем site, в окошке «Сравнение» выбираем utf8_general_ci – это кодировка для нашей базы. Жмем «Создать».

Создаем пользователя базы данных MySQL

Теперь нам нужно назначить пользователя для только что созданной базы. Идем в «Привилегии»

Жмем на «Добавить нового пользователя» и заполняем следующие поля:

Имя пользователя – любое слово состоящее из английских букв

Хост – Localhost

Пароль – любое сочетание английских букв и цифр

Многие начинающие веб-мастера для простоты запоминания и пароль, и имя пользователя делают таким же, как название базы данных, в нашем случае это было бы site. Это оказывается огромной прорехой в безопасности. Поэтому, когда будете создавать собственный сайт не поленитесь придумать другое имя пользователя, а пароль сгенерируйте с помощью кнопки «Генерировать», распечатайте и сохраните в надежном и безопасном месте. Вот пример такого заполнения:

Но так как у нас с вами обучающий курс, я поступлю как самый настоящий начинающий веб-мастер, которым, кстати, и являюсь, и заведу имя пользователя и пароль site .

Назначаем привилегии пользователю базы данных MySQL

Теперь необходимо назначить привелегии созданному пользователю, в Глобальных привелегиях жмем «Отметить все» и говорим «Ok».

Часть 2. Настройка виртуальных хостов

Редактируем файл httpd-vhosts.conf

– Как, еще не все? – спросите вы, увы, нет, подходим к самому интересному. Для того чтобы мы могли просматривать в браузере свой сайт, необходимо настроить виртуальный хост. Для этого мы отправимся редактировать файл C:\xampp\apache\conf\extra\httpd-vhosts.conf. Открываем файл с помощью Notepad++ или обычным блокнотом. Сейчас в этом файле имеется некоторая информация, все строки которой начинаются с #. Мы ее не трогаем, а ниже добавляем следующий код:

NameVirtualHost127.0.0.1 ServerName localhost ServerAdmin admin@localhost VirtualHost>

Здесь мы указываем имя виртуального хоста и описываем локальный хост. Теперь нам надо добавить данные, чтобы заработал наш сайт. Наш сайт будет называться также, как мы назвали базу данных – site , но названия сайта и базы данных не обязательно должны совпадать. Конечно, наш сайт должен будет называться что-то типа www.site.ru, но нам нет необходимости указывать полное имя сайта, так как это название будет использоваться только на нашем локальном компьютере, а нам нет нужды писать лишние буквы, поэтому и назовем его просто site. Под тем кодом, который мы только что добавили, добавляем еще код:

ServerName site ServerAlias www.site ServerAdmin [email protected] DocumentRoot "C:/xampp/htdocs/site/www/" ErrorLog "C:/xampp/htdocs/site/logs/error.log" CustomLog "C:/xampp/htdocs/site/access.log" combined AllowOverride All Order allow,deny Allow from all

ServerName site Название нашего сайта, которое можно писать без.ru
ServerAlias www.site Альтернативное название сайта
ServerAdmin [email protected] Почта администратора ресурса
DocumentRoot “C:/xampp/htdocs/site/www/” Папка с файлами сайта
ErrorLog “C:/xampp/htdocs/site/logs/error.log” Журнал ошибок
CustomLog “C:/xampp/htdocs/site/access.log” combined Журнал посещений

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

Редактируем файл hosts

Осталось добавить наш сайт в базу данных доменных имен нашей операционной системы Windows. Для этого в Windows 7 заходим в папку C:/Windows/ и находим в ней файл notepad.exe , выделяем его и жмем правую кнопку мыши, выбираем «Запуск от имени администратора», затем Файл >> Открыть выбираем папку C:/Windows/Sistem32/drivers/etc/ а в поле «Имя файла» руками вбиваем слово hosts . Если все сделали правильно, откроется файл hosts. В нем будет некоторая информация, также закомментированная решеткой #. Ниже добавляем следующую конструкцию:

127.0.0.1 site

Если будете создавать еще сайт, скажем site2, не забываем добавлять в этот файл:

127.0.0.1 site2

Делаем почтовую заглушку sendmail для XAMPP

Для того, чтобы иметь возможность просматривать письма при тестировании формы обратной связи, необходимо сделать так называемую почтовую заглушку. Делается это следующим образом, открываем Notepad++, создаем новый документ, выбираем синтаксис PHP а кодировку UTF-8, затем помещаем в этот документ следующий код:

Сохраняем файл под именем sendmail.php в папку C:\xampp\sendmail\. Затем в папке C:\xampp\tmp\ создаем папку sendmail .

В файле php.ini (C:\xampp\php) заменяем строчку:

Sendmail_path ="C:\xampp\sendmail\sendmail.exe -t"

на строчку:

Sendmail_path = C:\xampp\php\php.exe c:\xampp\sendmail\sendmail.php

Перезапускаем XAMPP. Если вы все сделали правильно, все отправленные письма можно будет просмотреть в папке C:\xampp\tmp\sendmail\. Но пока у нас нет обратной связи, поэтому, будем проверять тогда, когда ее создадим.

Создание папки для нашего сайта

Мы столько уже сделали, придумали название, даже прописали пути к нашему сайту, а до сих пор даже не создали для него папку. Настала пора этим заняться.

Все сайты, которые мы будем делать, мы будем размещать в папке C:/xampp/htdocs/. Теоретически, не обязательно использовать именно эту папку, можно использовать любую другую, но для этого надо будет изменить пути в файле httpd-vhosts.conf. Но мы не будем отходить от традиций. Давайте создадим нашу папку site в папке htdocs . А теперь в папке C:/xampp/htdocs/site/ создадим еще две папки: www и logs . В папке www будут находиться все фалы нашего сайта, которые мы будем потом переносить на хостинг. Папка logs будет содержать два файла – журнал ошибок и журнал посещений.

Ну вот, собственно, и все. На этом наш первый урок можно считать оконченным. Я засек время, которое мне понадобилось на то, чтобы проделать все, что описано в этом уроке. У меня получилось примерно 10 минут. Добавим время на скачивание дистрибутива XAMPP, ну пусть 5 минут. Итого, получается, что наше первое занятие мы выполнили за 15 минут. Время на ознакомление с материалом я не учитываю, так как наш слоган “Сайт за один день!” подразумевает не обучение этому процессу за один день, а время, за которое мы создадим сайт. До встречи на следующем уроке.