Рубрика «react.js»

О механизме React по предотвращению возможности инъекции JSON для XSS, и об избегании типовых уязвимостей.

Читать полностью »

Добрый день, дорогие друзья.

В данной статье хотел бы максимально просто и кратко описать механизм redux-saga каналов, на примерах приближенных к реальным кейсам, надеюсь у меня это вышло.

Итак, начнем.

Читать полностью »

Для начала надо установить компонент react-validation-boo, предполагаю что с react вы знакомы и как настроить знаете.

npm install react-validation-boo

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

import React, {Component} from 'react';
import {connect, Form, Input, logger} from 'react-validation-boo';

class MyForm extends Component {
    sendForm = (event) => {
        event.preventDefault();

        if(this.props.vBoo.isValid()) {
            console.log('Получаем введённые значения и отправляем их на сервер', this.props.vBoo.getValues());
        } else {
            console.log('Выведем в консоль ошибки', this.props.vBoo.getErrors());
        }
    };
    getError = (name) => {
        return this.props.vBoo.hasError(name) ? <div className="error">{this.props.vBoo.getError(name)}</div> : '';
    };
    render() {
        return <Form connect={this.props.vBoo.connect}>
            <div>
                <Input type="text" name="name" />
                {this.getError('name')}
            </div>
            
            <button onClick={this.sendForm}>
                {this.props.vBoo.isValid() ? 'Можно отправлять': 'Будьте внимательны!!!'}
            </button>
        </Form>
    }
}

export default connect({
    rules: () => (
        [
            ['name', 'required'],
        ]
    ),
    middleware: logger
})(MyForm);

Читать полностью »

Введение в React Hooks - 1

Если вы читаете Twitter, вы, вероятнее всего, знаете что Hooks  -  это новая фича React, но вы можете спросить, как мы на практике можем их использовать? В этой статье мы покажем вам несколько примеров использования Hooks.
Одна из ключевых идей для понимания заключается в том, что Hooks позволяют использовать state и другие возможности React без написания классов.
Читать полностью »

image

С выходом нового React 16.6.0 в документации появился HOOKS (PROPOSAL). Они сейчас доступны в react 17.0.0-alpha и обсуждаются в открытом RFC: React Hooks. Давайте разберемся что это такое и зачем это нужно под катом.

Читать полностью »

Как фронтентд-разработчику заработать больше?

Я более 6-ти лет занимаюсь фронтендом для своих проектов или фриланса. Начинал с html/css/js, узнал о WordPress — учил php/sql. Но это все копейки, настоящие деньги достаются тем кто учит модные сейчас фреймворки — Angular, Vue, React.

Читать полностью »

Хотите получить наглядное представление о том, что происходит с компонентами, когда вы работаете с React? Читайте под катом перевод статьи Ohans Emmanuel, опубликованной на сайте freeCodeCamp.

Незнание основ React, которое, возможно, вас губит - 1Читать полностью »

Привет!

Краткий экскурс в GraphQL - 1

Именно кратким экскурсом в язык запросов GraphQL послужит вам книга Алекса Бэнкса и Евы Порселло, которую мы отдали в перевод пару дней назад. Книга этих же авторов о React и Redux стала настоящим бестселлером (ждем 5-й тираж из типографии). Кстати, спасибо всем, кто указал нам на неточности в коде и терминах ;) книгу по столь быстро устаревающей технологии мы делали излишне быстро.

Автор сегодняшней статьи Робин Вирух также работает над книгой о GraphQL и библиотеках для этого языка, а в сегодняшней статье кратко объясняет достоинства и характерные особенности GraphQL как альтернативы REST
Читать полностью »

Эта статья является ответом на статью-перевод «Как сделать поиск пользователей по GitHub используя React + RxJS 6 + Recompose», которая буквально вчера научила нас как надо использовать React, RxJS и Recompose вместе. Что ж, предлагаю теперь посмотреть, как это можно реализовать без оных инструментов.

Как сделать поиск пользователей по GitHub без React + RxJS 6 + Recompose - 1
Читать полностью »

Картинка для привлечения внимания

Эта статья рассчитана на людей имеющих опыт работы с React и RxJS. Я всего лишь делюсь шаблонами, которые я посчитал полезными для создания такого UI.

Читать полностью »