Дело было в период локдауна. Каждое
воскресенье в 8:30 утра кухня превращалась в превращалась в в
импровизированную студию для вебинаров с лайвкодингом.
В этой статье я расскажу о MVP курса по обучению программированию, который возник благодаря удаленке.
Удаленщиком я стал по зову сердца, еще в 2017-м. Работа из дома высвободила мне около 10 часов в неделю и я впервые задумался о том, чтобы делиться опытом. Так я стал наставником в одной известной онлайн-школе, и остаюсь им по сей день: ревьюю код студентов, помогаю им с вопросами по учебным проектам.
За это время через меня прошли десятки новичков и одна из проблем, с которой я сталкивался регулярно, большинство школ, предлагая курсы начального уровня, все же предполагают, что у студентов уже есть некие знания, а может и опыт. Однако среди моих подопечных регулярно встречались те, кто слабо понимал базовые алгоритмы, работу с переменными, массивы, условия и циклы все это приходилось кропотливо объяснять в личных разговорах и переписках. Когда рассказывал очередному студенту, подумал: хорошо бы сделать свой ликбез и давать ссылку на него. Так в голове поселилась идея создать небольшой курс по самым азам разработки.
Идеальный шторм
Годами идея так и оставалась идеей. То времени не хватало, то шел поток сильных ребят (а им вроде и не нужно) короче, я долго находил какие-то отговорки. Но все изменилось в начале 2020-го.
Удаленка дала мне еще одну возможность: больше времени проводить с семьей. Пока дети маленькие, каждую зиму мы стали уезжать в теплые страны: часть времени я работаю, часть провожу в полноценном отпуске. Та поездка оказала самое благоприятное влияние на мысли и цели.
Шри-Ланка. Месяц до локдауна. И полтора
месяца до старта всей затеи.
Где-то в тот момент я прочитал о технике достижения целей Майкла Роуча. Алгоритм простой, всего 4 шага. Если кратко: поставить себе любую цель, найти человека, который тоже хочет к ней прийти, помогать ему бесплатно раз в неделю и искренне радоваться его достижениям.
Мне захотелось проверить этот метод на практике. Так что я подумал: вернусь и напишу в соцсетях анонс о наборе группы для обучения программированию. А там будь, что будет.
В марте 2020-го мы вернулись домой, а через пару недель был объявлен режим самоизоляции.
У многих вынужденно появилось по несколько свободных часов в день. Я подумал: возможно, найдутся те, кто захочет потратить их на обучение азам программирования. Тогда и решил - либо начинаю прямо сейчас, либо пора выбросить эту затею из головы.
Я разместил пост в соцсетях... и записалось 3 человека
Я не стал заморачиваться с лендингами и
прочим: короткое описание и форма регистрации, больше ничего не
было.
То, что курс будет бесплатным, я решил четко (уж больно хотелось попробовать метод Роуча). Плюс, я не маркетолог: поэтому платную рекламу отверг сразу. Оставались посты в соцсетях. Чтобы написать их, я сел формулировать идею курса. Вот что получилось.
-
JavaScript, потому что они же новички по сути, имея браузер, ребята с первого занятия смогут что-то сделать, не заморачиваясь с настройкой окружения. Мне вообще-то ближе PHP, на работе пишем на нем.
-
Лекции с лайвкодингом, как у Пола Хегарти из Стэнфорда одно время я руководил командой мобильных разработчиков и смотрел его курсы по iOS-разработке, чтобы лучше въехать в тему. И скажу, что живое программирование это очень круто. Даже опечатки и прочие сбои играют на руку: для лектора это возможность что-то дообъяснить. А для студентов, кто только думает о работе программистом, это даст понимание, как оно бывает.
-
Занятия по воскресеньям, в 9 утра требований к опыту я не предъявлял, готов был обучать с нуля. Но вот требования по мотивации, особенно при учете бесплатности, оставил. Когда-то я ходил в воскресную школу программирования при ННГУ. Да, иногда было тяжело, но программирование это не легкая прогулка, привыкайте)
Да и с учетом основной работы, так было проще: нужна была хотя бы суббота, чтобы набросать план нового занятия.
Время на практику и самоподготовку - это
важно. Те, кто не делал первую домашку, со второй лекции стали
отстающими.
Между лекциями нужна объемная домашняя работа. На стримах планировался в основном лайвкодинг плюс разъяснения у доски, а теория, тренажеры, все это уйдет в самостоятельную работу. Плюс, чтобы ребята научились писать базовые алгоритмы и решать задачи, изучили возможности JavaScript в браузере, написали финальный проект для портфолио нужно много практики между занятиями. О том, что на домашку потребуется от 10 часов в неделю, я честно говорил в анонсе и повторял в анкете регистрации.
За 6 дней до старта у меня были: анонс, анкета, план первого урока и цель провести шесть занятий. Я шел путем, принятым в продуктовой разработке: накидываем видение, тестируем спрос, потом итеративно пилим фичи. Неожиданно, спрос превысил предложение, и пару фич пришлось запиливать в авральном режиме.
Через день: у меня 49 желающих. Как это автоматизировать?
Исходно я рассчитывал на 5-10 учеников, но соцсети сходу принесли лишь пару заявок. Поэтому у меня был запасной план. У нас в Skyeng работают несколько десятков тестировщиков, и вечером того же дня я закинул анонс в канал QA. Ребята из тестирования оказались очень благодарной публикой. Кто-то задумывался о переходе в разработку и хотел попробовать занятия с наставником, большинство увидели в изучении JS возможность автоматизировать рабочую рутину.
По истории скриншотов можно заметить, что
я хотел попробовать для занятий Skype, затем Hangouts - но за пару
дней до старта поменял решение. А потом поменял его еще раз.
Так за пять дней до старта заявки перестали быть проблемой в итоге в форме отметились 49 человек (много QA из Skyeng, был даже тестировщик из моей команды; плюс еще несколько человек пришло из соцсетей). Теперь на передний план вышли другие головные боли.
Пишем юнит-тесты для проверки домашек. Основной проблемой стали домашки: между лекциями я хотел давать по две задачки. Я представил, как буду проверять решения нескольких десятков человек и ужаснулся. Сначала задумался о поиске помощника, но найти человека за несколько дней казалось нереальным. Так что решил все максимально автоматизировать: написать юнит-тесты к задачам и научить студентов их запускать самостоятельно.
Помню, как над тестами пришлось сидеть до
2 ночи. Зато потом это сэкономило мне кучу времени и нервов.
Я завел репозиторий на гитхабе, придумал 12 задач для основного курса, плюс выпускные проекты на выбор. Весь остаток недели оформлял задачки и писал к ним тесты. Зато потом мне надо было просто отправлять студентам ссылку на задачку гитхабе: они решали ее, запускали мои тесты, и если они были зелеными домашка зачтена.
Собираем всех в одном месте. Я решил сделать телеграм-канал для анонсов, рассылки домашек, публикации напоминаний. Чтобы оповестить всех записавшихся, написал скрипт рассылки.
Единственное, что не удалось
автоматизировать - это написание текстов) А тк телеграм тогда
формально блокировали, сделал зеркало.
Параллельно с каналом появился чат туда можно было писать вопросы по домашкам. Я или ребята, кто был посильнее, всегда отвечали. Но так как формат был бесплатным, персональной обратной связи студентам не предполагалось.
Автоматизируем сбор обратной связи от студентов. Курс рождался на ходу, мне важно было собирать фидбек после занятий. Я создал гугл-форму для анонимных отзывов: просил поставить оценку занятию и в свободной форме написать, что понравилось, а что стоит улучшить. Заодно прикрутил к каналу-каналу ControllerBot он помогал автоматизировать постинг, добавлять реакции и ссылки в виде кнопок к постам, особенно это выручало, когда линков было много.
Так выглядел пост по итогам первого занятия.
Из ручных операций оставалось лишь заходить в гугл-форму перед новым занятием, закрывать сбор ответов о прошлом стриме и открывать прием отзывов и оценок по-новой.
Утром 29 марта 2020 года я был готов начать курс. Единственное, что меня беспокоило это трансляция. Так как времени на поиск инструмента было немного, я попросил доступ к корпоративному Zoom: в нем проходят внутренние митапы нашей разработки.
Первый стрим комом
Само занятие прошло хорошо. Я начал с демонстрации тезиса, что каждый может немного программировать, если у него есть браузер: показал, как локально менять код, предложил ребятам повторить. Затем добавил интерактива: открывал порты через ngrok на своем компьютере и ребята получали реальные ответы от моего сервера. А в конце занятия мы уже писали простенький сайт и настраивали рабочее окружение: VSCode, git, cmdr + либа parcel для быстрого запуска кода.
Результаты из той самой анонимной формы
обратной связи.
Но вот Zoom меня подвел. Во-первых, запись получилась кривой я только постфактум узнал, что нужно настраивать отображение для записи, чтобы лица не перекрывалась часть экрана :)
Черная область на записи - еще одна моя боль.
А главное, я не смог быстро научиться управлять сменой планов в Zoom:
-
Мой экран в режиме демонстрации.
-
Я перед ноутбуком.
-
Я возле физической доски, на которой иногда нужно что-то рисовать.
-
Плюс, комментарии ребят, за которыми нужно следить.
В общем, я решил искать инструмент для стримов дальше. И когда заливал видео на ютуб-канал, решил посмотреть, а что сам хостинг советует для организации трансляций. Оказалось, у них есть хорошая документация: в частности, там были ссылки на несколько инструментов. Я быстро прочитал отзывы и по ним мне понравился OBS.
Я нашел на ютубе 10-минутный рассказ, как запустить стрим через эту софтину. Понял принцип ее работы. И решил попробовать.
Как я тюнил трансляцию и запись
Старый жидкокристаллический дисплей я
забрал у родителей: они уже было хотели его выкидывать, а мне он
пригодился, чтобы чекать трансляцию на ютубе. Вместе с этим
потребовалась хитрая система переходников с VGA на Type-C.
За следующую неделю я поставил OBS и разобрался, как стримить на ютуб, имея несколько источников захвата: камеру макбука (чтобы было видно меня в окошке), экран с IDE и браузером, внешнюю камеру на триподе для съемки объяснений у доски. Также для стабильности сигнала я отказался от вайфая и прокинул на кухню 20 метров патч-корда.
Стало сильно лучше.
Чуть позже я открыл, что при связке macOS и iPhone можно также выводить в трансляцию экран смартфона и иногда пользовался для работы с комментариями.
Заодно придумал, как автоматизировать создание таймкодов. Оказалось, в настройках ютуба можно включить создание автосубтитров: если скачать их, то откроется список таймкодов остается найти там ключевое слово и скопировать таймстамп в описание ролика.
Как была устроена подготовка к стриму
В пятницу вечером я отвозил детей и жену к родителям в деревню. Всю субботу мы отдыхали, а когда все ложились спать, я писал верхнеуровневый план и тайминг лекции здороваемся, разбираем домашку, разбираем темы, работаем в IDE. Помимо сценария, для тренировки писал код, который хотел показать на стриме, заранее запускал-проверял, а затем распечатывал и подсматривал как в шпаргалку.
Заодно учил ребят код-стайлу - и почему это важно.
В воскресенье рано утром я ехал домой вести курс час в дороге, и вот ты в пустой квартире. Удачно, что в это время никто обычно не сверлит, не устраивает домашних дискотек и так далее.
Разложиться - почти как к концерту подготовиться. Процесс занимал минут 20-30. Я доставал большую сумку (там хранились монитор, провода, переходники, гарнитура), заваривал чай и начинал все расставлять и настраивать для эфира.
-
переставлял стол;
-
приносил детское кресло на него ставился трипод для камеры;
-
доставал удлинитель на 5 розеток, запитывал монитор, принтер, ноут и телефон;
-
включал авиарежим на телефоне;
-
выключал Docker на втором стриме ноут гудел очень сильно, а когда я полез разбираться, оказалось, рабочие проекты Skyeng крутились в фоне;
-
заходил в VSCode, создавал папку и пустые проекты чтобы на стриме переключил экраны и все готово;
-
и, конечно, отключал все нотификации на телефоне.
Бэкенд. Коробка из-под обуви очень выручала.
Чтобы ничего не забыть, я завел чек-лист подготовки и шел по нему. Минут за 15 до занятия все было готово оставалось запустить клиент OBS, проверить настройки (включен ли чат, не сбились ли битрейты) и быть готовым выйти в эфир.
Фронтенд. Это мы разбираем проекты ребят
на финальном занятии.
Казалось, к третьему занятию все наладилось. Но затем возникла новая проблема.
Они не делают домашки... Что делать?
Ребята активно подключались к лекциям. А вот задачи между стримами делали не так хорошо. Тогда я придумал конкурс: ввел систему рейтинга и объявил, что лишь те, кто решит все 12 задачек и пришлет их до майских, получат доступ к финальным проекту.
В качестве финальных проектов я выбрал
Арканоид и Тир.
Домашки можно было решать в любое время, но прислать строго до дедлайна, загрузив все результаты в общую форму. В итоге, в конкурс вовлеклись 15 человек а еще один принес решение на час позже дедлайна. Пришлось отказать(
Были и забавные случаи. Один студент решил задачу нахождения длины числа без циклов: математической формулой, выразив результат через логарифм. Другой вскрыл баг в моих юнит-тестах. За такие вещи я добавлял баллов.
Желтым отмечены как раз такие необычности.
Домашки участников конкурса я перепроверял вручную 15 человек, 12 решений. 180 раз я запускал программу. Сидел в субботу до двух ночи, так как обещал, что в воскресенье на предпоследнем занятии объявлю результаты.
Я рассказал ребятам про финальные проекты, а также подсказал классный хостинг Surge, там можно бесплатно и быстро (просто из командной строки, без регистрации) размещать фронтовые проекты. Так мы разошлись до после майских и финального стрима, где я обещал разобрать их готовые проекты.
Студенты делятся на два типа
Несколько ответов из формы заявки на курс с какими ожиданиями приходили люди:
Хочу
Чтобы программировать разные штуки)
Не хватает знаний JS, чтоб писать автоесты. Ну и просто это очень интересно! :)
У меня давно было желание заняться программированием т.к. хочу получить новые знания и новую профессию. Есть диплом инженера-системотехника, но я давно не работал в этой сфере.
За месяц группа поредела на две трети. Я сел анализировать, почему так. И быстро заметил, что студенты поделились на две категории: те, у кого все получалось почти самостоятельно. И те, у кого скобки не ставились.
Для ребят, которые понимали, как будут применять знание в работе, тех же тестировщиков, все было по фану. А вот из совсем новичков только один сделал огромный шаг вперед. Многие же решили, что программирование это не для них.
Люди думали, что интерпретатор их поймет, но... нет. Нам, разработчикам, многие вещи кажутся очевидными. Например, что у языка жесткий синтаксис фигурные, круглые скобки, точка с запятой. Или то, что переменные вне и внутри функции, даже если обе названы А, они разные это же две разные области видимости. И даже когда ты это показал и рассказал, не факт, что человек все уяснил.
Бывали и обратные случаи: ученик сразу пробовал отправлять запросы на сервера, изучать фреймворки еще не разобравшись с базовыми вещами. Это выглядело как попытка сразу перескочить из 1-го класса в 5-й. И примерно также оканчивалось...
Наверное, сейчас я бы сразу делил людей на мини-группы по уровню и приставлял к каждой группе по ментору, чтобы быстрее подмечать проблемы и помогать прогрессировать. Но это уже больше похоже на полноценный платный курс.
Что по итогу
-
49 человек зарегистрировалось, примерно столько же смотрело прямые эфиры.
-
15 человек решили все задачи, финальный проект сделали 4. Один дослал проект через полгода.
-
Один студент тот самый новичок, решил продолжать развитие в веб-разработке. Он пошел на другие, уже платные курсы, плюс мы потихоньку продолжили изучение технологий и пилили пет-проекты. За год он дорос до уровня джуна: разместил резюме и сейчас ходит на собеседования.
Я решил не продолжать делать курсы в одиночку. Организация это как минимум половина успеха. Мне повезло, что не понадобилась большая работа по продюсированию и маркетингу, народ пошел с пары постов. Но даже на таком уровне стало очевидно, что мало придумывать и вести лекции. Стрим, канал, сбор фидбека, да даже создание картинок для видео есть масса мелочей, которые требуют внимания и времени. И это я еще про монетизацию не задумывался.
Кстати, про деньги. Хотя курс был бесплатным, еще в анонсе я заявлял, что не против донатов. И после первого занятия (того самого, с глючным зумом) завел форму для сбора денег.
От первого к последнему занятию динамика
выглядела так.
Всего набралось около 7 тысяч рублей. На один из первых донатов я купил пару переходников для монитора, чтобы улучшить стримы. На оставшееся оплатил небольшое обучение себе.
Вот как-то так прошла моя самоизоляция.
А еще, от курса остались артефакты:
Если вы думали делать свои уроки или искали простые задачки по JS, надеюсь, вам пригодится.
