Месяц назад я начал разработку своего первого веб-приложения Node.js/Express/React.js. Это был процесс обучения, и работа все еще продолжается, но я подумал, что поделюсь небольшими знаниями, которые я приобрел на этом пути, и, надеюсь, помогу другим, которые начали подобное начинание.
Я считаю себя разработчиком. Я понимаю логику кодирования и могу разобраться с любым новым кодом, на который наткнусь. Но ни в коем случае я еще не эксперт. Я действительно хорошо умею складывать кусочки воедино (или, по крайней мере, каким-то образом заставляю это работать), но если мой язык или метод действия неидеальны, пожалуйста, дайте мне знать.
Проект
Целью приложения является отображение списка всех художественных событий в районе Нью-Йорка. Данные предоставлены artcritical.com, и инструмент будет работать на их веб-сайте.
Инструмент листинга изначально был создан в Wordpress с использованием их реляционных баз данных SQL. Он был перемешан с журнальными статьями и с годами становился больше, что делало инструмент медленным и неуклюжим.
Переместив инструмент листинга в собственное оптимизированное комплексное решение, мы надеемся сделать его более быстрым и интуитивно понятным. UX и дизайн были пересмотрены и предоставят пользователю отличный новый интерфейс.
Используемая технология
Проект начался с простой настройки серверной части Node.js, Express и MongoDB. Во внешнем интерфейсе использовался Jade (затем Pug) в качестве инструмента HTML-шаблона, Javascript/JQuery для интерактивность и Sass для оформления.
Данные хранятся в базе данных MongoDB, а Mongoose используется для их чтения и записи.
React был добавлен для внешнего интерфейса и использует React-router и React-Dom. Архитектура пользовательского интерфейса React разработана с использованием Flux» Facebook и его системы Action-Store-Display.
Для аутентификации используется Passport.js, и работа над ней еще не завершена.
Все компилируется с использованием Webpack и Babel, как внешнего, так и внутреннего, поскольку приложение обрабатывается с помощью React на стороне сервера.
Почему MongoDB вместо DynamoDB?
Проект был впервые запущен с Amazon Web Services (AWS) и с использованием DynamoDB. Поскольку объекты базы данных нужно было сортировать по нескольким различным значениям (Дата начала, Дата окончания, Событие, Местоположение), строгая индексная архитектура DynamoDB не подходила для этого. Две базы данных также необходимо было соединить, и MongoDB казался логичным инструментом для использования.
Проблемы и решение
В ближайшие недели я опубликую информацию о проблеме, с которой столкнулся, найденных решениях и ресурсах, которые я использовал для ее устранения. Я объясню проблему как можно лучше, и я надеюсь, что это поможет людям, оказавшимся в моей ситуации.
Отрисовка вложенных маршрутов с помощью React-Router и Express не работает
Динамическое перенаправление с использованием react-router
