Я работал на новой работе две недели, когда понял, что она станет моей старой работой. Меня бросили на растерзание львам. Я мог видеть кровь на их зубах. Я задавался вопросом: «Как это произошло?» Я знаю, как программировать. Я успешно закончил со степенью в СНГ. Хотя я знаю, что это не то же самое, что CS, нам все равно нужно было уметь программировать. Но я терпел неудачу, и я терпел большие неудачи.

Меня попросили разработать интерфейс Angular для серверной части, которую одновременно писал другой разработчик. Я никогда не занимался программированием на Angular. Черт, я никогда не занимался программированием на JavaScript. Но насколько сложным может быть JavaScript, верно? Все всегда говорили об этом свысока, как будто это был игрушечный язык. Язык для новичков. Если бы это было важно для учебы, конечно, мы бы использовали это в школе!

После двенадцати недель пыток я создал глючное клиентское приложение. Это было хорошее начало, и я уверен, что это было больше, чем мой босс думал, что я буду производить. Но по истечении двенадцати недель меня отпустили. Причина: я недостаточно знал JavaScript.

В течение последнего года после этого опыта я в среднем 2,5 часа в день программировал на JavaScript. Это 10 вещей, которые я хотел бы знать с первого дня. (Не все из этих пунктов относятся к проблемам с JavaScript, но я думаю, что они являются важной частью инструментов, которые нужны «новичкам», когда они начинают профессиональную работу):

  1. HTML и CSS. Отличительной чертой JavaScript является то, что у него нет библиотеки пользовательского интерфейса, и он никогда в ней не нуждался. JavaScript захватил HTML и CSS, превратив эти инструменты в пользовательский интерфейс для языка. Но чтобы эффективно использовать JavaScript (по крайней мере, во внешнем интерфейсе), я должен был знать, как создавать статические страницы, и я должен был знать об атрибутах HTML-элементов и их взаимодействии с правилами CSS.
  2. Объектная модель документа (DOM) — самой сложной частью обучения созданию сайта на Angular на лету было отсутствие у меня знаний о JavaScript и объектной модели документа. Проблема усугублялась отношением Angular к DOM. Если вам не нужно получать доступ к DOM, как вы можете узнать об этом? Я недостаточно знал о DOM, чтобы знать, что Angular делает за кулисами, и помогает ли это моему процессу разработки или вредит ему. Я не знал о сценариях DOM или о соответствии 1:1 между HTML, атрибутами CSS и свойствами элемента DOM. Никогда не управляя состоянием браузерного приложения, я потерялся.
  3. «Причуды» JavaScript. Глядя на код JS, вы можете не увидеть ничего необычного на первый взгляд. Вы можете заметить var, let и const, но это вас не шокирует. Но как только вы раскроете коробку, выскочит семиглавый зверь из Откровения! Замыкания, обратные вызовы, функции, определенные в местах, куда помещаются параметры!..Что это за безумие? Почему функции объединяются в цепочку? Почему определяются объекты, не имеющие классов? Что такое «прототип»? Что такое стрелочная функция? Что такое анонимные функции? Кроличья нора становится глубокой очень быстро.
  4. React — ничего не зная о мире JavaScript, я хотел бы знать о войне фреймворков между Angular и React. Для приложения, которое я создал, если бы я мог вернуться в прошлое и выбрать между ними, я бы использовал React. Использование Angular для создания моего проекта было похоже на использование базуки, чтобы убить кролика. Конечно, вы можете выполнить эту работу, но зачем? React было бы намного проще изучить и использовать.
  5. Отладчик Chrome. В школе почти все, что я создавал, было тривиального размера. Я всегда мог прорубить себе путь из леса, и я действительно думал, что именно так программисты пишут код. Неправильно! Когда дела пошли плохо, и мне нужно было знать, где мои выходные данные, отладчик стал спасательным кругом, о котором я даже не подозревал. Я не знал, что console.log мне не друг, что он хранит секреты за моей спиной. Я не знал, что console.log сообщит вам то, что, по его мнению, вы хотите знать, а не то, что происходит на самом деле. Использование console.log похоже на друга, который скрывает от вас правду «для вашего же блага». Спасибо, но нет!
  6. Git — в школе вы обычно работаете в одиночку, а проекты достаточно малы, чтобы код мог уместиться в нескольких функциях. Я мог скопировать свой код, сохранить его на переносном диске и престо, мгновенно создать резервную копию. Работая над этим проектом, я оказался в реальном мире, где люди используют Git. Мир, в котором код может разветвляться самым безумным образом, и вам захочется постоянно пробовать новые идеи. Нет ничего более дилетантского, чем тот, кто не фиксирует изменения, которые они вносят в свой проект. По крайней мере, я должен был делать это на своей локальной машине. О, невежество новичка!
  7. Узел. Узел большой. Немногое, что я знал о JavaScript, это то, что это язык для браузера. Но времена изменили моих друзей. JavaScript вырос, и я все еще смотрел на его детские картинки. Приходилось многому учиться: npm, gulp, webpack, Babel, package.json и т. д. — куча терминов и идей, которые добавляли шума и беспорядка. Дело не в том, что мне нужно было освоить все эти инструменты. Проблема заключалась в том, что когда что-то пошло не так, была ли проблема одним из этих инструментов? Я не отличал деревья от леса. Было слишком много переменных для обработки.
  8. Webflow — Как единственный разработчик, работающий над проектом, я получил чистый лист. Помимо «что, черт возьми, такое Angular?» вопросы крутились в моей голове, я также не знал, что делать с дизайном внешнего интерфейса для проекта, поскольку никогда не писал HTML или CSS. Было бы неплохо узнать об инструментах, помогающих создавать каркасы и макеты статических веб-страниц. Таким образом, я мог бы предложить что-то моему работодателю, чтобы показать им, что я начал процесс разработки. Единственное, что они видели, это то, что я читал документацию.
  9. Одностраничные приложения (SPA). В начале своего становления программистом я думал о разнице между Интернетом и программами, работающими на настольных компьютерах. Я довольно быстро понял при использовании приложений в браузере, что обновление страницы было большой проблемой. Я подумал про себя: «Что, если бы вы могли создавать приложения, которые запускаются в браузере, но не требуют перезагрузки страницы?». На этой работе я наткнулся на решение этой проблемы. Но SPA — это совсем другой мир, чем разработка веб-сайтов/статических страниц. Управление состоянием становится очень сложной проблемой, особенно для новичков в JavaScript. Также было бы здорово понять, почему SPA используют компоненты и пользовательский HTML для построения представлений.
  10. API-интерфейсы RESTful. Последним в списке является концепция сервисов RESTful, API-интерфейсов и написания асинхронного кода. С Angular вы используете Observables для выполнения вызовов на сервер. Как я ни старался, я не мог заставить все мои звонки работать чисто. Я мог бы заполнить некоторые таблицы, но у меня были проблемы с эффективным извлечением всех данных. Некоторые из моих таблиц требуют, чтобы я дважды вызывал данные для обновления. По сей день я никогда не узнаю, были ли все проблемы моей ошибкой или разработчик серверной части неправильно настроил свой API. Была проблема межсайтового скриптинга, которую я решил, о которой он ничего не знал, пока я не поймал его ошибку, и были другие вещи, которые он сделал, которые заставили меня почесать голову (пробелы в именах столбцов базы данных?). Но я был бы намного эффективнее, если бы понимал, как JavaScript работает асинхронно, а также как использовать обратные вызовы или Fetch API для извлечения данных.

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