evgeniyworkbel

В этом испытании вам предстоит реализовать авторизацию в настоящем SPA (single-page application). Идея состоит в том, что при получении валидной пары логин-пароль сервер возвращает токен, который сохраняется в local storage и отправляется на сервер с каждым клиентским запросом. Приложение состоит из главной, публичной и приватной страниц, а также страницы с формой входа. Часть кода уже написана, внимательно изучите файлы приложения. Выполнение испытания потребует изучения новых хуков и библиотек. Рекомендуем проходить это испытание после выполнения предыдущего.

components/LoginPage.jsx
Реализуйте компонент с формой авторизации пользователя. Форма содержит поля username и password. В случае ошибки аутентификации в форме показывается сообщение the username or password is incorrect. При успешной проверке полученный с сервера токен необходимо сохранить и сделать редирект на ту страницу, с которой пользователь попал в форму логина. Если пользователь зашёл по прямой ссылке, его следует перенаправить на главную стр

evgeniyworkbel

App.jsx
Реализуйте и экспортируйте по умолчанию компонент, который реализует приложение "записная книжка".

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

Для прохождения испытания нужно познакомиться с новыми хуками и использовать готовые компоненты бутстрапа. Рекомендуем проходить это испытание после выполнения предыдущего.

Примеры
Начальный HTML:

evgeniyworkbel

Buttons.jsx
Реализуйте и экспортируйте по умолчанию компонент <Buttons />, который отрисовывает кнопки со значением счетчика.

В компоненте необходимо реализовать следующее поведение:

Текущее значение счетчика каждой кнопки — это строка внутри тега button.
Клик по кнопке должен увеличивать значение счетчика на единицу, не затрагивая при этом другие счетчики.
Компонент должен принимать пропс count, который определяет количество кнопок. Значение по умолчанию: 3.
Для оформления внешнего вида кнопок используйте библиотеку bootstrap (подключена к испытанию).
Последняя нажатая кнопка меняет цвет (с помощью класса). Классы в примерах ниже.

evgeniyworkbel

export PS1="\[\e[m\]\[\e[0;90m\]\u: \[\e[m\]\[\e[0;93m\]\w\[\e[m\]\[\033[34m\]\$(__git_ps1)\[\033[00m\] $ "

how it will look: https://disk.yandex.by/i/49nO4q1d1mQyNA

evgeniyworkbel

JavaScript содержит метод JSON.stringify() для приведения к строке любого значения. Он работает следующим образом:

JSON.stringify('hello'); // "hello" - для строковых значений добавляются кавычки
JSON.stringify(true);    // true    - значение приведено к строке, но без кавычек
JSON.stringify(5);       // 5

const data = { hello: 'world', is: true, nested: { count: 5 } };
JSON.stringify(data); // {"hello":"world","is":true,"nested":{"count":5}} 

JSON.stringify(data, null, 2); // null, 2 - указывают на два пробела перед ключом

evgeniyworkbel

Объекты JavaScript позволяют обращаться к собственным свойствам. При обращении к свойству, которое не было установлено, возвращается undefined:

const obj = {
  key: 'value',
  key2: {
    key3: 'value3',
  },
};

obj.key2 // { key3: 'value3' }

evgeniyworkbel

dates.js
Реализуйте и экспортируйте по умолчанию функцию, которая переводит входные данные в удобный для построения графика формат.

На вход эта функция принимает три аргумента: массив данных; дата начала периода; дата конца периода. Данные представлены в формате объекта вида { value: 14, date: '02.08.2018' }, а даты диапазона в формате 'yyyy-MM-dd'.

Диапазон дат задаёт размер выходного массива, который должна сгенерить реализуемая функция. Правила формирования итогового массива:

он заполняется записями по всем дням из диапазона begin - end.
если во входном массиве нет данных для какого-то дня из диапазона, то в свойство value записи этого дня установить значение 0.
import buildRange from './dates.js';

evgeniyworkbel

В этой задаче необходимо реализовать ленивую коллекцию.https://ru.wikipedia.org/wiki/%D0%9E%D1%82%D0%BB%D0%BE%D0%B6%D0%B5%D0%BD%D0%BD%D0%B0%D1%8F_%D0%B8%D0%BD%D0%B8%D1%86%D0%B8%D0%B0%D0%BB%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D1%8F

enumerable.js
Реализуйте и экспортируйте по умолчанию класс, который предназначен для обработки коллекций объектов. Основная особенность работы данного класса заключается в том, что он использует lazy вариант обработки.

import Enumerable from './enumerable.js';

const elements = [
  { key: 'value' },
  { key: '' },

evgeniyworkbel

Пьяница — карточная игра, в которой побеждает тот игрок, который собирает все карты. В нашей задаче используется модификация игры с двумя игроками. Игрокам раздаётся равное количество карт. Игроки не смотрят в свои карты, а кладут их в стопку рядом с собой. Затем каждый игрок снимает верхнюю карту и показывает её сопернику. Тот игрок, чья карта оказалась большего номинала, берёт обе карты и кладёт их к себе в колоду снизу (так что своя карта идёт первой). Если карты имеют одинаковый номинал, то они выкидываются из игры. В игре возможны три исхода:

У обоих игроков не осталось карт
Игра не может закончиться
Победил один из игроков
drunkard.js
Реализуйте и экспортируйте по умолчанию класс с методом run(), принимающим на вход два списка чисел, которые представляют собой карты для первого и второго игроков.

Если выиграл первый игрок, то метод должен вернуть First player. Round: <номер раунда>.
Если выиграл второй игрок, то метод должен вернуть Second player. Round: <номер раунда>.

evgeniyworkbel

Square.js
Реализуйте и экспортируйте по умолчанию класс Square для представления квадрата. У квадрата есть только одно свойство — сторона. Реализуйте метод getSide(), возвращающий значение стороны.

Пример
const square = new Square(10);
square.getSide(); // 10
SquaresGenerator.js
Реализуйте класс SquaresGenerator со статическим методом generate(), принимающим два параметра: сторону и количество экземпляров квадрата (по умолчанию 5 штук), которые нужно создать. Функция должна вернуть массив из квадратов. Экспортируйте класс по умолчанию.

Пример