Если вы провели какое-то время в Интернете, пытаясь изучить разработку программного обеспечения, вы знакомы с учебным пособием YouTube. Пытаетесь ли вы написать Hello World! в Javascript» или создайте полный клон Instagram. Нет недостатка в ютуберах, которые пытаются помочь вам научить улучшить [свое место в алгоритме YouTube и привлечь внимание к своим видео] при разработке программного обеспечения. навыки и умения. Тем не менее, столь же распространенной, как и учебная программа YouTube, является концепция ада обучающей программы YouTube.

Tutorial Hell — это бесконечное завершение проектов, следуя руководствам на YouTube. Часто можно получить отличные результаты (любой может создать и опубликовать приложение для Android менее чем за 4,5 часа с помощью freeCodeCamp), но в конце видео также можно не понять, что только что произошло. Какая часть процесса сохраняется? Каковы были основные понятия? Процесс или продукт важнее? Возможный ответ на любой из этих вопросов — вернуться к другому руководству — вперед и создайте 15 ванильных проектов JavaScript чуть более чем за 8 часов.

Теперь, чтобы быть совершенно ясным, я не пытаюсь язвительно относиться к контенту, который создают эти создатели. Я провел довольно много времени на YouTube — посмотрите моих любимых инструкторов YouTube — просматривая различные уроки, и мне это понравилось. Приятно следовать за кем-то, кто действительно понимает, что он делает. В конце концов, нечасто любитель получает прямой доступ к профессионалу.

В настоящее время я также изучаю разработку программного обеспечения в General Assembly, поэтому YouTube не является моим основным источником контента и совершенствования навыков. Я также провел большую часть двух десятилетий в качестве профессионального педагога, поэтому у меня есть четкое представление о том, как учиться, что сослужило мне хорошую службу, поскольку я дополнил свое формальное обучение контентом YouTube — и не попал в ловушку ада YouTube. . Вот как я подошел к недавно найденному учебному пособию Создание лучшего приложения todo — HTML и CSS, которое является результатом сотрудничества Кевина Пауэлла и Кайла Кука.

Во-первых, следуйте за создателем, но используйте кнопку "пауза". Заманчиво ускорить видео, чтобы максимально использовать эти учебные минуты, но у создателя есть немало преимуществ. Во-первых, он или она подготовили все заранее. Они редко пишут код с ходу — на самом деле, есть большая вероятность, что они используют эталонный монитор и перепечатывают код, который они уже разработали. Во-вторых, они хороши в том, что делают. С повторением приходит опыт, которого не хватает новичкам, поэтому останавливайте видео почаще… очень часто. Видео Кевина, на которое я ссылался выше, длится чуть менее 40 минут; тем не менее, я считаю, что провел большую часть 3 часов, пробираясь через это. Зачем останавливаться, спросите вы? По причине №2.

Вы должны комментировать... все время. Если вы только начинаете, HTML, CSS и JavaScript имеют уникальное форматирование для вставки комментариев в ваш код. Эти комментарии не будут прочитаны компьютером: они предназначены для человеческого глаза. Ниже приведены примеры каждого формата.

<!-- This is an HTML comment -->
/* This is a single-line comment in CSS */
/* This is
a multi-line CSS
comment */
// Any text on this line will be ignored by JavaScript
/* This is 
a multi-line JavaScript
comment
*/

Вот пример моего CSS из учебника:

/* The * selector selects all elements.*/
/* The ::before selector inserts something before the content of each selected element(s).*/
/* The ::after selector inserts something after the content of each selected element(s).*/
/* inherit means that the element inherits this property from its parent element.*/
/* When you set the width/height of an element, the element often appears bigger than you have set (because the element's border and padding are added to the element's specified width/height). The box-sizing property allows us to include the padding and border in an element's total width and height.If you set box-sizing: border-box; on an element, padding and border are included in the width and height*/
*,
*::before,
*::after {  
font-family: inherit;  
box-sizing: border-box;
}

Как можно чаще я ставлю видео на паузу, чтобы вставить комментарии, чтобы не вводить код мастера (это код, который волшебным образом и необъяснимо работает). Крайне важно понимать, что вы на самом деле делаете, гораздо важнее, чем просто продолжать делать. Как только вы доберетесь до незнакомого элемента или свойства, сделайте паузу и перейдите в Веб-документы MDN или W3Schools, чтобы найти его. Таким образом, вы цените процесс больше, чем продукт: ваша цель — учиться, пока вы работаете, а не просто производить что-то, не понимая, как оно появилось. Так что не стесняйтесь нажать на паузу и вставить собственное понимание в свой код.

В-третьих, поставьте перед собой собственную цель(и) обучения. Лучшее обучение происходит на грани хаоса и разочарования. Слишком много дискомфорта, и ученик просто чувствует себя потерянным: невозможно отличить хорошее от плохого или правильное от неправильного. Есть стадии понимания, через которые человек неизбежно проходит:

  • Неосознанная некомпетентность: стадия, на которой вы не знаете, чего не знаете. Можно назвать это блаженным невежеством.
  • Сознательная некомпетентность. этап обучения, на котором вы остро осознаете, как многого вы не знаете. Теперь вы столкнулись с достаточным количеством информации, которая может быть ошеломляющей — это этап, который может быть самым сложным для преодоления.
  • Сознательная компетентность. У вас достаточно навыков и понимания, чтобы знать, что вы делаете. Вы не можете сделать все это, но это меньше похоже на питье из пожарного шланга и немного больше похоже на глоток из садового шланга.
  • Неосознанная компетентность. Теперь вы достаточно способны, чтобы вам было трудно вспомнить то, чего вы раньше не знали. Это связано с концепцией порога: как только вы научились кататься на велосипеде, очень сложно вспомнить, что значит не знать. Это прекрасное место; однако всегда важно следить за своим собственным пониманием, чтобы оно не отклонилось назад к бессознательной некомпетентности.

Чтобы следить за своим пониманием, поставьте собственные измеримые цели при работе с учебным пособием. Когда я наблюдал, как Кевин работает с CSS, меня так же интересовал его рабочий процесс и то, как он прыгает туда-сюда между классами, как и сам код, который он писал. Я обратил внимание на то, как он визуализировал страницу, когда составлял свой HTML-код. Таким образом, я узнаю о процессе разработки программного обеспечения столько же, сколько и о настройке глобальных переменных цвета в main.css.

Наконец, отлаживайте собственный код. Многие авторы на YouTube рады поделиться своими репозиториями GitHub, чтобы их зрители могли работать с готовым кодом. Это может быть отличным справочным материалом, но отладка — это навык, который нужно развивать так же, как и писать. Например, у меня все еще есть проблема, заключающаяся в том, что мой текст-заполнитель в разделе создателя списка приложения To Do едва виден, см. Ниже:

Я работал над тем, чтобы сделать его более заметным, зная, что в любой момент я могу просто зайти в репозиторий Кевина и скопировать весь код, который мне нужен, и он волшебным образом заработает. Однако разочарование от отладки — это часть процесса, а не ошибка. Работайте над проблемой.

Как написал Мильтон в Потерянном рае: «Долгий и трудный путь из ада ведет к свету. «Если вы работаете с учебными пособиями или, к сожалению, застряли в аду учебных пособий на YouTube, я надеюсь, что это поможет вам ориентироваться в том, что может быть одновременно величайшей сокровищницей знаний и величайшим костылем в мире. Наслаждаться!

Ниже приведены задачи, о которых я упоминал в этой статье: