Курс Введение в веб-разработку
Цели данного курса
- Дать представление о том что такое веб-разработка
- Дать базовые практические навыки HTML/CSS/JavaScript
- Подготовить к продвинутым курсам по веб-разработке
Стоимость обучения: 15 000 руб
Учебный курс представляет собой 14 видео-уроков. После каждого видео-урока дается практическое задание, которое проверяется наставником и материалы для чтения. Если у наставника есть замечания, то ученик должен их исправить, чтобы получить доступ к следующему уроку. Ученику дается 8 недель для прохождения всего курса. По окончанию этого срока проверка заданий и консультации наставника прекращаются. Необходимо планировать примерно 4 часа на прохождение одного урока, это включает время на просмотр видео, на выполнение домашнего задание и на чтение.
Module 1 Введение в веб-разработку 8 недель
- Ставим Ubuntu
Видео. Установка Ubuntu 16.04
Домашнее задание. Установить Ubuntu 16.04
Читать. Информацию о Linux
- Bash - Ubuntu terminal
Базовые bash команды, установка пакетов, движение между папками
Установить VIM, выполнить задание на использование пройденных команд
Читать про Linux Terminal
- Текстовый редактор SublimeText и учимся гуглить
Об установке SublimeText и советы по гуглению
Установка SublimeText, подключение полезных модулей. Практическое задание по форматированию текста и поиску информации.
Читаем про текстовые редакторы и IDE. Что это и чем они отличаются
- Git и GitHub
Установка Git, создание аккаунта на GitHub, генерация ключей ssh, базовые команды Git
Установить Git, настроить свой аккаунт на GitHub. Создать репозиторий с одной веткой, создать репозиторий с несколькими бранчами, клонирование и Pull Request
Читать про Git и GitHub
- HTML
Базовый HTML, различия между HTML и HTML5, обзор проблем совместимости между различными браузерами (high level), элементы HTML документа, синтаксис (элементы, атрибуты и пр.)
Создать свой проект на HTML5. Проект выложить на GitHub и сделать Pull Request (PR)
Читать про основные HTML тэги
- CSS
Базовый CSS и подключение стилей, различия между css/css3, синтаксис и inheritance, селекторы, playground codepen.io
Добавляем в проект из прошлого урока CSS стили. Делаем Ёлку на HTML и CSS. Делаем PR
Читаем про возможности CSS, какие прикольные штуки можно с помощью него делать
- Web-сервер NGINX
Установка и базовая настройка сервера nginx
Запустить два сайта на локальном сервере NGINX на портах 8080, 8081
Что такое веб-сервера и что такое NGINX
- Размещение сайта на сервер Linode
Покупка домена и настройка DNS. Установка дистрибутива Ubuntu, настройка NGINX, размещение сайта на хостинге
Настройка своего Linode и размещение туда своего сайта
Читать про хостинг и Linode
- Twitter Bootstrap
Об адаптивной, mobile-first библиотеке Twitter Bootstrap
Создать свой сайт на Bootstrap, сделать PR, разместить на хостинге
Читать документацию Twitter Bootstrap
- JavaScript (типы данных, if/else, функции)
Установка npm и node. Типы данных, переменные, константы, массивы, объекты, функции, console.log
Решить квадратное уравнение. Сделать расчет високосного года. Написать Оракула, который будет давать случайные ответы на вопросы.
Что такое Node.js и JavaScript
- JavaScript в браузере
Подключение JavaScript, манипуляция с элементами HTML страницы (DOM), события (onchange, onclick), Chrome DevTools
Сделать Оракула в брузере. Сделать пианино
Читаем про основы JavaScript
- Библиотека jQuery
Подключение jQuery, селекторы (по ID, по классу), события (click, focus, scroll), эффекты (fade, animate), цепочки событий, манипуляции с HTML (получить, изменить значение, изменить класс)
Задание волшебный квадрат. Задание волейбол
Про то как работает jQuery
- Реляционная база данных MySQL
Установка и настройка MySQL, настройка кириллицы, создание баз данных, таблиц и вставка данных. Выборки данных по критериям, группировка данных, JOIN
Установить MySQL, создать таблицы movies (фильмы) и genre (жанры) и заполнить их данными. Сделать различного рода выборки и JOIN
Читать про типы данных в MySQL и про LEFT JOIN, INNER JOIN, OUTER JOIN
- CMS Wordpress
Установка и настройка MySQL, PHP, NGINX, скачивание дистрибутива Wordpress и установка, выбор и кастомизация темы
Настроить сайт Wordpress на хостинге, добавить и внести изменения в тему на GitHub и хостинг. Сделать PR. Сайт должен быть доступен по субдомену bootstrap.yourdomain.ru
Читать о том что можно делать с Wordpress
Open book icon credits