ITMO_ICT_WebDevelopment_2022-2023

Репозиторий для реализации дистанционного обучения по дисциплине "Web-программирование".

Учебный журнал по дисциплине. Тут доступна информация о сроках сдачи работ, о текущей успеваемости студентов и описаны все материалы необходимые для реализации курса.

Составляющие финальной оценки:

• 50 баллов - лабы (их делать обязательно).
• 10 баллов - тесты.
• 20 баллов - дисскусии на практиках (2+ доклада за семестр (оценка складывается из доклада 50% + активности на занятиях 50%)).
• 20 - экзамен.

При выполнении всех лаб по дисциплине в срок + две недели - экзамен-автомат.

Все лабы необходимо сдать до 20 декабря, иначе есть риск, что преподаватель не успеет их проверить.

Если лабораторная работа выполнена не в срок, требуется получить допуск к ее защите. Для допуска необходимо выполнть задания на https://leetcode.com/. 1 неделя просрочки - 1 задание.

Инструкции к использованию полезных материалов

Дополнительные материалы делятся на 3 категории:

1. Для тех, кто считает, что имеет недостаточно базовых знаний об информатике, веб-разработке и сетях (обзначается (+)).
2. Для тех, кто считает, что имеет базовые знания (обзначается (++)).
3. Для тех, кто хочет поглубже изучить материал (обзначается (+++)).

Лекция 1.1 - Концепции разработки веб сервисов.

Презентация с лекции тут.

Допонительные материалы:

1. Иерархия компьютерных информационных систем для разработки сайта (+)
2. Топ-5 наиболее популярных CMS: какую выбрать? (++)
3. Веб-фреймворки: введение для новичков (классификация фреймворков) (++)
4. Чем отличаются фронтенд- и бэкенд-разработка (+)
5. Что такое MVC: базовые концепции и пример приложения (++)

Лабораторная работа 1. Работа с сокетами.

Важное сообщение для тех, кому "препод опять втирает какую-то ненужную лабу непонятно про что". Эта лабораторная работа и заданя в ней помогут Вам понять, как происходит сетевое взаимодействие в вебе, и не только. Сокеты используеются всегда, при любом сетевой взаимодействии. Если Вы будете веб-разработчиком, Вам придется работать с средствами, которые их используют (100%) и настраивать их в ручную (очень вероятно).

Лекция с практики
Текст работы

Срок сдачи: 25.09.2022 (включительно). Вес работы в баллах – 12,5. Выполнение пунктов 1-5 - 100%. После срока сдачи максимальный бал 6.

Сдача работы №1

Полученную модель, код и отчет залить в папку репозитория students/группа/laboratory_works/фамилия_имя/laboratory_work_1. Инструкция о загрузке работы ниже. Не забывайте о файле gitignor.

На git должен быть загружен pdf-файл с отчетом, код программамы, где каждая папка соотвествует части работы (task_1, task_2...).

Шаблон имени файла отчета: Фамилия_Имя_группа_№лабы. Отчет должен содержать титульный лист, листинг кода по каждому пункту с комментариями, скрины работы программ.

Как делать пул-реквест описано в разделе Сдача работ

Дополнительный контент к первой лабе

Те студенты, которые хотят получить более обширное представление о работе с конструкторами сайтов, могут пройти этот курс.

Лабораторная работа 2. Реализация простого сайта на django.

Практическая работа №2.1

Цель работы: дать краткое представление о работе Django WEB фреймворка.

Необходимо выполнить все задания с пометкой практическая работа из практической работы №1.
Полученную программу загрузить в папку этого репозитория sutdents/группа/practical_works/фамилия_имя/simple_django_web_project. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Для удобства навигации по практическим работам необходимо открыть меню оглавления (см. скриншоты ниже)

Практическая работа №2.2

Цель работы: дать подробное представление о реализации CRUD(Create, read, update and delete) интерфейсов средствами Django WEB фреймворка.
Необходимо выполнить все задлания с пометкой практическая работа из практической работы №2.
Полученную программу залить в папку этого репозитория sutdents/группа/practical_works/фамилия_имя/simple_django_web_project. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Практическая работа №2.3

Необходимо выполнить все задлания с пометкой практическая работа из практической работы №3.
Полученную программу залить в папку этого репозитория sutdents/группа/practical_works/фамилия_имя/simple_django_web_project. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Лабораторная часть

Реализовать веб сервис, в соответствии с вариантом из задания (студент с порядковым номером 6 в списке группы делает 6 вариант, седьмой - вариант номер 1).
Текст лабораторной работы тут.
Срок сдачи: 20.10.2020 (включительно)

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

Дополнительная оабораторная часть, для тех, кто хочет получить больше опыта.

Чтобы продлить срок, необходимо:

• Реализовать меню (меню с бутсрап - https://www.youtube.com/watch?v=HEPTgggsRgY)
• Реализвать пагинацию страниц (так себе вариант - https://evileg.com/ru/post/10/ , отличный вариант - https://evileg.com/ru/post/237/)
• Внедрить поиск по объектам, с которыми настроена пагинация (https://evileg.com/ru/post/21/)

Полезные материалы

Фундаментально - плейлист уроков по джанго для тех кто хочет фундаментально изучить, как работает джанго веб фремйворк и заниматься этим в будущем.

Базово - плейлист, который позволит быстро понять, как и что работает и сделать лабу.

Сдача работы №2

Все файлы загрузить в папку students/группа/laboratory_works/фамилия_имя/laboratory_work_2. Инструкция о загрузке работы ниже. Не забывайте о файле gitignor.

На git должен быть загружен pdf-файл с отчетом, код программамы.

Шаблон имени файла отчета: Фамилия_Имя_группа_№лабы. Отчет должен содержать титульный лист, описание модели данных, описание контроллеров в файле views, описание роутеров файла urls, скрины работы программы.

Как делать пул-реквест описано в разделе Сдача работ

Лабораторная работа 3. Реализация серверной части на django rest. Документирование API.

Цель работы: овладеть практическими навыками реализации серверной части (backend) приложений средствами Django REST framework.

Лекция 1

Содержание:

• REST и альтернативы. (Лекция 06.11.2020 / Время 00:00 - 00:35)
  
• Django rest framework. (Лекция 06.11.2020 / Время 00:35 - 02:20)
  
• Подробно о формате json. (Лекция 06.11.2020 / Время 02:20 - 03:15)
  
• Сериализация. (Видео по сериализации от Давида)
  

Лекция 2

• Документирование апи
• Виды авторизации (сессии, токены)
• JWT + Использование JWT в Django
• Djoser (DRF + Djoser часть 1. Регистрация, авторизация по токенам, получение и изменение данных пользователя)

Дополнительный контент для тех, кто хочет лучше изучить DRF и работать с ним в будущем::

1. простой курс - плейлист уроков по джанго для тех, кто хочет быстро изучить, как работает работает Django rest framework в связке с vue.js. (Примечание. В уроке 4 изменился путь для получения токена авторизации (см. официальную докумекнтацию Djoser https://djoser.readthedocs.io/en/latest/getting_started.html))
2. более подробный курс, чем в пункте 1

Практическая работа №3.1

Цель работы: получить представление о работе с запросами в Django ORM. Необходимо выполнить все задания с пометкой Практическое задание [из практической работы №3.1] (https://docs.google.com/document/d/1jB8EYOWk-bbjB6sLr1s7dOmLYRC9Z5jIV6xIpnigdvY/edit?usp=sharing). Полученную программу залить в папку этого репозитория sutdents/группа/practical_works/фамилия_имя/simple_drf_project. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Сдача практический работы №3.1: Оформить, как часть документации все задания с пометкой "практическая работа" и сдать Сергею.

Практическая работа №3.2

Цель работы: получить представление об использовании возмжностей работы контроллеров и серриализаторов в Django Rest Framework. Необходимо выполнить все задания с пометкой "Практическое задание [из практической работы №3.2] (https://docs.google.com/document/d/1PkpwxCUYQ2_Pi8Fpcgno6te3oCQHZfkh03Zxt6DhHSw/edit?usp=sharing). Полученную программу залить в папку этого репозитория sutdents/группа/practical_works/фамилия_имя/simple_drf_project. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Практическая работа №3.3

Цель работы: овладеть навыками написания документации к API.
Необходимо выполнить все задания с пометкой "Практическое задание" из практической работы №3.3.
Результаты практики загружаются в репозиторий вместе с лабораторной работой.

Лабораторная часть

Срок сдачи общий для всех групп 28.11.2022

Реализация серверной части приложения средствами django и djangorestframework в соответствии с заданием из текста работы.

Порядок выполнения работы:

1. Выполнить Практические работы 3.1 и 3.2
   
   
2. Выбрать вариант или предложить свой, есть 3 способа:
   2.1. Предложить свой вариант.
   2.3. Выбрать вариант из вариантов по курсу «Основы баз данных» (https://drive.google.com/file/d/174gPjJ7AOHfzteYcobPY0x7sFBTkN1Xx/view?usp=sharing).
   2.3. Использовать вариант из курса Давида по фронтент-разработке. 2.4. Если хочется сделать что-то полнофункциональное для порфтолио и задеплоить, можно поговорить с Антоном Игореувичем и он предложит несколько важных для него тем (при этом варианте шаги по работе чаще нужно будет согласовывать с преподавателями). По любому из способов функционал нужно согласовать с преподавателем или ментором. В лабораторной работе №4 необходимо будет реализовать клиентскую часть(фронтенд) по этому же варианту.
   
   
3. Реализовать модель базы данных средствами DjangoORM (согласовать с преподавателем на консультации).
   При необходимости, студент может согласовать модель базы данных с преподавателем и только потом приступить к описанию модели средствами Django ORM
   Полезные материалы:
   
   • Создание модели данных в Django ORM (Видео)
     
     
   • 3.1
4. Реализовать логику работу API средствами Django REST Framework (используя методы сериализации).
   Полезные материалы:
   
   • Пункты 4, 5, 6 в Практической работе 3.1
     
   • DJANGO API VIEWS, GENERICS, FILTER (Видео)
     
   • JSON. Сериализация данных. Пишем свой сериализатор. Разбираем Django REST Framework Serializers (Видео)
     
   • Работа с Django ORM (Видео)
     
     
5. Подключить регистрацию / авторизацию по токенам / вывод информации о текущем пользователе средствами Djoser.
   Полезные материалы:
   
   • Djoser (DRF + Djoser часть 1. Регистрация, авторизация по токенам, получение и изменение данных пользователя) (Видео)
     
     
6. Выполнить практическую работу 3.2 по оформлению документации (в процессе разработки)
   
   
7. Реализовать документацию, описывающую работу всех используемых endpoint-ов из пункта 3 и 4 средствами Read the Docs или MkDocs.
   
   Полезные материалы:
   • Пункт 3 из практической работы №3.2

Работа выполняется индивидуально.
Код практический и лабораторной части должен быть загружен в репозиторий курса, в соответствии с инструкциями тут.
Работу необходимо защитить на консультации или прислать видео с описанием проделанной работы.

Сдача работы №3

Работа выполняется индивидуально.

Этап 1

Полученную программу залить в папку этого репозитория sutdents/группа/laboratory_works/фамилия_имя/laboratiry_work_3. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Этап 2

Работу необходимо защитить лично или прислать видео с описанием проделанной работы.

Лабораторная работа 4. Реализация клиентской части средствами Vue.js.

Практическая работа №4.1

Цель работы: Ознакомится с базовыми конструкциями JavaScript. Текст "Практической работы №4.1 (сдавать не нужно, можно не делать, если базово знаете JS).

Практическая работа №4.2

Цель работы: получить представление о работе Vue.js. Текст "Практической работы №4.2.

Практическая работа №4.3

Цель работы: получить практические навыки настройки CORS (Cross-origin resource sharing). Текст "Практической работы №4.3.

Лабораторная часть

Срок сдачи День консультации перед экзаменом

Реализация клиентской части приложения средствами vue.js.

Порядок выполнения работы:

1. Выполнить практическую работу 4.1 Базовые конструкции языка JavaScript). (https://docs.google.com/document/d/1lurVq_ddbKQ-rORvxF3T9PlPPy-sOgHwFazCI0yEqYY/edit?usp=sharing)
2. Выполнить практическую работу 4.2. Работа с Vue.JS. (https://docs.google.com/document/d/1kSXkW6Vcis8z-TunNALcapCVmMHps3jaDdIP4rZkV9E/edit?usp=sharing)
3. Настроить для серверной части, реализованной в лабораторной работе №3 CORS (Cross-origin resource sharing) в соответствии с Практической работой 4.3
4. Утвердить с одним из преподавателей список интерфейсов для взаимодействия с серверной частью в соответствии с вашей предметной областью (это очень важный пункт, тк бывает такое, что не все студенты понимают суть своих вариантов).
5. Реализовать интерфейсы авторизации, регистрации и изменения учётных данных и настроить взаимодействие с серверной частью. Полезные материалы:
   
   • Настройка авторизации средствами Vue.js и Django REST framework (DjangoSchool) (ссылка)
     
6. Реализовать клиентские интерфейсы и настроить взаимодействие с серверной частью (интерфейсы из пункта 4). Полезные материалы:
   
   • Пункты 4.2, 4.3, 4.5 в Практической работе 4.2
     
   • Уроки 6, 7 и 10-13 из данного плейтиста (DjangoSchool) (ссылка)
7. Подключить vuetify или аналогичную библиотеку. Полезные материалы:
   
   • Пункт 3.1 в Практической работе 4.2
     
8. Реализовать документацию, описывающую работу разработанных интерфейсов средствами MkDocs.

Сдача работы №4

Работа выполняется индивидуально.

Этап 1

Полученную программу залить в папку этого репозитория sutdents/группа/laboratory_works/фамилия_имя/laboratiry_work_4. Инструкция о загрузке работы ниже. Не забывайте о файле gitignore.

Этап 2

Работу необходимо защитить лично или прислать видео с описанием проделанной работы.

Сдача работ

Для сдачи работы в связи с переходом на дистанционную форму обучения введены дополднительные правила игры.

Все отчеты сохраняются в pdf (документы и презентации).

Все студенческие работы хранятся в папке Students Для сдачи работы необходимо:

1. Зарегистрироваться на Git.
2. Сделать форк репозитория с заданиями в свой аккаунт (на странице https://github.com/TonikX/ITMO_ICT_WebDevelopment_2022-2023 кнопка fork справа, сверху).
3. Установить Git на компьютер.
4. Открыть папку, где хранятся Ваши проекты. В контекстом меню нажать "Open Git Bash here". Склонировать форкнутый репозиторий на комьютер (git clone https://github.com/ваш аккаунт/ITMO_ICT_WebDevelopment_2022-2023).
5. В файловой системе Вашего компрьютера в склонированном репозитории создать в папке students/группа Вашу личную папку в формате Фамилия_Имя латиницей (Пример students/k3340/Petrov_Vasya).
6. В личной папке сделать подпапку с текущей работой в формате lr_номер (Пример students/k3340/Petrov_Vasya/Lr1).
7. Записать в папку отчетные материалы.
8. Сделать коммит, описать его адекватно (Пример "был добавлен файл перезентация_петров.pdf"). Набрать команлы git add и git commit -m "название комита".
9. Сделать push в Ваш форкнутый репозиторий (git push).
10. Сделать пул-реквест в репозиторий преподавателя из вашего форкнутого, описать его. Структура заголовка пулреквеста: Фамилия_Имя-Работа_Номер (Пример: Петров_Василий-Лабораторная_работа_1).

Пользуйтесь этой инструкцией, у нас нет веток с заданиями, как тут, но Вам поможет. Все работы сдаются средствами создания Pull Requests в папку students в этом репозитории.

Еще один мануал о том, как сделать Pull Request описано тут.