1/11

📋 Dossier Professionnel DWWM

Guide des 8 compétences
Titre Professionnel Développeur Web et Web Mobile
Référentiel 2023

🛠️ Technologies couvertes

HTML5 CSS3 JavaScript PHP Symfony
2/11

📊 Vue d'ensemble des compétences

🎨 CCP1 - Frontend

  • Environnement de travail
  • Maquettage interfaces
  • Interfaces statiques
  • Interfaces dynamiques

⚙️ CCP2 - Backend

  • Base de données
  • Accès aux données
  • Composants métier
  • Documentation déploiement

💡 Conseil structure du dossier

Contexte - Projet, entreprise, durée
Réalisation - Technologies, méthodes
Difficultés - Problèmes et solutions
Résultats - Livrables, métriques
3/11
🛠️ Compétence 1 : Installer et configurer son environnement de travail

Exemples de projets (formation ou stage)

🔧 Outils à configurer

  • VS Code + extensions
  • Git + GitHub/GitLab
  • XAMPP/Laragon
  • Composer/npm
  • Symfony CLI

📋 Livrables

  • Documentation setup (README)
  • Fichiers configuration
  • Guide installation équipe
  • Captures d'écran étapes
💡 Astuce : Même un TP de formation peut être valorisé ! Documentez votre setup initial, les difficultés rencontrées, les solutions trouvées.
4/11
🎨 Compétence 2 : Maquetter des interfaces utilisateur web ou web mobile

Processus de maquettage

Wireframes basse fidélité - Sketches, structure
Architecture information - Sitemap, navigation
Wireframes haute fidélité - Figma, détails
Maquettes finales - Desktop/Mobile
Prototype interactif - Tests utilisateur

🔧 Outils recommandés

  • Figma ou Adobe XD
  • Balsamiq (wireframes)
  • InVision (prototype)
  • Miro (idéation)

📱 Points clés

  • Responsive design
  • Accessibilité WCAG
  • Tests utilisateurs
  • Guide de style
5/11
💻 Compétence 3 : Réaliser des interfaces utilisateur statiques

Technologies HTML/CSS à maîtriser

  • HTML5 sémantique - article, section, nav, header, footer
  • CSS Grid & Flexbox - Layouts modernes responsive
  • CSS Variables - Maintenance et cohérence
  • Animations CSS - Transitions, keyframes
  • SCSS/Sass - Préprocesseur, méthodologie BEM

✅ Contraintes à respecter

  • Accessibilité WCAG 2.1
  • SEO on-page
  • Performance (Lighthouse)
  • Cross-browser
  • Mobile-first

📊 Métriques à mesurer

  • Score Lighthouse > 90
  • Validation W3C 100%
  • Temps chargement < 3s
  • Tests utilisateurs
Exemple : Intégration des maquettes Figma fournies en formation, reproduction d'un design existant, création de votre portfolio
6/11
⚡ Compétence 4 : Développer la partie dynamique des interfaces utilisateur

Fonctionnalités JavaScript à démontrer

🎯 Interactions DOM

  • Manipulation éléments
  • Gestion événements
  • Validation formulaires
  • Animations JavaScript

🌐 Communication serveur

  • AJAX/Fetch API
  • Consommation API REST
  • LocalStorage/SessionStorage
  • Gestion erreurs async

💡 Projets de formation utilisables

  • TP JavaScript - Calculatrice, jeu, manipulation DOM
  • Exercices AJAX - Appels API, affichage données
  • Projet fil rouge - Partie frontend interactive
  • Mini-projets - Slider, modal, validation de formulaires
Bonnes pratiques : Code modulaire, ES6+, Gestion d'erreurs, Performance
7/11
🗄️ Compétence 5 : Mettre en place une base de données relationnelle

Processus de conception BDD

Analyse besoins - Entités, attributs, contraintes
Modèle conceptuel (MCD) - Relations, cardinalités
Modèle logique (MLD) - Normalisation
Modèle physique (MPD) - Implémentation
Optimisation - Index, performances

🔧 Technologies BDD

  • MySQL/PostgreSQL
  • phpMyAdmin
  • MySQL Workbench
  • Outils de modélisation

📋 Livrables

  • Scripts création tables
  • Diagrammes UML
  • Documentation structure
  • Jeu de données test
Exemples de formation : BDD de votre projet e-commerce, exercices de modélisation, TP création de tables
8/11
🔌 Compétence 6 : Développer des composants d'accès aux données

🛠️ Stack PHP/Symfony + Doctrine

  • Entités Doctrine - Annotations, relations
  • Repositories - Requêtes personnalisées DQL
  • Migrations - Évolution structure BDD
  • Fixtures - Données de test

⚡ Optimisations

  • Requêtes avec jointures
  • Pagination automatique
  • Cache de requêtes
  • Lazy loading

🧪 Tests

  • Tests unitaires repositories
  • Tests d'intégration BDD
  • Fixtures pour tests
  • Validation données
Projets de formation : Repositories de votre application Symfony, TP Doctrine, exercices de requêtes DQL
9/11
🏗️ Compétence 7 : Développer des composants métier côté serveur

Architecture Symfony à maîtriser

🎯 Composants Symfony

  • Controllers - Logique présentation
  • Services - Logique métier
  • Events - Découplage
  • Forms - Validation données
  • Security - Auth/Autorisation

🔧 Design Patterns

  • Dependency Injection
  • Observer (Events)
  • Strategy Pattern
  • Factory Pattern
  • Repository Pattern

Projets de formation exploitables

  • Application Symfony complète - Authentification, CRUD, API
  • TP Services et Events - Architecture, patterns
  • Projet collaboratif - Travail en équipe, Git
  • Mini-API REST - Endpoints, validation, sécurité
Tests : PHPUnit (unitaires), Tests fonctionnels, Tests d'intégration
10/11
📋 Compétence 8 : Documenter le déploiement d'une application

Environnements à documenter

Développement - Docker local, configuration
Test/Staging - Serveur de pré-production
Production - Serveur final optimisé

📚 Documentation à produire

  • Guide installation - Prérequis, étapes
  • Procédures déploiement - Scripts, commandes
  • Configuration prod - Variables, SSL
  • Maintenance - Backup, monitoring

🛠️ Outils DevOps

  • Git/GitHub Actions
  • Docker/Docker Compose
  • Apache/Nginx
  • Certbot (SSL)
  • Serveur Linux
💡 Projets de formation : Déploiement de votre projet final sur un serveur, mise en ligne du portfolio, documentation des TP
11/11

💡 Conseils pour réussir son dossier

🎯 Structure recommandée

  • Contexte détaillé - Entreprise, durée, équipe
  • Objectifs techniques - Défis à relever
  • Réalisations concrètes - Code, captures
  • Difficultés/Solutions - Capacité d'adaptation
  • Résultats mesurables - Métriques, tests

🎓 Projets de formation

  • Projet fil rouge - Application complète de A à Z
  • TP progressifs - Évolution des compétences
  • Mini-projets thématiques - Focus sur une technologie
  • Exercices collectifs - Travail collaboratif

✅ Points de vigilance

  • Projets de formation OK ! - Vos TP et projets sont valides
  • Amélioration continue - Montrez l'évolution entre vos premiers et derniers projets
  • Contextualisation - Expliquez le cadre pédagogique, les objectifs
  • Apprentissages - Mettez en avant ce que vous avez appris
  • Valorisation - Même un exercice simple peut être bien présenté

🎓 Vos projets de formation sont précieux !

Valorisez chaque exercice, chaque TP, chaque difficulté surmontée pendant votre apprentissage