Intégration du projet Boumboum de Benjamin Code en react native.
Intégration graphique :
-
Inscription étape 1 : choix avatar
-
Inscription étape 2 : Informations personnelles
-
Inscription étape 3 : Selection des musiques préférées
-
Home page
-
Matching
-
Page édition de profil
-
Page liste des matchs
Accessibilité :
- Dark mode
- Traduction en/fr
├── ...
└── apps/ => Applications du monorepo
├── backend/ => Application NestJs Typescript
├── config/ => Dossier config du backend
└── src/
├── app/
├── core/ => Modules technique du project
└── modules/ => Modules fonctionnels du project
└── boumboumapp/ => Application React Native Typescript
└──src/
├── components/ => Components core
├── module_declarations/ => Declarations typescript externes
└── modules/ => Modules fonctionnels du project
en artichecture :
├── assets/ => Assets utilisés uniquement par le module
├── components/ => Components //
├── context/ => Context //
├── hooks/ => Hooks //
├── i18n/ => I18n keys utilisées dans le language.service.ts
├── screens/ => Screens //
└── .navigator.ts => Navigator du module (react navigation)
└── App.tsx
├── .env => Variables d'environnement
└── index.js => Main file
└── pakages/ => Packages du monorepo
└── di/ => Package d'injection de dependance du project front
└── swaggers/ => Projets Swagger autogénérés via openapi-generator-cli
├── backend/ => Beans Backend autogénérés pour le Frontend
└── spotify/ => Beans Spotify autogénérés pour le Backend
└── ...
La configuration du backend se trouve dans le dossier apps/backend/conf/.
Vous pouvez ajouter un fichier local.ts qui ne sera pas commit pour votre conf local.
Exemple :
export default definePartialConfig({
database: {
provider: SqliteDatabaseService,
configs: {
[DatabaseDialect.SQLITE]: {
// alter: true,
},
},
},
ssoProviders: {
spotify: {
clientID: 'fbzyvczjhvbfzrfvzjhrvaz',
clientSecret: 'hvbyzavuzyavfzayvrazyjv',
callbackURL: 'http://localhost:4000/api/auth/spotify/callback',
successURL: 'http://localhost:4000/api/auth/success',
},
},
});Dupliquer le fichier .env.exemple en .env pour adapter les variables d'environnement à votre configuration.
Pour travailler en local sans serveur avec des données mockées, passer la variable EXPO_PUBLIC_MOCK_MODE du .env a true
L'application utilise expo, vous n'avez donc pas besoin d'installer un environnement android ou ios. suffit d'installer l'application Expo GO sur votre téléphone.
Installation des dépendances :
yarn install
Démarrer le backend :
cd apps/backend
yarn start:dev
Si modification, regénérer les beans le backend :
yarn swagger:backend:update
yarn swagger:backend:build
Lancer l'application en mode développement:
cd apps/boumboumapp
yarn start -c
Puis scanner le QR code qui s'affiche dans le terminal avec l'application Expo Go sur votre téléphone.
Pour travailler avec le serveur, passer la variable .env EXPO_PUBLIC_MOCK_MODE a false
Ne pas oubliez de créer une app sso dans le dashboard dev spotify.
Ne pas oubliez d'ajouter un utilisateur test
- Adaptation en Typescript, organisation du code et branchement au backend par llucas.spot
- Intégration graphique et animations par Stéphane Wouters
Si vous récupérez notre travail, merci de créditer "llucas.spot" "Stéphane Wouters" et de nous en notifier.