Видео
GET и POST запросы
- HTTP-методы GET и POST — самые распространённые способы отправить или получить данные с сервера.
- GET — метод для чтения данных с сайта. Например, для доступа к указанной странице. Он говорит серверу, что клиент хочет прочитать указанный документ. На практике этот метод используется чаще всего.
- POST — метод для отправки данных на сайт.
- Тело запроса присутствует только в POST-запросе и в ответе.
// GET
let response = await fetch(url);
// POST
let response = await fetch('/article/fetch/post/user', {
method: 'POST',
headers: {
'Content-Type': 'application/json;charset=utf-8'
},
body: JSON.stringify(user)
});
GET и POST обработчики на Flask
@app.route("/getData", methods=['GET'])
def getData():
responseJson = {'status': 'success'}
return responseJson
@app.route("/postData", methods=['POST'])
def postData():
requestJson = request.json
responseJson = {'status': 'success'}
return responseJson
Компоненты React
Компонент - это функция JS. Пример:
function Welcome() {
return <h1>Привет, Андрей</h1>;
}
Пропсы React
Пропсы - параметр props компонента.
function Welcome(props) {
return <h1>Привет, {props.name}</h1>;
}
Каждый родительский компонент может передать дочернему какую-либо для инициализации.
<Welcome name='Андрей'/>
Стейты React
Стейты - это переменные компонентов. При изменении стейта происходит автоматический рендеринг компонента.
function MyComponent() {
const [name, setName] = useState('Taylor');
function handleClick() {
setName('Robin');
}
}
Домашнее задание
- Создать компоненты React.
- На фронте создать страницу, на которой отобразить список предсказаний по темам (содержимое файла future.json с прошлого задания) с возможностью добавления.