Открыта [Stepik] Верстаем 8 сайтов по макету из Figma в портфолио [Исмаил Усеинов]

[asd]

[Stepik] Верстаем 8 сайтов по макету из Figma в портфолио [Исмаил Усеинов]

О курсе
Этот курс направлен на обучение созданию верстки сайтов на HTML и CSS по макету из Figma или Photoshop. Весь материал подносится простым языком. Вы получите много полезных материалов и мы вместе будем применять изученное на практике создавая интересные проекты шаг за шагом.

Что в этом курсе?

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

На все вопросы внутри курса отвечаю лично в разделе "Комментарии" (этот раздел есть под каждым шагом). Так же есть телеграм канал для вопросов и обсуждений не только по данному курсу. Там можно общаться с другими участниками моего сообщества и лично со мной на любые темы касательно разработки и программирования.

Каждый урок состоит из отдельных шагов (до 16 шагов) - это может быть, теория в виде текста, видео, тестовое задание.

Почему стоит начать обучение сейчас? Создание сайтов (верстка) - очень востребованный навык, который хорошо оплачивается. Мало того, что изучив всю данную вам информацию вы уже сможете создавать свои продукты и работать как на фрилансе, так и в web-студии, но и вы заложите базу для дальнейшего обучения. Владея этими навыками вы сможете освоить любую CMS, сможете понять и изучить как работает backend часть, и сможете создавать визуальную часть приложений, написанных на JavaScript фреймворках и библиотеках.

Внимание!
Курс "Верстаем 8 сайтов по макету из Figma в портфолио" содержит в себе уроки и задания из трех следующих моих курсов:
1 Вёрстка на HTML & CSS для начинающих
2 Git и GitHub для разработчика
3 Frontend разработчик на HTML, CSS и JavaScript (3 последних модуля из этого курса, которые были добавлены 25 ноября 2022)

Это значит, что вам не нужно покупать их по отдельности и вы можете сэкономить приобретая данный курс. Или же приобрести отдельный курс только по интересующей вас теме.

Чему вы научитесь
- Устанавливать редактор для написания кода VS Code, настраивать его, устанавливать расширения и темы, работать с плагином Emmet, работать в терминале (командной строке)
- Работать с HTML5 и CSS3 - это два языка, которые необходимы для создания любого сайта. Работать с Flexbox, Grid и BEM, создавать свою адаптивную сетку на CSS и мы сверстаем много отдельных фрагментов современных сайтов
- Создавать современные веб-сайты и правильно пользоваться документацией
- Работать с Photoshop и Figma в контексте верстки, извлекать картинки и текст из макетов
- Работать с системой контроля версий Git и добавлять свой код в удаленные репозитории на GitHub, делать Fork, Pull-request и слияние веток
- Сверстаем 8 сайтов по макету из Figma и вы сможете добавить их себе в портфолио
- Расскажу как составить резюме, портфолио и взять первый заказ на фрилансе

Для кого этот курс
- Для тех, кто не знаком с темой создания сайтов;
- Для тех, кто уже делал свои первые попытки создания сайтов;
- Для тех, кто хочет освоить HTML, CSS, Figma, Photoshop, VS Code, Emmet, BEM, Git, GitHub и начать применять эти навыки в работе;
- Для тех, кто хочет стать крутым веб-разработчиком и зарабатывать деньги.

Начальные требования
- Желание освоить создание сайтов и начать зарабатывать на этом
- Базовые навыки работы с компьютером
- Никакой другой предварительной подготовки

Наши преподаватели
Исмаил Усеинов
Автор канала ITDoctor
Занимаюсь веб-разработкой с 2013 года.
В 2017 году создал YouTube канал ITDoctor. Делюсь своими знаниями в области программирования и создания сайтов. Сформировал собственную методику обучения, которая позволяет ученикам максимально эффективно осваивать изучаемый…

Как проходит обучение
Обучение построено на видео уроках. Для лучшего усвоения материала рекомендуется смотреть урок и пробовать повторить все самостоятельно. Почти в каждом уроке доступно одно или более заданий в виде теста, задачи на сопоставление, заполнение пропусков, сортировки и другие. В некоторых уроках есть шаги с заданием в видео формате, где подробно изложены условия и цель задачи. Обязательно читайте всю текстовую информацию к уроку там могут быть полезные ссылки на сторонние ресурсы или на материалы, которые нужны для урока. По желанию можете конспектировать изучаемый материал в любом удобном для вас формате (бумага, цифра). Задействовав дополнительный вид памяти вы улучшите усвоение материала.

Что вы получаете
- 7 модулей, в которых вы научитесь работать с HTML, CSS, Figma, Photoshop, VS Code, Emmet, BEM, Git, GitHub
- 71 урок, 7 из которых доступны бесплатно (по одному из каждого модуля)
- общая продолжительность видео уроков более 23 часов
- 199 тестовых заданий
- более 80 ресурсов для скачивания (ссылки на полезные сервисы, статьи, готовые шпаргалки, макеты сайтов и примеры кода)
- этот курс содержит в себе материалы из 3-х разных курсов по самой выгодной цене
- обучение может занять от 1 до 3 месяцев, в зависимости от уделенного вами времени
- много домашних заданий по написанию кода, вся теория закрепляется на практике на наглядных примерах
- выдается сертификат Stepik
- общение с автором и другими учениками, обсуждение уроков и отдельных шагов
- обучение по шагам - учитесь когда вам удобно, уроки разбиты на маленькие шаги (это может быть, текст, видео, тестовое задание)
- курс предоставляется вам на всегда, без каких-либо лимитов и ограничений по времени
- вы получите огромный багаж знаний и сможете освоить современную востребованную профессию

Спойлер: Программа курса

Язык HTML
01 Введение
02 Установка браузера и редактора кода
03 Обзор функций редактора
04 Первые HTML теги
05 Как задавать путь к файлу
06 Создание списка
07 Создание таблиц
08 Работа с текстом
09 Создание формы
10 Универсальные атрибуты
11 Цвет RGB и спецсимволы
12 Тест по HTML, Часть 1
13 Подведение итогов изучения HTML

Язык CSS
01 CSS селекторы
02 Работа с изображениями
03 Границы
04 Размеры элементов
05 Работа с шрифтом
06 Блочная модель документа
07 Псевдоклассы и псевдоэлементы
08 Основы CSS Flexbox
09 Тест по CSS, Часть 1
10 Адаптивная версия сайта, Создание своей сетки

Практика по HTML и CSS
01 Практическое занятие 1
02 Практическое занятие 2
03 Практическое занятие 3
04 Урок по Photoshop
05 Практическое занятие 4
06 Заключение
07 Тест по HTML, Часть 2
08 Тест по CSS, Часть 2
09 Справочники и ссылки

Система управления версиями Git и GitHub
01 Что такое Git
02 Установка Git
03 Регистрация на GitHub
04 Первые команды Git
05 Работа с Git в VS Code
06 Алиасы для Git
07 Отмена изменений и возврат к коммиту
08 Работа с ветками
09 Панель команд Git в VS Code
10 Откат к любому коммиту и Git Graph
11 Удаление репозитория
12 Синтаксис Markdown для README.md
13 Фрагменты кода Gist
14 Хостинг GitHub Pages
15 Описание профиля на GitHub
16 Резервная копия всех своих репозиториев
17 Fork и Pull Request что это такое
18 Слияние веток Git, разрешение конфликта слияния

Верстка сайта из Figma
01 Работа с Figma и создание проекта
02 Про Pixel Perfect и верстка Grid + Flexbox
03 Верстаем несколько разделов сайта
04 Пара слов о работе верстальщика
05 Интерактивные элементы на сайте
06 Домашнее задание по верстке сайта
07 Фриланс: как взять заказ

Полезные материалы
01 Редакторы кода, иконки и Emmet
02 CSS Grid и другие возможности
03 Позиционирование, размеры и блочная модель
04 БЭМ и как называть классы в HTML
05 margin или padding что лучше использовать
06 Выравнивание по центру и анимация
07 Переменные root и функция calc

7 сайтов в портфолио
1 Konstruct
2 Alivio
3 WD
4 Britlex
5 Archi Web
6 Cloud Budget
7 Dae

Стоимость: 2800 руб.

Продажник

Донор

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.