Как я учусь на курсах frontend разработки с помощью доработанного метода ZettelKasten
До недавнего времени я считал, что все on-line курсы обучения программистов с нуля — это один из 300 сравнительно честных способов отъема денег у населения. Почему? Да потому что с нашей специальности ВУЗа «программист» после 5 лет обучения не более 30% смогли начать работать по этой профессии. При этом к нам в группу шли самые умные парни и девушки со всего института. И мозги их были молодыми и неокостеневшими. И при этом такой слабый результат!
Потому, когда мой племянник пошел на подобные «быстрые» курсы, я лишь посочувствовал его бессмысленным (как казалось на тот момент) денежным тратам. Со слов племянника, там был бесплатный вводный курс, ссылку на который он выслал. И я решил лично проинспектировать современное предприятие Остапа Бендера. Однако, уже через пару часов обучения, мое мнение несколько изменилось.
Типичная реклама подобных курсов
Пару слов о моем опыте в программировании. Большинство реализованных за последние 30 лет проектов были классическими Desktop-приложениями на VB, Delphi, C#, Oracle, SQLite, PostgreSQL. Однако, в портфолио «затесались» и 4 полноценных WEB Интранет-проекта на Perl, ASP.NET и PHP. Посему я имел какое-то представление о WEB-разработке.
Так вот, первое что удивило, это структурированность предлагаемой информации. 90% излагаемого материала я и так знал. Но вот целостного представления не было. Здесь же не только давался материал, но и тут же в тренажере с сайта можно было проверить, как именно ты его усвоил. Известная в педагогике фича — то, что тебе кажется понятным, совсем не значит, что ты его понял. А задание на тренажере позволяет самому от себя получить обратную связь. В общем, я так увлекся, что с удовольствием прошел весь вводный курс. Кстати, узнал причину своих страданий на CSS во время реализации всех 4-х WEB-проектов.
Однако, даже на вводном материале я понимал, что многое скоро забудется. Потому параллельно оформлял весь новый материал по методу ZettelKasten в программе «LumanBox для Windows». Кстати, племянник жаловался, что нового материала много, и как его запомнить, а потом быстро вспомнить — неприятная проблема. Чтобы помочь ему, и тем, кто проходит подобные курсы, я решил сделать данную публикацию. То есть в данной статье продемонстрирую, как проходить on-line курсы по frontend программированию с использованием метода ZettelKasten для эффективной организации индивидуальной базы знаний. Такой подход будет преследовать сразу две цели:
глубоко усвоить новый материал (чтобы шипики в нейронах нашего мозга сформировались как положено);
сформировать свою личную базу знаний, которая будет позволять вспомнить необходимое знание хоть через год, хоть через 10 лет, максимум за пару минут.
Пример структурирования одного конкретного спринта on-line курса
Особенность подобных курсов является прямо таки вал новой информации для усвоения. Потому я сразу понял, что классический ZettelKasten здесь плохо будет работать. Пока по всем канонам оформишь индивидуальную базу знаний, любой deadline пройдет, и вылетишь с курсов за неуспеваемость! Поэтому организовал свою работу с ZettelKasten по следующему алгоритму:
По мере ознакомления с материалом, сталкиваясь с чем-то нетривиальным или важным, но трудно запоминаемым, сразу в программе LumanBox добавлял заметку. При этом грубо нарушая главное правило ZettelKasten — »никакой копипасты»! У меня наоборот, была одна лишь копипаста. Благо делать это в On-line курсах очень удобно — помечаешь куски текста заинтересовавшие, и копируешь.
однако уже на этом этапе старался соблюдать принцип атомарности заметки — одна заметка=одна идея. Кроме того, придумывал заметкам удобоваримые и понятные названия. Иногда в этом мне помогали толковые заголовки в самих курсах.
если для демонстрации идеи заметки нужны были исходные коды, которые были в тренажерах курса, не ленился копипастить и эти коды. Сохраняя их в заметках в виде аттач-архива (поскольку в примерах всегда было более двух файлов — как минимум *.html и *.css).
Пример аттача демо-исходников
Таким образом первичное заполнение ZettelKasten не сильно замедляло прохождение уроков с тренажерами.
обычно на следующий день после первичного заполнения своего Zettel, я повторно работал с уже созданными заметками. А именно:
добавлял необходимые ключевые слова;
проставлял тип заметок (что это — определение, алгоритм, пример, проблема и т.д.);
группировал заметки в папки внутри курса;
сортировал новые ключевые слова по категориям.
Пример проставления ключевых слов и типа идеи
Да, это занимало значительное время. Однако, материал новый реально укладывался и в моей голове, и в индивидуальной базе знаний. Обязательное повторение на следующий день пройденного материала — это старый лайфхак еще с ВУЗа, что позволяло комфортно учиться и высшей математике, и английскому, и новым языкам программирования.
По соотношению времени — на 100 единиц непосредственного прохождения on-line курсов, я тратил 10 единиц на первичное заполнение ZettelKasten, и 20 единиц времени на повторную работу с заметками. Итого превышение времени на работу с индивидуальной базой знаний было всего лишь на 30%.
Поскольку бесплатная часть курсов понравилась, то я решил пройти очередное повышение квалификации именно там, по специализации fullstack-программиста. Тут уже было на хабре, что в любых on-line курсах самое сложное — это сдавать проектные работы. На мой взгляд, проблема подобных курсов в том, что студента неверно ориентируют относительно его распределения усилий. Почему то у меня сложилось впечатление, что вот пройду обучение, меня научат, а потом на основании усвоенного материала сделаю проектную работу спринта. Но уже на первом спринте споткнулся о видеоразбор готового кэйса. Там было видео на 45 минут, как опытный верстальщик верстает сайт. Казалось бы, все его рассуждения базируются на уже пройденном материале. Но — лично мне было непонятным практически все. Я аж расстроился, как так очень внимательно прошел все уроки, добросовестно делал задания в тренажерах, но ничего не понял в готовом кэйсе. При чем, опять таки, повторюсь, курсы для программистов заявлялись с нуля, а я уже несколько WEB-проектов реализовал. И все равно разбор готового кэйса на первом же спринте для меня стал китайской грамотой.
Как создатели курсов видят новые нейронные связи в мозгу студентов, и какие они в реальности у большинства
Потом я успокоился, и решил, что раз так, буду изучать предложенный готовый кэйс, пока все не станет ясным. В общем, пересмотрел видео реализации учебного кэйса раз двенадцать. В т.ч. значительную часть покадрово, когда на экране мелькали куски исходников. Самостоятельно с нуля реализовал этот кэйс, основываясь на ТЗ и речам разработчика на видео. И в конце понял ошибку, наверное, всех разработчиков курсов. Они считают, что новые знания в мозгах студентов сразу выстраиваются как крымский мост, 4-х полосный и с дополнительными ЖД-путями. А на самом деле новые знания в подобных случаях — всего лишь перекидной пешеходный мостик над узким ручьем.
Дико смущал еще тот момент, что разбор готового кэйса — это всего лишь пара коротких уроков. 1/50 от всего спринта. И подсознательно считаешь, что нужно пройти их быстро. Но в реальности у меня на разбор готового кэйса ушло 1/5 от всего времени, потраченного на спринт. Однако именно на разборе этого готового кэйса почувствовал, как шипики нейронов в моем мозгу пришли в активное движение, и начали грандиозное строительство. Приятное, кстати говоря, чувство! И да, во время прохождения on-line курсов проснулся дикий аппетит. Особенно на сладкое и жирное. Физиологию не обманешь! Мозгу для построения новый нейронных сетей нужны стройматериалы.
Фундук, красная икра и батончики из темного шоколада — мои излюбленные десерты во время спринта
Разбирая готовый кэйс, я не просто понимал выполненный профессионалом проект, а тут же пытался его немного модифицировать, чтоб лучше понять детали. К примеру, менял фон, картинки, лэйаут, выравнивания, алгоритмы переноса и т.д. Или наоборот, убирал какие-то классы и свойства, чтобы понять, зачем они нужны точно. Как бы игрался проектом, чтоб лучше освоить все его нюансы.
Во время разбора готового кэйса очень помогала уже составленная база знаний. Пару секунд, и я вспоминал нужный материал. Но что более важное — опять таки пару секунд, и я понимал, что этого знания в уроках не было. И его нужно освоить самостоятельно. Т.е. я не рылся в on-line уроках курсах, выискивая, психуя и не находя нужное. А либо сразу находил искомое. Либо сразу понимал, что его нет, и нужно гуглить самостоятельно.
Кстати, самостоятельная работа — это та фича, из-за которой я чуть не вылетел из ВУЗа в молодости в свою первую сессию. Не понял, что нам задали какой-то материал на самостоятельную проработку, ведь такого не было в школе! То же и в on-line курсах. Там как-то не акцентировался тот момент, что нас не будут прямо таки всему необходимому обучать для сдачи проектной работы. И ведение индивидуальной базы знаний сразу позволило это понять. Как это — важно понимать то, что ты знаешь. Но еще важнее понимать то, чего именно ты не знаешь! Так сказать, отчетливо видеть границы своей компетенции.
Успешно пройдя первый спринт обучения, я понял пропорции усилий, которые необходимо прикладывать для учебы:
50% времени и внимания занимают уроки и задачи на тренажерах;
20% сил тратится на разбор и реализацию готового кэйса (по которому есть видеоразбор в виде урока на курсе);
30% усилий необходимо потратить на выполнение и сдачу проектной работы по спринту.
И да, усилия эти совершенно разные:
на уроки и тренажер силы тратятся познавательные. Т.е. здесь студент узнает что-то новое.
на разборе готового кэйса, на мой взгляд, происходит самое важное — выстраивается в мозгу новая нейронная сеть для реализации подобного рода задач. Т.е. формируется тот самый практический навык, ради которого все и было затеяно.
сдача проектной работы требует, в основном, обычной аккуратности и внимания к мелочам. Чтоб ничего не упустить из ТЗ. 80% требуемых практических навыков уже было должно быть усвоено на понимании готового кэйса на предыдущем шаге.
Еще стоит рассказать об ошибках на курсах. Все мы люди, все ошибаемся, и разработчики курсов тоже. Но — одно дело, когда грубая орфографическая ошибка нагло пялится на тебя из огромного заголовка урока. Это, конечно, неприятно и понижает уровень доверия к излагаемой информации, но не более того. И совсем другое дело, когда ошибка в уроках логическая. Например, дается часть теории, а потом предлагается сделать упражнение. Но автор курсов ошибся, и само упражнение поместил в тексте под тренажером. Который откроется только после успешного выполнения задачи. Я вначале пытался догадаться, о каком упражнении идет речь. Потом плюнул, и стал жать «проверить», и по сообщениям об ошибках смог восстановить саму постановку задачи. Таких ляпов в одном курсе как минимум штуки три. Обидно!
Так иногда, к сожалению, выглядят некоторые задания on-line курсов
Очень странно, что создатели курсов не додумались сделать обратную связь со студентами, чтоб можно было сообщить об орфографической/логической ошибке прямо со страницы курсов. Такой функционал есть во многих Интернет-магазинах.
В процессе прохождения курсов как то сами собой всплыли и позже были реализованы целый ряд доработок программы «LumanBox для Windows», упрощающих процесс обучения:
реализовал таки поддержку различных цветовых схем, спасибо пользователю @mnhunter81 за наводку! Сразу стало глазам удобней работать. Теперь работаю только в темных темах. Пример экрана ниже:
Демонстрация одной из темной темы, в которой я работаю постоянно
перенес хранение всех файлов из SQLite базы в указываемый пользователем каталог. Что значительно ускорило работу программы. Тем более, что этих сторонних файлов у меня уже 700 МБ. В т.ч. книги, сохраненные сайты, исходники, копии экранов, схемы, видео-уроки.
сделал возможность задавать ключевые слова сразу на весь источник. Имеет смысл для небольших источников, по которым создается всего 1–3 заметки. Чтобы не дублировать ключевые слова для каждой заметки.
самое важное — появилась новая возможность добавлять ключевые слова к элементам оглавления источника. Это просто незаменимая вещь при прохождении уроков. К примеру, если идет тема «псевдоклассы», то какой смысл к каждой заметке по этой теме добавлять ключевое слово «псевдоклассы»? Ключевое слово добавляется один раз — к элементу оглавления. А далее автоматически прописывается ко всем заметкам в этом пункте оглавления.
Пример добавления ключевого слова на весь элемент оглавления
Вместо итогов
Администрация on-line курсов не сообщает процент отчисленных с курсов после первого жесткого дедлайна. Однако я сразу заподозрил, что он высок. Уже есть негласная статистика по моему потоку. Если на первом занятии в Zoom было 65 студентов, то на последнем занятии перед дедлайном — всего лишь 24. Понятно, что не все студенты, не пришедшие на последнее занятие, бросят учебу. Однако все равно уровень не справившихся высок. С моей субъективной точки зрения, он не ниже 30%.
И тут студентам помочь сможет модифицированный ZettelKasten (в т.ч. с бесплатной программой «LumanBox для Windows»). Для понимания — как раз во время спринта меня угораздило подхватить ОРЗ/ОРВИ, и я неделю провалялся с температурой. Однако, несмотря на болезнь, я продолжал потихоньку проходить уроки. Внешняя структурированность учебного процесса с помощью ZettelKasten, по изложенному выше алгоритму, позволяла продолжать обучение. Даже в столь дискомфортном физиологическом состоянии. Тем самым я не выбился из графика и сдал все работы вовремя.
На проходимых мною on-line курсах были уроки по популярной сейчас тематике софт-скиллов. Для каждого базового спринта — свой курс софт-скиллов. С одной стороны это радует. Поскольку софт-скилы рулят, и это факт. Но с другой стороны сильно удивляет некая наивность авторов софт-скилл уроков. В подобных уроках даются лишь общие сведения о той или иной методике (Agile, Scrum, Kanban, …), но авторы почему то считают, что студенты сразу начнут все это применять в жизнь. Они это серьезно?
Здесь речь идет о существенном изменении стиля жизни человека. Что, как показывает практика коучеров и психоаналитиков, штука очень непростая и долгая. Однако, эти неумелые попытки побудить студентов использовать Agile-философию, навели меня на интересную идею. А именно, прикрутить к ZettelKasten Scrum. Ведь действительно, мы изучаем новую информацию не просто так. Она тем или иным образом преобразуется в проекты. IT-проекты или бытовые, не суть важно. И тут аж дух захватывает от открывающихся возможностей. Когда компьютерные системы будут помогать не только запоминать информацию и восстанавливать контекст, но и погружать человека в Agile философию на всех уровнях его бытия через автоматическое ведение проектных бэклогов! По этой теме планирую сделать отдельную публикацию для всеобщего обсуждения. С примером интерфейса нужного функционала, разумеется!
p.s.: автор не ставил своей целью рекламировать или ругать какие-то конкретные on-line курсы обучения программирования. А просто рассказал свой опыт прохождения одних из таких курсов при помощи популярного метода структурирования информации ZettelKasten.
