Чему вы научитесь, пройдя курс:
Освоите workflow, как в Google
и
Facebook
Веб-разработка пожалуй, одна из самых
быстро развивающихся IT-отраслей в мире.
То,
как было актуально писать код еще год
назад сегодня уже безнадежно устаревший
подход. На курсе мы покажем workflow,
который используют прямо сейчас лучшие
программисты Кремниевой Долины.
«Full stack» разработка
Несомненный тренд 2016/17 годов. Забудьте
про разделение на специализацию. Сегодня
веб-разработчик должен не просто знать и
понимать код от сервера до клиента. Также
необходимо правильно выбирать
технологии для каждого конкретного случая.
Вы научитесь именно этому: выбирать.
решать, обосновывать и защищать свой
выбор.
Работать в команде или
возглавлять её
Времена успешных программистов-
одиночек прошли. Умение работать в
команде сегодня не просто требование при
устройстве в совершенно любую IT-
компанию. Конкуренция настолько сильно
захлестнула рынок, что выживать будут
только те разработчики, которые смогут
предложить лучший продукт за самое
короткое время. Иначе говоря — сплоченные
Модульная архитектура
Количество JavaScript кода на современном
сайте уже несколько лет как переваливает за
7096-80% от общего объема кода. Особенно с
приходом серверного JavaScript — node. js. Вы
научитесь планировать, создавать и
масштабировать свой код. Вы также на
практике освоите самые востребованные
паттерны кодирования и проектирования.
команды профессионалов.
Программировать веб-приложения,
а
не просто сайты
Требования к сайтам стали жестче, чем когда
Бы
то ни было. Сейчас, это не просто
красивые странички с классными.
визуальными эффектами. Сегодня сайт — это
полноценное веб-приложение, которое
молниеносно загружается и потрясающе
выглядит на любом устройстве смартфоне,
планшете и даже на телевизоре.
Уверенно использовать серверный
JavaScript
Node. js — одна из наиболее востребованных
технологий на сегодняшний день. MongoDB
самая популярная NoSQL документ-
ориентированная СУБД Изучив и применив
на практике обе эти технологии, ваше
отношение к backend-разработке
поменяется навсегда.
Писать понятный
и
масштабируемый код
Работа с препроцессорами сейчас норма не
только для CSS, но и для HTML, Все
практические задачи вы сразу будете делать
на
SASS/SCSS и Jade. Получаемые данные с
сервера (JSON) научитесь выводить в HTML
при помощи JavaScript, используя
handlebars. js
Решать самые разные задачи при
работе с API внешних сервисов
Научитесь работать и понимать API запросы
как самых востребованных социальных
сетей, так и различных сервисов, типа Google
maps и пр. Освоив основные принципы, для
вас не составит труда разобраться с API
любого внешнего сервиса
Учебная программа:
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 коллабарации

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