Frontend

Все, что касается клиентской части вэб-разработки, помимо самой верстки.

При разработке вэб-приложений на React у начинающих разработчиков наибольшие трудности вызывает использование библиотеки Redux. Попробуем вместе разобраться в ней.

Данное руководство по языку программирования JavaScript предназначено для быстрого повторения основ этого языка, например, для подготовки к текстам. Для более глубокого изучения рекомендую использовать учебники и онлайн-курсы.

Современная версия языка JavaScript, носящая название ES2015, он же ES6,  получила ряд дополнительных возможностей, которые хотелось бы рассмотреть отдельно.

1. Деструктуризация (destructuring assignment)

Деструктуризация это выражение, позволяющее преобразовать объект или массив в список переменных, выражение слева содержит список переменных, выражение справа - объект или массив, который нужно преобразовать.

let {a, b, ...rest} = {a: 100, b: 200, c: 300, d: 400}
a; // 100
b; // 200 
rest; // { c: 300, d: 400 }

Если число переменных меньше, чем в объекте, то оператор спред "..." после переменных позволяет добавить все остальные элементы массива или объекта в переменную после "...". 

продолжение следует...

sessionStorage - одно из свойств объекта window (т.е. целого вэб-документа).

Оно позволяет устанавливать пары ключ-значение, сохраняя их на компьютере пользователя в течении установленного срока (сессии). Как правило, свойство sessionStorage используется для сохранения данных пользователя на время текущей сессии. Для работы со свойством существует 4 javascript функции (метода), позволяющих соотвественно задавать, считывать, удалять пару или очищать полностью все элементы.

// установить пару ключ - значение
sessionStorage.setItem("key", "value");
// считать значение по ключу
var lastname = sessionStorage.getItem("key");
// удалить значение по ключу
sessionStorage.removeItem("key");
// удалить все сохраненные данные 
sessionStorage.clear();

    Существует также localStorage, имеющее те же свойства, но без ограничения времени хранения.

Значения sessionStorage и localStorage имеют тип строка, но есть возможность записывать в них и объекты, используя при этом JS-функцию JSON.stringify()

var myJSON = JSON.stringify(obj);

React Developer Tools - это дополнение к браузеру Google Chrome от компании Фэйсбук, которое служит очень полезным инструментом при работе с React. Дополнение создает еще одну вкладку (React) в Инструментах разработчика (Ctrl+Shift+I), позволяющую произвести инспекцию всего реакт-приложения, включая компоненты, а также их свойства и состояния (state, props).