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

Учебные часы

Лекции 16 ч.

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

Экзамен.

Зачетная неделя с 6 по 11 июня. 

Сессия с 13 по 25 июня.



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

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

Часть 1. Верстка методом Flexbox

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

Предварительно изучите метод верстки 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

Часть 2. PHP и MySql

1. Выполнить уроки 1, 2, 3, 5 по PHP и MySql из раздела Учебные курсы - Уроки PHP и MySQL. Урок 5 должен быть размещен на бесплатном хостинге. Рекомендуется хостинг https://beget.com/ru/free-hosting

2. Пройти тест по урокам PHP и MySQL 1, 2, 3, 5 в системе Таймлайн. 

3. Выполнить контрольную работу 1 по PHP "Шаблон сайта" по вариантам. Варианты по фамилиям см. внизу этой страницы. Варианты HTML-шаблонов скачайте здесь.

Требования к контрольной работе 1:

HTML-шаблон сайта перевести на PHP. Требования к php-сайту:
- блоки сайта, общие для всех страниц сайта должны включаться в web-страницу с использованием функции include();
- включаемых блоков должно быть не менее трех: верхнее меню, боковое меню, подвал;
- на php-сайте создать не менее трех взаимосвязанных гиперссылками страниц с разным содержимым основного (изменяемого) контента.

4. Выполнить контрольную работу 2 по PHP и MySQL по вариантам. Варианты можно скачать здесь. Работу разместить на бесплатном хостинге.

 

Часть 3. Изучить CMS Revolution

Выполнить все уроки из раздела «Уроки MODx Revolution». Сайт должен быть размещен на бесплатном хостинге.

 

Часть 4. Итоговая контрольная работа

Создать сайт на свободную тему на CMS Revolution.

Контрольная работа должна быть размещена на бесплатном хостинге. Рекомендуется хостинг 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 MODX Revolution

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

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

 

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

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

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

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

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

В конце семестра – ЭКЗАМЕН – тест по теоретическому материалу (PHP). Лекции приложены в Таймлайн.

Действует рейтинговая система. 

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

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

 

Варианты

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)
22. Попов Кирилл Олегович (вариант 22)
23. Прокин Иван Алексеевич (вариант 23)
24. Прыкин Владимир Владиславович (вариант 24)
25. Султакаев Андрей Игоревич (вариант 25)
26. Сухарев Матвей Павлович (вариант 26)
27. Тарейкина Юлия Александровна (вариант 27)
28. Червякова Ирина Игоревна (вариант 28)
29. Шаньгина Кристина Алексеевна (вариант 29)
30. Юрпалова Анна Максимовна (вариант 30)

 




Темы ВКР

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

  • Интернет-магазин средствами системы управления контентом (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 и др.)»



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