// Projet : NaxaForge - Clone complet de Fiverr avec un seul vendeur // Stack : React + Firebase (Auth + Firestore + Hosting)

// Arborescence des dossiers : // - /src //   - /components //   - /pages //   - /services //   - /admin //   - /utils // - firebase.json // - .firebaserc // - public/ // - package.json

// === Étape 1 : Authentification Firebase === // src/services/firebase.js import { initializeApp } from "firebase/app"; import { getAuth } from "firebase/auth"; import { getFirestore } from "firebase/firestore";

const firebaseConfig = { apiKey: "VOTRE_API_KEY", authDomain: "VOTRE_DOMAINE.firebaseapp.com", projectId: "VOTRE_ID", storageBucket: "VOTRE_BUCKET", messagingSenderId: "", appId: "", };

const app = initializeApp(firebaseConfig); export const auth = getAuth(app); export const db = getFirestore(app);

// === Étape 2 : Pages === // src/pages/Home.jsx import React from "react"; const Home = () => (

  <div>
    <h1>Welcome to NaxaForge</h1>
    <p>Find premium services directly from the platform creator.</p>
  </div>
);
export default Home;// === Étape 3 : Admin Panel === // src/admin/Dashboard.jsx import React, { useEffect, useState } from "react"; import { db } from "../services/firebase"; import { collection, getDocs } from "firebase/firestore";

const Dashboard = () => { const [stats, setStats] = useState({ users: 0, orders: 0 });

useEffect(() => { const fetchStats = async () => { const usersSnapshot = await getDocs(collection(db, "users")); const ordersSnapshot = await getDocs(collection(db, "orders")); setStats({ users: usersSnapshot.size, orders: ordersSnapshot.size }); }; fetchStats(); }, []);

return ( <div> <h2>Admin Dashboard</h2> <p>Registered Users: {stats.users}</p> <p>Total Orders: {stats.orders}</p> </div> ); }; export default Dashboard;

// === Étape 4 : Ajout de la navigation === // src/App.jsx import React from "react"; import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import Home from "./pages/Home"; import Dashboard from "./admin/Dashboard";

const App = () => ( <Router> <Routes> <Route path="/" element={<Home />} /> <Route path="/admin" element={<Dashboard />} /> </Routes> </Router> );

export default App;

// === Étape 5 : Package.json (partiel) === { "name": "naxaforge", "version": "1.0.0", "dependencies": { "react": "^18.0.0", "react-router-dom": "^6.0.0", "firebase": "^10.0.0" } }

// === Étape 6 : Commande de build === // npm install // npm run build

// === Étape 7 : Déploiement === // firebase init // firebase deploy