Путь разработчика в современную веб-разработку

Я занимался разработкой корпоративного программного обеспечения (.NET) около шести лет, когда начал заниматься веб-разработкой. Сегодня я расскажу вам о путешествии, о том, что я мог бы сделать лучше и о своих планах на будущее.

Примечание. Эта запись изначально была опубликована на моем веб-сайте.

Как все начиналось

Мне всегда нравилась идея стать веб-разработчиком. В 14–18 лет, когда я еще учился в школе, мне нравилось возиться с HTML и CSS и создавать с их помощью веб-сайты меньшего размера. Хотя я не очень хорошо в этом разбирался, это вызвало у меня интерес. Затем я начал работать разработчиком программного обеспечения для корпоративного программного обеспечения и в течение следующих нескольких лет мало занимался веб-разработкой, пока мне не пришлось написать диссертацию для моего неполного рабочего дня, где я решил написать о фреймворках JavaScript и о том, как они влияют на качество программного обеспечения одностраничных приложений по сравнению с использованием ванильного JavaScript.

Angular и стек MEAN

Я подумал, что если я просто сосредоточусь на изучении одного урока за другим, то скоро смогу создать что-то собственное.

Мне очень понравилось то, что я узнал во время написания этой диссертации, поэтому я продолжил изучать AngularJS (тогда это был Angular 1) и сосредоточился на создании руководств, чтобы узнать больше об этом. В какой-то момент я решил, что хочу знать, как создать бэкэнд для простого приложения angular. Это был также момент, когда я обнаружил что-то, называемое стеком MEAN. Я был поражен, как все это работает вместе. Мне нравится. Так что я сделал кучу руководств по полному стеку. Я подумал, что если я просто сосредоточусь на выполнении одного урока за другим, я скоро смогу создать что-то самостоятельно. О, мальчик, я был так неправ.

Угловой 2

После нескольких месяцев обучения по вечерам несколько дней в неделю, Angular 2 находился на поздней стадии бета-тестирования, и ходили слухи, что скоро будет опубликован первый релиз-кандидат. Хорошо… новое всегда лучше (подмигнуть 😁), поэтому я взглянул на Angular 2, и это был отличный опыт. Мне понравилась концепция компонентов, и работать со всем этим стало немного проще. И снова я сделал кучу руководств, пока коллега не рассказал мне об идее и не спросил, можно ли ее реализовать. Впервые с тех пор, как я начал изучать веб-разработку, я смог создать что-то реальное. Что-то, что когда-нибудь может пригодиться. Почти каждый рабочий день после работы я приходил домой и проводил вечер, пытаясь создать это веб-приложение с помощью того стека MEAN, который я изучил ранее. И вдруг я понял, что ни хрена не знаю, как делать все эти вещи. По сути, все, что я узнал во всех этих уроках, было потеряно.

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

ReactJS

В один солнечный день, когда был выпущен еще один Angular 2 RC с большим количеством критических изменений, этого было достаточно. Я все выбросил, просто чтобы изучить ReactJS и начать все сначала. Мои друзья и раньше рассказывали мне хорошие отзывы о React, и он поддерживается Facebook, так что же может пойти не так? (Я боялся, что от небольших фреймворков могут отказаться, поэтому я сосредоточился на тех, которые поддерживаются крупными компаниями) Learning React было потрясающе. За короткое время я смог собрать несколько классных вещей и запустить их локально. На этот раз обучение было намного проще и быстрее, потому что я уже знал основы JavaScript. Теперь, когда я освоился с новой структурой, я сосредоточился на том, чтобы научиться создавать готовое к работе веб-приложение с помощью React, MongoDB, NodeJS и Express. (Конечно, для новичка это было слишком много новых технологий)

Я был поражен тем, сколько всего нужно, чтобы эта штука заработала. Очевидно, Webpack и Babel были вещами, которые вы должны знать, чтобы создать современное приложение, поэтому я попытался разобраться в этом. К счастью, это было примерно в то время, когда было выпущено приложение create-react-app. Йиппи! Больше не возиться с загадочными конфигами! Теперь я мог просто сосредоточиться на том, чтобы узнать, как запустить эту штуку, потому что приложение create-react-app также можно использовать для создания готовых к производству приложений.

С того дня я создаю для себя мелочи - вещи, которые так и не были опубликованы, потому что я их так и не закончил. Все для обучения и накопления опыта. И хотя я до сих пор не знаю всего о React, веб-разработке, бэкэнд-разработке, мне это достаточно удобно, чтобы создать что-то реальное, что-то поставляемое, что я хотел бы сделать в ближайшем будущем.

Зачем я тебе все это рассказал? Потому что я совершил ужасную ошибку. Ошибка, которая помешала мне набраться опыта и быстрее достичь желаемой роли веб-разработчика: я делал одно руководство за другим. Как только я закончил одно, я уже начал следующий, даже не задумываясь о том, что я только что узнал.

Выводы - Что я мог сделать лучше?

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

Не делайте слишком много руководств

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

Получите обзор, начните с основ и стройте!

Перед тем как начать, подумайте, чем вы хотите заниматься. Какой фреймворк вы хотите изучить? А что насчет экосистемы?

Например, если вы хотите изучить React, я бы рекомендовал начать с основ. Если у вас нет опыта работы с JavaScript, изучите основы. Изучите ES2015 / ES6, он вам понадобится. После этого ознакомьтесь с диспетчером пакетов NPM или Yarn. Выберите тот, который вам больше всего подходит.
Теперь, когда вы изучили основы, ознакомьтесь с официальным руководством по React, в котором рассказывается о многих вещах, которые вам понадобятся позже. Как только вы закончите, придумайте что-нибудь маленькое и создайте это. Посетите знакомую страницу (например, Twitter, Facebook и т. Д.) И создайте компонент, который показывает твит или запись в facebook. Постарайтесь скопировать его как можно точнее. Затем попробуйте отобразить список сообщений / твитов. Если вам это удалось, вы можете попробовать подключить свое приложение к Twitter или Facebook API (или, возможно, вы найдете другой API). Это хороший момент, чтобы узнать, как работают API-интерфейсы и как их использовать в вашем проекте.

Ключ в том, чтобы знать, когда вам нужно знать что. Начните с основ и постарайтесь использовать как можно больше в небольших проектах. Не думайте о полноценном масштабируемом приложении с полным стеком, готовом к использованию сотнями тысяч пользователей. Просто создайте что-нибудь маленькое для практики и выбросьте потом. Если вам достаточно комфортно в том, что вы делаете, повышайте уровень и добавляйте сложности. Будь то подключение к API или рендеринг на стороне сервера с разделением кода. Просто продолжайте совершенствоваться и расти.

Подведение итогов

Я люблю узнавать о новых технологиях. Но в некоторых случаях вы просто ошеломлены количеством новых фреймворков и библиотек. Это был момент для меня, когда я понял, что просто не могу научиться и все пробовать. Так что я придерживался основ и постоянно совершенствовался до сегодняшнего дня. И еще так много предстоит узнать. Я так и не узнал о рендеринге на стороне сервера, так что этим я собираюсь заняться в будущем. Похоже, что сначала мне нужно будет узнать о Webpack и Babel, потому что в Webpack есть функция разделения кода. И самое главное: всему этому я научусь, создавая свои собственные вещи. Как только меня это устроит, я напишу об этом. Вот как мне удается держать вещи в голове.

РЕДАКТИРОВАТЬ: В качестве более подробного дополнения к этой статье я настоятельно рекомендую прочитать эту статью Гоши Аринич. (TL; DR: изучите одну вещь за раз, практикуйтесь с учебными проектами, не заботьтесь о передовых методах вначале, не пытайтесь угнаться за каждой новой библиотекой или концепцией) Я бы хотел прочитать такую ​​статью до того, как я начал 😁

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

[1] Я ходил в школу под названием HTL (Hoehere Technische Lehranstalt) - это школа среднего образования, которая позволяет студентам одновременно получать квалификацию для поступления в университет и профессиональную подготовку. Я не уверен, существует ли что-то подобное за пределами Австрии - по крайней мере, с таким названием.

Эта статья также была опубликована на моем сайте.

Надеюсь, вам понравилось читать! Если да, 👏 👏 👏 и поделитесь этой статьей со своими друзьями. Я всегда рад поговорить о разработке, поэтому, если у вас есть отзывы об этой статье или вы просто хотите поговорить о чем-то конкретном, оставьте сообщение или свяжитесь со мной в Twitter.

Найдите лучшего веб-разработчика прямо сейчас! Подпишитесь на мою еженедельную рассылку, и я буду доставить вам высококачественный контент, а также советы и рекомендации по веб-разработке!