Hugging Face's logo

Spaces:
Abmacode12
/
espace-codage
Configuration error

App Files Community
espace-codage
File size: 5,134 Bytes
b55f131
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documentation - Espace Codage</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"/>
</head>
<body>
    <div class="container">
        <!-- Colonne 1 : Navigation -->
        <aside class="sidebar">
            <div class="header">
                <a href="index.html" class="logo">Espace Codage</a>
            </div>
            <nav class="menu">
                <a href="index.html" class="menu-item"><i class="fas fa-home"></i> Accueil</a>
                <a href="documentation.html" class="menu-item active"><i class="fas fa-book"></i> Documentation</a>
                <button>Nouvelle tâche</button>
                <button>Rechercher</button>
                <button>Bibliothèque</button>
            </nav>
            <div class="projects">
                <h3>Projets</h3>
                <ul id="projectList">
                    <!-- Projets ajoutés ici -->
                </ul>
            </div>
        </aside>

        <!-- Colonne 2 : Documentation -->
        <main class="documentation">
            <div class="doc-header">
                <h2><i class="fas fa-book"></i> Documentation Rosalinda</h2>
                <div class="doc-version">Version 1.0.0</div>
            </div>
            
            <div class="doc-content">
                <section class="doc-section">
                    <h3><i class="fas fa-comment-dots"></i> Fonctionnalités du Chat</h3>
                    <div class="feature-card">
                        <h4><i class="fas fa-code"></i> Génération de code</h4>
                        <p>Rosalinda peut générer du code dans plusieurs langages (Python, JavaScript, HTML/CSS, etc.) avec des commentaires explicatifs.</p>
                    </div>
                    <div class="feature-card">
                        <h4><i class="fas fa-bug"></i> Debugging</h4>
                        <p>Envoyez votre code et Rosalinda identifiera les erreurs et proposera des corrections.</p>
                    </div>
                </section>

                <section class="doc-section">
                    <h3><i class="fas fa-image"></i> Génération d'images</h3>
                    <div class="feature-card">
                        <h4><i class="fas fa-paint-brush"></i> DALL·E Integration</h4>
                        <p>Générez des images à partir de descriptions textuelles en utilisant le bouton "Nouvelle tâche".</p>
                        <pre><code>Exemple: "Une interface utilisateur moderne pour une application météo"</code></pre>
                    </div>
                </section>

                <section class="doc-section">
                    <h3><i class="fas fa-microphone"></i> Commandes vocales</h3>
                    <div class="feature-card">
                        <h4><i class="fas fa-assistive-listening-systems"></i> Transcription</h4>
                        <p>Cliquez sur l'icône microphone pour dicter vos messages ou commandes à Rosalinda.</p>
                    </div>
                </section>

                <section class="doc-section">
                    <h3><i class="fas fa-server"></i> Configuration backend</h3>
                    <div class="feature-card">
                        <h4><i class="fas fa-link"></i> Endpoints API</h4>
                        <ul class="api-list">
                            <li><strong>POST /chat</strong> - Dialogue avec GPT-4</li>
                            <li><strong>POST /image</strong> - Génération d'images DALL·E</li>
                            <li><strong>POST /whisper</strong> - Transcription audio</li>
                        </ul>
                    </div>
                    <div class="feature-card">
                        <h4><i class="fas fa-key"></i> Variables d'environnement</h4>
                        <pre><code>OPENAI_API_KEY=votre_clé_api_ici
PORT=3000</code></pre>
                    </div>
                </section>
            </div>
        </main>

        <!-- Colonne 3 : Exemples -->
        <section class="examples">
            <div class="examples-header">
                <h3><i class="fas fa-lightbulb"></i> Exemples d'utilisation</h3>
            </div>
            <div class="example-cards">
                <div class="example-card">
                    <h4>Frontend</h4>
                    <p>"Crée un composant React pour un formulaire de contact"</p>
                </div>
                <div class="example-card">
                    <h4>Backend</h4>
                    <p>"Montre-moi comment créer une API REST avec Express.js"</p>
                </div>
                <div class="example-card">
                    <h4>Design</h4>
                    <p>"Génère une maquette pour une application de recettes"</p>
                </div>
            </div>
        </section>
    </div>
    <script src="script.js"></script>
</body>
</html>