User avatar

Товарищи фронтендщики! Сами мы не местные, на вокзале украли все приватные ключи, нужна подсказка. Скажите, если бы вам достался эмммм Очень Традиционный Codebase (вообще без фреймворков, все вот эти вот self.doThat = function() { 500 строк }, часть JS прям в шаблонах вьюшек и т.п.) для довольно динамического интерфейса (сложные компоненты редактирования сложных данных) — какие бы вы предприняли первые шаги по приведению его в чувство, без опций «выкинуть и написать с нуля» и «беги оттуда»? Ну то есть типа «подключить такой-то фреймворк, он не очень инвазивный, начать структурировать компоненты как ...» и т.п.?

Comment

зависит от того, какую задачу решаем / что хочется получить на выходе. например, иногда имеет смысл просто задокументировать, как оно устроено и не трогать.

 ‎· внемание к деатлям 2
Comment

React не инвазивный и даже не фреймворк. ReactDOM.render() вызываешь где нужно и у тебя появляется UI.

 ‎· псы в рапиде 3
Comment

@ai212983: решаем задачу «мне с этим жить и развивать ещё, возможно, много лет, код стартапа на начальных стадиях»

 ‎· просто варежка
Comment

@squadette: да, я про реакт-то и думаю, но вот мне бы кто-нибудь в трёх словах рассказал откуда начинать (в смысле, понятно что надо научиться реакту, но вот первые шаги пути, включая более разумный package management чем «мы просто копируем всё в /lib или подключаем с CDN», и ... и... и я хз что я вообще спрашиваю)

 ‎· просто варежка 1
Comment

@zverok: create-react-app

 ‎· sober, steady, good provider 1
Comment

ну я бы для начала хорошенько проорал, а потом поувольнял бы нахуй долбоебов пиздоруких, а нанял бы умниц, пускай они и разбираются. говорю как фронтэндщик <3

 ‎· лошадиное торнадо 6
Comment

^ все так. (и заплакал)

 ‎· внемание к деатлям
Comment

если вопрос про то как связать реакт с легаси, то начать можно отсюда https://reactjs.org/docs/integrating-with-other-libraries.html

 ‎· tisane
Comment

если вопрос как начать с реакт, то можно начать отсюда https://reactjs.org/docs/thinking-in-react.html

 ‎· tisane
Comment

в любом случае, https://reactjs.org/docs/ стоит прочесть в первую очередь. документация с простыми примерами, без лишних слов и описывает практически все, что нужно. и да, реакт это первое, что приходит в голову по твоему запросу - идеально подходит, что бы переделать небольшую часть в проекте, а потом принять решение о переходе

 ‎· tisane
Comment

Убедиться, что бэкенд это строго API и не возвращает ничего, кроме данных. Если это не так, инициировать его рефакторинг. Написать тесты на самые важные для бизнеса куски. Посмотреть, как структурировано приложение, составить список всех routes, посмотреть, насколько они изолированы, и насколько дорого каждый из них переписать. Посмотреть статистику использования каждого route (возможно, на какие-то страницы-компоненты никто уже не смотрит и проще их просто удалить). Попробовать отделить CSS по компонентам (зачастую это самая сложная часть переписывания по компонентам). И не отчаиваться.

 ‎· a fanfare of swans 4
Comment

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

 ‎· криптопокемон 2
Comment

Бывает.

 ‎· a fanfare of swans 1
Comment

Я понял, что дал недостаточно данных! Ситуация, на самом деле, такова, что это стартап, и довольно молодой. То есть а) кода ещё довольно немного, это не 10-летние наслоения б) «некогда думать, прыгать надо»; в) коллег чучуть, они не злонамеренны, но менее опытны. Картбланш на «а давайте всё переделаем» (или даже на «а давайте я буду заниматься только рефакторингом пару недель/месяцев») никто не даст, а вот подход «я тут сделал следующую фичу, и кстати походу переделал связанные куски логики как правильно, а не как попало» — работает. Но если в бэкенде я довольно неплохо представляю, что и куда итеративно вводить, чтобы в пределе получить приличную систему, то во фронтэнде — ...

 ‎· просто варежка
Comment

^ вот эти "новые данные", не поменяли ни один из приведенных ответов

 ‎· tisane 1
Comment

(машет рукой и уходит сгорбившись)

 ‎· гиперволоёб инженера Гарина
Comment

@tisane: ну, мне кажется в какой-то степени поменяли. как минимум, я пытаюсь сказать что а) «как изучить реакт» вопрос не стоит, разберусь и б) «превратить бэкенд в строго API» здесь-и-сейчас — слабовыполнимая задача.

 ‎· просто варежка
Comment

Удобный тред, чтобы спросить про Vue.js и другие — они чем-то лучше Реакта?

 ‎· bardo calling
Comment

@zverok: четвёртый, твой, комментарий в этом треде "я про реакт-то и думаю, но вот мне бы кто-нибудь в трёх словах рассказал откуда начинать" звучит именно так, как на него все в этом треде отвечают

 ‎· tisane 1
Comment

@zverok: а про пункт б), ты вроде сам выше написал "представляю, что и куда итеративно вводить, чтобы в пределе получить приличную систему" - так просто сделай это, ну

 ‎· tisane 1
Comment

А. Делаешь так: берешь доступ к гугл аналитике. Находишь там самые посещаемые страницы. С десктопа и веба. Находишь самую первую в списке. Берешь открываешь ее (в хроме, не в опере!), F12, Audit (или https://developers.google.com/web/tools/lighthouse/). Смотришь какого хуя?! Берешь и переделываешь. потом ты такой говоришь пидоры а ну быстро мне доступ в сёрч консоль (https://www.google.com/webmasters/tools/home?hl=en), через неделю сам себе его намутил и идешь смотришь какого хуя. там урлы короче и они тебе говорят дескать нихуя не работает пиздец вообще. ты берешь и фиксишь там половина редиректов не тех, другая ответы по полминуты, третья дубли из 100500 мест вот это вот, потом проходит полмесяца ты показываешь как поменялось кол-во страниц в индексе, посещаемость и все прочее и тут ты такой с ноги заходишь и говоришь: всё пиздец, я решил переписать всё нахуй, используем purescript вместо реакта будут вебкомпоненты, а они такие: йес, Виктор, летс до зис! дальше см. предыдущих ораторов. UPD purescript -> http://www.purescript.org/

 ‎· möe 4

1 2 3 4 5 6 7 8 9 10