«Бекитемин»

«Мээрим» БББн директору

______________А.Чотолоева

«___»______________2023ж.

Календарный план по IT(програмирование) кружку на 2023-2025 учебный год

№ Тема урока Цель и задача Используемые Часов Приблизительная Фактическая

тех. оборудование дата дата
Прак- 1 2 3 4 5 1 2 3 4 5
тика
1 Введение в HTML Что такое HTML и его роль в Интернет и 2
веб-разработке. компьютер

Основные теги и структура

веб-страницы.
2 Работа с текстом и ссылками Заголовки, абзацы и списки. 2
в HTML
Гиперссылки и создание
навигации.
3 Изображения и мультимедиа Вставка изображений. 2
в HTML
Оптимизация мультимедиа для
веба.
4 Основы CSS Введение в CSS и его роль в 2
стилизац веб-страниц.

Применение стилей к тексту и

фону.
5 Работа с цветами и Изменение цвветов и фоновой 2
шрифтами в CSS графики.

Выбор и применение шрифтов.

6 Модель блоков в CSS Box model и его свойства 2
(margin,padding,border).

Создание блочных элементов

7 Позиционирование и верстка Относительное и абсолютное 2
в CSS позиционирование.

Создание простых макетов с

использованием CSS.
8 Flexbox и Grid Layout в CSS Введение в Flexbox и Grid для 2
сложных макетов.

Создание гибких и сетчатых

макетов.
9 Формы в HTML и их Создание различных видов 2
стилизация форм.

Стилизация форм с
использованием CSS
10 Псевдоклассы и анимации в Использование псевдоклассов 2
CSS для стилизации состояний элем.

Создание анимаций с помощью

CSS
11 Резиновый и адаптивный Принципы резинового и 2
дизайн адаптивного дизайна.

Медиа-запросы и адаптация
макетов под разные устройства.
12 Оптимизация и завершение Оптимизация 2
проекта производительности веб-
страницы.

Тестирование, откладка и
публикация проекта.
13 Введение в JacaScript Что такое JavaScript 2

Роль JavaScript в веб-

разработке
14 Основы JavaScript Переменный и типы данных. 2
15 Операторы и выражения Арифметические, 2
сравнительные и логческие
операторы
16 Управление потоком Условные операторы(if, else if, 2
выполнения switch).

Выполнение различных действи

в зависимости от условий.
17 Циклы и инерации Циклы(for, while, do…while). 2
18 Функции вв JavaScript Что такое функции и зачем они 2
нужны.

Обьявление, вызов и параметры

функций.
19 Область видимости и Замыкание(clousures) и 2
замыкание лексическая область видимости.
20 2
Массивы и их методы Добавлние, удаление и обход
элементов массива.
21 Обьекты и свойства Добавление и изменение 2
свойств обьектов
22 Введение в событие и Что такое событие и как их 2
обработчики использовать
23 Работы с DOМ Манипуляция с 2
элементами(создание,удаление,
изменение).
24 Стилизация элементов с Добавление и даление классов, 2
JavaScript изменение CSS
25 Ассинхронное Асинронные операции и их 2
программирование и колбэки обработка.

Колбэки и использование
setTimeout.
26 Промисф и обработка Работа с промисами и цепочки 2
асинхронных операций обещаний
27 Асинхронные Асинхронные операции с async 2
функции(async/await) и await
28 Работа с событиями мыши и Дейстия при кликах, нажатиях 2
клавиатуры клавиш и других событиях.
29 Введение в AJAX и отправка Введение в AJAX и 2
GET-запросов асинхронные запросы.

Отправка GET-запросов к
серверу
30 Работы с JSON данными и Работа с JSON данными. 2
обраотка ответов
Обработка ответов от сервера и
вывод данных.
31 Работа с историей браузера Взаимодействие с историей 2
(HISTORY API) браузера.
32 Управление окнами и Открытие новых окон и 2
вкладками браузера вкладок, работа с ними.
33 Уведомление и браузерные Обработка браузерных 2
события событий.
34 Введение в локальное Сохранение и получение 2
хранилище (LocalStorage) данных из локального
хранилища.
Работа с куками(cookies) Создание, чтение и удаление 2
35 куков.
36 Безопасность и сценарии Основы безопасности JavaScript 2
атак
37 Принципы Введение в ООП и его 2
обьктноориентированного принципы.
программирования(ООП)
38 Наследование и полиморизм Применение наследования и 2
в JavaScript полиморфизма в JavaScript.
39 Фреймворки ибиблиотеки Обзор популярных 2
фреймворков и библиотек.
40 Использование библиотек Интеграция библиотек в проект. 2
для ускорения разработки
41 Завершение проекта и Разработка собственных 2
практики проектов и портфолио.
42 Знакомство с React Что такое React и зачем он 2
нужен.

Основные принципы и
концепции React.
43 Установка и настройка Установка зависимостей и 2
React-проекта настройка среды разработки.
44 Работа с копанентами React Создание и использование 2
компонентов.
45 Вывод данныхх и JSX JSX – синтаксис разметки в 2
React.

Вывод данных и днамический

контент.
46 Работа с состоянием (State) Понятие состояния и его роль в 2
React.

Обновления состояния и
перерендеринг.
47 Пропсы (Props) и их Пропсы как механизм передачи 2
передача данных в компоненты.

Деструктуризация пропсов и
валидация.
48 Жизненый цикл Понимание жизненного цикла 2
компонентов компонентов.

Методы жизненногоцикла
(componentDidMount,
componentWillUnmount
другие).
49 Использование хуков(Hooks) Введение в хуки и их роль в 2
функциональных компонентах.

Примеры хуков(useState,
useEffect и другие).
50 Работа с формами в React Управляемые и неуправляемые 2
компоненты форм.

Обработка ввода и отправка

данных форм.
51 Динамические компоненты и Создание и отображение 2
словный рендеринг компонентов динамически.

Условный рендеринг на основе

данных.
52 Работа с данными и HTTP- Отправка HTTP-запросов из 2
запросами React.

Использование библиотеки
Axios для запросов.
53 Управление состоянием с Создание контекста в 2
Coontext API приложении.
54 Управление состоянием с Redux и его роль в управении 2
Redux состоянием.

Создание стора и работы с

действиями и редюсерами.

55 Роутинг с React Router Навигация и маршрутизация в 2

React-приложении.

Использование React Router для

создания маршрутов.

56 Оптимизация Rect- 2
приложения Оптимизация
производительности Rect-
прилоений.

Мемоизация и ленивая
загрузка.
57 Тестирование компонентов Методы и иструменты 2
React тестирования компонентов.

Использование библиотеки Jest

и его тестирование
пользовательского
58 Завершение React-проекта и Завершение React-проекта и 2
подготовка портфолио создание портфолио.

Работа над собственными

проектами и их демонстрация.
59 Развертывание React- Развертывание React- 2
приложения приложения на хостинге.

Использование инструментов
для развертывания
60 Проверка и завершение Проверка качества кода, 2
проекта React откладка и финальные штрихи.

Подготовка проекта к
продакшну,тестирование,рефак
торинг и окончательное
завершение
61 Создание простого To-Do Добавление, редактирование и 2
приложения удаление задач
62 Галерея изображений Загрузка изображений, промотр 2
в полноэкранном режиме.
63 Простой блог Создание блога с постами и 2
комментприями.
64 Погодное приложение Интеграция с внешним API для 2
отображения погоды.

Получение данных о погоде.

65 Простой чат Отправка и прием сообщений 2
вреальном времени.
66 Интернет магазин Разработка интернет магазина с 2
использованием React.
67 Персональныый блог Создание персонального блога 2
с возможностью публикации
статей.
68 Социальная сеть Разработка мини-социальной 2
сети с профлями и друзьями.
69 Управление Создание системы управления 2
задачами(Kanban) задачами в стиле Kanban.

Добавление задач перемещение

между колонками.
70 Онлайн калькулятор Разработка калькулятора для 2
выполнения математических
операций.

Расчеты, обработка ввода.

71 Административная панель Создание административной 2
панели для управления
данными.

Управление пользователями,
данными и настройками.
72 Персональный портфолио Создание портфолио для 2
отображения выполненных
проектов.

Добавление проектов, описание

и демонстрация.
Всего часов 144