- •Предисловие
- •Раздел 1. Технологическая база веб-систем
- •1.1. Интернет
- •1.2. Хостинг
- •Хостинг
- •Интернет-адресация
- •1.3. Классификация веб-технологий
- •1.4. Инструментарий разработчика
- •Локальные LAMP
- •Алгоритм создания своего сайта в «Денвере»
- •Редакторы скриптов
- •1.5. Проблемы несовместимости
- •Задачи для самоконтроля
- •Раздел 2. Гипертекстовый язык разметки (HTML)
- •2.1. Основные определения
- •2.2. Структура HTML-документа
- •Заголовок HTML-документа
- •Тело HTML-документа
- •Специальные символы
- •Экранная типографика
- •2.3. Гиперссылки
- •2.4. Фразовые элементы
- •2.5. Текстовые блоки
- •2.6. Мультимедийные объекты
- •2.7. Списки
- •2.8. Таблицы
- •2.9. Формы
- •2.10. Общие атрибуты
- •Задачи для самоконтроля
- •Раздел 3. Каскадные таблицы стилей (CSS)
- •3.1. Основные определения
- •Вид CSS-инструкции
- •Селекторы
- •Приоритеты способов визуализации
- •Оптимизация объявлений
- •Размеры
- •3.2. Включение CSS в HTML-документ
- •Внешние стили (external style sheets)
- •Таблицы стилей документа (document style sheets)
- •Подключение внешних стилей через директиву
- •Стили, подставляемые в строку (inline styles)
- •3.3. Шрифт
- •3.4. Текст
- •3.5. Цвет и фон
- •Правила визуализации цвета
- •Цвет текста
- •Управление фоном
- •3.6. Оформление блоков
- •3.7. Позиционирование элементов
- •Абсолютное позиционирование
- •Относительное позиционирование
- •Задачи для самоконтроля
- •4.1. Основные определения
- •Структура программ
- •4.2. Переменные и массивы
- •4.3. Операции
- •4.4. Операторы
- •Условный оператор
- •Операторы цикла
- •Оператор for
- •Оператор for…in
- •Оператор while
- •4.5. Функции
- •Декларация функции
- •Вызов функции
- •Оператор return
- •4.6. Включение JavaScript в HTML-документ
- •Расположение внутри страницы
- •Расположение внутри тега
- •Вынесение в отдельный файл
- •4.7. Объекты
- •Дерево объектов обозревателя Интернет
- •Объект window
- •Объект Date
- •Объект document
- •4.8. Модели документа DHTML и DOM
- •Модель документа DHTML
- •Модель документа DOM
- •Задачи для самоконтроля
- •Раздел 5. Серверные сценарии: языки SSI и PHP
- •5.1. Включения на стороне сервера SSI
- •Дата последней модификации файла
- •Вставка данных из внешнего файла
- •Работа с переменными
- •Условный оператор
- •5.2. Язык программирования PHP
- •Синтаксис
- •Шаблоны
- •Запись и чтение из файлов
- •Обработка HTML-форм
- •Передача данных в php-скрипт через ссылку
- •Задачи для самоконтроля
- •Раздел 6. Работа с базами данных: MySQL
- •6.1. Основы SQL
- •Вставка данных в таблицу
- •Запрос данных
- •Удаление записей из таблицы
- •Обновление записей в таблице
- •6.2. Управление базой данных через phpMyAdmin
- •Создание базы данных
- •Создание таблицы
- •Вставка данных
- •6.3. Создание собственного PHP-скрипта для управления базой данных
- •Задачи для самоконтроля
- •Раздел 7. Готовые веб-системы
- •7.1. Форумы
- •phpBB
- •Invision Power Board
- •7.2. Блоги
- •Wordpress
- •bBlog
- •7.3. Фотогалереи
- •Coppermine Photo Gallery
- •Gallery
- •jsImageBox
- •7.4. Каталоги ссылок
- •LinkExchanger
- •FairLinks
- •7.5. Cистемы управления документами и файловые архивы
- •KnowledgeTree
- •RW:Download
- •7.6. Статистика
- •CNStats
- •TrackSite
- •7.7. Интернет-магазины
- •OsCommerce
- •PrestaShop
- •7.8. Аукционы
- •Web Auction
- •7.9. Wiki
- •7.10. Системы управления контентом
- •Joomla!
- •Drupal
- •1C-Битрикс: Управление сайтом
- •7.11. Корпоративные порталы
- •LifeRay
- •1С-Битрикс: Корпоративный портал
- •Задача для самоконтроля
- •Заключение
- •Список рекомендуемой литературы
- •П.1.1. Гипертекстовая часть (index.html)
- •П.1.2. Каскадные таблицы стилей (common.css)
- •П.1.3. Результат
- •П.2.1. Проверка форм
- •Подключаемый скрипт test_form.js
- •Вызов функции в HTML-документе для любой формы
- •Вид после выявления ошибок
- •П.2.2. Меню-телепортатор
- •П.2.3. Смена изображения при наведении мыши
МИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ РОССИЙСКОЙ ФЕДЕРАЦИИ
НАЦИОНАЛЬНЫЙ ИССЛЕДОВАТЕЛЬСКИЙ ЯДЕРНЫЙ УНИВЕРСИТЕТ «МИФИ»
С.А. Филиппов
Основы современного веб-программирования
Рекомендовано УМО «Ядерные физика и технологии» в качестве учебного пособия
ля студентов высших учебных заведений
Москва 2011
УДК 004.738(073) ББК 32.973.202я7 Ф 53
Филиппов С.А. Основы современного веб-программирования:
Учебное пособие. М.: НИЯУ МИФИ, 2011. – 160 с.
В пособии представлены наиболее популярные технологии соз-
дания веб-систем: HTML, CSS, JavaScript, SSI, PHP, MySQL, а так-
же обзор наиболее распространенных свободно-распространяемых и коммерческих веб-систем.
Предназначено для студентов-старшекурсников, студентов, проходящих обучение по сокращенной форме и получающих второе высшее образование.
Будет интересно преподавателям, которые планируют создание образовательных ресурсов в электронном виде.
Подготовлено в рамках Программы создания и развития НИЯУ МИФИ.
Рецензент д-р техн. наук, проф. А.И. Гусева
ISBN 978-5-7262-1402-3 |
© Национальный исследова- |
|
тельский ядерный университет |
|
«МИФИ», 2011 |
Редактор Е.Г.Станкевич
Подписано в печать 15.12.2010. Формат 60×84 1/16.
Печ. л. 10,0. Уч.-изд. л. 14,0. Тираж 100 экз.
Изд. № 1/4/12. Заказ № 20
Национальный исследовательский ядерный университет «МИФИ». 115409, Москва, Каширское ш., 31
ООО «Полиграфический комплекс «Курчатовский». 144000, Московская область, г. Электросталь, ул. Красная, д. 42
СОДЕРЖАНИЕ |
|
ПРЕДИСЛОВИЕ............................................................................................. |
6 |
РАЗДЕЛ 1. ТЕХНОЛОГИЧЕСКАЯ БАЗА ВЕБ-СИСТЕМ..................... |
7 |
1.1. ИНТЕРНЕТ............................................................................................... |
7 |
1.2. ХОСТИНГ................................................................................................. |
9 |
1.3. КЛАССИФИКАЦИЯ ВЕБ-ТЕХНОЛОГИЙ ................................................... |
15 |
1.4. ИНСТРУМЕНТАРИЙ РАЗРАБОТЧИКА...................................................... |
16 |
1.5. ПРОБЛЕМЫ НЕСОВМЕСТИМОСТИ.......................................................... |
20 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ..................................................................... |
21 |
РАЗДЕЛ 2. ГИПЕРТЕКСТОВЫЙ ЯЗЫК РАЗМЕТКИ (HTML) ......... |
22 |
2.1. ОСНОВНЫЕ ОПРЕДЕЛЕНИЯ.................................................................... |
22 |
2.2. СТРУКТУРА HTML-ДОКУМЕНТА.......................................................... |
23 |
2.3. ГИПЕРССЫЛКИ ...................................................................................... |
28 |
2.4. ФРАЗОВЫЕ ЭЛЕМЕНТЫ.......................................................................... |
31 |
2.5. ТЕКСТОВЫЕ БЛОКИ ............................................................................... |
32 |
2.6. МУЛЬТИМЕДИЙНЫЕ ОБЪЕКТЫ.............................................................. |
33 |
2.7. СПИСКИ................................................................................................. |
35 |
2.8. ТАБЛИЦЫ.............................................................................................. |
38 |
2.9. ФОРМЫ ................................................................................................. |
41 |
2.10. ОБЩИЕ АТРИБУТЫ.............................................................................. |
48 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ..................................................................... |
50 |
РАЗДЕЛ 3. КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ (CSS) ....................... |
51 |
3.1. ОСНОВНЫЕ ОПРЕДЕЛЕНИЯ.................................................................... |
51 |
3.2. ВКЛЮЧЕНИЕ CSS В HTML-ДОКУМЕНТ................................................ |
57 |
3.3. ШРИФТ.................................................................................................. |
60 |
3.4. ТЕКСТ.................................................................................................... |
62 |
3.5. ЦВЕТ И ФОН........................................................................................... |
63 |
3.6. ОФОРМЛЕНИЕ БЛОКОВ.......................................................................... |
65 |
3.7. ПОЗИЦИОНИРОВАНИЕ ЭЛЕМЕНТОВ ...................................................... |
68 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ..................................................................... |
73 |
РАЗДЕЛ 4. СЦЕНАРИИ КЛИЕНТА: |
|
ЯЗЫК JAVASCRIPT, МОДЕЛИ DHTML И DOM................................. |
75 |
4.1. ОСНОВНЫЕ ОПРЕДЕЛЕНИЯ.................................................................... |
75 |
4.2. ПЕРЕМЕННЫЕ И МАССИВЫ ................................................................... |
76 |
4.3. ОПЕРАЦИИ ............................................................................................ |
77 |
4.4. ОПЕРАТОРЫ .......................................................................................... |
78 |
4.5. ФУНКЦИИ.............................................................................................. |
81 |
3
4.6. ВКЛЮЧЕНИЕ JAVASCRIPT В HTML-ДОКУМЕНТ................................... |
83 |
4.7. ОБЪЕКТЫ .............................................................................................. |
85 |
4.8. МОДЕЛИ ДОКУМЕНТА DHTML И DOM ............................................... |
93 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ................................................................... |
101 |
РАЗДЕЛ 5. СЕРВЕРНЫЕ СЦЕНАРИИ: ЯЗЫКИ SSI И PHP............. |
103 |
5.1. ВКЛЮЧЕНИЯ НА СТОРОНЕ СЕРВЕРА SSI ............................................. |
103 |
5.2. ЯЗЫК ПРОГРАММИРОВАНИЯ PHP ....................................................... |
107 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ................................................................... |
116 |
РАЗДЕЛ 6. РАБОТА С БАЗАМИ ДАННЫХ: MySQL......................... |
117 |
6.1. ОСНОВЫ SQL...................................................................................... |
117 |
6.2. УПРАВЛЕНИЕ БАЗОЙ ДАННЫХ ЧЕРЕЗ PHPMYADMIN........................... |
121 |
6.3. СОЗДАНИЕ СОБСТВЕННОГО PHP-СКРИПТА ДЛЯ УПРАВЛЕНИЯ |
|
БАЗОЙ ДАННЫХ.......................................................................................... |
126 |
ЗАДАЧИ ДЛЯ САМОКОНТРОЛЯ ................................................................... |
132 |
РАЗДЕЛ 7. ГОТОВЫЕ ВЕБ-СИСТЕМЫ............................................... |
133 |
7.1. ФОРУМЫ ............................................................................................. |
133 |
7.2. БЛОГИ.................................................................................................. |
134 |
7.3. ФОТОГАЛЕРЕИ .................................................................................... |
135 |
7.4. КАТАЛОГИ ССЫЛОК ............................................................................ |
136 |
7.5. CИСТЕМЫ УПРАВЛЕНИЯ ДОКУМЕНТАМИ И ФАЙЛОВЫЕ АРХИВЫ...... |
137 |
7.6. СТАТИСТИКА ...................................................................................... |
138 |
7.7. ИНТЕРНЕТ-МАГАЗИНЫ........................................................................ |
139 |
7.8. АУКЦИОНЫ ......................................................................................... |
140 |
7.9. WIKI .................................................................................................... |
140 |
7.10. СИСТЕМЫ УПРАВЛЕНИЯ КОНТЕНТОМ............................................... |
141 |
7.11. КОРПОРАТИВНЫЕ ПОРТАЛЫ ............................................................. |
146 |
ЗАДАЧА ДЛЯ САМОКОНТРОЛЯ ................................................................... |
148 |
ЗАКЛЮЧЕНИЕ.......................................................................................... |
149 |
СПИСОК РЕКОМЕНДУЕМОЙ ЛИТЕРАТУРЫ................................. |
150 |
ПРИЛОЖЕНИЕ 1. ПРИМЕР РЕАЛИЗАЦИИ СТАТИЧЕСКОЙ |
|
HTML-СТРАНИЦЫ .................................................................................. |
151 |
П.1.1. ГИПЕРТЕКСТОВАЯ ЧАСТЬ (INDEX.HTML)......................................... |
151 |
П.1.2. КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ (COMMON.CSS) ............................. |
152 |
П.1.3. РЕЗУЛЬТАТ ...................................................................................... |
156 |
4
ПРИЛОЖЕНИЕ 2. ПРИМЕРЫ ЧАСТО ИСПОЛЬЗУЕМЫХ |
|
СКРИПТОВ JAVASCRIPT....................................................................... |
157 |
П.2.1. ПРОВЕРКА ФОРМ............................................................................. |
157 |
П.2.2. МЕНЮ-ТЕЛЕПОРТАТОР.................................................................... |
159 |
П.2.3. СМЕНА ИЗОБРАЖЕНИЯ ПРИ НАВЕДЕНИИ МЫШИ............................. |
159 |
5
ПРЕДИСЛОВИЕ
Сегодня можно уверенно констатировать, что Россия вступает в эпоху информационного общества. Основой, «кирпичами» этого общества являются веб-системы. Они определяют его возможности, влияют на решения, способствуют улучшению уровня жизни. В такой ситуации особенно востребованными становится знание основных механизмов создания и функционирования подобных систем, умение правильно поставить задачу на ее разработку или же реализовать ее самостоятельно.
Данное учебное пособие посвящено рассмотрению основных технологий и принципов создания и обеспечения доступности конкурентоспособных веб-систем, среди которых:
•размещение систем в Интернете;
•формирование статических и динамических вебстраниц;
•готовые веб-системы.
Впособии приведены только основные, часто используемые технологии и их составные части. Для получения более обширной информации рекомендуется ознакомиться со списком рекомендуемой литературы.
Автор советует не только использовать многочисленные примеры из настоящей книги, но и смело экспериментировать, создавая собственные системы.
6