# 📁 Étape 1 — Identifier & comprendre un projet WebDev

> 🧠 Objectif : Retrouver où est stocké ton projet WebDev, comprendre l’interface, et localiser les fichiers et sources de code WLangage à extraire.

---

## 🧭 1. Où se trouve le dossier de ton projet WebDev ?

### 🧩 Structure typique d’un projet WebDev :

Quand tu ouvres un projet WebDev, il est composé de plusieurs dossiers/fichiers sur ton disque, comme :

```
MonProjet\
├── MonProjet.WDP           <- Fichier principal du projet
├── MonProjet_WEBDEV\       <- Contient les sources (pages, procédures, etc.)
│   ├── *.WDW               <- Pages/fenêtres
│   ├── *.WDG               <- Procédures globales
│   ├── *.WDM               <- Analyse (base de données)
├── AAAWEB\                 <- Code HTML/CSS/JS généré
├── EXE\                    <- Résultat des générations
```

---

## 🧑‍💻 2. Retrouver l’emplacement du projet **depuis WebDev**

> 💡 Si tu as déjà ton projet ouvert dans WebDev, voici comment trouver son emplacement exact :

### 🔹 Étape 1 : Ouvrir les **informations du projet**

1. En haut à gauche de WebDev :  
   🖱️ Clique sur le **menu "Projet"** (dans la barre de menus principale).

2. Dans ce menu :  
   🖱️ Clique sur `Informations sur le projet…`  
   (_ou parfois juste `Projet > Propriétés du projet` selon ta version_)

3. Une fenêtre s’ouvre avec plusieurs onglets.

4. Dans l’onglet `Général`, tu verras :
   - **Nom du projet**
   - **Répertoire du projet** ← **copie ce chemin** !

> 📝 Note : Le fichier du projet principal se termine par `.WDP`. C’est lui que tu peux utiliser pour rouvrir le projet plus tard.

---

## 🖥️ 3. Structure de l’interface WebDev (vue développeur)

> 🧭 Voici les principales zones que tu dois repérer dans l’IDE WebDev :

| Zone                     | À quoi ça sert ? |
|--------------------------|------------------|
| **Explorateur de projet** | Liste tous les éléments : pages, classes, procédures, composants, etc. |
| **Éditeur de code**       | Permet d’écrire du WLangage pour les événements, procédures, classes, etc. |
| **Éditeur de page**       | Interface graphique pour créer des pages (drag & drop, CSS, JS, champs, etc.) |
| **Panneau de propriétés** | Modifie les propriétés de l’élément actuellement sélectionné (nom, style, code, etc.) |

---

## 📌 4. Naviguer dans ton projet WebDev

Voici **les éléments de code à repérer** dans l'explorateur de projet :

### 🔹 a. Pages

1. Dans le volet de gauche (**Explorateur**), clique sur `Pages`.
2. Double-clique sur une page pour l’ouvrir.
3. Clique droit sur un champ ou bouton > `Code` → Tu vois les événements liés.

### 🔹 b. Procédures globales

1. Dans l’explorateur, repère un dossier nommé `Procédures globales`.
2. Clique droit dessus > `Ouvrir` ou `Code`.
3. Toutes les fonctions sont visibles et réutilisables dans tout le projet.

### 🔹 c. Procédures locales (dans une page)

1. Ouvre une page
2. Dans la fenêtre, clique sur l’icône `Code` ou via clic droit > `Code`
3. Les procédures locales sont affichées en haut ou dans un onglet

### 🔹 d. Classes

1. Explorateur > `Classes` (si ton projet en utilise)
2. Clic droit > `Code` → Tu y vois la déclaration et les méthodes

---

## 💡 Astuce : Revenir rapidement sur ton projet

- Depuis WebDev :  
  Menu `Fichier > Ouvrir un projet récent`

- Depuis ton disque :  
  Double-clique sur le fichier `.WDP` du dossier projet

---

## ✅ À faire maintenant

- [x] Ouvre `Projet > Informations sur le projet` et note le chemin. ✅ 2025-03-24
- [x] Explore l’explorateur WebDev et note les pages, procédures, classes disponibles. ✅ 2025-03-24
- [x] Clique sur une page > bouton droit > `Code` → vérifie que tu peux lire les événements. ✅ 2025-03-24
- [x] Idem pour une procédure globale ou une classe. ✅ 2025-03-24

---

## 📘 Prochaine étape (à venir)

👉 Extraire le code manuellement ou semi-automatiquement (copier/coller ou repérage des fichiers sources `.WDG`, `.WDW`, etc.).

---
[[Application webdev (1)]]