Τι είναι το state και τα props στο πλαίσιο της ανάπτυξης React;

State — είναι η εσωτερική κατάσταση του συστατικού, ένα σύνολο δεδομένων που μπορεί να αλλάξει κατά τη διάρκεια λειτουργίας του συστατικού. Η αλλαγή του state προκαλεί την επαναεικόνιση του συστατικού.

Props — είναι εξωτερικές παράμετροι που περνιούνται στο συστατικό από έξω, από τον γονικό συστατικό. Τα props είναι αμετάβλητα μέσα στο συστατικό που τα λαμβάνει. Χρησιμοποιούνται για διαμόρφωση και μεταφορά δεδομένων από τον γονέα στο παιδί.

Βασικές διαφορές:

Χαρακτηριστικό	State	Props
Πηγή	Εσωτερικό του συστατικού	Μεταβιβάζονται από έξω
Μεταβλητότητα	Μπορεί να αλλάξει	Δεν μπορούν να αλλάξουν μέσα
Στόχος	Έλεγχος εσωτερικής εμφάνισης	Μεταφορά δεδομένων και διαμόρφωσης

Παράδειγμα χρήσης του state:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0); // Αρχικοποίηση του state

  return (
    <div>
      <p>Μετρητής: {count}</p>
      <button onClick={() => setCount(count + 1)}>Αύξηση</button>
    </div>
  );
}

Παράδειγμα χρήσης των props:

import React from 'react';

function Greeting(props) {
  return <h1>Γειά σου, {props.name}!</h1>; // Χρήση των props
}

function App() {
  return <Greeting name="Κόσμε" />; // Μεταβίβαση των props
}