Torna ai progetti

2025 - Progetto formativo

Corso interattivo di React

Impara React costruendo un portfolio

Corso interattivo di React per principianti: 30 livelli per costruire un portfolio reale, con controlli automatici locali e progresso nel cloud.

Perché questo corso

Volevo un modo pratico e passo passo per imparare React con feedback immediato. Ho progettato un percorso gamificato nel portfolio: ogni livello spiega concetti (JSX, componenti, props, stato, hook, routing…) mentre costruisci il sito con Vite e Tailwind.

Come funziona

Scarichi un template, esegui npm run dev e npm run check. Playwright valida ogni passo nel tuo codice; avanzi uno alla volta. Il sito del corso mostra concetti React, istruzioni chiare e mappa dei livelli.

Caratteristiche

  • 30 livelli progressivi

    Da Hello World al deploy su Vercel: JSX, componenti, props, useState, useEffect, React Router, Context, test Vitest e CI GitHub Actions.

  • Correzione automatica

    Playwright verifica il codice in locale. Un passo = un avanzamento; niente completamenti multipli.

  • Concetti spiegati

    Ogni passo include una spiegazione del concetto React prima dell'azione pratica.

  • Portfolio reale

    Risultato finale: portfolio deployabile con navbar, progetti, contatto, tema e pannello admin.

Stack tecnologico

Frontend studente + piattaforma portfolio.

  • React 19UI studente · Vite
  • Tailwind CSSStili utility-first
  • PlaywrightValidazione locale
  • Next.jsPiattaforma corso
  • SupabaseProgresso e diplomi

Il mio ruolo

Design pedagogico, contenuti 30 livelli, motore di verifica, UI mappa livelli e integrazione portfolio.

Corso interattivo di React — Impara React costruendo un portfolio | Pau Pedrejon