[LoftSchool] Продвинутый курс по веб-разработке

Складчина: [LoftSchool] Продвинутый курс по веб-разработке

Данный курс рассчитан на разработчиков с опытом от 1 года или тех, кто закончил курс «Веб-разработка для начинающих».

​

Учебная программа:

Спойлер

1. Настройка рабочей среды

• Боевое крещение новобранцев
• Знакомство с наставниками и одногруппниками
• Знакомимся с Slack и платформой обучения
• Подготовка рабочего окружения
• Выбор и настройка редакторов кода: Sublime text, Atom, Brackets
• Настройка и базовые принципы работы в терминале
• Тонкие настройки и особенности работы PhpStorm/WebStorm
• Полезные инструменты для повышения продуктивности
• Как оставаться здоровым, работоспособным и эффективным
• Планирование, постановка задач и достижение целей

2. Workflow

• Основы работы в Linux терминале
• Базовый workflow в Git
• Знакомство с node.js
• Работа с модулями, npm
• Понимание dependencies и devDependencies
• Bower - настоящее и будущее
• Bower vs Npm для frontend-разработки
• Локальный сервер на node.js - BrowserSync
• LiveReload - наиболее эффективные решения
• Корректная публикация проекта на Github

Workflow #2

• Gulp - лучшие практики применения
• Конкатенация, минификация, работа со статикой
• 15 самых востребованных npm-плагинов
• Автоматическая оптимизация картинок
• Bower - продвинутые техники, тонкая настройка
• Подготовка и сборка проекта для последующей отправки на хостинг (Production Server)
• Настройка хостинга и автодеплой проекта (Auto Deploy)

Workflow #3

• Принцип работы PostCss
• PostCSS + Gulp
• Организация необходимого набора плагинов( Autoprefixer, Postcss-nested, Postcss-short, Postcss-assets, Postcss-sorting)
• Stylelint + Reporter

3. Вёрстка
Вёрстка #1

• Самые важные приёмы при нарезке макета в Photoshop
• Как писать семантичный и качественный HTML
• Какие единицы измерения лучше? "px", "em", "rem" и др.
• "font-size" и "line-height"
• Все значения свойства "display"
• Свойство "float" и его корректная очистка
• Вертикальное и горизонтальное центрирование элементов
• Псевдоэлементы :before, :after
• Свойство "outline"
• Тонкости модели "box-sizing", margin, padding
• Рекомендации о том, как писать "правильный" CSS
• Meyer Reset, Normalize.css, border-box reset

Вёрстка #2

• Знакомство с препроцессором Jade
• Использование алгоритмической структуры Jade
• Написание собственных примесей
• Построение универсального шаблона
• БЭМ-нейминг
• Организация файловой структуры проекта
• Рендеринг данных из JSON

Вёрстка #3

• Препроцессор - SASS/SCSS
• Циклы, условия, переменные SASS
• Необходимые в работе функции SASS
• Автоматизация сборки спрайтов средствами Spritesmith
• SVG, иконочные шрифты

Вёрстка #4

• Адаптивная вёрстка
• Настройка картинок для адаптивной верстки
• Адаптация картинок под ретина-дисплеи
• Адаптив или Респонсив. В чем разница?
• Медиазапросы
• Библиотека SingularityGS & Breakpoints SASS. Для верстки респонсив сайтов.

Вёрстка #5

• Модуль CSS - flexBox
• Поведение флексбокс лэйаута
• Управление пропорциями блоков
• Управление порядком блоков
• "Хитрое" выравнивание flexBox контента

Вёрстка #6

• Простая техника параллакс
• Параллакс бэкграунд
• Параллакс скроллинг
• Сложные анимации

4. Javascript
Javascript #1

• Типы данных в JS
• Объекты-обертки
• Введение в функции
• Типы объявления функций
• Анонимные функции
• Всплытие переменных и функций
• Работы с объектами
• Паттерн модуль. Взаимодействие модулей

Javascript #2

• Работа с jQuery
• Cобытия и их обработка
• Корректная работа с DOM
• Аjax и Deffered object - реализация в jQuery
• JSON
• Шаблонизация на Javascript, Handlebars.js
• Лучшии практики и производительность
• Browserify

Javascript #3

• Версии ECMAScript
• ES-2015 сейчас
• Трансляция ES6 через Babel.JS
• Переменные для разных областей видимости
• Шаблонные строки
• Функции с передачей контекста
• Классы
• Деструктуризация

5. Node.js
Node.js #1

• Настройка окружения для разработки и отладки
• Работа со встроенными модулями и создание собственных
• Важные приёмы при работе с npm
• Потоки и асинхронность
• Веб-сервер на node.js

Node.js #2

• Работа с базами данных
• Связка Node.js + Mongo.db и её особенности
• Работа с MongoDB в связке с Mongoose
• Сессии в Node.js

6. PHP
PHP #1

• Настройка сервера Apache
• Основы языка программирования PHP
• Работа с функциями
• Встроенные возможности языка
• Работа с файлами
• Работа с данными: JSON, XML, CSV, ini-файлами

PHP #2

• Работа с сессиями
• Работа с базой данных MySQL
• Безопасность
• Знакомство с РНРStorm
• Пакетный менеджер Composer и Packagist
• Работа со сторонними библиотеками
• Работа с изображениями
• Шаблонизатор Twig

7. Командная разработка

• Системы менеджмента кода
• Тонкая настройка git
• Работа с git в консоли
• Переходы по веткам, теги
• Git Bash
• Git GUI, SourseTree
• Работа с ветками
• Анализ и разрешение конфликтов
• GitHub коллабарации

8. Работа с интерактивными элементами страницы

• Частые проблемы с дропдаунами
• Перекрытия элементов
• Абсолютное центрование
• Практическое использование кастомных примесей
• Работа с очередью анимаций
• Рекурсивные анимации с параметрами и без
• Частые проблемы с формированием лейаута
• Wow.js под капотом

9. Работа с API

• Что такое API?
• Как устроено API?
• Что такое Curl?
• Работа с API Вконтакте
• Работа с API Yandex
• Подводные камни API

10. Устройство на работу

• Подготовка к прохождению собеседования: что нужно уметь, прежде чем устроиться в хорошую компанию
• Виды собеседований и особенности каждого
• Какие вопросы чаще всего задают на собеседованиях (для backend и frontend разработчика)
• Стратегия работы на фрилансе
• Какие подводные камни могут вас подстерегать при работе на фрилансе
• Стратегия ведения проектов
• Как правильно искать клиентов

11. Работа с CMS

• Какие бывают CMS и почему именно MODx?
• Установка и первоначальная настройка
• Обзор популярных компонентов
• Работа с ресурсами и шаблонами
• Работа c чанками, сниппетами и TV
• Практика работы с MODx

12. Закрытие курса

• Выдача дипломов
• Выпускники попадают в закрытый чат всех учеников Loftschool - огромное сообщество единомышленников, где регулярно появляются проекты, заказы, вакансии и многое другое
• Анкетирование на дальнейшее трудоустройство и стажировки в компаниях - партнёрах
• Привилегии выпускников

САЙТ КУРСА: