Мой путь в качестве Full-Stack разработчика в Microverse.

Что говорят разработчики, вернувшись из отпуска, чтобы заняться той же проблемой, над которой работали 4 месяца? Ну, говорят «Как дела у моей любимой ветки»?

В октябре 2021 года я присоединился к школе удаленной разработки программного обеспечения под названием Microverse, где вы ничего не платите, пока не получите работу, которая изменит вашу жизнь. Мой путь к полнофункциональному веб-разработчику начался здесь. От изучения основ, таких как HTML5 и CSS3, до сложных языков и фреймворков, таких как JS и React, не забывая о системах контроля версий, таких как git, я проведу вас через свой путь в качестве разработчика полного стека.

В этом разделе я поделюсь с вами стратегией обучения, которую я использовал при изучении различных технологий, упомянутых во вводной части выше. Во время работы в Microverse мне пришлось читать официальную документацию и статьи об этих веб-технологиях, чего я не делал до Microverse, но начал ценить это, когда стал больше знакомиться с ними. Большинство людей, особенно начинающие разработчики, в основном полагаются на учебные пособия YouTube как на единственный источник правды. Хотя это не обязательно плохо, я думаю, что большинство этих руководств не заходят так далеко, как объяснение некоторых базовых концепций некоторых технологий, которые можно найти только в документации. После прочтения документации я решил закрепить полученные знания, следуя видеоурокам. Сегодня я могу с уверенностью сказать, что это один из лучших способов. Чтение различной документации и статей было для меня непростым, так как я больше визуальный ученик, но оно того стоило. После обучения я создал проекты, предложенные Microverse, чтобы проверить свое понимание различных концепций, относящихся к этой конкретной технологии. Это один из способов, который использует Microverse для обеспечения мастерства обучения. Затем проекты проверяются рецензентами кода Microverse, которые дают ценные отзывы о проекте. Их отзывы ориентированы на написание чистого кода и наилучшее использование принципов технологии, над которой вы работаете, поэтому, в конце концов, если проект будет одобрен, вы можете быть уверены, что у вас есть хорошее понимание того, что вы только что узнали. и можете продолжить свое путешествие.

Рассказывая о своем опыте работы с каждой технологией, которую я изучил до сих пор, о трудностях, с которыми я столкнулся во время обучения, о том, как я преодолел эти трудности, и о некоторых проектах, которые я создал, я начну с рассказа о Git и GitHub. Прежде чем мы начнем что-то строить, нам нужно место для хранения того, что мы собираемся построить. Хорошо . . . GitHub решает эту проблему, поскольку это платформа для размещения кода для контроля версий и совместной работы. Что же такое Git? Вы можете спросить, Git — это настоящая система контроля версий. Проще говоря, он может определить различия между разными версиями файла, папки или всей кодовой базы. Его также можно использовать для отправки кода на GitHub и многого другого. Я упоминал ранее об отправке моего проекта (кода) на проверку, технологии, которые делают это возможным, — это Git и GitHub. Изучение их было обязательным условием для попадания в Microverse. Microverse предоставил несколько очень полезных ресурсов для изучения Git, некоторые из которых включают статьи и интерактивный веб-сайт для изучения Git, который показывает учащимся, что на самом деле происходит, когда они вводят любую команду git. Благодаря этим ресурсам я изучил основные команды Git и GitHub Flow, который я в основном использовал до того, как был представлен Gitflow.

Переходя к HTML, это скелет, на котором построено большинство причудливых сайтов, которые вы видите в Интернете. У Microverse есть целый модуль только для HTML и CSS. Как упоминалось ранее, я изучал HTML в основном, читая официальную документацию на сайте MDN. Я также следил за видео-уроками на YouTube от сетевого ниндзя. В HTML слишком много тегов. Выяснение того, какой тег использовать и где именно его использовать, приводит нас к семантике HTML, которую мне было трудно понять (я знаю это, потому что обозреватели кода постоянно говорили мне использовать семантические теги там, где это необходимо). Позже я понял, что при кодировании используется лишь несколько этих тегов, поэтому я сосредоточился на них и на том, где их использовать на веб-странице. Это решило мою проблему. Мне также было трудно понять концепцию доступности. Позже об этом позаботились, прочитав об этом на сайте W3C и познакомившись с инструментами доступности, такими как WAVE Web Accessibility Evaluation Tool. Говоря о проектах, я создал свой личный сайт портфолио и сайт страницы конференции. Мне нужно было настраивать линтеры перед каждым проектом, которые будут проверять мой код на соответствие лучшим практикам HTML каждый раз, когда я создаю запрос на извлечение с помощью действий GitHub. Это было мое первое знакомство с идеей использования линтеров. Для HTML я использовал линтер под названием Webhint.

CSS известен как декоратор или декоратор. Если HTML рассматривать как кирпичи, из которых строят дом, то CSS можно рассматривать как штукатурку, покраску и облицовку плиткой. Метод обучения был таким же, как HTML. Microverse предоставил мне хорошо подобранные ресурсы для обучения (в основном документацию). Я узнал практически обо всем, что мне нужно было знать, чтобы начать создавать красивые веб-сайты. Некоторые из действительно важных включают анимацию и переход, медиа-запросы (MQ) и, что наиболее важно, CSS Flexbox и CSS Grid, которые играют огромную роль в адаптивном веб-дизайне (RWD) вместе с MQ. Я также следил за видеоуроками из сети ниндзя и практиковался в написании CSS на Freecodecamp, чтобы закрепить свои знания о CSS. Основной проблемой, с которой я столкнулся при изучении CSS, было понимание ключевых кадров, и для этого мой друг из Microverse помог мне понять это на реальных примерах во время одного из наших сеансов парного программирования. Я использовал свои знания в области CSS для оформления веб-сайтов, перечисленных выше в разделе HTML, при этом использовал Stylelint для получения лучших практик CSS.

Следующим в списке идет JavaScript. Это язык программирования для Интернета и первый фактический язык программирования, о котором мы упоминаем в этой статье. Возвращаясь к нашей аналогии со строящимся домом, JavaScript можно рассматривать как водопроводную и электрическую системы в доме. Это делает дом полным и функциональным. В том же свете JavaScript придает веб-сайту интерактивность и динамическую природу. В Microverse также есть целый модуль для JavaScript, снова упакованный хорошо подобранными учебными ресурсами для обучения. Я нашел документацию MDN очень полезной для понимания JavaScript, поскольку она очень хорошо документирована. Я также изучал и практиковался в написании JavaScript на Freecodecamp, который также был рекомендован Microverse. Некоторые другие удивительные концепции и технологии, которые я изучил в этом модуле, включают лучшие практики JavaScript, Webpack, работу с API, тестирование (шуточное тестирование) и введение в структуры данных и алгоритм. немного. Я создал несколько проектов, все они основаны на Webpack, а некоторые используют API. Во время одного из проектов мне пришлось сотрудничать с моим партнером, и мы использовали Kanban Board вместе с Gitflow для реализации Методологии гибкой разработки программного обеспечения. сильный>. Основной проблемой, с которой я столкнулся при изучении JavaScript, было тестирование с помощью Jest. Мне нужно было протестировать (модульное тестирование) веб-приложения, которые я придумал. Тестирование чистых функций не доставляло особых хлопот, но тестирование нечистых функций было для меня большой проблемой, особенно функций, требующих имитации данных, поступающих из API. Всю идею тестирования мне позже разъяснил мой друг из Microverse через зум-звонок и дистанционное парное программирование. Некоторые из проектов, над которыми я работал, включают веб-сайт с книгами под названием Awesome Books, Todo List и веб-сайт Amiibo, который использовал API и был разработан с использованием Agile Software Methodology, о которой я говорил ранее. Я использовал Eslint, чтобы еще раз применить лучшие практики JavaScript.

Последним в списке является React. React — это внешняя библиотека JavaScript, созданная и поддерживаемая Meta. Это единственная библиотека в нашем списке, а также целый модуль в учебной программе Microverse. Опять же, большая часть моего обучения была получена путем чтения официальной документации React, а мои знания были закреплены просмотром видеоуроков на YouTube от net ninja. Дальнейшее обучение и практика также проводились на Freecodecamp. Я изучил самые основы React, такие как создание реагирующего приложения с помощью create-react-app, компонентов (как функциональных, так и классовых) и управление состояниями и реквизитами внутри компонента. Я также изучил продвинутые концепции, такие как перехватчики реакции, маршрутизация, методы жизненного цикла и концепцию поднятия состояния. Позже в модуле были представлены все более и более сложные концепции, такие как тестирование приложений реагирования с использованием Jest и библиотеки тестирования реагирования, а также концепция управления состоянием с использованием Redux. Уже есть множество концепций, которые нужно усвоить, не забывая о промежуточном программном обеспечении redux-thunk для работы с API при использовании Redux и использовании шаблона утки для организации файлов и папок при работе с Redux. Основная трудность, с которой я столкнулся при изучении React и Redux, заключалась в том, что концепции приходили очень быстро, и у меня не было достаточно времени, чтобы обработать и понять информацию, которую я получил. Чтобы исправить это, я выделил время в выходные дни, чтобы медленно прочитать каждую концепцию и просмотреть видеоуроки, объясняющие только эту единственную концепцию, чтобы лучше понять ее. Я также создал несколько проектов, используя полученные знания. Некоторые из проектов включают Калькулятор, Список дел и Книжный магазин.