Файл: Лекции (ак ч) Содержание лекций Практ занятия (ак ч.).docx
ВУЗ: Не указан
Категория: Не указан
Дисциплина: Не указана
Добавлен: 22.11.2023
Просмотров: 16
Скачиваний: 2
ВНИМАНИЕ! Если данный файл нарушает Ваши авторские права, то обязательно сообщите нам.
Наименование темы | Лекции (ак.ч) | Содержание лекций | Практ. занятия (ак.ч.) | Содержание практических занятий | Самост. работа (ак.ч.) | Содержание самостоятельной работы |
Тема 1. Как работает интернет? | 2 | Интернет. HTTP. Браузер. Доменные имена. Хостинг. DNS. Основы алгоритмизации: алгоритмы ветвления и циклы. | | | | |
Тема 2. HTML-документ: структура, разметка текста | 1 | Язык гипертекстовой разметки. Структура HTML-документа. | 1 | Создание HTML-файла. Разметка текста. | - | |
Тема 3. Изображения на веб-странице | 1 | Тег и его атрибуты. Форматы веб-графики. Карта изображения с активными областями (теги | 1 | Вставка изображения ( , | - | |
Тема 4. Среда разработки или веб-редактор | 1 | Типы веб-редакторов. Сравнительная характеристика популярных веб-редакторов. | 1 | Инструменты вебредактора. Подбор вебредактора. | | |
Тема 5. Списки на вебстранице | 1 | Неупорядоченные списки. Упорядоченные списки. Вложенные списки. Списки определений. | 1 | Создание списков в HTML. | | |
Тема 6. Спецсимволы HTML | 1 | Полезные знаки и символы. Знаки пунктуации. Стрелки. Правила применения. | 1 | Вставка специальных символов при помощи HTML. | - | |
Тема 7. Создание таблиц | 1 | Таблицы в HTML. Строки. Ячейки. Понятие табличной вёрстки и её недостатки. | 1 | Создание таблицы в HTML. | - | |
Тема 8. Гиперссылки | 1 | Гипертекст. Гиперссылки. Тег и его атрибуты. | 1 | Вставка гипертекста и создание гиперссылки. | - | |
Тема 9. Что такое CSS. Основные свойства CSS и их значения | 1 | Что такое CSS. Виды селекторов CSS. Основные свойства CSS и их значения. Боксовая модель в CSS. | 1 | Подключение CSS к вебстранице. | | |
Темы 10. Позиционирование и интересные CSS- эффекты | 2 | Позиционирование. Псевдокласс :hover. Контекстные селекторы. Свойство display. | 2 | Применить CSS-эффекты (тени и скруглённые углы). | | |
Тема 11. Блочная модель | 1 | Блочные и строчные элементы HTML. Свойства CSS, использующиеся для блочной вёрстки. | 1 | Применить блочные и строчные элементы HTML. | - | |
Тема 12. Приёмы и шаблоны вёрстки | 2 | Типы макетов веб-страниц. Шаблоны вёрстки для распространенных типов макетов. | 3 | Применить приёмы и шаблоны вёрстки («резиновая» и фиксированная вёрстка). | 3 | Самостоятельная работа направлена на повторение пройденного материала. |
Аттестация по итогам модуля 1. | | | | | 4 | Тест на знание HTML и CSS. Практическое задание: создание веб-страницы по образцу. |
Тема 1. Проектирование сайта | 1 | «Силуэт» сайта. Модульная сетка сайта. Элементы вебстраницы. | 1 | Проектирование дизайна сайта. | - | |
Тема 2. Основы вебдизайна | 2 | Что такое веб-дизайн. Основные принципы вебдизайна. Базовые элементы дизайна. Принципы создания композиции. Стили веб-дизайна. Особенности веб-графики. | | | | |
Тема 3. Разработка дизайна сайта | 2 | Инструменты для создания макетов сайта. Работа со стоками изображений и графическими редакторами. | 2 | Разработка дизайн-макета сайта. Экспорт графических элементов. | | |
Тема 4. Вёрстка сайта по дизайн-макету | 2 | Фоновые изображения CSS. Управление слоями. Таблица веб-цветов. | 2 | «Нарезка» дизайн-макета. | - | |
Тема 5. Семантическая вёрстка | 1 | Почему семантика важна. Семантические теги HTML. | 1 | Создание семантической разметки по макету. | - | |
Тема 6. Система контроля версий Git | - | | 4 | Установка Git. Создание репозитория. Внесение и | - | |
| | | | индексация изменений. Коммит изменений. Работа с репозиториями. Расшаривание репозиториев. | | |
Тема 7. Размещение вебсайта в сети | 1 | GitHub Pages. Создание сайта. Настройка источника публикации. Управление собственным доменом. Отмена публикации. | 1 | Практическая работа, направленная на создание сайта | | |
Тема 8. Адаптивный дизайн | 1 | Понятие адаптивного макета. Фактор юзабилити. Адаптивная вёрстка и мобильная версия. | 1 | Практическая работа по созданию адаптивного макета сайта | | |
Тема 9. Анимации CSS | 1 | Простые анимации CSS. CSS-переходы. Конфигурация анимации. | 1 | Практическая работа по созданию простой анимации в CSS | 2 | Самостоятельная работа направлена на повторение пройденного материала. |
Аттестация по итогам модуля 2. | | | | | 10 | Проектирование и разработка небольшого сайта. |
Тема 1. Введение в JavaScript | 1 | Что такое JavaScript. Особенности JavaScript. Подключение JavaScript к веб-странице. | | | | |
Тема 2. Переменные и типы данных | - | | 1 | Структура кода. Переменные. Типы данных. Преобразование типов. | - | |
Тема 3. Базовые операторы | - | | 1 | Математические операторы. Операторы сравнения. Логические операторы. | - | |
Тема 4. Условное ветвление | | | 2 | Условный оператор if-else. Условное ветвление. Тернарный условный оператор. | | |
Тема 5. Конструкция switch | - | | 1 | Оператор switch. Группировка case. Сравнение с if. | - | |
Тема 6. Циклы | | | 2 | Цикл while. Цикл do-while. Цикл for. Прерывание циклов. Переход к следующей итерации. | | |
Тема 7. Функции | | | 4 | Объявление функции. Параметры функции. Возврат значения. Локальные и глобальные переменные. | | |
Тема 8. Качество кода | - | | 4 | Отладка в браузере. Стиль кода. Комментарии. | - | |
Тема 9. Объекты: основы | | | 4 | Объекты. Методы объектов, this. Конструкторы, создание объектов. Сборка мусора. | | |
Тема 10. Структуры данных | - | | 3 | Массивы. Перебираемые объекты. Сложные структуры данных. | 3 | Самостоятельная работа направлена на повторение пройденного материала. |
Тема 11. Работа с DOM | | | 4 | DOM-дерево. Навигация по DOM-элементам. Атрибуты и свойства. Способы взаимодействия с пользователем. События. Динамическое изменение документа | | |
Аттестация по итогам модуля 3. | | | | | 6 | Реализация работоспособного веб-приложения. |
Тема 1. Веб-безопасность | 2 | Преимущества HTTPS перед HTTP. Основные виды атак веб-приложений. Межсайтовый скриптинг. Политика безопасности содержимого. Проверка входящих данных. | | | | |
Тема 2. Препроцессоры CSS | | | 8 | Что такое препроцессоры. Переменные. Вложенность. Миксины. Наследование селекторов. | | |
Тема 3. Шаблонизаторы HTML | | | 4 | Создание шаблонов. Создание компонентов. Работа с данными. Интерактивность: условные выражения и циклические конструкции. | | |
Тема 4. Пакетные менеджеры и бандлеры | | | 2 | Обзор менеджеров пакетов и сборщиков для приложений на JavaScript. Установка и настройка. Базовые понятия. | | |
Тема 5. Изучение фреймворка | | | 8 | Выбор фреймворка. Библиотека. Компоненты. События. Управление состоянием. Формы. API- вызовы. Маршрутизация. | 8 | Самостоятельная работа направлена на повторение пройденного материала. |
Аттестация по итогам модуля 4. | - | | - | | 4 | Модульные, интеграционные и функциональные тесты. |
Итоговая аттестация | - | | - | | 16 | Итоговая аттестация |