
- •Пособие по курсу «Веб – программирование»
- •Для студентов специальности
- •«Математика и информационные технологии»
- •Минск, бгу,
- •Содержание
- •Глава 1. Компьютерные сети и протоколы
- •Глава 2. Проектирование и разработка сайтов……………………….62
- •Глава 3. Краткий обзор основных технологий разработки Веб приложений…………..………………………………………………..……......90
- •Глава 4. Информационный обмен, html и css.…..……………….132
- •Глава 5. Язык JavaScript………………………………………………..202
- •Глава 6. Язык серверных скриптов php…………...…………286
- •Глава 7. Лабораторные работы……………………..………………….400
- •Введение Коротко об истории Интернет
- •Как работает Интернет?
- •Система адресации
- •Способы подключения к сети
- •Сервисы Интернет
- •Электронная почта
- •Передача файлов по ftp
- •Всемирная паутина www
- •Задания для подготовки рефератов
- •Глава 1. Компьютерные сети и протоколы
- •Локальные сети
- •Распределенные и глобальные сети
- •Сеть vpn
- •Адресация в локальных сетях
- •Адресация в глобальных сетях и в Интернет
- •Адресация в iPv6
- •Доменные имена
- •Url адреса
- •Понятие и краткое описание протоколов
- •Соотношение между tcp/ip и osi/iso
- •Межсетевой протокол iPv4
- •Формат пакета iPv6
- •Формат заголовка пакета iPv6
- •Заголовки расширения iPv6
- •Маршрутный заголовок
- •Транспортный протокол tcp
- •Протокол дейтаграмм udp
- •Протоколы arp и rarp
- •Протоколы сетевого уровня
- •Протоколы электронной почты
- •Протоколы smtp и pop3
- •Протокол imap4
- •Протокол ftp
- •Протокол передачи гипертекстов
- •Клиентский запрос http
- •Ответ сервера
- •Развитие прикладных протоколов: rpc, rest, soap
- •Безопасность в сети
- •Протокол ssl
- •Шифрование данных
- •Установление подлинности участников
- •Реализация ssl
- •Как избежать блокирования сайтов
- •Проблемы с кодировкой и Unicode
- •Задания для подготовки рефератов
- •Адресация в iPv6.
- •Глава 2. Проектирование и разработка сайтов
- •2.1. Виды сайтов
- •2.2. Этапы проектирования и разработки сайта
- •2.3. Модели проектирования и управление проектами
- •2.3.1 Модель водопада для управления проектами
- •2.3.2 Итерационная (спиральная) модель
- •2.3.3 Технология Microsoft Solutions Framework (msf)
- •2.3.4 Другие технологии управления проектами
- •2.4. Программные средства управления проектами
- •2.5.1. Стили сайтов
- •2.6. Логическое проектирование дизайна сайта
- •2.7. Главная страница сайта
- •2.8. Внутренние страницы сайта
- •2.9. Оценки качества Веб-сайтов
- •2.9.1. Оценки качества для e-commerce
- •2.9.2. Ключевые индикаторы для e-commerce
- •2.9.3. Определение качества и рейтинга сайтов учебных заведений
- •2.9.4. Оценка качества и стоимости сайта
- •Глава 3. Краткий обзор основных технологий разработки Веб-приложений
- •3.1. Язык разметки гипертекста xml
- •3.1.1. Синтаксис xml
- •Объявление xml. Первая строка xml-документа называется объявление xml.
- •Конструкции языка xml. Повторим еще раз содержимое xml-документа: набор элементов, секций cdata, директив анализатора, комментариев, спецсимволов, текстовых данных.
- •3.1.2. Правильно построенные и действительные документы xml
- •Отображение xml-документа. Наиболее распространены три способа преобразования xml-документа в отображаемый для пользователя вид:
- •3.3. Язык ActionScript
- •3.3.1. Видео-, аудиопроигрыватели
- •3.5. Технология «клиент-сервер»
- •3.6. Программирование для серверов
- •3.7. Базы данных и язык sql
- •Нормализация модели данных
- •3.8. Язык sql
- •Команды управления транзакциями
- •Извлечение данных, команда select
- •Секция where. Директива where содержит условия отбора (предикат). Синтаксис where выглядит следующим образом:
- •Групповые функции. Если нас интересуют не строки таблицы, а некоторые итоги, мы можем использовать в процессе выборки колонок таблиц групповые функции (табл. 3.5.).
- •Команда insert. Добавление новых записей в таблицу осуществляется посредством команды insert. Она имеет следующий синтаксис:
- •Глава 4. Информационной обмен, нтмl и css
- •4.1. Язык разметки гипертекста html
- •4.2. Ссылки
- •4.3. Списки
- •4.4. Формы html
- •4.4.1. Новые элементы форм html5
- •4.4.2. Валидация формы
- •4.5. Метатеги
- •4.6. Новые возможности html5
- •Поддержка аудио
- •Поддержка видео
- •4.7. Каскадные таблицы стилей css
- •4.7.1. Способы включения каскадных таблиц стилей
- •Заголовок 1 Заголовок 2 Заголовок 3
- •4.7.2. Стили текста
- •4.7.3. Цвет и фон
- •Свойства таблиц
- •4.7.4. Псевдоклассы
- •4.7.5. Псевдоэлементы
- •4.7.6. Форматирование псевдоклассов и псевдоэлементов
- •Различные свойства
- •4.7.7. Представление документа в виде блоков
- •Отступы, поля, позиционирование
- •Границы элементов
- •4.7.8. Новое в css3
- •Глава 5. Язык JavaScript
- •5.1. Включение скриптов JavaScript в html-код
- •5.1.1.Создание простых сценариев
- •5.1.2.Отладка скриптов. Ввод и вывод данных
- •5.2. Описание языка
- •5.2.1. Типы данных
- •Булев тип. Переменные булева типа могут принимать значения: true – истина; false – ложь.
- •Переменные типа Undefined и Null. Тип undefined используется для несуществующих переменных или переменных, значения которых еще не определены. Тип null – пустое значение, например.
- •5.2.2 Операторы и выражения
- •Оператор with присоединяет имя объекта к имени свойства объекта. С помощью оператора with можно обращаться со свойствам объекта в сокращенном виде:
- •Оператор switch позволяет выбрать вариант
- •5.3. Функции
- •5.3.1. Стандартные функции и библиотеки.
- •5.3.2. Функции пользователя
- •5.3.3. Передача параметров по значению и по ссылке
- •5.3.4. Глобальные и локальные переменные
- •5.3.5. Модели событий
- •Ключевое слово this
- •5.4. Объектная модель
- •5.4.1. Пользовательские объекты
- •5.4.2. Объекты и прототипы
- •5.4.3. Исключения: throw/catch/finally
- •5.4.4. Встроенные объекты String, Array, Date, Math Объект String.Экземпляр объекта можно объявить двумя способами:
- •Объект Array
- •Объект Number (Число)
- •Объект Math (Математика)
- •Объект Date (Дата)
- •Объект Function
- •Объект RegExp и регулярные выражения
- •5.5.1. Свойства и методы объекта document
- •5.5.2. Коллекции
- •5.5.3.Свойства элемента innerHtml и outerHtml
- •5.5.4.Навигация по дереву документа
- •5.5.5.Создание новых узлов
- •Удаление и замена узлов в документе
- •5.5.6.Объект window
- •Свойства окна, передаваемые методу open()
- •Методы объекта window
- •5.5.7.Свойства и методы объекта navigator
- •5.5.8.Свойства и методы объекта history
- •5.5.9.Свойства и методы объекта location
- •5.5.11.Каскадные таблицы стилей и объект Style
- •5.6.1 Класс xmlHttpRequest
- •Использование dom
- •Работа с cookie
- •5.8.1.Доступ к элементам dom
- •5.8.2. Манипуляции с dom
- •5.8.3. Использзование css
- •5.8.4. Блочная верстка
- •5.8.5. Обработка событий
- •5.8.6. Работа с ajax
- •5.9. Примеры на JavaScript
- •Глава 6. Язык серверных скриптов php
- •Инструменты для разработки
- •Как php работает
- •6.1. Описание языка
- •Массивы и их инициализация
- •Операции и выражения
- •Битовые операции
- •Операции сравнения
- •Логические операции
- •Строковые операции
- •Операторы управления
- •Функции
- •Рекурсивные функции
- •Область действия и время жизни переменных
- •Изменяемые (динамические) переменные
- •Внешние библиотечные функции
- •Функции для работы с массивами
- •Функции для работы со строками
- •Функции форматных преобразований строк
- •Преобразование строк и файлов к формату html и наоборот
- •Преобразование html в простой текст
- •Установка локальных настроек
- •Регулярные выражения
- •Функции даты и времени
- •Математические функции
- •6.2. Объектно-ориентированное программирование в php Основные понятия объектно-ориентированного программирования
- •Конструкторы и деструкторы
- •Наследование классов и интерфейсов
- •Магические методы
- •Обработка ошибок
- •Ошибки php и журнал error_reporting
- •6.4. Файлы
- •Чтение и запись бинарных файлов
- •Работа с каталогами в рнр
- •6.5. Php и база данных MySql
- •Выборка данных из бд
- •Выборка данных из таблиц бд
- •Работа с MySql занесение и получение данных из базы данных
- •Организации работы с данными
- •6.6. Передача данных от клиента к серверу и обратно по протоколу http
- •Клиентские методы http
- •6.7. Обработка html-форм
- •Передача переменных из формы в скрипт
- •Передача данных на сервер по методам get и post
- •Ввод данных из различных форм
- •6.8. Работа с e-mail
- •6.9. Cookies-наборы
- •6.10. Сессии (Сеансы)
- •Отмена регистрации сеансовых переменных
- •6.11. Сериализация объектов
- •Сериализация объектов в сессиях
- •6.12. Сетевые соединения и сокеты
- •6.13. Вывод графических данных с помощью рнр
- •Получение информации об изображении
- •Функции рисования прямых и кривых линий
- •Заливка изображений
- •Удаление и изменение цветов палитры
- •Создание прозрачности в изображениях
- •Рисование с помощью кистей
- •Использование шрифтов и вывод строк
- •Слияние изображений с помощью gd
- •Лабораторная работа 3 (4ч). Применение каскадных таблиц стилей css
- •Трехколоночный контейнерный макет сайта:
- •Лабораторная работа 4. Применение каскадных таблиц стилей css
- •Лабораторная работа 5 (4 ч). Динамика и JavaScript на веб-странице
- •Ответьте на следующие вопросы:
- •Лабораторная работа 6 (4 ч).
- •Проверка правильности заполнения формы на сайте.
- •Методы объекта window
- •Задание 2. Функции
- •Задание 4. Работа с базами данных Выполните одно из перечисленных ниже упражнений
- •Задание 5. Создание web-объектов Задания:
- •Лабораторная работа 8(4 ч.) Разработка сайтов на основе cms Joomla! и Drupal
- •Drupal: практические примеры
- •Приложения
- •1. Курсовые работы Курсовая работа 1. Создание клиентских приложений
- •Курсовая работа 2. Сайты клиент-сервер
- •2. Каталог товаров
- •Курсовая работа 3. Технологии разработки Веб-приложений. Проекты сайтов
- •2. Быстрая разработка веб-приложений
- •Начало работы с сайтом
- •Создание контента
- •Установка нового модуля
- •Создание шаблона
- •Включение блока отображение популярных статей
- •Удаление
Курсовая работа 3. Технологии разработки Веб-приложений. Проекты сайтов
Создать сайт на основе HTML5+CSS+JavaScript+Jquery+Ajax+PHP-средств.
Для каждого Веб-приложения реализовать:
– интерфейсную (клиентскую) часть;
– административную часть.
Вход в административную часть и на все административные страницы должен быть защищен паролем. Реализовать с помощью механизма сессий.
В административной части администратор может:
редактировать существующие новости (изменять, удалять);
добавлять новые новости;
изменять число выводимых на странице новостей;
реализовать хранение новостей в базе данных MySQL.
– Для каждого сайта рассмотреть вопросы автоматизации проектирования и оценки качества созданных приложений в сравнении с существующими приложениями
Задания
Юзабилити. Оценка качества сайта с позиций юзабилити.
Многоязычный контент. Перевод на другие языки, включая китайский.
SEO. Оценка качества сайта с позиций SEO.
Электронный научный журнал. Прием статей от автора. Подписка, рассылка, реклама, скачивание.
Web-конференция. Прием заявок, прием тезисов, рассылка сообщений и приглашений. Конференция on-line. Особенности:
страница входа;
страница с личными настройками;
общие комнаты;
комнаты с приватными сообщениями;
возможность добавить картинку-аватар.
Создать систему контроля в учреждении образования, веб-журнал и веб-дневник. Страница приема заданий. Содержит таблицу со списком студентов и заданий. Студенты могут только посмотреть текущее состояние дел. Преподаватели, после ввода пароля, могут поставить или убрать галочку, означающую факт сдачи задания. Должна быть предусмотрена возможность сортировки списка студентов по имени или по количеству cданных заданий. Возможно использование Java и Java Script.
Спамилка серверная (спамит по форумам PHP и гостевым книгам).
Web 2.0. Семантические сети. Оценка качества сайта с позиций контента.
Интернет аукцион. Создать Интернет-аукцион. Пользователь указывает минимальную цену своего товара и время до конца продажи данного товара. Сделать ботов, которые в случае не достижения min цены будут ее поднимать на 20 секунд до конца продажи данного товара.
Создайте приложение, позволяющее тестировать качество работы хостеров. Приложение должно посылать запрос на указанный ресурс с заданной периодичностью, проверяя доступен ли сайт в данный момент времени. На основе полученных данных приложение формирует статистику работы.
Создайте сервис для отправки открыток на e-mail. Предоставить пользователю выбор вида открытки и посылаемого текста поздравления или создания собственного текста и открытки. Предусмотреть список рассылки.
Создайте сервис, который мог бы рандомно генерировать задание для студента, причем задания должны быть разные и зависили бы от уровня сложности, который вводится пользователем.
Автоматический генератор сайтов (по шаблонам).
Напишите игровой сайт: Игра «Пятнашки», «Кто хочет стать миллионером?», «Крестики-Нолики», «Морской бой» против компьютера или другие.
Напишите сервис-редактор изображений. Возможности: конвертирование в различные форматы, изменять размер изображения и сохранять его, реализовать различные фильтры и т. д.
Скрипт проверки наличия новых личных сообщений на каком-либо популярном форуме (сайте). Особенности:
получение html-страницы при помощи CURL (вход в авторизированный раздел отправкой post-запроса на страницу логина);
проверка наличия новых сообщений на странице (NegExps);
отправка уведомлений на почту.
Напишите парсер (Вырезание статей на данную тему со всех сайтов).
Сервис по определению доменов, которые заканчиваются или брошенные. (Работа с сервисом Whois) зона .com; .info.
Создайте систему оценки учреждения образования по присутствию в Интернет. Подобную Webometrics для университетов.
Использование cookie & session: Пользователю, посетившему хотя бы однажды раздел «музыка», предлагается баннер с рекламой магазина музыкальных инструментов. Аналогично отдел строительных инструментов и др.
Http-туннель. Создайте цепь анонимных http, socks proxy.
Сайт голосования. Нахождение мультов (лиц, зарегистрировавшихся с одного IP несколько раз) и удаляет несколько последних, оставляет первого.
Бизнес – сайт + проектирование на UML.
Корпоративный сайт + проектирование на UML.
Создайте игровой сайт. Определите реакцию и оценку степени усталости. +Flash+MultiMedia
Системы управления контентом. Сравнение WordPress, Joomla,Drupal на примерах различных сайтов
Синхронизация Веб-приложения с 1С
Технологии Raby on Rails
Google Maps – Google-карты
Flickr – онлайн-фотоальбом
Netvibes – Персональный десктоп
Digg.com – Новостной ресурс
Pligg – Веб 2.0 CMS
Quintura – Визуальный поисковик с интуитивной картой подсказок
MySpace – сайт сетевых сообществ
Last.fm – музыкальное сообщество
Импорт из Excel
Экспорт в формат Яндекс.Маркет.
поддержка мобильной связи, рассылка SMS сообщений
Создайте новостной сайт с подпиской по технологии RSS, которая позволяет транслировать информацию с других сайтов. Для подписки необходимо установить программу – агрегатор типа News Reader или другой.