На каком стеке разработать проект, чтобы не похоронить его после релиза?

Моя цель - предложение широкого ассортимента товаров и услуг на постоянно высоком качестве обслуживания по самым выгодным ценам.

Привет, Хабр! На связи Пиробайт — продуктовые разработчики для фудтех, медтех, автотех. 

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

В статье отвечаем на эти и другие вопросы. Рассказываем, с чем работаем, чтобы продукт жил и процветал.

Что используем для создания мобильных приложений:

Backend: Laravel, Node.js, Nest.js

Frontend: React Native, Flutter, MobX State Tree, MobX, TypeScript

А что для сайтов, веб-сервисов и систем автоматизации бизнеса:

Backend: Laravel, Node.js, Nest.js

Frontend: React, Next.js, Sapui5, MobX State Tree, MobX, TypeScript. Дополнительно Vue.js и Angular  

Чем хороши технологии бэкенда: Node.js, Nest.js и Laravel?

Node.js  — это среда выполнения для JavaScript. Nest.js — фреймворк, построенный на базе первого — Node.js. А Laravel — фреймворк для написания сайтов на языке PHP. Они нужны для ускорения работы разработчика, облегчения и улучшения возможностей самого языка.

Laravel 

PHP — это язык, который изначально был придуман для небольших проектов. А когда у разработчиков появилась потребность создавать что-то крупное, были разработаны фреймворки, которые на этом специализировались. Одним из таких и стал Laravel.

Внутри него есть много готовых вещей: маршрутизация, HTML-шаблонизаторы, ORM, CLI и другое. Если программисту понадобится написать сервер для обработки запросов (API для мобильного приложения), CMS или CRM, то Laravel — идеальный выбор. Это не самые масштабные, но и немалые проекты, в которых фреймворк чувствует себя идеально.

Laravel подходит для разработки крупных проектов со сложной архитектурой и высокой нагрузкой, для которых нецелесообразно использовать CMS вроде Битрикса.

Примеры проектов, которые мы разрабатывали на Laravel: социальная сеть, сервис по аренде яхт, онлайн-аукцион, корпоративное приложение для корпорации Сервико-Авто.

Чем хороши продукты на нем:

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

  • Продукт на нем разрабатывается быстрее, чем, например, на Symfony (второй по популярности PHP-фреймворк). Все потому, что в процессе разработчики могут обходиться без сложного кода. 

  • Можно не переживать за безопасность своего продукта, потому что у Laravel есть встроенные базовые механизмы для защиты от угроз и атак. 

  • Продукт легко масштабировать. У фреймворка есть нативные инструменты, через которые можно расширить функционал. А так как у него большое комьюнити, то найти разработчиков для поддержки проекта будет несложно.

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

Node.js

Это платформа на C++, которая превращает JavaScript в язык общего назначения, поэтому с Node.js можно писать код и для бэкенда, и для фронтенда.

Чаще всего используем его для разработки проектов с постоянным обменом информацией с пользователем: социальных сетей, чатов, систем совместной работы над проектом, текстовых онлайн-редакторов. Пример — сервис онлайн-аукциона новых авто. Технологию используют Netflix, LinkedIn, НАСА, Yahoo, Netflix, Uber, Walmart, Google и еще много кто. 

Nest. js

Nest. js — это фреймворк, который ускоряет и упрощает разработку масштабируемых серверных приложений на основе Node.js. То есть дополнение. Подходит для разработки сайтов, мобильных и десктопных приложений, в которых нужно участие сервера с передачей динамического контента (по большей части для реализации сокетов).

Используем из-за хорошей реализации микросервесной архитектуры и статической типизации, так как Nest. js идет в связке с TypeScript — языком программирования, в котором исправлены недостатки JavaScript, об этом еще расскажем позже.

В чем хороши React и Next.js — технологии фронтенда?

У фронтенда основным языком программирования, на котором завязаны все технологии, является JavaScript, а его фреймворками и библиотеками — React, Angular и Vue.js. На чистом JS мы не пишем, так как это нецелесообразно, долго и дорого. 

Почему? 

Если говорить простыми словами, то для создания сайта на чистом JS мы потратили бы 1000 строк кода, а вот с React — 500, так как в этой библиотеке есть специальные методы, которые объединяют в себе функционал взаимодействия с контентом. За счет этого мы просто вызовем одну функцию в одной строке кода, чтобы добавить элемент. Вместо того, чтобы расписывать 10 строк на чистом JS.

Используем всё перечисленное — React, Vue.js и Angular, но активнее именно первый.

React 

Это не фреймворк, а библиотека для языка программирования JavaScript.

В чем разница?

Библиотека — это набор готовых решений, которые можно брать и использовать, как захочется.

Фреймворк же накладывает определенные ограничения, его элементы связаны между собой сильнее.

React считается самой популярной библиотекой среди фронтендеров, поэтому проблем с поддержкой не будет
React считается самой популярной библиотекой среди фронтендеров, поэтому проблем с поддержкой не будет

Цель React — предоставить высокую скорость, простоту и работоспособность приложений на разных платформах.

Библиотека сосредоточена на создании пользовательских интерфейсов SPA, PWA и крупных сайтов, доработки новой функциональности с любым стеком. Удобна при разработке сложной логики клиентской части (особенно когда есть много повторно используемых компонентов). На React необязательно разрабатывать весь сайт. Библиотека не зависит от остального инструментария и будет хорошо работать, на чем бы ни был написан код. Мы в основном используем React в связке с Laravel.

Чем крута эта библиотека для заказной и продуктовой разработки: 

  • У него высокая скорость разработки — если обычное веб-приложение на запрос от браузера возвращает ему HTML-разметку с CSS, чтобы тот отрисовал страницу, то в случае приложений на React, браузер сначала скачивает набор скриптов, которые выполняются на устройстве пользователя. Короче говоря, это снимает нагрузку с сервера, улучшая производительность проекта; 

  • У проектов на React чистая архитектура, в которой легко обнаруживать и исправлять баги, и которую легко поддерживать. Разработчик контролирует потоки данных, разметку и стилизацию. И в идеале знаком с паттернами программирования, а значит может собирать приложения быстрее и гибче.

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

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

Next.js 

Next.js мы используем вместе с React из-за навигаций из коробки и расширенных видов отрисовки. Главное отличие от «чистого» React в способе рендера конечных веб-страниц, подробности оставим для разработчиков. Все, что действительно важно знать — это то, что вокруг Next.js сформировалось большое и активное комьюнити, а сам фреймворк активно поддерживается и развивается разработчиками. 

Next.js используют и поддерживают крупные компании вроде Google, другие предлагают инфраструктуру для деплоя. Так что Next.js в ближайшем будущем будет жить и процветать — его можно спокойно использовать.

О технологиях мобильной разработки

React Native (RN) и Flutter

На этих фреймворках пишутся приложения под 2 флатформы сразу — Android и iOS. 

Но технологии разные: React Native реализован на базе языка программирования JavaScript, а Flutter — на Dart. 

Другое отличие — во Flutter есть набор инструментов, которые помогают в разработке приложений, а вот у RN с этим сложнее. Но зато у него меньше порог вхождения, чем у Flutter, а это значит что? Что на проект будет легче найти разработчика.

Но зачем эти фреймворки, когда есть нативные языки программирования? Дело в стоимости и скорости разработки. У нас есть подробная статья о том, кому это нужно. Если кратко — чтобы разработать продукт нативно, придется нанять 2 команды разработчиков. А используя Flutter или RN, понадобится только одна команда. Из-за чего выигрывает скорость и цена, а это важно для заказчиков, которые:

  • планируют запускать MVP, чтобы быстрее занять рынок;

  • их ЦА пользуется 2-мя платформами — и iOS, и Android;

  • будущий продукт не предполагает сверхнагруженных эффектов: анимаций, интерактивов;

  • в будущем собираются масштабироваться. 

А вот там, где из производительности нужно выжать максимум (а скоростью и ценой при этом можно пожертвовать), лучше выбрать нативный вариант. Которым, кстати, мы тоже занимаемся.

TypeScript (TS)

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

Мы используем TS, а не JS, чтобы сократить ошибки из-за неправильных

типов данных еще на этапе написания кода, не доходя до этапа исполнения кода или прямого тестирования на сайте.

SAPUI5

Практически полнейший аналог React. SAP — один из ведущих мировых производителей программных решений. Но в России больше распространен именно 1С. 

Sapui5 — неплохой фреймворк для больших энтерпрайз решений в экосистеме SAP. Мы используем его на нескольких проектах, в которых экосистема изначально построена на SAP. Например, в ERP для корпорации Таркетт. Но в плане разработки React быстрее и эффективнее.

MobX и MobX State Tree (MST)

MobX и MobX State Tree — это стейт-менеджеры. Стейт-менеджер — это глобальное хранилище данных внутри приложения или сайта. 

Они нужны для управления состоянием и потоком данных крупных приложений. Этот инструмент позволяет управлять состоянием из любого места приложения, но при этом само хранилище находится в одном месте. 

***

Со стороны фронтенд- и бекенд-разработки можем сказать, что у нас самый актуальный стек на рынке для определенного сегмента: высоконагруженных сервисов, мобильных приложений, сайтов и ERP. Есть, конечно, спорные моменты с MobX или MST, которые мы используем вместо Redux. И с MySQL, который используем вместо PostgreSQL на бэкенде. Это сказывается сугубо на удобстве разработки, но не на качестве конечных продуктов.

Иногда требования заказчика влияют на выбор технологического стека. Например, разработчики подключаются к Symfony, Vue.js, Angular, Sapui5 и другим технология, когда проект действительно того требует. 

Если остались вопросы, обязательно задавайте! А чтобы быть в курсе обновлений, следите за нами:

  • На нашем сайте

  • В телеграм-канале

Источник: https://habr.com/ru/articles/789130/


Интересные статьи

Интересные статьи

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Привет, Хабр! Меня зовут Александр Черемухин, я тимлид администраторов Hadoop в Big Data МТС. Мы прошли довольно длинный эволюционный путь в автоматизации администрирования и хотелось бы им поделиться...
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →
Еще в XVIII веке великий французский физик предсказал существование “симфонии” из атмосферных волн, охватывающей всю планету. И вот, 220 лет спустя, ученые наконец-то сумели ее услыша...
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.