А. В. Кириченко , Е. В. Дубовик , А. П. Никольский - Web на практике. CSS, HTML, JavaScript, MySQL, РНР для fullstасk-разработчиков

КиРИЧЕнко А.В., Никольский А.П., ДvБовик Е.В.

WEB НА ПРАКТИКЕ
css. HTML. JavaScript.
МySQL. РНР
AIUI

fullstасk-разработчиков

'"Наука и Техника"

г. Санкт-Петербург

УДКОО4.42
ББК 32.973
Кириченко А.В., Никольский А.П., Дубовик Е.В.

Web на практике. CSS, HTML, JavaScript, MySQL, РНР для
fullstасk-разработчиков - СПв.: НАУКА и ТЕхникА, 2021. - 432 с., ил.
ISBN 978-5-94387-271-6

Разработка многофункционального сайта, как правило, требует нескольких
разных специалистов, но в данной книге мы расскажем, как все сделать са­
мому! Fullstack-paзpaбoтчик - это разработчик, который обладает знани­
ями всех технологий (полным стеком) для создания пощюценных много­
функциональных веб-сайтов. Данная книга посвящена Fullstack-paзpaбoткe
сайта. В книге рассмотрен полный цикл создания полноценных сайтов и
Интернет-порталов:
• Идея или постановка целей и задач сайта.
• Создание макета дизайна сайта.
• Верстка. Создание frontend'a.
• Программирование backend'a.
• Базовое наполнение контентом.
• Разворачивание на хостинге.
В книге приведено описание всех ключевых технологий wеЬ-разработки
(HTMLS, CSS3, JavaScript, РНР, MySQL), знание которых необходимо
fullstасk-разработчикам.
Также приведен и разобран реальный пример разработки полноценного
образовательного Интернет-портала (его фронтенда и бэкенда), исходные
коды которого можно скачать с сайта издательства.

Все првва защищены. Никакая часть данной книги не может быть воспроизведена в какой бы то ни было форме без письменного разрешения
владельцев авrорских прав .
Издапльство не несе т отве тс твенности за возможный ушерб, причи ненный в ходе использования материалов д анн ой книm, а также за
доступносrь материалов, ссылки на которые вы можете найти в :этой книге. На момент подготовки книги к юданию все ссылки на интернет­
ресурсы 6Ь1Ли действующими.

1

ISBN 978-5-94387-271-6

9 8-5 - 9 4 3 7-271-6

Контакrные телефоны издательства:
(812) 412 70 26
. Официальный сайт: www.nit.com.ru

© Кириченко А.В., Дубовик Е. В.
© Наука и Техника (оригинал-макет)

Содержание

ГЛАВА 1 .ОБЩАЯ МЕТОДИКА FULLSTACK-PAЗPAБOTKИ
САЙТА . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 3
1. 1. ЭТАПЫ РАЗРАБОТКИ САЙТА....................................................... 14
1.1.1. Идея .................................................................................15
1.1.2. Техническое з.адание ........................................................ 16
1.1.3. Создание макета сайта ..................................................... 17
1.1.4. Верстка ............................................................................ 18
1.1.5. Программирование ..........................................................18
1.1.6. Наполнение контентом .....................................................19
1.1.7. Тестирование ...................................................................19
1.1.8. Жизнь после сдачи проекта .............................................. 20
1.2. СТЕК WEB-ТЕХНОЛОГИЙ FULLSТАСК-РАЗРАБОТЧИКА
РАЗНОГО УРОВНЯ .............................................................. 20
1.2.1. Базовый уровень ..............................................................21
1.2.2. Продвинутый уровень .......................................................22
1.2.3. Если нет таланта дизайнера ............................................. 26

ГЛАВА 2. ОСНОВЫ HTML 5 ..................................... 29
2. 1. ЯЗЫК HTML И НТМL-ДОКУМЕНТЫ КАК СОСТАВНЫЕ
ЭЛЕМЕНТЫ ИНТЕРНЕТ-САЙТОВ ............................................ 30
2.2. ТЕГИ (ЭЛЕМЕНТЫ) HTML - ОСНОВНЫЕ СТРУКТУРНЫЕ
ЕДИНИЦЫ HTML ................................................................. 32
2.3. СТРУКТУРА ДОКУМЕНТА HTML ................................................... 35
2.4. ЗАГОЛОВОК ДОКУМЕНТА HTML .................................................. 36
Тег TITLE - задаем название интернет-страницы ....................... 36
Тег BASE ....................................................................................38
Тег LINK - подключение каскадных таблиц стилей
CSS к НТМL-документу ..............................................................39
Тег МЕТА - задаем ключевые слова для индексации
поисковиками и кодировку.........................................................40
Тег SТYLE - задание стилевых настроек CSS3
непосредственно в НТМL-документе .........................................42

•

...

Тег SCRIPT - задание и подключение скриптов
Javascript к НТМL-документу (интернет-странице) .................... 45

2.5. ТЕЛО НТМL-ДОКУМЕНТА. ТЕГ BODY ............................................ 46

. .. . . . . . . . . . . . . . - .. . .. -..... ·:. -. - . - .... - . - ....................... -... -.. - . -. - . -. -

Web на практике
2.6. ПЕРСОНАЛИЗАЦИЯ И СЕГМЕНТАЦИЯ НТМL-ТЕГОВ. АТРИБУТЫ ID И
CLASS - ГОТОВИМ БАЗУ ДЛЯ ПРИМЕНЕНИЯ СSS-СТИЛЕЙ ......... 46
2.7. ФОРМАТИРОВАНИЕ ТЕКСТА ДОКУМЕНТА HTML ............................. 48
Подходы форматирования текста в HTML ..................................48
Теги структурного форматирования текста ................................49
2.8. СТРОКИ И АБЗАЦЫ .................................................................. 50
Тег --">