Путь длиною в React

в 9:10, , рубрики: angular.js, AngularJS, Ember.js, react.js, ReactJS, Блог компании Voximplant, как я искал лучший фреймфорк, Программирование, метки:

Путь длиною в React - 1 В VoxImplant мы используем React.js и TypeScript для всех новых фронтенд-проектов. Но стараемся не зацикливаться на выбранных инструментах и внимательно смотрим по сторонам – не летит ли орел, не ползет ли змея, не случилось ли что интересное у других фреймворков. Недавно нам попалась статья, автор которой подробно и вдумчиво сравнивает React с Ember. И, да, у него большой опыт работы и с первым, и со вторым (а не как это обычно бывает). Предлагаем вашему вниманию адаптированный, и, надеемся, легко читаемый, перевод.

3 января 2016 года Дэн Абрамов опубликовал твит:

«Хочу, чтобы в 2016 году больше программистов React создали что-нибудь с помощью Angular, Ember, Cycle. А программисты Angular, Ember, Cycle – на React. Вместе мы узнаем больше».

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

Это было как-то так:

Путь длиною в React - 2
В борьбе с документацией Angular

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

После неудачного опыта я стал искать другие варианты и решил попробовать Ember.

Путь длиною в React - 3
Моя реакция на документацию Ember

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

Фреймворк предоставляет разработчику:

  • раутинг с помощью Ember Router,
  • «выполнялку» для тестов,
  • фреймворк для тестов,
  • библиотеку data persistence с ember-data,
  • библиотеку работы с асинхронным кодом в RSVP,
  • интерфейс командной строки в ember-cli,
  • стандартную структуру проекта в Pods
  • богатую систему аддонов.

Как вы могли заметить, в коробке инструментов Ember много дополнительных «плюшек». Потребуется время, чтобы понять, как это всё работает. Но после того, как осилили эту науку, вы сразу же становитесь очень продуктивным. Вы легко начинаете проект или присоединяетесь к нему, так как знаете, что где лежит.

Но иногда готовые инструменты не идут ни в какое сравнение с собственной архитектурой приложения.

Путь длиною в React - 4
Разработка с помощью React

React.js – это библиотека, а не фреймворк. Очевидно, что она не обеспечивает разработчика теми возможностями, которые есть у Ember. Ember дает вам дом, а React – инструменты, с помощью которых можно построить дом. Или башню. Или космический корабль. Но это не мой случай. Придя из Ember, где всё готово, по началу трудно понять, что и как использовать в React – особенно в части настройки тулчейна. Много людей, которые обучаются работать с помощью React, чувствуют усталость и, в некотором смысле, потерянность.

После того, как вы настроите всё сами, обучитесь в процессе, что и где использовать – это будет ценным уроком для вас как разработчика. Полезно изучить, как использовать Webpack и лоадеры, как настроить дев сервер или выполнялку тестов, например Karma, с фреймворком тестирования, например, Mocha. Уверен, что знания, которые я получил, могут мне помочь в будущем, и я буду ценить всю работу, которая делается в Ember.

Самостоятельная настройка всего может выглядеть как-то так:

Путь длиною в React - 5

Но это того стоит!

Довольно просто изучить, как работать с React. В последние годы React повлиял на многие JavaScript-фреймворки. Ember не стал исключением. Он перенял подход «компоненты прежде всего», очень простой лайфцикл, систему «действия вверх, данные вниз», и другое.

Создание проекта с помощью React также подтолкнуло меня в некоторой степени к функциональному программированию через Redux и некоторые инструменты React. Также хочу обратить внимание, что и React, и Redux обладают великолепно составленной документацией. Полагаю, это немаловажно для процесса обучения.

После того, как я изучил и использовал Ember с React, не могу утверждать, что один фреймворк лучше другого. Оба представляют разные подходы к решению одних и тех же проблем. И к тому же представляют разную философию создания программного обеспечения. Думаю, что вместо того, чтобы выбирать, на какую сторону встать (как если бы это была война), мы должны отдать должное тяжелой работе, которая лежит в основе создания любого программного обеспечения с открытым программным кодом – которыми мы пользуемся, с чьей помощью обучаемся и, если можем, контрибьютим.

В конце концов, фреймворк или библиотека, которую мы выберем, будет определяться сроком, текущей проблемой и, что вероятно, руководителем разработки. Крутые приложения могут быть сделаны и с помощью Ember.js, и React.js. Обе экосистемы великолепны.

P.S. JSX не так уж плох.

Автор: Voximplant

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js