These are chat archives for dev-ua/reactjs

25th
Jan 2016
Aleksey Immuzov
@immuzov
Jan 25 2016 08:27
Ребята, а метеор с реактом кто нибудь использует?
Kirill Yakovenko
@blia
Jan 25 2016 09:29
а метеор кто-нибудь использует?
stanleer
@stanleer
Jan 25 2016 09:30
(c) все посмотрели на него косо с мыслью - о чем он говорит?
Borisov Semen
@devsnice
Jan 25 2016 12:53

rftgrt
fg

fg

Vitaliy Kriskov
@vitalka18
Jan 25 2016 13:26
привет, порекомендуйте пожалуйста с чего лучше начать изучение react i react native
Андрей Листочкин (Andrey Listochkin)
@listochkin
Jan 25 2016 13:29
@vitalka18 вот тут вниз прокрути - там серии видеоуроков https://egghead.io/technologies/react
плюс официальные доки - они вполне ок
Vitaliy Kriskov
@vitalka18
Jan 25 2016 14:01
спасибо)
Kirill Yakovenko
@blia
Jan 25 2016 14:26
А где в RN настройки бабеля?
Andrii Ulianenko
@gooduling
Jan 25 2016 14:48
Привет! Что если в Реакт-компоненте мы вызываем метод из d3js - d3.select( smth1 ).append( smth2 ) ? Происходит ли тут магия с эвристическим изменением DOM или это лобовая вставка smth2 в DOM в обход реактовской магии? Помогите разобраться плиз. Не могу понять как правильно приделать d3 к Реакту
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:49

Не могу понять как правильно приделать d3 к Реакту

математика и скейлы — d3
свг — реакт

никаких .select, .append и прочего
Andrii Ulianenko
@gooduling
Jan 25 2016 14:50
а как тогда к примеру поменять dataset?
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:50
датасет приходит в виде пропсов твоего реакт компонента, и на основе него просто строишь свг
в работе с d3 есть понятие времени, избавляйся от него
Andrii Ulianenko
@gooduling
Jan 25 2016 14:51
перебирать его в foreach и при несоответствии прежнему состоянию - перерисовывать компонент?
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:51
вообще не перебирать
просто рисовать
реакт сам разберется что там с свг делать
Andrii Ulianenko
@gooduling
Jan 25 2016 14:52
не пойму( Чем тут заменяется .data(dataset).enter() ?
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:53
ты просто не используешь это апи
function DistributionChart({distribution: {type, bins, range}, prediction}) {
    var xScale = D3.scale.linear().range([0, WIDTH]).domain(range);
    var yScale = D3.scale.linear().range([HEIGHT, 0]).domain([0, D3.max(bins, ({value}) => value)]);

    var getX = ({left, right}) => xScale((right + left) / 2);
    var getY = ({value}) => yScale(value);

    var area = D3.svg.area().x(getX).y0(HEIGHT).y1(getY).interpolate('basis')(bins);

    return (
        <svg>
            <path d={area} />
        </svg>
    );
}
быстрый пример выдернутый из проекта
из d3 остается работа с массивами (extent и прочие) и скейлами
все по полочкам
Andrii Ulianenko
@gooduling
Jan 25 2016 14:55
О, спасибо. Сейчас читну
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:56
там есть ссылки на примеры на гитхабе
можно по коду пробежать и понять идею
вот с чего автор начал http://peterbeshai.com/buckets/app/
Andrii Ulianenko
@gooduling
Jan 25 2016 14:57
омг)
Alexey Raspopov
@alexeyraspopov
Jan 25 2016 14:58
автор недавно выступал на Boston React Meetup с вот этим набором примеров http://pbeshai.github.io/react-basic-vis-examples/
где пошагово рассказывал как юзать d3 с реактом
можешь посмотреть код этих примеров, много нужных паттернов увидишь
Andrii Ulianenko
@gooduling
Jan 25 2016 15:08
Спасибо большое, то что надо. Много чего гуглил, но єтот момент так и остался не ясным