Un projet de géolocalisation des voitures et chauffeurs alTaxi

Un nouveau projet de passe-partout flutter (presque) complet en utilisant Bloc.

📝 La Motivation

Il y a plusieurs raisons pour lesquelles ce passe-partout existe, ce sont en somme pour créer clear, readable, reusable, scalable, testable, performant et maintainable projets mais à long:

1. permettre aux gens de se déployer production-grade MVP products,
2. pour m’assurer que je keep everything stupid simple (controversé mais j’ai fait de mon mieux),
3. pour s’assurer que le projet peut easily scale horizontally à mesure que l’application grandit,
4. pour save developers time par reducing boilerplate code en écrivant moins et en générant plus,
5. pour maintain code quality and platform standards dans des projets d’équipe avec des règles de linting strictes,
6. avoir bloc and golden tests pour vérifier que tout fonctionne comme prévu,
7. expédier l’application rapidement et efficacement en utilisant CI & CD pour automatiser le processus de développement.

🔥 Principales caractéristiques

• API System & Authentication

  Prise en charge de Rest et graphql api avec renouvellement de jeton et prise en charge de socket à l’aide de Dio, GraphQL et Fresh.

• Performance

  Performances optimisées pour les décalages causés par les builds, tels que les changements de page ou le défilement rapide de listes complexes, grâce au rendu de fractionnement de trame via keframe.

• State Management & Architecture

  BLoC & Hydrated Bloc aide à séparer la logique métier de l’interface utilisateur en créant une gestion d’état persistante et puissante.

• Advanced Linting

  Règles de peluchage avec des paramètres détaillés pour maintenir la santé du code en bon état et conforme aux normes de fléchettes.

• Type Safety

  Le passe-partout utilise une approche basée sur la sécurité des types (langages, actifs, etc.) pour vous aider à éviter les problèmes en détectant les erreurs nulles lors du développement plutôt qu’au moment de l’exécution.

• Forms

  Créer et gérer des formulaires n’a jamais été aussi facile et amusant. Les formulaires réactifs sont une approche basée sur un modèle pour gérer les entrées et les validations de formulaires.

• Testing

  Plus l’application a de fonctionnalités, plus il est difficile de tester manuellement. Les tests automatisés permettent de s’assurer que l’application fonctionne correctement avant de la publier avec Bloc Test, Golden Tookit et Mocktail.

• Dependency Injection & Service Locator

  Réduisez le couplage étroit entre les classes et obtenez ainsi une plus grande réutilisabilité de votre code avec Injectable et GetIt.

• Code Generation

  Maximisez la productivité et améliorez la qualité du code en générant des classes de données avec Freezed, Artemis et Build Runner.

• CI & CD Integration

  CI/CD est utilisé pour fournir en continu du code en production et assurer un flux continu de nouvelles fonctionnalités et de corrections de bogues via la méthode de livraison la plus efficace en utilisant Codemagic.

• Easy & Clean Routing

  AutoRouter permet le passage d’arguments fortement typés, la création de liens profonds sans effort et la génération de code pour simplifier les routes et réduire le code passe-partout.

• Desing Pattern

  Le modèle de conception du référentiel réduit la complexité de la couche de données, isole les données non structurées du reste de l’application et organise la structure du projet.

• Exception Handling

  Ce n’est pas une solution idéale pour gérer les exceptions en utilisant try and catch à chaque fonction, Data Channel fournit un utilitaire pour gérer les exceptions et le routage des données.

• Encrypted Storage

  Le stockage crypté vous permet de conserver en toute sécurité les informations de jeton et d’utilisateur dans le trousseau de plates-formes à l’aide du stockage sécurisé.

• Dynamic Theme

  Avec Android 12 et Material You, les couleurs du papier peint peuvent être extraites pour créer un ColorScheme qui peut être utilisé pour colorer l’application.

• Localization

  Localisez facilement l’application dans d’autres langues grâce à la prise en charge du générateur de langage ‘argot’ structuré de type sécurisé.

• Permission

  Le passe-partout fournit également une API multiplateforme (iOS, Android) pour demander des autorisations et vérifier leur statut avec permission_handler.

• Env Variables

  Les variables d’environnement permettent de définir des constantes globales partagées dans l’application, pour des éléments tels que les clés API, les URL de base, etc.

• Logging & Tracking

  Un mécanisme détaillé de journalisation et de suivi des erreurs pour surveiller chaque action se déroulant dans l’application en temps réel avec Logging et Sentry.

• Native Splash

  Flutter Native Splash génère automatiquement du code natif iOS, Android et Web pour personnaliser la couleur d’arrière-plan et l’image de démarrage de l’écran de démarrage natif.

• Refresh Rate

  Prise en charge des affichages à taux de rafraîchissement élevé avec le package flutter_displaymode.

📷 Captures d’écran

Thème dynamique sur mobile

iOS léger TR	Android System Dark FR

Thème dynamique sur le Web

Système Web léger TR	Web Dark FR

📚 Comment utiliser

🔨 Construire

Pour cloner et exécuter ce passe-partout, vous aurez besoin Gite et Battement installé sur votre ordinateur. Depuis votre ligne de commande :

# Clone this repository
$ git clone 

# Go into the repository
$ cd flutter_advanced_boilerplate

# Install dependencies
$ flutter pub get

# Generate structured language files
$ flutter pub run slang

# Checks missing and unused translations
$ flutter pub run slang analyze

# Generate data classes & structured asset files
$ flutter packages pub run build_runner build -d

# Update goldens & Execute tests
$ flutter test --update-goldens

# Run the app
$ flutter run

# Run the app on web
$ flutter run -d chrome --web-renderer html (low performance, low download size)
$ flutter run -d chrome --web-renderer canvaskit (high performance, high download size)

# If you update your splash screen configuration you can regenerate it via
$ flutter pub run flutter_native_splash:create

Masquer les fichiers générés

Pour masquer les fichiers générés, accédez à 'VSCode' -> 'Preferences' -> 'Settings' et chercher 'Files: Exclude' et ajoutez les motifs suivants en appuyant sur la 'Add Pattern' bouton:

**/*.config.dart
**/*.freezed.dart
**/*.inject.summary
**/*.inject.dart
**/*.g.dart
**/*.gr.dart

Dans Android Studio, accédez à 'Android Studio' -> 'Preferences' -> 'Editor' -> 'File Types' et collez les lignes ci-dessous dans la section ignorer les fichiers et dossiers :

*.config.dart;*.freezed.dart;*.inject.summary;*.inject.dart;*.g.dart;*.gr.dart;

📁 Structure des dossiers

Dossier Actifs

assets dossier est situé au-dessus du dossier lib. Les actifs utilisés dans l’application, les paramètres environnementaux, les polices, les images, les traductions et plus encore se trouvent ici.

.
└── assets
    ├── animations                          -> put your animated files here eg. lottie
    ├── configs                             -> put your env files here
    │   ├── dev.json                           -> env that is used for dev
    │   ├── prod.json                          -> env that is used for prod
    │   └── test.json                          -> env that is used for tes
    ├── fonts                               -> put your custom font files here
    ├── images                              -> put your image files here
    └── translations                        -> put your translation files here
        ├── en.json
        └── tr.json

Dossier de fonctionnalités

Les features dossier, qui est l’épine dorsale de l’application, a été conçu en utilisant le structure axée sur les fonctionnalités au lieu de couche d’abord, car il ne s’adapte pas très bien à mesure que l’application grandit et modèle de conception de référentiel. L’approche axée sur les fonctionnalités exige que nous créions un nouveau dossier pour chaque nouvelle fonctionnalité que nous ajoutons à notre application. Et à l’intérieur de ce dossier, nous pouvons ajouter les couches de modèles de référentiel elles-mêmes en tant que sous-dossiers.

.
└── lib
    └── features                            -> stands for FEATURE FIRST STRUCTURE
        └── feature_x                          -> seperate and put your features here
            ├── blocs                          -> stands for APPLICATION LAYER
            │   ├── x_cubit.dart                  -> seperate and put your logics here
            │   └── x_state.dart
            ├── models                         -> stands for DOMAIN LAYER
            │   └── x_model.dart                  -> seperate and put your models here
            ├── networking                     -> stands for DATA LAYER
            │   └── x_repository.dart             -> seperate and put your repos here
            └── presentation                   -> stands for PRESENTATION LAYER
                ├── widgets                       -> seperate and put your widgets here
                │   └── x_header_widget.dart
                └── x_screen.dart

Dossier Modules

Dans le modules dossier, il existe des processus d’enregistrement et d’initialisation d’injection de dépendances de modules tiers pour s’assurer qu’ils peuvent être facilement accessibles et utilisés depuis l’application.

.
└── lib
    └── modules
        ├── dependency_injection               -> add your modules injection here
        │   ├── di.dart                           -> must initialize di first
        │   └── x_module_di.dart                  -> example module injection
        └── x_module                           -> create folder for your modules
            └── init_x.dart                       -> create initialization files here

Dossier thématique

Les theme dossier contient la configuration et les paramètres de thème nécessaires.

.
└── lib
    └── theme
        ├── color
        │   └── app_color_scheme.dart
        ├── text
        │   └── app_typography.dart
        └── app_theme_creator.dart             -> theme creation configuration here

Dossier Utils

Outre ce qui précède, les constantes, les classes d’assistance et les méthodes, les raccourcis et bien d’autres utilisés dans l’application sont situés dans le utils dossier.

.
└── lib
    └── utils
        ├── helpers                            -> put your helpers here
        │   ├── bar_helper.dart                   -> bar helper to show alert
        │   ├── logging_helper.dart               -> logging helper to show fancy log in console
        │   └── permission_helper.dart            -> permission helper to handle permission requests
        ├── methods                            -> put your methods here
        │   └── aliases.dart                      -> create alias variables here
        │   └── shorcuts.dart                     -> add shortcut methods here
        ├── constants.dart                     -> configure app constants here
        ├── navigation.dart                    -> add navigation destinations here
        ├── r.dart                             -> generated type-safe asset classes here (don't modify)
        └── router.dart                        -> add new screens here

🌟 Bon à savoir

Ressources que je vous recommande vivement de lire et de regarder

1. Coder avec Andrea Tutoriels • Blog • Youtube
2. Tutoriels Reso Coder • Blog • Youtube
3. Battement • Youtube
4. Marcus par • Youtube
5. Carte flottante • Youtube
6. Max sur Flutter • Youtube

Extensions VSCode

📦 Forfaits

Ce référentiel utilise les packages pub suivants :

*Recommandé à conserver quel que soit votre projet.

❓ FAQ

🌸 Communauté

🔥 Cotisation

Si tu veux dire Je vous remercie vous pouvez;

De plus, les contributions au code sont toujours les bienvenues et appréciées.

1. Signaler un bug
   Si vous pensez avoir rencontré un bogue, et que je devrais le savoir, n’hésitez pas à le signaler et je m’en occuperai.
2. Demander une fonctionnalité
   Vous pouvez également demander une fonctionnalité, et si elle est viable, elle sera sélectionnée pour le développement.
3. Créer une demande d’extraction
   Cela ne peut pas aller mieux, votre pull request sera apprécié par la communauté. Vous pouvez commencer par relever tous les problèmes ouverts et faire une demande d’extraction.

Si vous êtes nouveau dans l’open-source, assurez-vous de vérifier en savoir plus à ce sujet ici et en savoir plus sur la création d’une pull request ici.

🌵 Succursales

1. stage est la branche de développement.

2. master est la branche de production.

3. Aucune autre branche permanente ne doit être créée dans le référentiel principal, vous pouvez créer des branches de fonctionnalités mais elles doivent être fusionnées avec le maître.

Étapes pour travailler avec la branche de fonctionnalité

1. Pour commencer à travailler sur une nouvelle fonctionnalité, créez une nouvelle branche avec le préfixe feat et suivi du nom de la fonctionnalité. (c’est à dire. feat-FEATURE-NAME)
2. Une fois que vous avez terminé vos modifications, vous pouvez augmenter le PR.

Étapes pour créer une pull request

1. Faire un PR pour stage bifurquer.
2. Respectez les meilleures pratiques et directives, par exemple lorsque le PR concerne des éléments visuels, il doit avoir une image montrant l’effet.
3. Il doit réussir tous les contrôles d’intégration continue et obtenir des critiques positives.

Après cela, les modifications seront fusionnées.

Ensemble, nous pouvons réaliser ce projet meilleur tous les jours! 😘

🔒 Licence

AVEC © Fikret Sengoul

GitHub

Voir Github