Ce projet est une implémentation simplifiée d'un système d'achat, le projet vise à fournir les fonctionnalités de base qui devraient être trouvées dans une application de commerce électronique mobile où les utilisateurs peuvent acheter et vendre des produits. Pour naviguer dans l'application, les utilisateurs doivent s'authentifier. Une fois connectés, les utilisateurs peuvent faire défiler la liste des produits disponibles, ajouter différents produits au panier et faire des commandes. Les utilisateurs peuvent également ajouter, modifier, supprimer leurs propres produits dans le magasin principal.
L'application contient un système d'authentification simple implémenté à l'aide de l'API Firebase Auth REST pour le backend. Si le processus d'authentification est réussi, un jeton unique est envoyé du backend à l'utilisateur en préoccupation, le jeton est ensuite stocké localement dans l'appareil et expirera exactement après 1h de son réception. Lorsqu'il est expiré, le jeton est supprimé de l'appareil et l'utilisateur sera automatiquement déconnecté et invite à l'écran de connexion. Sinon, si quelque chose se passe mal avec le processus d'authentification, le message d'erreur approprié sera affiché à l'écran.
Pour s'assurer que les bonnes informations d'identification doivent être fournies chaque fois que l'utilisateur entre dans certaines données, tous les formulaires de ce projet contiennent certains algorithmes de validation de base qui sont réutilisés chaque fois que la validation est requise.
La plupart des données de ce projet (produits, commandes, utilisateurs) sont stockées dans la base de données Firebase en temps réel. Certaines autres données spécifiques à l'utilisateur (Auth-Token, Products préférées) sont stockées localement dans l'appareil à l'aide d'AsyncStorage.
Toute la navigation dans ce projet est construite avec React Navigation v5.
L'application contient différents types d'animations sur différents écrans pour offrir une expérience utilisateur plus fluide, toutes les animations sont implémentées à l'aide de la bibliothèque réanimée native React, ce qui signifie que la grande majorité des calculs requis pour animer les différentes propriétés de style sont tous réalisés dans le fil d'interface utilisateur dans le côté natif, donc le pont entre les natifs natif fonctionnerait à 60 images par seconde même dans des appareils bas de gamme.
Tous les actifs de conception utilisés dans cette application (écrans, composants, icônes ...) sont fabriqués par le propriétaire de ce projet.
Pour exécuter le projet, exécutez localement les commandes suivantes dans l'ordre:
Cloner le projet localement
$ git clone https://github.com/abdoutech19/shop-app.git
Accédez à Root Directory du projet
$ cd shop-app
Installez toutes les dépendances
$ yarn install || npm install
Exécutez le projet en mode débogage
$ npx react-native run-android
Ou exécutez le projet en mode version pour une expérience plus fluide
$ npx react-native run-android --variant=release
Remarque: Ce projet utilise le moteur Hermes JavaScript pour améliorer le temps de démarrage, réduire l'utilisation de la mémoire et réduire la taille de l'application. Pour que ces améliorations prennent effet, l'application doit être exécutée en mode de libération , sinon, Hermes n'aura aucun effet sur l'amélioration des performances en mode débogage , en fait, certains développeurs ont remarqué des résultats plus lents avec le moteur Hermes activé en mode débogage .
Pour tester l'application dans votre appareil Android, vous pouvez télécharger le fichier .apk à partir d'ici: Shopping.
Distribué sous la licence du MIT. Voir la licence pour plus d'informations.
Envoyez-moi un courriel à: [email protected].