Skip to content
This repository was archived by the owner on Sep 15, 2022. It is now read-only.

Commit d0aee3f

Browse files
committed
Add hints to homework tasks
1 parent acd2f44 commit d0aee3f

File tree

4 files changed

+58
-0
lines changed

4 files changed

+58
-0
lines changed
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Задание 1 : Сделать компонент для отображения статьи
2+
3+
_Уровень сложности: низкий_
4+
5+
#### Задание
6+
7+
В компонент передается заголовок, имя автора и текст, а он их отображает, как статью. Внешний вид на ваше усмотрение.
8+
9+
#### Подсказка
10+
11+
Нужно создать компонент Article c параметрами, например, ```title```, ```author``` и ```body```.
+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
# Задание 2 : Написать динамический Hello World.
2+
3+
_Уровень сложности: низкий_
4+
5+
#### Задание
6+
7+
В поле ввода вводится текст. Снизу надпись, которая отображает “Hello, <введенный текст>!”. Текст должен меняться по мере ввода. Если в поле ничего не введено, то должно быть выведено “Hello, stranger!”.
8+
9+
#### Подсказка
10+
11+
В компоненте должно быть поле для ввода с событием ```onChange```. Обработчик события может выглядеть так:
12+
13+
```jsx
14+
// ...
15+
16+
handleNameChange(event) {
17+
this.setState({
18+
name: event.target.value
19+
});
20+
}
21+
22+
// ...
23+
```
24+
25+
А в компоненте нужно будет затем отобразить поле ```name``` состояния.
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Задание 3 : Дополнительная информация о контактах
2+
3+
_Уровень сложности: средний_
4+
5+
#### Задание
6+
7+
Усовершенствовать список контактов, написаный на уроке. При клике на контакт, он должен разворачиваться (увеличиваться в высоте) и должна отображаться какая-то дополнительная информация о контакте (например, адрес и email). При повторном клике, информация должна сворачиваться.
8+
9+
#### Подсказка
10+
11+
Для того, чтобы контакт разворачивался, в компоненте ```Contact``` нужно добавть состояние ```isOpened```. Обрабатывать событие ```onClick```, в обработчике нужно изменять состояние на противоположное предыдущему. В методе ```render``` в зависимости от значения ```this.state.isOpened``` отображать либо сокращенную информацию о контактах, либо полную.
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Задание 4 : Простой калькулятор
2+
3+
_Уровень сложности: выше среднего_
4+
5+
#### Задание
6+
7+
В два поля вводится числа `а` и `b`. Нужно написать простой калькулятор, который умеет их складывать, вычитать и умножать. Отображение на ваше усмотрение.
8+
9+
#### Подсказка
10+
11+
Вариантов реализации этого задания огромная масса. Проявите фантазию :)

0 commit comments

Comments
 (0)