Corso React con React Redux, hooks e Laravel come backend
4.4 (259 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
1,211 students enrolled

Corso React con React Redux, hooks e Laravel come backend

Impara React, hooks, redux e react redux da zero a livello avanzato .Single Page Application con Laravel. Deploy app
4.4 (259 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
1,211 students enrolled
Created by Hidran Arias
Last updated 4/2020
Italian
Current price: $59.99 Original price: $99.99 Discount: 40% off
4 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 25.5 hours on-demand video
  • 3 articles
  • 72 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Usare JSX
  • Usare React
  • Creare componenti
  • Creare Single Page Application
  • Chiamate ad API per mostrare i dati lato frontend
  • Usare redux, redux promise middleware e thunks
Course content
Expand all 187 lectures 25:43:21
+ Introduzione
9 lectures 01:07:27

Vedremo cos'è react

Preview 09:40

Installare nvm su windows

Installare nvm su windows
05:42
Installare nvm su mac
05:04
Nota su javascript ES6/7
00:08

Editor Visual code

Editor Visual code
16:02

Editor online stackblitz. Visual code online

Editor online stackblitz. Visual code online
05:29

Installare create-react-app.

https://github.com/facebook/create-react-app

Preview 08:51

Struttura app react con funzione al posto di classe

Struttura app react con funzione al posto di classe
11:45
+ Componenti. Uso di JSX in React
6 lectures 01:13:35

JSX: Elementi ed espressioni

JSX: Elementi ed espressioni
12:57

Component e props. Vedremo come creare un componente con una funzione e come passare parametri attraverso delle proprietà

Component e props
16:47

Component. Props e state

Component. Props e state
10:55

Component: LifeCycle & hooks

Component: LifeCycle & hooks
10:49

Component. ComponentDidMount & componentWillMount

Component. ComponentDidMount & componentWillMount
08:01

Component. SetState, prevPos & nextProps

Component. SetState, prevPos & nextProps
14:06
+ Gestione eventi
5 lectures 41:47

Evento onlick e gestione del this

Evento onlick e gestione del this
11:57

Eventi: Bind di funzioni e uso delle arrow function

Eventi: Bind di funzioni e uso delle arrow function
06:57

Gestire liste e mostrare array di elementi

Gestire liste e mostrare array di elementi
09:56

Formattare una lista

Formattare una lista
07:49

Accesso al sorgente del corso su github

Accesso al sorgente del corso su github
05:08
+ Creazione app my movies
13 lectures 01:26:44

My movies app.Intro. Visita sito open movies database

My movies app.Intro
01:58

Creare app e ottenere chiave API di omdb

Creare app e ottenere chiave API di omdb
08:07

My  movies app. Chiamata api con api FETCH

My movies app. Chiamata api con api FETCH
06:22

My movies app. Mostrare elenco film. FETCH API

My movies app. Mostrare elenco film. FETCH API
07:00
My movies app. Creare componente MoviList
07:32

Creazione movieitem e layout con bootstrap

Creazione movieitem e layout con bootstrap
06:13

MovieItem: Layout responsive con bootstrap

MovieItem: Layout responsive con bootstrap
07:30
MovieItem: Conclusione
04:48

My movies app. Component NavBar con bootstrap

My movies app. Component NavBar con bootstrap
06:39

My movies app. Component SearchBar e NavBar

My movies app. Component SearchBar e NavBar
03:26

My movies app. Controlled Component SearchBar

My movies app. Controlled Component SearchBar
08:38

My movies app. Passare  funzioni da padre a figli

My movies app. Passare funzioni da padre a figli
10:44

My movies app.Evento OnClick ricerca Video

Preview 07:47
+ React Redux. Todo list
27 lectures 03:33:32
Introduzione a redux
06:21

Creazione applicazione Todolist-redux

Creazione app todolist con Redux
04:21

Creazione app todolist con Redux

Creazione app todolist con Redux. Creazione di store e reducer
13:31
Creazione Store, Reducer e stato iniziale.Conclusione
07:01

Redux Todolist. React.createref . Accedere al DOM

Redux Todolist. React.createref . Accedere al DOM
07:06

Redux Todolist. Store.dispatch, store.subscribe

Redux Todolist. Store.dispatch, store.subscribe
11:45

Redux. Dispatch action REMOVE_TODO

Redux. Dispatch action REMOVE_TODO
12:07

React redux Intro

React redux Intro
02:03

React-redux todolist. Creare i componenti presentazionali

React-redux todolist. Creare i componenti presentazionali
14:40

React redux Action Creators

React redux Action Creators
08:17

React redux  connect e MapStateToProps

React redux connect e MapStateToProps
11:24

React redux  connect e MapStateToProps. Conclusione

React redux connect e MapStateToProps. Conclusione
05:24

MapDispatchToProps. Passare funzione da store a state

MapDispatchToProps. Passare funzione da store a state
09:00

Connettere add todo component con connect e container

Connettere add todo component con connect e container
03:20

Collegare componente con connect e passare dispatch

Collegare componente con connect e passare dispatch
09:55

Passare metodo removeTodo attraverso mapDispatch

Passare metodo removeTodo attraverso mapDispatch
07:11

Aggiunta checkbox con carattere unicode, rimozione bottone remove e gestione lay

Aggiunta checkbox con carattere unicode, rimozione bottone remove e gestione lay
09:54

Aggiungere onKeyUpp all'input

Aggiungere onKeyUpp all'input
06:16
Cambiare lo stato dello store per aggiungere completed e id
09:51

Creare footer per filtrare i todo

Creare footer per filtrare i todo
07:13

Cambiare removetodo per toggleTodo

Cambiare removetodo per toggleTodo
11:03

Creare componente TodoFooter

Creare componente TodoFooter
02:28

Container todofooter

Container todofooter
04:21

Azione SET_FILTER

Azione SET_FILTER
09:40

Filtrare i todos

Filtrare i todos
06:50

Segnare il filtro attivo

Segnare il filtro attivo
06:23

Salvare i dati nella localStorage

Salvare i dati nella localStorage
06:07
+ Redux middleware
4 lectures 34:39

Redux middleware intro

Redux middleware intro
02:49

Applimiddleware e struttura di un middleware

Preview 11:36

Catena di middleware. Verificare passo a passo un middleware

Catena di middleware. Verificare passo a passo un middleware
13:23

Redux logger e plugin dev tool

Redux logger e plugin dev tool
06:51
+ React redux con promise
7 lectures 01:05:10

Installare json-server e postman

Installare json-server e postman
13:41

Installare redux promise middleware e axios

Preview 10:52

Chiamare il server per lista di todos e aggiungere nuovi con promise e axios

Chiamare il server per lista di todos e aggiungere nuovi con promise e axios
10:57

Toggle todo con promise e axios

Toggle todo con promise e axios
07:00

Filtrare i  todo lato server con promise e axios

Filtrare i todo lato server con promise e axios
04:24

Rimuovere definitivamente un todo. Action REMOVE_TODO

Rimuovere definitivamente un todo. Action REMOVE_TODO
08:54

Rimuovere todo lato server

Rimuovere todo lato server
09:22
+ Error boundaries , PropTypes e gestione degli errori
5 lectures 45:16

Errori di rete e promise rejected

Errori di rete e promise rejected
04:44

Errorbounday. Creazione di un componente per catturare gli errori javascript

Errorbounday. Creazione di un componente per catturare gli errori javascript
10:07

Gestione degli errori con un errorboundary component

Gestione degli errori con un errorboundary component
13:33

PropTypes e typechecking

PropTypes e typechecking
09:38

Aggiungere proptypes alla nostra todo app

Aggiungere proptypes alla nostra todo app
07:14
+ Combinereducers. Gestire lo stato con diversi reducers
5 lectures 36:00

Dividere lo store reducers in tre reducers

Dividere lo store reducers in tre reducers
09:28

Usare combineReducers per passare i reducers allo store

Usare combineReducers per passare i reducers allo store
05:35

Refactor dei reducers

Refactor dei reducers
06:23

Sistemare mapping dei reducers e valore iniziale dello store

Sistemare mapping dei reducers e valore iniziale dello store
04:14

Sistemare filtri e salvataggio dati nel localstorage

Sistemare filtri e salvataggio dati nel localstorage
10:20
Requirements
  • Html
  • Css
  • Javascript almeno funzionale
  • Conoscenza dom html ed eventi
Description

Impara React, redux e react redux da zero a livello avanzato .Single Page Application con API di Laravel come backend

Se vuoi imparare ad utilizzare la libreria REACTJS  passo a passo, in modo pratico e senza fronzoli, questo è il corso che fa per te!.

Ho voluto condensare in questo corso i concetti fondamentali di REACT E REDUX in modo semplice, comprensibile e pratico in modo che sia alla portata di tutti coloro che hanno un minimo di esperienza con javascript, html e css.

Ecco i concetti fondamentali che imparerai in modo pratico:

  • Installazione nodejs e npm

  • Creazione di un'app REACT

  • Struttura dell'app creata con create-react-app

  • Introduzione a  JSX

  • Rendering di elementi

  • Componenti e Props

  • State & Lifecycle

  • Gestione Eventi

  • Rendering condizionale

  • Liste and Keys

  • Forms

  • Controlled components

  • Accedere al DOM degli elementi con React.createRef

  • React Fragments

  • Chiamate ad API esterne

  • Passare parametri da padre a figli

  • React router

  • Hooks: useState, useEffect, useReducer

Creeremo un'app: Movie API dove vedremo

  • Cos'è Redux

  • Cos'è una store

  • Inviare messaggi alla store con dispatch

  • Abbonarsi agli eventi della store con subscribe

  • Actions e Actions creators

  • Reducers


React Readux

Creeremo un'app, TODO LIST, dove vedremo

  • Collegare React e Redux con react-redux

  • Passare la store ai componenti con <Provider>

  • Connettere la store ai componenti con connect()

  • Creazioni di componenti container per collegare redux ai componenti

  • Mappare lo state della store come proprietà dei componenti

  • Mappare gli Action Creator come metodi e passarli come proprietà allo store con connect

  • MapDisPatch to Props

  • MapStateToProps

  • Utilizzo di combineReducers

  • Creazione di un CRUD, create, read update e delete con Laravel come backend

Questi sono i concetti Core per sviluppare in REACT e vengono tutti coperti in modo pratico ed intuitivo


Who this course is for:
  • Web developer
  • Web designer
  • Front end developer
  • Chiunque abbia voglia di imparare a fare Single Page Application