LoftSchool. Курс по подготовке начинающих frontend-специалистов

Содержание

Слайд 2

Для начала, давайте познакомимся

Для начала,
давайте познакомимся

Слайд 3

Форс-мажор? Есть к кому обратиться! Дмитрий Ковальчук сооснователь школы LoftSchool skype_kdn

Форс-мажор? Есть к кому обратиться!

Дмитрий Ковальчук
сооснователь школы LoftSchool
skype_kdn

Владимир Сабанцев
основной преподаватель курса
wowua_

Слайд 4

Позовите администратора Юрий Кучма администратор курса krabaton

Позовите администратора

Юрий Кучма
администратор курса
krabaton

Слайд 5

“хьюстон, у нас проблемы” Команда наставников курса Юрий Кучма krabaton Александр Собакарь xaosaki Дарья Пушкарская dashaoralenaoo

“хьюстон, у нас проблемы”
Команда наставников курса

Юрий Кучма
krabaton

Александр Собакарь
xaosaki

Дарья Пушкарская
dashaoralenaoo

Слайд 6

Особенности курса Административные вопросы Подготовка рабочего места Полезные программы Содержание вебинара

Особенности курса
Административные вопросы
Подготовка рабочего места
Полезные программы

Содержание вебинара

Слайд 7

Особенности курса

Особенности курса

Слайд 8

Зачем идти на курс? Обычный разработчик, обучаясь самостоятельно по видео урокам

Зачем идти на курс?

Обычный разработчик, обучаясь самостоятельно по видео урокам или

другим материалам, постоянно борется со своей ленью, апатией, усталостью. Зачастую, искусственно пытаясь вызвать в себе интерес к новой сложной и непонятной технологии.
Только на живом курсе, находясь в кругу единомышленников, заряженных энергией и мотивацией, под чутким руководством наставника, ты сможешь выйти на новый профессиональный уровень.
На живом курсе ты не останешься с проблемой один на один. Ты автоматически получишь поддержку, сильнейший заряд бодрости, мотивации и захватывающего всё твоё существо интереса к миру веб разработки.
Слайд 9

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

Эффективность обучения

Любое обучение должно быть эффективным. Исследования показывают, что люди запоминают

только:
5% того, что узнали, из лекции.
10% того, что прочитали.
20% того, что узнали посредством аудио-визуального воздействия.
30% визуальной демонстрации (опыт, эксперимент).
50% материала групповой дискуссии.
75% практической отработки теории.
90% того, что объясняют кому-то еще. ( подробнее... )
Это называется “конус обучения”.
В LoftSchool вы используете все виды внимания.
Слайд 10

Дорожная карта Веб для начинающих Продвинутый веб JavaScript PHP SEO

Дорожная карта

Веб для начинающих

Продвинутый веб

JavaScript

PHP

SEO

Слайд 11

Наш подход к обучению Гибкость. Курс меняется в режиме “реального времени”.

Наш подход к обучению

Гибкость. Курс меняется в режиме “реального времени”.
Полное погружение.

Имитация рабочего процесса реальной студии.
Правильно расставленные приоритеты
- Домашние задания и code review
- Работа с наставником
- Общение с преподавателями
- Материалы курса (лекции, методические пособия и др.)
Ученики ставят оценки преподавателям.
Слайд 12

Личный наставник Каждый, кто готов Вкалывать ночами и на выходных. Соблюдая

Личный наставник

Каждый, кто готов
Вкалывать ночами и на выходных.
Соблюдая жесткие дедлайны,

выполнить все выпускные проекты.
Как минимум, 1 раз выступить публично перед своей группой.
Раз в неделю являться на групповые занятия, непредусмотренные расписанием.
Получит личного наставника.
Слайд 13

Что делать, если вам нужна помощь? Убедиться, что вы посмотрели вебинар

Что делать, если вам нужна помощь?
Убедиться, что вы
посмотрели вебинар по

теме
прочитали методичку
посмотрели сопутствующие уроки
попробовали решить задачу самостоятельно
GOOGLE IT!
Задать вопрос в чате своей подгруппы
Если вам не помогли, задать вопрос в личку своему наставнику
Если вам не может помочь ваш наставник, обратитесь к любому другому наставнику или преподавателю

Что просить у наставника?
Помощь по конкретной проблеме
Кодревью, просите кодревью!
Как просить?
Лучше всего, локализуйте свою проблему https://jsfiddle.net/
Если первый вариант для вас слишком сложен, тогда скидвайте архив.
Если первый и второй вариант не помогли - расшарьте экран

Слайд 14

Как проходит работа в группе На одну группу - один наставник

Как проходит работа в группе

На одну группу - один наставник
Группа -

по 10 - 20 человек
Раз в неделю
будут проводиться групповые созвоны, с повторением материала либо разбором текущих проблем
необходимо отписываться наставнику о том, как у вас проходит обучение
Наставник будет вас “пинать”
Слайд 15

2. Административные вопросы

2. Административные вопросы

Слайд 16

Всем, кто вносил предоплату менее, чем за 30 дней до начала

Всем, кто вносил предоплату менее, чем за 30 дней до начала

обучения необходимо полностью рассчитаться за курс до конца первых 2х недель обучения. Остальным должникам (если такие есть) - в течении 3х дней, начиная с сегодняшнего.
Те, кто понимает, что не сможет делать домашние задания, заранее предупредите об этом старшего администратора курса. Вы получите статус “Слушатель” и вас не будут беспокоить.
Обязательно заполните все данные о себе в личном кабинете. ФИО только на русском языке. Это необходимо для выдачи диплома.
Фотография в скайпе должна быть настоящей.
Если вы не согласны с каким-либо пунктом и считаете свою ситуацию особенной - обсудите это со старшим администратором курса.
У нас есть книга “жалоб и предложений”.
Словарь терминов для новичков.

Важно

Слайд 17

В чат нельзя кидать код, а тем более файлы. Для этого

В чат нельзя кидать код, а тем более файлы. Для этого

есть такие сервисы, как:
hastebin.com
jsfiddle.net
Приветствуются любые виды общения, но соблюдайте цензуру.
Больше общайтесь, знакомьтесь, добавляйтесь в друзья!
Если хотите что-то быстро показать – используйте monosnap.com или аналогичные сервисы для создания скриншотов.
Устали от уведомлений? Отключите их (подробнее – в методичке).

Скайп чат

Слайд 18

Все важные материалы Графики дедлайнов Журнал успеваемости Полезные ссылки Расписание вебинаров.

Все важные материалы
Графики дедлайнов
Журнал успеваемости
Полезные ссылки
Расписание вебинаров.
Объявления.
Обсуждения и вопросы.
Литература и вспомогательные

уроки.

Группа в Контакте

Слайд 19

Все вебинары доступны в записи на следующий же день после проведения.

Все вебинары доступны в записи на следующий же день после проведения.

Записи - в личном кабинете на сайте loftschool.com
Приглашение на вебинар высылается заранее, в день его проведения вам на почту.
Доступ на вебинар - по ссылке из письма.
Продолжительность - полтора - два часа.
Начало в 20:00 по Москве.

Вебинары

Слайд 20

Чтение специальных книг, методических пособий и документаций - обязательное условие роста

Чтение специальных книг, методических пособий и документаций - обязательное условие роста

frontend инженера.
Из списка литературы - необходимо прочитать первые 2 и идти дальше!
Читай каждую из них минимум 30 минут в день.
Задавать вопросы в чате преподавателям или ученикам, ответы на которые явно указаны в методичке или презентации - признак неуважения к соратникам и к труду учителей.

Самостоятельная работа

Слайд 21

Всего будет 2 выпускных проекта “Сайт портфолио” Верстка, семантика, HTML/CSS, работа

Всего будет 2 выпускных проекта

“Сайт портфолио”

Верстка, семантика, HTML/CSS, работа с плагинами,

кроссбраузерность, препроцессоры, модульность, CSS3 и пр.

“Реальный лендинг для нереальной компании”

Изучение jQuery, работа с API сервисов и готовыми решениями

Слайд 22

Что я получу на выходе? Готовый сайт - визитку которую можно,

Что я получу на выходе?

Готовый сайт - визитку которую можно, не

стесняясь, отсылать работодателю.
Портфолио, где можно собирать свои работы.
Первая работа в портфолио!
Сертификат о прохождении обучения (будет доступен в электронном виде в личном кабинете)
Пожизненное членство в закрытом клубе “frontend братство”.
Скидку до 10% процентов на все курсы школы.
Стажировка в веб студии “itloft”.
Слайд 23

За каждую домашнюю работу вы будете получать баллы. 1 - простые

За каждую домашнюю работу вы будете получать баллы.
1 - простые задачки

на начальном этапе
2 - сайт портфолио
3 - лендинг
4 - интерактивные элементы лендинга
5 - js лендинга
Соответственно что бы получить максимальный диплом, необходимо набрать 15 баллов
От количества баллов будет зависеть статус в дипломе.

Баллы для Диплома

Слайд 24

3. Подготовка рабочего места

3. Подготовка рабочего места

Слайд 25

Рабочее место Несколько мониторов – работа на 20% быстрее. Минус –

Рабочее место

Несколько мониторов – работа на 20% быстрее. Минус – повышается

утомляемость.
Полезные утилиты для windows:
Dual Monitor Taskbar
Dexpot
Смело подключайте мониторы к ноутбуку, если вы работаете в разных местах и ноутбук – всегда с вами.
Рабочее место должно быть удобным и красивым.
Берегите глаза, поставьте себе F.lux
Слайд 26

Чередуйте работу сидя и стоя Это даст здоровье и бодрость. Тонус

Чередуйте работу сидя и стоя

Это даст здоровье и бодрость. Тонус в

теле, хорошее кровообращение - лучше работает мозг.
В офисе студии itloft половина сотрудников, по своему желанию, перешли на стоячие рабочие места.
Стоячее рабочее место можно очень легко сделать дома самостоятельно: youtube.com/watch?v=qaSOoLbyBt4 - ролик о том, как это сделал я.
Слайд 27

Стоя работают всё чаще http://bazarny.ru/ - в некоторых школах уже учатся

Стоя работают всё чаще

http://bazarny.ru/ - в некоторых школах уже учатся стоя
http://www.planet-standup.ru/

- целый сайт о работе стоя
http://www.youtube.com/watch?v=j7FioTdZaEk - некоторые пошли дальше

Стоя за конторкой работали: Пушкин, Пётр Первый, Хемингуэй, Черчилль, Достоевский, Гоголь, Менделеев, Ленин, Маркс, Некрасов, Филлип Рот и многие другие.

Слайд 28

Клавиатура для профессионала Устают запястья? Признаки «туннельного синдрома» (RSI)

Клавиатура для профессионала

Устают запястья? Признаки «туннельного синдрома» (RSI)

Слайд 29

4. Полезные программы

4. Полезные программы

Слайд 30

“Слепая” печать Программы VerseQ Соло на клавиатуре Онлайн сервисы klavogonki.ru klava.org vse10.ru

“Слепая” печать

Программы
VerseQ
Соло на клавиатуре
Онлайн сервисы
klavogonki.ru
klava.org
vse10.ru

Слайд 31

Google Chrome Самые необходимые Web developer ColorZilla Page Ruler Clear Cache

Google Chrome

Самые необходимые
Web developer
ColorZilla
Page Ruler
Clear Cache
PixelPerfect
uBlock Origin
Ссылки вы найдете в

методических указаниях.
Слайд 32

PixelPerfect При виде вашей верстки, дизайнеру не должно хотеться плакать, хотя бы на 96%

PixelPerfect

При виде вашей верстки, дизайнеру не должно хотеться плакать, хотя бы

на 96%
Слайд 33

Operation System А чем пользуетесь вы?

Operation System

А чем пользуетесь вы?

Слайд 34

А чем пользуетесь вы? IDE vs Text Editor

А чем пользуетесь вы?

IDE vs Text Editor

Слайд 35

Что нужно установить обязательно Photoshop Sublime Text 3 Программу для снятия

Что нужно установить обязательно
Photoshop
Sublime Text 3
Программу для снятия скриншотов, варианты:
Monosnap
Joxi или

др.
Open Server или Xampp/Mamp
Программы для работы с FTP, варианты:
Filezilla
Transmit
Total Commander/MuCommander
CyberDuck

Программы и утилиты

Браузеры
Google Chrome
Firefox
Internet explorer
Opera
Дополнительно
Launchy (Synapse для Linux)
Ссылки - в методических указаниях.

Слайд 36

Лучшие способ попросить помощь у преподавателя: codepen Jsfiddle Favicongenerator - favicon

Лучшие способ попросить помощь у преподавателя:
codepen
Jsfiddle
Favicongenerator - favicon под все

устройства
fontsquirrel.com - генератор веб шрифтов
colorzilla.com - генератор CSS3 градиентов
c9.io - облачная IDE

Онлайн сервисы

Слайд 37

Sublime text 3 Главные плагины Package Control Emmet SideBarEnhancement SyncedSideBar BracketHighlighter

Sublime text 3

Главные плагины
Package Control
Emmet
SideBarEnhancement
SyncedSideBar
BracketHighlighter
AutoFileName
Дополнительно
jQuery Snippets pack
SFTP


Свои сниппеты

console.log($1);$2
]]>

cons

Горячие клавиши
CTRL + P - переход по файлам
CTRL + Shift + P - Command Palette

Самый быстрый порог вхождения. Также обратите внимание на Brackets, Atom

Слайд 38

Освоиться в группе ВКонтакте. Прочитать методичку по теме Общаться, знакомиться с

Освоиться в группе ВКонтакте.
Прочитать методичку по теме
Общаться, знакомиться с одногруппниками
Установить

программы из обязательного списка
Установить браузеры и плагины к chrome
Настроить Sublime text (или atom, или brackets)

Что нужно сделать после вебинара?

Слайд 39

Полезные ссылки Посмотреть Видео урок про установку и настройку Sublime text

Полезные ссылки

Посмотреть
Видео урок про установку и настройку Sublime text
Видео курс про

Brackets
Видео курс про Atom
Emmet
JSFiddle

Почитать
Термины для новичков
Правила обучения
Список литературы на курс