POST

Para los que no usan Axiox (como yo), les dejo la form para hacerlo con fetch

const data = await fetch("https://jsonplaceholder.typicode.com/todos",
        { 
            method: 'POST', 
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(newTask)
        }
    ).then(response => response.json())

Consulta @RodolfoSaldivar, No es mejor en lugar de hacer un nuevo GET para traer todas las tareas concatenar a las tareas que tenemos en el store la tarea que nos devuelve el metodo post?

1. Al componente Guardar.js le agregamos al botón de guardar un evento onClick que este evento llama al actions creator agregar(nueva_tarea) mandándole por parámetro un objeto con los valores de la nuevas tarea que se enviara a la API.

2. Creamos el actions agregar() que recibe por parámetro el objeto con la info de la nueva tarea que se enviara a la API, hacemos la petición de tipo POST con axios a la url y mandándole como segundo parámetro el objeto que voy a agregar a la API y me retorna la respuesta de la peticion en respuesta.data el nuevo campo que se agrego.

3. Justo después de la petición ejecuto un dispatch de tipo agregada, en el reducer creo ese caso que retona el estado y las tareas vacío porque ya no están las mismas tareas se puso una nueva

Conclusión: cuando se de click al botón guardar llama al action agregar() que ejecuta la petición de tipo post a la API y como segundo parámetro el objeto que voy a agregar a la API, es decir la nueva tarea a algún usuario.

Este curso me hizo acordar lo que dijo un profesor en el curso profesional de Javascript. “Cuando la única herramienta que tienes es un martillo, todo problema comienza a parecerse a un clavo”.

Como en este curso se quiere enseñar a usar Redux, todo lo están haciendo con Redux. Concuerdo con que Redux es una gran herramienta, ayuda un montón, pero está en nosotros cuando es mejor usarlo y cuando no.

mi Cabeza desbloqueo una gran parte de hueco de teorias, excelente

Existe algún problema si se hace de la siguiente manera o no es una buena practica

export const agregar = () => async (dispatch, getState) => {
    dispatch({
        type: CARGANDO
    });
    const { usuario_id, titulo} = getState().tareasReducer;
    const nuevaTarea = {
        userId: usuario_id,
        title: titulo,
        completed: false
    };
    try
    {
        const respuesta = await axios.post('https://jsonplaceholder.typicode.com/todos', nuevaTarea);
        console.log(respuesta.data);
        dispatch({
            type: 'agregada'
        });
    } catch (err) {
        console.log(err.message);
        dispatch({
            type: ERROR,
            payload: 'Intente mas tarde.'
        });
    }
};

Al no utilizar base de dato, de donde surgen los ID autogenerados?. Donde quedan almacenados los datos?

jsonplaceholder se encarga de crear una simulacion de un POST correcto ya que no estamos trabajando con una base de datos como tal, generando un id a la tarea cuando la guardamos

Esta clase estuvo interesante.

Quizá tuvo que haber explicado todo éste módulo de primero, pues la forma en que ahora lleva el curso de todos es muuucho mejor que el primer módulo… El profeso es sin dudas muy bueno y el contenido de clase es sin dudas mucho mejor!
Excelente clasE!

Excelente clase. 🙂

un buena clase

La URL de las tareas:
https://jsonplaceholder.typicode.com/todos

Excelente clase

Me sale esto en cuando le doy a guardar:

http://localhost:3000/tareas/guardar?```

¿Alguna idea de por qué?

Mi código:
export const agregar = nueva_tarea => async dispatch => {
// console.log(nueva_tarea)
dispatch({
type: CARGANDO
})

try {
const respuesta = await axios.post(
‘https://jsonplaceholder.typicode.com/todos’,
nueva_tarea)
console.log(respuesta.data)
dispatch({
type: ‘agregada’
})
} catch (error) {
console.log(error.message)
dispatch({
type: ERROR,
payload: ‘Inténtelo más tarde.’
})
}
}```

Hola, al intentar hacer la peticion POST del request ilustrado en el video me sale un problema de CORS policy, no se que headers tendria que agregar a la peticion, si alguno le ha salido este problema favor notificar para seguir con el curso.

Gracias

Aquí les dejo el Url de las tareas
https://jsonplaceholder.typicode.com/todos

export const agregar = (new_task) => async (dispatch) => {
	// console.log(new_task)
	dispatch({
		type: CARGANDO
	})

	try {
		const respuesta = await axios.post('https://jsonplaceholder.typicode.com/todos', new_task)
		console.log(respuesta)
		dispatch({
			type: 'agregada'
		})
	} catch(error){
		console.log(error.message)
		dispatch({
			type: ERROR,
			payload: 'Intentelo mucho mas tarde'
		})

	}
}```

excelente clase