zkk / Udemy React course



Descrizione corso

Titolo

React - The Complete Guide 2025 (incl. Next.js, Redux)

Autore e insegnante

Autore e insegnante:

Academind by Maximilian Schwarzmüller.

Sezione 1: Getting started

Impostazioni

Code Editor e cartelle locali

Visual Studio Codium con le seguenti estensioni:

Salvo i vari progetti nella cartella ~/mygit/, ad esempio il primo nella cartella ~/mygit/react/.

Sync cartella locale e VPS

Sul VPS max73.it creo il repository:

ssh max73.it
su -l git
git init --bare react-sand.git

Sul computer locale, ad un certo punto vado a generare il codice del sito statico che viene creato nella cartella dist:

cd ~/mygit/react
npm run build
cd dist
git init
git remote add origin git@react-sand.git
git add .
git commit -m "Default."
git push origin main

A questo punto, sul VPS, dove ho creato il dominio https://sand.max73.it :

cd /var/www/sand
git config --global --add safe.directory *
git clone /var/git/react-sand.git .

L’obiettivo è quello di creare le varie branch dei vari step del corso.

Sezione 2: JavScript Refresher

Arrow Function

Qualche prova:

function multi(number){
  	return number * 3;
}
const number = 3
const result = multi(number);
console.log(result)

const result2 = number => number * 3;
console.log(result2(2))

Class Objects

Constructor e Instances, praticamente il primo è la definizione di un oggetto, ed il secondo è la dichiarazione di un oggetto in basa alla sua definizione.

class User {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    greet() {
        console.log('Hi '+ this.name)
    }
}

const user1 = new User("Manuel", 35)
user1.greet()

Notare il significato di this che si riferisce all’array in qui è contenuto.

Destructuring

Un modo per dichiarare variabili mentre di dichiarano Arrays e Objects.

// const [nome, cognome] = ["Max", "Fontana"];
const {nome: userName, cognome} = {
    nome: "Max",
    cognome: "Fontana"
}
console.log(userName)
console.log(cognome)

Sezione 3: React Essential - Compenents, JSX, Props, State & More