Советы и ресурсы по изучению стека MERN
Это моя первая статья на Medium, и пока я размышлял над тем, на какую тему написать, я понял, что мне очень нравится читать статьи типа «Как начать…» и «Мой опыт…», поскольку они дают вам представление опыта других людей и дает вам представление о том, как подойти к этой конкретной теме.
Эта статья о том, как я изучил MERN Stack Development, и дает вам несколько советов, что можно и чего нельзя делать по этой теме. Я не ожидаю, что все будут следовать этой практике, поскольку у каждого свой способ изучения вещей. Но я надеюсь, что это поможет тем, кто запутался (как и я!) в том, как начать.
Что такое МЕРН?
MERN — это сочетание 4 ведущих технологий в области разработки.
- MongoDB — документно-ориентированная база данных NoSQL.
- Express /Express.js — бэкэнд-фреймворк для веб-приложений Node.js.
- ReactJS — внешняя библиотека Javascript
- Node.js — внутренняя среда выполнения JavaScript
Все 4 из этих технологий могут построить трехуровневую архитектуру (интерфейс, серверная часть, база данных) веб-приложения, в основном с использованием JavaScript и JSON.
Внешний интерфейс
ReactJS отвечает за разработку динамических веб-страниц веб-приложения. Он написан на чистом JavaScript или JSX (это позволяет нам писать HTML в React). Вы можете создавать страницы с помощью CSS, React Bootstrap или React-strap.
Бэкэнд
Express.js и Node.js вместе составляют серверный уровень MERN.
Express обрабатывает различные функции разработки веб-приложения, такие как маршрутизация URL-адресов, обработка HTTP-запросов и ответов, а также динамическое отображение страниц на основе передаваемых аргументов.
Node.js используется для управления данными в базе данных (добавление, удаление или изменение данных). Он также используется для сбора данных формы (если в вашем веб-приложении есть какие-либо формы), управления файлами на сервере и создания динамического содержимого страницы.
База данных
Если вы хотите хранить какие-либо данные (имена, пароли, изображения, комментарии, обзоры и т. д.), вам понадобится база данных.
MongoDB — это база данных, которая лучше всего работает с Express и Node.js. Базы данных NoSQL не ограничивают типы данных, которые мы можем хранить, а также позволяют нам добавлять новые типы данных в любое время. Поэтому мы предпочитаем базы данных NoSQL (например, MongoDB) для приложений реального времени.
Схема обучения и ресурсы
Я никогда не следовал фиксированному курсу изучения MERN. Я просто взялся за множество проектов и дурачился с различными концепциями, выискивая их значения и способы использования. Но была куча документов и видео, которые помогли мне разобраться в некоторых темах.
Я начал с создания простого фронтенд-приложения ERP с помощью React, что дало мне представление о его различных компонентах (реквизиты, состояния, хуки, компоненты и т. д.). Поскольку создание динамического приложения может быть слишком сложным для новичка, я бы посоветовал вам начать с простого статического приложения, которое вы создали в HTML и CSS, и преобразовать его в приложение React.
Вот некоторые из ресурсов, которые помогли мне изучить React:
- Учебник по официальному сайту ReactJS
- freeCodeCamp full React tutorial (я не смотрел все 10 часов, я просто смотрел концепции, в которых мне нужно было разъяснение)
Получив достаточно хорошее представление о внешнем интерфейсе, я перешел к созданию динамического приложения для электронной коммерции, в котором на первый план вышли серверная часть и часть базы данных. Изучение серверных технологий может быть немного сложным, и вы можете столкнуться с множеством ошибок в начале. Но не беспокойтесь об этом и постарайтесь понять причину каждой ошибки. Не просто погуглите и скопируйте и вставьте измененный код. Поймите, почему ваш код не работал, и внесите в него изменения самостоятельно (даже если вы копируете какой-либо фрагмент кода, разбирайтесь в каждой строке и пишите ее самостоятельно, а не просто вставляйте. Это поможет вам вспомнить, что вы сделали. )
Вот некоторые из ресурсов, которые помогли мне понять Node, Express и MongoDB:
Если вы тот, кто любит учиться по структурированным курсам, то вот некоторые из курсов, которые использовали многие мои друзья, и это им очень помогло:
- Программа React Nanograde от Udacity
- Полное руководство по стеку MERN на Udemy
- Мастер-курс MERN Stack по Udemy
Советы
- Не пытайтесь забить себе голову всей теорией, которая есть на курсах/сайтах/блогах. Прочтите основы каждой технологии и примите базовое приложение. Не волнуйтесь, вы узнаете все, что вам нужно, во время выполнения практического упражнения.
- Как я упоминал выше, даже если вы копируете какой-то код из Интернета, избегайте возможности копирования и вставки. Вместо этого напишите код самостоятельно. Это поможет вам вспомнить, что вы делаете.
- Многие курсы, которые мы видим на таких платформах, как Udemy, Udacity, Coursera и т. д., обучают вас концепциям, а также создают что-то на стороне. Таким образом, в конце курса у вас будет готовый проект. Никогда не останавливайтесь на достигнутом и не думайте, что «у меня есть готовый проект, так что теперь я все знаю об этой технологии». Возьмите собственное определение и начните его строить. Вы должны быть в состоянии самостоятельно применить свои знания на практике.
- Несмотря на то, что у многих из вас может быть привычка учиться чему-то на курсах, не застревайте в «туториальном аду» и вообще не используйте свою собственную логику. Поверьте мне, нет лучшего обучения, чем практическая техника обучения.
- Наконец, пусть ваш творческий ум придумывает удивительные идеи! Посмотрите на приложения, которые вы используете, и подумайте, как вы можете попробовать сделать их или добавить дополнительные функции. Пока я изучал React, я сделал клон Trello, чтобы поэкспериментировать с его UI/UX и добавить некоторые собственные функции.
Вывод
Изучение любой технологии может быть трудным, и это определенно расстраивает, когда вы получаете сотни ошибок, и на их решение уходят часы (иногда даже дни!). Когда я разрабатывал приложение для электронной коммерции, мой бэкенд не работал, и я не получал никаких ошибок, так как мой код не был ошибочным. Покопавшись в этом 2 дня, я понял, что произошла какая-то внутренняя ошибка установки, поэтому мне пришлось переделывать весь бэкенд. Но это просто поможет вам более тщательно изучить эту технологию.
Спасибо за чтение!
Прия Рой