Веб-разработка – одно из самых востребованных направлений программирования. Какую бы профессию ни выбрал ваш ребенок в будущем, умение создавать сайты точно пригодится в будущем!
На этом курсе ученики освоят работу с HTML, CSS, языком программирования JavaScript и популярным фреймворком jQuery. Ребята научатся верстать веб-страницы и освоят азы веб-дизайна. В результате подростки подготовят свои индивидуальные digital-проекты — полноценный сайт, размещённый на хостинге, и веб-приложение с адаптивной вёрсткой.
Цели курса “Создание сайтов для детей”:
- Познакомиться с особенностями построения сайтов на основе HTML5.
- Научиться создавать собственные стили СSS и пользоваться популярными CSS-фреймворками.
- Овладеть основами программирования на языке JavaScript, позволяющими оживить сайт.
Под руководством опытного преподавателя ученики разработают сайт о любимой игре, супергерое, музыканте или о чем угодно.
Программа курса
1 модуль. Программирование HTML и CSS
Курс будет полезен тем, кто хочет изучить основы веб-разработки. Вы освоите основные понятия и получите представление о том, как устроены сайты и как они разрабатываются. На занятиях мы познакомимся с языком гипертекстовой разметки HTML как с основой любого сайта и добавим веб-страницам индивидуальности с таблицами стилей CSS.
Результат занятий:
- Создадим свои первые веб-страницы с надписями, таблицами, картинками и ссылками;
- Научимся управлять как текстом, так и отдельными элементами страницы, создадим анимацию;
- Узнаем, как сделать сайт более удобным для экранов разной ширины;
- По итогу курса разработаем небольшой сайт и разместим его в сети интернет.
Методический план модуля:
- Знакомство с HTML;
- Форматирование текста веб‐страницы;
- Списки, графика и ссылки;
- Разметка веб‐страниц с помощью таблиц;
- Основы CSS;
- Управление шрифтом;
- Управление элементом;
- Дополнительные свойства CSS;
- Трансформация элементов;
- Анимация элементов;
- Адаптивная верстка;
- Размещение сайта в сети.
2 модуль. Программирование JavaScript
Вы освоите основные понятия и типы данных, и научитесь писать алгоритмы для решения поставленных задач и реализовывать их на языке программирования JavaScript.
Данный курс будет полезен не только тем, кто хочет научиться писать свои скрипты на языке JavaScript, но и тем, кто начинает изучать программирование.
На занятиях мы познакомимся со всеми основными конструкциями языка JavaScript и разберем практические задачи, которые решаются с их помощью.
Результат занятий:
- Создадим свои первые скрипты как для выполнения простых арифметических операций, так и для более сложных задач.
- Научимся использовать различные типы данных, познакомимся с сортировкой.
- Разберемся с такими понятиями, как алгоритм, цикл и ветвление.
- Узнаем, как сделать сайт более интерактивным, добавив реакции на определенные действия в браузере.
- По итогу курса мы разработаем небольшое браузерное приложение для решения уравнения и визуализации его в виде графика.
Пример занятия:
На занятии знакомимся с браузерными инструментами разработчика и отладкой программы на простых примерах. Затем, с помощью полученных знаний, создаем функцию для автоматического расчета координаты при равноускоренном движении прямо в браузере, а также функцию для добавления своей подписи к письму.
Методический план модуля:
- Знакомство с JavaScript;
- Условия в JavaScript;
- Циклы в JavaScript;
- Массивы;
- Объекты;
- JQuery;
- Математические функции;
- Сортировки;
- Множества и сравнение массивов;
- Библиотека Vue.js;
- События и переходы;
- Рекурсия.
3 модулью. Библиотека React — JavaScript
Модуль “Веб Программирование 3 – ReactJS” познакомит учеников с одной из самых популярных JavaScript-библиотек, разработчиком которой является компания Facebook. Данная библиотека используется для упрощенной разработки высокоскоростных одностраничных сайтов, целью которой является создание как небольших веб-приложений, так и больших проектов со сложной структурой.
На занятиях ребята приобретут навыки:
- работы через командную строку;
- создания интерактивных пользовательских интерфейсов;
- разработки гибких веб-сайтов;
- более удобного распределения блоков сайта на логические части.
По завершении модуля ученики будут знать, как с помощью ReactJS динамически изменять страницу, используя в одном файле одновременно HTML и JavaScript, методы жизненного цикла, позволяющие разработчику в нужный момент запускать на сайте разные процессы, включая анимацию, переходы, всплывающие окна и другие особенности данной библиотеки.
Пример занятия:
Ученики создают информационные блоки, грамотно распределяя их на сайте. Позже осуществляют динамический переход по вкладкам.
Методический план модуля:
- ReactJS. Создание первого веб-приложения;
- Создание компонентов;
- Props;
- Классовые компоненты. State;
- CSS-модули;
- CSS Grid;
- Route;
- NavLink;
- Работа с данными ч.1;
- Работа с данными ч.2;
- Подготовка к защите проекта на ReactJS;
- Защита проекта на ReactJS.