ИТм-406. «Web-программирование». Весна 2022

Учебные часы

Лабораторные работы 16 ч.

Курсовая работа

Экзамен.

Зачетная неделя с 28 марта по 2 апреля. 

Сессия с 4 по 16 апреля.


Задание по дисциплине на весенний семестр 2022 г.

(в аудитории при себе всегда иметь наушники, чтобы можно было просмотреть видео)

 

1. Выполнить практическую часть.

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

Предварительно изучите метод верстки web-страниц на Flexbox. Теоретический материал (теория flex-верстки – разное изложение материала):

  • https://tproger.ru/translations/how-css-flexbox-works/
  • https://html5book.ru/css3-flexbox/
  • https://developer.mozilla.org/ru/docs/Learn/CSS/CSS_layout/Flexbox
  • Тренажер по флексбоксу  https://flexboxfroggy.com/#ru

Установите современный текстовый редактор для web-разработки на выбор:

- SublimeText и все необходимые плагины (инструкцию см. на этой странице)

- можете воспользоваться портабельной версией SublimeText можно скачать здесь.

- или можно установить Visual Studio Code (инструкцию см. в файле «Настройка_VSC_структура_HTML-5.mkv»). В этом же файле см. как использовать VSC и создание структуры документа HTML-5

Клавиатурные сокращения для плагина EMMET см. в соответствующих файлах.

2. Выполните уроки из видео 1_Flexbox_часть_1.mkv и 1_Flexbox_часть_2.mkv. Для задания в конце урока исходные файлы расположены в папке 1 lesson cleer.

3. Выполните видеоуроки из папки Flex-итоговый проект. Скачать можно здесь

4. Выполните контрольное задание - создайте адаптивный макет на Flexbox на основе шаблона PSD согласно своему варианту. 

Ссылки на макеты:

Контрольное задание по Flex верстке «Создание адаптивного шаблона на основе PSD-шаблона».
Варианты 1-15

Контрольное задание по Flex-верстке «Создание адаптивного шаблона на основе PSD-шаблона».
Варианты 16-30

Варианты

1. Бутакова Екатерина Романовна (вариант 1)
2. Вагин Максим Александрович (вариант 2)
3. Веретенова Наталья Романовна (вариант 3)
4. Герцев Кирилл Сергеевич (вариант 4)
5. Динза Эрнандес Даяна Вальфридовна (вариант 5)
6. Дубровский Александр Владимирович (вариант 6)
7. Исмаилов Роман Русланович (вариант 7)
8. Клименкова Ксения Владимировна (вариант 8)
9. Климова Алиса Андреевна (вариант 9)
10. Коренюгин Степан Андреевич (вариант 10)
11. Красодымский Владимир Николаевич (вариант 11)
12. Лушников Дмитрий Игоревич (вариант 12)
13. Митракова Виктория Викторовна (вариант 13)
14. Наумов Александр Геннадьевич (вариант 14)
15. Новиков Вячеслав Кириллович (вариант 15)
16. Сайфутдинова Александра Рустамовна (вариант 16)
17. Саламонов Александр Андреевич (вариант 17)
18. Терентьева Анна Андреевна (вариант 18)
19. Третьяков Александр Дмитриевич (вариант 19)
20. Черепков Константин Сергеевич (вариант 20)
21. Шило Ольга Дмитриевна (вариант 21)

2. Выполнить курсовую работу  – создать сайт на любой CMS на свободную тему.

Курсовая работа должна быть размещена на бесплатном хостинге. Рекомендуется хостинг https://beget.com/ru/free-hosting

Этапы работы:

Этап 1. Структура и контент. Выбрать тему сайта, создать структуру сайта, можно в виде вложенного списка. 

Минимальная структура:

  • Главная страница с адаптивным слайдером
  • Раздел 1
    • раздел 1.1
    • раздел 1.2
  • Раздел 2
    • раздел 2.1
    • раздел 2.2
  • Контакты с формой обратной связи и картой Google или Яндекс.
  • Карта сайта для пользователей.
  • Карта сайта для поисковых систем.

Собрать контент для сайта: тексты, фото, видео.

Этап 2. Создать прототипы страниц. Прототипов должно быть два: для главной страницы и для типовой. При проектировании дизайна предусмотреть наличие адаптивного слайдера на главной странице.

Ознакомительные материалы по прототипам можно скачать по адресу https://yadi.sk/d/50wX34eQwJvJkA 

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

Прототип можно сделать в цветном или черно-белом варианте, в графической программе или аккуратно от руки на выбор. Обязательно должны быть подписи к блокам. Примеры прототипов приведены ниже. Щелкните по изображению для увеличения.

Прототип сайта

Этап 3.  Согласно прототипам создать дизайны в Figma. Для этого необходимо зарегистрироваться на сайте Figma.com

Технологии Figma изучить самостоятельно. Обучающие материалы можно скачать по адресу https://yadi.sk/d/UbaEJrsltCUMww

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

Этап 4.  По дизайнам в Figma создать два HTML шаблона (для главной страницы и для типовой), адаптивные под различные устройства методом Flexbox.

Этап 5. Реализовать HTML-шаблоны на CMS по выбору.

Этап 6. Реализовать структуру сайта и наполнить сайт контентом.

Одним из важнейших критериев при оценке сайта будет проверка возможности работать контент-менеджеру без HTML-кода. Т.е. все тексты, изображения, видео должны иметь возможность вставки на сайт без использования знаний HTML.

Этап 7. Написать пояснительную записку. Скачать требования к оформлению ПЗ. Сделать презентацию. Скачать шаблон презентации

3. Написать научную статью по теме web-технологий.

Требования к статье:

- не менее 5 страниц;

- оригинальность не менее 70%. Проверяется преподавателем в системе "Антиплагиат. Вуз";

- форматирование согласно требованиям  к оформлению статей.  Скачать шаблон статьи. Скачать правила оформления источников

В конце семестра – ЭКЗАМЕН 

Оценка за экзамен будет выставлена согласно набранным баллам. Действует рейтинговая система. 

Критерии оценки:

  • 55-70 баллов – «Удовлетворительно»
  • 71-85 баллов – «Хорошо»
  • 86-100 баллов - «Отлично»




Темы ВКР

Для групп «Информационные технологии в медиаиндустрии»

  • Интернет-магазин средствами системы управления контентом (CMS по выбору Joomla, WordPress, MODx и др.)
  • Web-сайт компании средствами системы управления контентом (CMS по выбору Joomla, Wordpress, MODx и др.)

Для групп «Компьютерные технологии»

  • Web-сайт компании средствами системы управления контентом (CMS по выбору Joomla, Wordpress, MODx и др.) + электронное руководство
  • ЭУП «Создание сайта средствами CMS MODx Revolution»
  • ЭУП «Создание сайта средствами CMS MODx Evolution»
  • ЭУП «Создание сайта средствами CMS Drupal»
  • ЭУП «Создание интернет-магазина средствами CMS MODx»
  • ЭУП «Создание интернет-магазина средствами CMS Wordpress»
  • ЭУП «Создание интернет-магазина средствами CMS OpenCart (или ocStore)»
  • ЭУП «Адаптивная верстка web-сайта»
  • ЭУП «Создание сайта средствами PHP и MySQL»
  • ЭУП «Язык jQuery»
  • ЭУП «Верстка многостраничных изданий в Adobe InDesign»
  • ЭУП «Графический редактор Adobe Illustrator»
  • ЭУП «SEO-оптимизация и продвижение сайта в сети Интернет»
  • ЭУП «Препроцессор Less - динамический язык стилей»
  • ЭУП «Фреймворк Yii»
  • ЭУП «Дизайн сайтов в программе Figma»

Для групп «Информационная безопасность»

  • Обеспечение безопасности веб-сайта компании (создание сайта + безопасность)
  • ЭУП «Web-программирование и защита в среде Интернет»
  • ЭУП «Средства защиты web-сайта на CMS (WordPress, Joomla, MODx и др.)»



Информация для студентов РГППУ