Juliya16
Свой
- 3 Ноя 2016
- 17
- 208
Веб-верстальщик: Код фрилансера (2017)
Автор:Андрей Гаврилов
ЧЕМУ ВЫ НАУЧИТЕСЬ:
HTML
Создавать валидную HTML-разметку страниц, использовать стандарт HTML5 и проектировать лаконичную структура проектов любой сложности
CSS
Писать грамотный CSS-код. Использовать стандарт CSS3, медиа-запросы для создания адаптивности, а также работа ть профессионально с препроцессором SASS (SCSS)
JAVASCRIPT
Использовать базовые возможности языка Javascript и использовать библиотеку Jquery. Устанавливать плагины на все случаи жизни: всплывающие окна, галереи, слайдеры и т.д.
BOOTSTRAP
Использовать самый популярный фреймворк для веб-разработки Bootstrap, а также его аналоги. Поддерживать и управлять контентом веб-приложений с помощью Bootstrap
NODE.JS
Устанавливать и использовать в работе пакетные менеджеры, типа Bower, NPM. Использовать инструменты для прогрессивной frontend-разработки и сборщики проектов, типа Gulp и Grunt
SASS
Использовать препроцессор SASS (SCSS) для быстрого модульного написания CSS-кода. Работать с перемеными, наследованием, миксинами и условиями для ускорения work flow
ADAPTIVE
Создавать адаптивные и отзывчивые (resposinve) веб-сайт ы с использованием современных инструментов, а также работать над максимально сложными в верстке проектами
CMS
Устанавливать, настраивать и работать с самой прогрессивной и гибкой CMS MODx - системой управления контентом или «движком».
Блок #1 ВВЕДЕНИЕ В ПРОФЕССИЮ
Знакомство с коучингом и профессией
Введение в CSS
Photoshop и модульными сетками
Основы Javascript
Node.js, NPM и Bower
Установка сайта и CMS на хостинге
Работа на фрилансе
Скачать:
Автор:Андрей Гаврилов
ЧЕМУ ВЫ НАУЧИТЕСЬ:
HTML
Создавать валидную HTML-разметку страниц, использовать стандарт HTML5 и проектировать лаконичную структура проектов любой сложности
CSS
Писать грамотный CSS-код. Использовать стандарт CSS3, медиа-запросы для создания адаптивности, а также работа ть профессионально с препроцессором SASS (SCSS)
JAVASCRIPT
Использовать базовые возможности языка Javascript и использовать библиотеку Jquery. Устанавливать плагины на все случаи жизни: всплывающие окна, галереи, слайдеры и т.д.
BOOTSTRAP
Использовать самый популярный фреймворк для веб-разработки Bootstrap, а также его аналоги. Поддерживать и управлять контентом веб-приложений с помощью Bootstrap
NODE.JS
Устанавливать и использовать в работе пакетные менеджеры, типа Bower, NPM. Использовать инструменты для прогрессивной frontend-разработки и сборщики проектов, типа Gulp и Grunt
SASS
Использовать препроцессор SASS (SCSS) для быстрого модульного написания CSS-кода. Работать с перемеными, наследованием, миксинами и условиями для ускорения work flow
ADAPTIVE
Создавать адаптивные и отзывчивые (resposinve) веб-сайт ы с использованием современных инструментов, а также работать над максимально сложными в верстке проектами
CMS
Устанавливать, настраивать и работать с самой прогрессивной и гибкой CMS MODx - системой управления контентом или «движком».
Блок #1 ВВЕДЕНИЕ В ПРОФЕССИЮ
Знакомство с коучингом и профессией
- Знакомимся с участниками
- О коучинге и процессе обучения
- Как выжать максимум из программы
- Перспективы развития на фрилансе
- Как работают сайты
- Понятия "домен" и "хостинг"
- Протоколы FTP и SSH
- Инструментарий: SublimeText, WinSCP, DevTools, Photoshop и др.
- Блок #2 HTML-ПРОЕКТИРОВАНИЕ
- Знакомство с HTML
- Что такое HTML
- Основные теги языка разметки
- Понятие блочных и строчных элементов
- Ссылки
- Атрибуты
- Классы и айди
- Как быстро запомнить основные теги
- Структура документа HTML
- Семантические принципы проектирования
- Понятие валидности кода, W3C
- Форматирование кода
- Комментирование
- Работа с путями
- Теги HTML5
- Назначение и применение тегов HTML5
- Использование видео и аудио
- Структура форм в HTML
- Теги для разработки форм
- Методы отправки форм
- HTML-структура таблиц
- Форматирование и стилизация таблиц
- Создание таблиц любой сложности
Введение в CSS
- Зачем нужен CSS
- Возможности CSS
- Способы подключения CSS к HTML
- Структура CSS-документов
- Быстрые способы написания кода
- Работа с селекторами
- Наследование
- Псевдоклассы :before, :after, nth-child и др.
- Работа с цветовыми моделями rgb, rgba, hex, hsla
- Как эффективно и быстро выучить CSS-свойства
- Разбор современной методологии БЭМ
- Готовим среду для разработки
- Создаем настоящую страницу HTML/CSS
- Фишки CSS3: animation, transition, rotate и др.
- Вендорные префиксы
- Все преимущества HTML5 и CSS3 в примерах
Photoshop и модульными сетками
- Интерфейс Photoshop
- Структура современного макета
- Основы минимализма и Flat-дизайна
- Понятие "модульные сетки"
- Типы модульных сеток по назначению
- Экспорт графики для верстки
- Понятие форматов PSD, JPG, PNG, GIF, SVG, AI, EPS, PDF
- Ключевые принципы преобразования макета в код
- Для чего нужны медиа-запросы (media queries)
- Примеры работы с медиа-запросами
- Подходы mobile first и mobile last
- Понятие "резиновость" и "brake-points"
- Относительные единицы измерения (%, em, rem и др.)
- Подготовка изображений под retina-дисплеи
- Профессиональный подход к структуре CSS с media queries
- Подготовка структуры проекта
- Экспорт графики из PSD
- Минификация файлов для ускорения загрузки
- Создание HTML-разметки
- Блочная структура организации контента
- Использование всей мощи CSS3
- Работа со шрифтами в CSS
- Подключение шрифтов из Google Fonts
- Конвертация формата шрифтов и подключение к сайту
- Тестирование адаптивности и отзывчивости
- Инструменты для тестирования: DevTools в браузерах и др.
Основы Javascript
- Введение в язык
- Переменные и типы данных
- Управляющие конструкции
- Циклические и условные конструкции
- Функции
- Объекты и массивы
- Практика: решение задач
- Понятие библиотеки
- Принципы работы с Jquery
- Анимации
- Добавление/удаление классов
- Взаимодействие с элементами DOM
- Процесс установки плагинов Jquery
- Готовые решения: слайдеры, галереи, модальные окна
- Обзор решений Bootstrap для решения повседневных задач
- Parallax-эффекты различной сложности
- Основные ошибки и проблемы в использовании Jquery
Node.js, NPM и Bower
- Работа с командной строкой (терминалом/консолью)
- Понятие "пакетный менеджер"
- Установка оболочки Git
- Установка Node.js, NPM, Gulp, Bower
- Полезные дополнения и функции Gulp
- Автоматическая минификация графики, CSS, JS
- Настройка личной среды разработки
- Ускорение рабочего процесса в 3 раза
- Установка самого популярного сборщика frontend - Gulp
- Подробная инструкция по использованию Gulp
- Что такое препроцессоры
- Преимущества препроцессора SASS (SCSS)
- Переменные
- Наследование
- Миксины
- Условия
- Ускорение work flow с использованием SASS
- Работа с серверами Github
Установка сайта и CMS на хостинге
- Какой хостинг и тариф выбрать
- Покупка и привязка домена к хостингу
- Принцип установки любой CMS на примере MODx
- Подключение к хостингу по FTP и SSH
- Основы работы с Базами Данных (БД)
- Управление БД с помощью phpMyAdmin
- Файловая структура дискового пространства
- Основные точки интеграции
- Возможности интеграции
- Формирование удобного Backend с помощью MODx
- Работа с TV-параметрами, сниппетами, чанками
- Установка расширений в MODx
- Интеграция галерей изображений
- Интеграция форм обратной связи
- Принцип работы с любой CMS: Wordpress, Joomla, Drupal и др.
- Почему именно Opencart для магазинов?
- Возможности интеграции с CMS Opencart
- Разбор Opencart на винтики
- Масштабы использования Opencart
Работа на фрилансе
- Обзор самых прибыльных бирж фриланса
- Создание идеального профиля
- Секреты формирования портфолио
- Эффективный метод поиска клиентов
- Мои секреты и фишки поиска клиентов
- 5 встреч онлайн в течение последнего месяца
- Мои постоянные консультации и поддержка
- Помощь в работе с клиентами
- Вдохновение и мотивация
- Долгожданное занятие!
- Обсуждение результатов
- Речь каждого студента
- Напутствие от наставника
- Выдача дипломов
- Советы по развитию
- Неформальная беседа и виртуальное чаепитие
У вас нет прав на просмотр ссылок, пожалуйста: Вход или Регистрация
Скачать:
Для просмотра скрытого контента необходимо Войти или Зарегистрироваться.
Последнее редактирование модератором:
