О методических аспектах изучения дисциплины "Web-программирование" бакалаврами профиля "Информатика и информационные технологии в образовании"

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

Тема 1. Базовые понятия сети интернет.

Краткое содержание лекции 1. Структура и основные принципы работы сети Интернет, TCP/IP — технология межсетевого взаимодействия, адресация в сети интернет, сервисы интернет, электронная почта, система USENET, TELNET, FTP-сервис.

Методические рекомендации по изучению темы. Особое внимание следует уделить адресации в сети интернет, способам проверки работоспособности сетевых сервисов и протоколов.

Вопросы к обсуждению: Какие технологии используются в образовательных учреждениях? Какие технологии необходимо задействовать в рамках использования Web-технологий на сайте образовательного учреждения? Как организовать полноценное сетевое обеспечение интернет технологий в рамках локальной сети (интранет)?

Содержание компетентностно-ориентированного задания №1

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

Формулировка задания Определите возможные причины этой проблемы

Форма представления отчета по КОЗ : Представить в виде файла Word возможные причины неисправности.

Тема 2. Установка, настройка и управление Web-сервером Apache, Internet Information Server.

Краткое содержание лекции 2. Установка сервера Apache, IIS. Особенности функционирования. Структура каталогов. Средства управления. Способы настройки. Проверка функционирования.

Вопросы для обсуждения : Достоинства и недостатки бесплатного программного обеспечения; Правила использования программного обеспечения, с разными видами бесплатного лицензирования; Разница между интранет и интернет серверами

Практические задания: Установить сервер на компьютер с ОС Windows; Произвести настройку автозапуска сервиса; Произвести настройку каталогов для хранения скриптов и контента сервера; Проверить открытие статической html страницы с установленного сервера.

Методические рекомендации по изучению темы. При изучении этой темы, для удобства просмотра и редактирования конфигурационных и других файлов возможно использовать файловые менеджеры типа Far Manager и Total Commander. Особое внимание нужно уделить рассмотрению настроек типов файлов для отображения и настроек безопасности сервера.

Содержание компетентностно-ориентированного задания №2

Описание проблемной ситуации: На компьютерах в классе необходимо использовать Web –технологии для проведения тестов. Выделенного сервера нет, на персональном компьютере преподавателя установлена операционная система Linux.

Формулировка задания : Обоснуйте какой Web-сервер вы можете использовать в данной ситуации и укажите порядок установки и назначение каталогов выбранного вами сервера.

Форма представления отчета по КОЗ: Необходимо предоставить ответ в виде файла Word с обоснованием выбора. Ответ должен включать перечень каталогов сервера в стандартной конфигурации.

Тема 3. Особенности HTML и CSS.

Краткое содержание лекции 3. Структура HTML, списки, ссылки, изображения, таблицы, формы, дополнительная разметка, flash, видеоаудиоконтент. Введение в CSS, цвет, текст, блоки, списки, таблицы и формы, макет, изображения, макет в HTML5, процесс разработки.

Вопросы для обсуждения : Структура файла html; Понятие «тег»; Ссылки как неотъемлемая часть интернета; Типы списков и способы их реализации на сайтах; Способы просмотра изображений в интернете; Какие функции могут исполнять каскадные страницы стилей; Как могут храниться CSS; Способы описания свойств объектов в CSS.

Практические задания: Создать html-документ, содержащий несколько линий, абзацев и картинок. Изменить внешний вид документа путем добавления в него описаний css. Вынесите описание стилей в дополнительный файл.

Методические рекомендации по изучению темы. При изучении темы для удобства просмотра и редактирования конфигурационных и других файлов возможно использовать файловые менеджеры типа Far Manager и Total Commander. Для работы с готовыми примерами этой темы возможно использовать разработанную программу Weber. Ее использование упрощает работу с примерами HTML и CSS фалов, позволяет открывать примеры, изменять их, сохранять в нужный каталог, просматривать внешний вид страницы. Лаконичный интерфейс позволит сосредоточиться на предмете изучения. Основное внимание при изучении темы необходимо уделить синтаксису HTML5, как современному стандарту HTML. При изучении темы CSS особое внимание необходимо уделить возможностям хранения стилей во внешнем, общем для всего сайта файле. Тем самым обеспечивая единое оформление сайта на всех страницах. Для систематизации знаний необходимо изучить соответствие тегов HTML и свойств CSS.

Содержание компетентностно-ориентированного задания № 3

Описание проблемной ситуации Для преподавания дисциплины (по выбору студента) необходимо создать статический ресурс со справочным материалом по теме.

Формулировка задания Приведите пример того, как это может быть реализовано при помощи текстового редактора «блокнот» или FarManager.

Материал должен содержать не менее 5 страниц c изображениями и навигацией по страницам при помощи тегов.

Форма представления отчета по КОЗ: Для оценки необходимо предоставить разработанные Web-страницы.

Тема 4. Photoshop, Adobe Dreamweaver как средства создания Web-страниц.

Краткое содержание лекции 4. Photoshop: создание фрагментов, установка свойств фрагментов, создание навигационных кнопок, создание фрагментов на основе слоев, экспорт HTML страницы из изображений. Adobe Dreamweaver: реализация структуры сайта и управление им, фреймы, таблицы, шаблоны стили, анимация.

1. Вопросы для обсуждения : Графика и интернет сайты; Программы для редактирования графической информации; Анимация на страницах вебсайтов; Особенности создания дизайна web-сайтов; Что такое WYSIWYG HTML-редакторы; Какие еще html редакторы используются в повседневной деятельности; Плюсы и минусы WYSIWYG редакторов; Возможности WYSIWYG редактора от Adobe Dreamweaver;

Практические задания: при помощи Photoshop Adobe Dreamweaver создать сайт, содержащий следующие элементы:  Основную и дополнительные страницы с возможностью перехода по ним; Анимированные элементы с однократным и многократным воспроизведением; Элементы iframe, специальные ссылки (maile to, twitter, rss); Изучить возможности автоматизации повторяющихся операций в Photoshop.

Методические рекомендации по изучению темы. При изучении темы необходимо определить направление использования в Web-программировании функционала графических редакторов и WYSIWYG редакторов. Научиться использовать эти редакторы на практике. Определить степень возможной автоматизации работ по созданию Web-сайтов при помощи Photoshop, Adobe Dreamweaver.

Содержание компетентностно-ориентированного задания №4

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

Формулировка задания Предложите способ позволяющий реализовать поставленную задачу и реализуйте ее на практике (предмет тот же, что в КОЗ№3, темы должны совпадать).

Форма представления отчета по КОЗ : _Для оценки необходимо предоставить разработанный ресурс,

Тема 5. Основы JavaScript.

Краткое содержание лекции 5. Переменные, операторы, синтаксис языка, объекты документа и браузера, сценарии и документы HTML, формы и их элементы, строки математические выражения, даты, окна и фреймы.

Вопросы для обсуждения : JavaScript возможности использования при разработке школьных занятий; Место JavaScript среди других языков программирования; Особенности разработки программ на JavaScript; Особенности синтаксиса языка; Схожесть и отличия основных структур языка JavaScript с другими объектно-ориентированными языками программирования; Перспективы использования JavaScript.

Практические задания: Создайте несколько простых сценариев и зарузить их на выполнение при помощи браузера; Изучите использование переменных и функций JavaScript; Напишите несколько скриптов с использованием массивов и строковых данных; Напишите два и более скрипта, использующих функции тестирования и сравнения значений; Создайте JavaScript с использованием циклов; Создайте html документ с использованием обработки событий в JavaScript; Создайте html документ, использующий управление окнами и фреймами;    Создайте         html документ, в котором будут использоваться JavaScript и формы ввода данных; Создайе html документ, иллюстрирующий способы добавления рисунков и анимации при помощи JavaScript; . Создайте html документ, показывающий способы использования таблицы стилей и JavaScript.

Методические рекомендации по изучению темы. Особенностью изучения данной темы является то, что студент должен иметь минимальную базу по программированию. Должен оперировать понятиями переменная, функция, процедура, объект, метод, свойства, уметь использовать циклы и условия. Особое внимание необходимо уделить изучению JavaScript для проверки и расчетов значений, возможности управлять мультимедиа контентом и порядком отображения страниц.

Содержание компетентностно-ориентированного задания №5

Описание проблемной  ситуации. Для  обучения  школьников необходимо «оживить» страницы, используемые как наглядный материал.

Формулировка задания. Приведите пример того, как могут быть использован JavaScript в процессе обучения школьников.

Форма представления отчета по КОЗ : Для оценки необходимо предоставить 5 и более Web-страниц использующих JavaScript, по теме КОЗ№4.

Тема 6. Основы SQL (structured query language).

Краткое содержание лекции 6. Создание, заполнение, удаление баз данных, таблиц. Создание запросов. Фильтры. Запрос к нескольким таблицам. Группировка, подзапросы, условия, транзакции.

Вопросы для обсуждения: Типы баз данных и СУБД используемых для разработки программного обеспечения; Определение и возможности использования SQL; Понятия: идентификатор, литералы, операторы, зарезервированные и ключевые слова, ключ (уникальный и неуникальный), индекс, фильтр, запрос, таблица, база данных и т.д; Синтаксис структур SQL

Практические задания: Создайте SQL запросы для: создания таблицы с параметрами: id - ключевое поле (счетчик); fio - строковое поле для хранения данных “ФИО”; klass - строковое поле для хранения данных “класса ученика”; создайте запрос для добавления 5 строк в созданную таблицу; создайте запрос для изменения данных 2-х строк в таблице; создайте запрос для удаления строк из таблицы; создайте запрос для удаления из БД, созданной Вами таблицы.

Методические рекомендации по изучению темы. При изучении этой темы необходимо делать акцент на использование функционала баз данных и SQL для систематизации, обработки и представления данных образовательных учреждений. В качестве примера можно использовать списки класса и оценки, базы знаний, содержащие справочную информацию

Содержание компетентностно-ориентированного задания №6

Описание проблемной ситуации. Классному руководителю регулярно приходится работать со списком учеников класса из 10 человек. Информация состоит из ФИО ученика, его адреса и номера телефона.

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

Форма представления отчета по КОЗ: Для оценки необходимо предоставить SQL скрипты по всем перечисленным функциям.

Тема 7. Основы PHP (Personal Home Page Tools).

Краткое содержание лекции 7. Переменные, константы, операторы и комментарии, основные конструкции языка, массивы и списка, доступ к базам данных MySQL, работа с файлами и формами.

Вопросы для обсуждения : PHP возможности использования при разработке школьных занятий по информатике; Место PHP среди других языков программирования; Особенности разработки программ на PHP; Особенности синтаксиса языка; Схожесть и отличия основных структур языка PHP с другими объектно-ориентированными языками программирования; Перспективы использования PHP.

Практические задания: Напишите на PHP консольную программу (одну или несколько), в которой будут использоваться: условный отбор if, циклы for и while, switch-cas; Напишите консольную программу, запрашивающую у пользователя список класса с данными: ФИО, а затем выводит на экран этот список при помощи цикла for, затем командой List. Усовершенствуйте программу путем добавления сортировки элементов массива; Напишите консольную программу, показывающую технологию работы с массивами (добавление, удаление элементов, упаковка переменных в массив, сложение массивов); Разработайте скрипты для: подключения к

БД; выборки и вывода в html (экран) списка полученных данных; добавления данных в таблицу; Удаления данных из таблицы.

Методические рекомендации по изучению темы. Основные понятия этой темы целесообразно изучать сопоставляя со знаниями студентов о других языках программирования. Это позволит систематизировать понятия связанные с языками и методами программирования. Первое знакомство с методами программирования на языке PHP осуществляется методом изучения работы консольных приложений, после освоения этой темы происходит переход к Web-программированию. Для начального этапа изучения можно использовать FarManager и Total Commander, как средства редактирования скриптов и выполнения их в консоли. Завершающим этапом изучения Web-программирования языке PHP должно стать изучение взаимодействия Web-приложения и MySQL.

Содержание компетентностно-ориентированного задания №7

Описание проблемной ситуации. Есть набор скриптов, разработанный в КОЗ№6. Использование их при помощи утилит SQL сервера неудобно.

Формулировка задания. Предложите способ, позволяющий реализовать работу со справочником при помощи Web-интерфейса. Реализация должна быть на PHP.

Форма представления отчета по КОЗ: Для оценки необходимо предоставить скрипты на PHP, реализующие работу со всеми sql файлами КОЗ№6,

Тема 8. Технологии Content Manager Software (Moodle, Joomla)

Краткое содержание лекции 8. Понятие cms, основные модули cms: блог, новости, форум, опросы, и др. Безопасность и разграничение доступа. Методы администрирования сайта. Backup и восстановление сайта. Импорт и установка содержимого сайта. Использование хостингов, предустановленное и установленное ПО.

Вопросы для обсуждения : Трудности в создании и администрировании Web-серверов в ручном режиме. Существующие методы в организации работ связанных с управлением содержимым Web-сайтов. Виды CMS (универсальные, учебные, новостные и т.д.). Возможности расширения CMS при помощи плагинов. Способы “разворачивания” своих Web-серверов на хостингах.

Практические задания: На установленный локально Web-сервер или на любом доступном хостинге “разверните” сервер Moodle. Настройте его на работу класса с 5-ю учащимися. Создайте курс с использованием различного вида компонентов для организации учебного процесса. Аналогично первому заданию разверните CMS Joomla. Русифицируйте и настройте на работу двух пользователей. Организуйте заполнение под их учетными записями данных в: статьи; ссылки; галерею изображений. Установите и проведи бекап данных вашего сервера при помощи ПО PHPMyAdmin

Методические рекомендации по изучению темы: При изучении данной темы необходимо акцентировать внимание на правовом аспекте использования модулей и плагинов сторонних производителей, возможностях использования CMS для автоматизации работ по разработке и поддержанию сайтов образовательных учреждений. На занятии необходимо рассмотреть виды CMS и возможные сферы их использования в образовательном учреждении. В случае недостаточной обеспеченности компьютерной техникой допустимо использование бесплатных хостингов типа hostifree.ru или 3owl.com. На этих сайтах есть возможность бесплатной установки и разворачивания старых версий CMS Joomla, Moodle, а также многих других компонентов.

Содержание компетентностно-ориентированного задания №8

Описание проблемной ситуации. Школьный Web-сервер должен публиковать массу различного материала. Сервер построен на основе Joomla.

Формулировка задания. Предложите способ структурировать, хранить и предоставлять доступ к информации на примере информации, приготовленной к занятиям КОЗ №2-№7, которую разместите на Web-сервере.

Форма представления отчета по КОЗ: Для оценки необходимо предоставить разработанный ресурс на основе joomla с опубликованными html страницами и скриптами разработанными в КОЗ №2-№7. Информация должна быть структурирована по разделам.

Таким образом по каждой теме дисциплины «Web-программирование» для бакалавров профиля «Информатика и информационные технологии в образовании» разработано: краткое содержание лекций, теоретический и практический блок, компетентностно-ориентированные задания, методические рекомендации по изучению темы.