🤖 Cruciverba Robot - Sistema Educativo Avanzato

App educativa interattiva per bambini che imparano a scrivere attraverso cruciverba con immagini fotorealistiche.

🌟 Caratteristiche

• 📸 Immagini HD fotorealistiche da Pixabay API
• ⌨️ Input multimodale - Tastiera fisica + touch screen
• 🔒 Sistema anti-duplicati - Ogni parola appare una sola volta
• ⬛ Layout cruciverba classico - Solo celle delle parole visibili
• 🎯 80+ parole nel vocabolario italiano per bambini
• 🎮 Griglia configurabile - Da 5 a 20 parole selezionabili
• 🧠 Algoritmo intelligente - Posizionamento ottimizzato delle parole
• 📱 Responsive design - Funziona su desktop, tablet e smartphone

🚀 Demo Live

🎮 Gioca Ora alla Demo!

Sostituisci "TUOUSERNAME" con il tuo username GitHub

🛠️ Installazione Locale

Prerequisiti

• Node.js (versione 16 o superiore)
• npm o yarn

Passi per l'installazione

# 1. Clona il repository
git clone https://github.com/TUOUSERNAME/cruciverba-robot.git

# 2. Entra nella cartella del progetto
cd cruciverba-robot

# 3. Installa le dipendenze
npm install

# 4. Avvia il server di sviluppo
npm start

L'app si aprirà automaticamente su http://localhost:3000

🎯 Come Giocare

1. Seleziona il numero di parole (5-20) dal menu a tendina
2. Clicca "NUOVA MISSIONE" per generare un nuovo cruciverba
3. Osserva le immagini negli indizi visivi per capire le parole
4. Digita le parole nei campi di input (solo lettere)
5. Ricevi feedback immediato quando la risposta è corretta
6. Usa "MOSTRA SOLUZIONI" se hai bisogno di aiuto

📱 Tecnologie Utilizzate

• React 18 - Framework JavaScript
• Tailwind CSS - Styling e design responsive
• Lucide React - Icone moderne
• Pixabay API - Immagini fotorealistiche
• GitHub Pages - Hosting gratuito

🔧 Comandi Disponibili

# Avvia il server di sviluppo
npm start

# Crea build di produzione
npm run build

# Esegue i test
npm test

# Deploy su GitHub Pages
npm run deploy

📋 Struttura del Progetto

cruciverba-robot/
├── public/
│   └── index.html          # Template HTML principale
├── src/
│   ├── App.js              # Componente principale del cruciverba
│   ├── index.js            # Entry point dell'app
│   └── index.css           # Stili Tailwind CSS
├── package.json            # Dipendenze e script
├── tailwind.config.js      # Configurazione Tailwind
├── .env                    # Variabili d'ambiente (chiave API)
└── README.md              # Questo file

🎨 Caratteristiche Educative

Vocabolario Ottimizzato

• 80+ parole italiane accuratamente selezionate
• Oggetti fisici familiari ai bambini
• Categorizzazione per temi: casa, natura, cibo, scuola, trasporti

Sistema di Apprendimento

• Associazione visiva: Immagine + parola scritta
• Feedback immediato: Conferma istantanea delle risposte corrette
• Progressione graduale: Difficoltà scalabile da 5 a 20 parole
• Interfaccia intuitiva: Design child-friendly

🔐 Configurazione API

L'app utilizza l'API di Pixabay per le immagini. La chiave API è già configurata nel file .env:

REACT_APP_PIXABAY_API_KEY=50491918-b5d12a5a4f3c90485fad27932

🚀 Deploy su GitHub Pages

1. Modifica il campo homepage in package.json:

   "homepage": "https://tuousername.github.io/cruciverba-robot"

2. Esegui il deploy:

   npm run deploy

3. Configura GitHub Pages nelle impostazioni del repository:

   • Vai su Settings → Pages
   • Source: Deploy from branch
   • Branch: gh-pages

🤝 Contribuire

I contributi sono benvenuti! Per contribuire:

1. Fork il progetto
2. Crea il tuo branch (git checkout -b feature/AmazingFeature)
3. Committa le modifiche (git commit -m 'Add some AmazingFeature')
4. Push al branch (git push origin feature/AmazingFeature)
5. Apri una Pull Request

📝 Roadmap Future

• Modalità difficoltà - Livelli facile/medio/difficile
• Salvataggio progressi - Sistema di punteggi e statistiche
• Modalità competitiva - Sfide a tempo
• Vocabolario espanso - Aggiunta di nuove categorie
• Supporto multilingua - Inglese, francese, spagnolo
• Modalità offline - Funzionamento senza connessione

📄 Licenza

Questo progetto è distribuito sotto licenza MIT. Vedi il file LICENSE per maggiori dettagli.

🙋‍♂️ Supporto

Se hai domande o problemi:

1. Controlla le Issues su GitHub
2. Apri una nuova Issue se il problema non è già stato segnalato
3. Contatta via email: [tuaemail@esempio.com]

🎉 Ringraziamenti

• Pixabay per le splendide immagini fotorealistiche
• Tailwind CSS per il sistema di design
• React Team per il framework eccezionale
• Tutti i contributori che hanno reso possibile questo progetto

---

Creato con ❤️ per l'educazione dei bambini

🏠 Homepage • 📊 Issues • 🔄 Pull Requests