Првильно ли я использую библиотеки?

Question

[Игорь Махов]

Решил написать хеллоуворлд на React и у меня получилось, что для этого придется использовать следующие библиотеки:

• TypeScript - я на нем привык писать
  
• Express.js
  
• Less/SCSS
  
• Browserify чтобы собирать компоненты и скрипты в один файл для фронта
  
• shell.js(возможно) - для копирования статических ресурсов из src в dist
  
• Gulp - чтобы собирать все вышеперечисленное
  
• Eslint - без него никуда
  

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

P.S. Каждую из этих библиотек я в отдельности понимаю, но в целом, как по мне они создают какую-то монструозность, при том, что на выходе будет небольшая страничка с парой кнопок.

Answer 1

[FinGanapre]

Использование фреймворка всегда требует некоторой подготовки перед запуском, но сложность поддержки проекта в дальнейшем не сильно возрастает.

Browserify, Gulp вполне можно заменить webpack.
Express.js это для серверной стороны, вы пишите что-то на node.js и получаете hello world через api?
LESS/SCSS - это ваш выбор, для задачи он не требуется.
TypeScript - опять же, ваш выбор.

Comments

[Игорь Махов]

По поводу express, да, там нужен небольшой бэк, хотел посмотреть как обновлять компоненты после xmlhttprequest.

[FinGanapre]

Игорь Махов, Можно api на чистом node.js писать. express просто возьмёт часть работы на себя и позволит концентрироваться на задаче в большей степени.
React вместо чистого js мы ведь тоже используем ради того, чтобы думать о бизнес логике и реализовывать её быстрее.
Тут вам ещё axios пригодится для взаимодействия с api. Просто ввиду удобства работы. Но если буквально один запрос, то можно и fetch встроенный использовать. Если понадобится ie есть полифил. Но можно и самому через xmlHttpRequest. Тогда ничего не понадобиться. Это всегда компромис между размером итогового бандла и удобством разработки/поддержки.

Важно понимать, что в итоговый прод идут не все библиотеки, которые вы используете. Некоторые нужны только для разработки и не войдут в js который в итоге попадёт в браузер. Так же как и не всё, что вы используете на серверной стороне попадёт на прод сервера.

Например, препроцессоры будут использованы только при разработке, на выходе мы получаем css и библиотека для препроцессора нам не нужна в итоговом бандле. С тайпскрипт та же история. С линтером то же самое.

Вывод: если инструмент подходит для решения задачи и не выглядит избыточным в её контексте - используйте его:)

Answer 2

[McBernar]

Ну вы же не тянете это на фронт. Когда-нибудь слышали, чтобы механик жаловался на обилие инструментов и на просторный гараж? Я — нет.

Вас никто не заставляет настраивать все руками. Взяли create-app и развернули проект.

И да — экспресс для статики вам не нужен.

Comments

[Игорь Махов]

Для статики в принципе да, но я хотел попробовать сделать обновление компонентов с использованием ajax.

[Developer]

Аналогия совершенно неуместна.
Если хочешь сравнить с механиком, то тогда так: водитель должен возить в своей машине все инструменты из гаража, в том числе и огромный подъёмник. И шины на все сезоны

Answer 3

[Aetae]

Нормально, фреймворки всегда жирные, это ж вам не какие-то жалкие библиотеки.)
Просто надо использовать готовые пресеты на все случае жизни, либо от авторов\комьюнити (creat react app?), либо собственные. Каждый раз конфиг с нуля писать - конечно с ума сойдёшь.