🎯 Цель урока

Настроить локальную среду разработки, запустить веб-сервер и увидеть результат работы первого PHP-скрипта в браузере. Понимать разницу между клиентскими и серверными технологиями.

📚 Теоретическая часть (30 минут)

📖 Что такое PHP и зачем он нужен?

PHP (PHP: Hypertext Preprocessor) — это серверный язык программирования, который делает сайты "живыми" и интерактивными.

🔍 Простыми словами:

Представьте, что HTML — это скелет сайта, CSS — это одежда, а PHP — это мозг, который думает и реагирует на действия пользователя.

Сравнение HTML и PHP
Статические сайты (HTML) Динамические сайты (PHP)
Всегда показывают одно и то же Меняют контент в зависимости от ситуации
Не помнят пользователя Запоминают логины, корзины, настройки
Не могут обрабатывать формы Принимают данные из форм (регистрация, заказы)
Просто показывают информацию Работают с базами данных
Быстро загружаются Требуют обработки на сервере

✨ Где используется PHP в реальной жизни?

  • Интернет-магазины — корзина покупок, оформление заказа
  • Социальные сети — лента новостей, комментарии, лайки
  • Блоги и CMS — WordPress, Joomla, Drupal
  • Формы обратной связи — отправка email с сайта
  • Личные кабинеты — регистрация и авторизация
  • Админ-панели — управление контентом сайта

💡 Простой пример: Если на HTML-сайте вы хотите показать текущую дату, вам нужно каждый день вручную менять код. На PHP дата обновляется автоматически!

🛠 Установка локального сервера

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

🎯 OpenServer (рекомендуется для Windows)

Русскоязычная сборка "всё в одном"

Преимущества:
  • Не требует установки — работает с флешки
  • Простая панель управления
  • Уже включает PHP, Apache, MySQL, phpMyAdmin
  • Автоматическая настройка доменов
Скачать OpenServer

🌐 XAMPP (для всех ОС)

Кроссплатформенное решение

Преимущества:
  • Работает на Windows, macOS, Linux
  • Официальная сборка от Apache Friends
  • Множество документации и руководств
  • Простая установка в 3 клика
Скачать XAMPP

📝 Что такое локальный сервер? Это программа, которая эмулирует работу настоящего веб-сервера на вашем компьютере. Позволяет разрабатывать сайты без интернета.

✍️ Выбор редактора кода

Редактор — ваш главный инструмент для написания кода. Вот популярные варианты:

Сравнение редакторов кода
Редактор Плюсы Минусы Кому подходит
VS Code Бесплатный, тысячи расширений, отладчик, Git-интеграция Может тормозить на слабых ПК Всем, особенно начинающим
Notepad++ Очень легкий, быстрый, подсветка синтаксиса Мало возможностей для серьезной разработки Для быстрого редактирования файлов
PhpStorm Мощная IDE со всеми возможностями Платный, требует много ресурсов Профессиональным разработчикам
Sublime Text Быстрый, минималистичный, множество плагинов Бесплатный пробный период Любителям минимализма

🎨 Рекомендуемые расширения для VS Code:

  • PHP Intelephense — автодополнение кода PHP
  • PHP Debug — отладка PHP-скриптов
  • Live Server — быстрый запуск HTML-страниц
  • Russian Language Pack — русский интерфейс
  • Material Icon Theme — красивые иконки для файлов

💡 Совет: Начните с VS Code — он бесплатный, современный и имеет всё необходимое для старта.

💻 Практическая часть (1.5 часа)

Шаг 1: Установка и запуск OpenServer/XAMPP

Для OpenServer:

  1. Скачайте и распакуйте архив в C:\OpenServer\
  2. Запустите OpenServer.exe
  3. В трее (возле часов) найдите красный флажок → правой кнопкой → Запустить
  4. Дождитесь, когда флажок станет зеленым

Для XAMPP:

  1. Запустите установщик и следуйте инструкциям
  2. Выберите компоненты: Apache, PHP, MySQL
  3. Запустите панель управления XAMPP
  4. Нажмите Start напротив Apache

Проверка: Откройте браузер и перейдите на http://localhost. Должна открыться стартовая страница сервера.

Шаг 2: Создание структуры проекта

  1. Создайте папку для проекта:
    Для OpenServer: C:\OpenServer\domains\myproject\
    Для XAMPP: C:\xampp\htdocs\myproject\
  2. Откройте VS Code или Notepad++
  3. В меню выберите File → Open Folder (VS Code) или просто откройте папку (Notepad++)
  4. Создайте новый файл и сохраните его как index.php

📁 Структура проекта: Все PHP-файлы должны находиться в папке htdocs (XAMPP) или domains (OpenServer), иначе сервер их не увидит.

Шаг 3: Первая программа на PHP

В файле index.php напишите следующий код:

<?php
echo "Hello, World!";
?>

📖 Разбор кода по частям:

  • <?php — говорит серверу: "Внимание, дальше идет PHP-код!"
  • echo — команда "скажи" или "покажи" (выводит текст)
  • "Hello, World!" — текст, который мы хотим показать (в кавычках)
  • ; — точка с запятой, ставится в конце каждой команды
  • ?> — конец PHP-кода (можно не ставить, если файл заканчивается PHP-кодом)

⚠️ Важно: Сохраните файл (Ctrl+S) перед проверкой в браузере.

Шаг 4: Запуск в браузере

  1. Откройте ваш браузер (Chrome, Firefox, Edge)
  2. В адресной строке введите:
    Для OpenServer: http://myproject/
    Для XAMPP: http://localhost/myproject/
  3. Если всё сделано правильно, вы увидите надпись "Hello, World!"

🔍 Проверка работы сервера:

Нажмите Ctrl+U (Просмотр кода страницы). Вы увидите только текст "Hello, World!", но не PHP-код. Это доказательство того, что PHP выполнился на сервере!

🧪 Эксперименты с кодом

Попробуйте изменить код и обновить страницу (F5):

Эксперимент 1: Несколько команд echo

<?php
echo "Привет, ";
echo "мир!";
echo " Я изучаю PHP.";
?>

Вопрос: Почему весь текст выводится без пробелов?

Эксперимент 2: PHP внутри HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<title>Мой первый PHP-сайт</title>
</head>
<body>
<h1><?php echo "Добро пожаловать"; ?></h1>
<p>Статический текст на HTML</p>
<?php echo "<p>Динамический текст через PHP</p>"; ?>
</body>
</html>

Эксперимент 3: Динамическая дата

<?php
echo "Сегодня: " . date("d.m.Y");
echo "<br>"; // перенос строки
echo "Время: " . date("H:i:s");
?>

Обновите страницу несколько раз и посмотрите, как меняется время!

📋 Домашнее задание

✏️ Задание на день 1

  1. Установите OpenServer или XAMPP и убедитесь, что сервер работает
  2. Создайте папку php_course и внутри неё файл index.php
  3. Создайте страницу-визитку на PHP:
    <!DOCTYPE html>
    <html lang="ru">
    <head>
    <meta charset="UTF-8">
    <title>Моя визитка</title>
    <style>
    body { font-family: Arial; max-width: 800px; margin: 40px auto; }
    .card { background: #f8f9fa; padding: 30px; border-radius: 10px; }
    </style>
    </head>
    <body>
    <div class="card">
    <?php
    $name = "Ваше Имя";
    $skills = "PHP, HTML, CSS";
    $city = "Ваш Город";
    
    echo "<h1>$name</h1>";
    echo "<p><strong>Навыки:</strong> $skills</p>";
    echo "<p><strong>Город:</strong> $city</p>";
    echo "<p><strong>Дата создания:</strong> " . date("d.m.Y H:i") . "</p>";
    ?>
    </div>
    </body>
    </html>
  4. Добавьте на страницу:
    • Текущий день недели (функция date("l"))
    • Счетчик посещений (просто число, которое увеличивается на 1 при каждом обновлении)
    • Случайное число от 1 до 100 (функция rand(1, 100))
  5. Бонус: Создайте файл info.php с кодом <?php phpinfo(); ?> и изучите информацию о вашей установке PHP

🧠 Проверка понимания

Вопросы для самопроверки

  1. Почему нельзя просто открыть PHP-файл двойным кликом как HTML?
  2. Что означает зелёный флажок OpenServer?
  3. Чем отличается echo "<h1>Привет</h1>" от просто echo "Привет"?
  4. Почему при просмотре исходного кода страницы мы не видим PHP?
  5. Что делает точка с запятой в конце команд PHP?
  6. Какой редактор кода лучше выбрать новичку и почему?
  7. Зачем нужен локальный сервер для разработки на PHP?
  8. Что произойдет, если забыть закрывающую кавычку в строке?

🔗 Полезные ресурсы

Официальное руководство по PHP (русский)

Документация от создателей языка

Быстрый старт с OpenServer

Пошаговое руководство по установке

Работа с PHP в VS Code

Официальная документация Microsoft

Notepad++ официальный сайт

Скачать и изучить возможности редактора

W3Schools PHP Tutorial

Интерактивные уроки на английском