💌 Invitation de Mariage Mobile 💌

Ce projet est une invitation de mariage mobile.

Il a été développé avec React et TypeScript, en utilisant Vite pour un environnement de développement rapide et simple.

Eslint et Prettier ont été configurés, et le styling a été réalisé avec emotion/styled.

La galerie utilise react-photoswipe-gallery, et la carte utilise react-naver-maps.

Une fonctionnalité de confettis mignonne a été ajoutée avec js-confetti.

Méthode d'installation et d'exécution du projet

1. Clonez le dépôt.

git clone https://github.com/your-username/mobile-wedding-invitation.git

2. Accédez au dossier du projet.

cd mobile-wedding-invitation

3. Installez les dépendances nécessaires.

npm install

4. (Obligatoire) Renommez le fichier .env.sample en .env et remplissez VITE_APP_NAVERMAPS_CLIENT_ID avec le client_id obtenu depuis Naver Cloud. Vous pouvez obtenir un client_id en enregistrant une application sur NAVER CLOUD PLATFORM.
5. (Optionnel) Si vous souhaitez utiliser les fonctionnalités de likes et de livre d'or, une configuration Firebase est nécessaire. Configurez le SDK Firebase dans le fichier src/firebase.ts. Consultez la documentation Firebase pour configurer le SDK.
6. Modifiez les fichiers nécessitant une personnalisation (voir la checklist ci-dessous).
7. Exécutez l'application.

npm run dev

Checklist de personnalisation

• Modifiez les informations du faire-part dans src/data.json.
• Modifiez les métadonnées (favicon, titre, balises OG, etc.) dans index.html.
• Modifiez la photo miniature dans public/thumbnail.jpg.
• Ajoutez les photos pour la galerie dans assets/images et importez-les dans src/layout/Gallery/Images.ts. Ajustez ici les dimensions selon les photos.
• Dans .env, saisissez l'ID client : VITE_APP_NAVERMAPS_CLIENT_ID=client_id.
• (Optionnel) Configurez le SDK Firebase dans src/firebase.ts si vous utilisez les fonctionnalités "J'aime" ou livre d'or.
• (Optionnel) Pour ajouter des liens KakaoPay ou Toss avec les numéros de compte des parents, utilisez les champs kakaopayAccount et tossAccount dans src/data.json.

Déploiement immédiat après clonage

Ressources

• Développeur : heejin-hwang
• Bibliothèque react-photoswipe-gallery : react-photoswipe-gallery
• Documentation officielle de react-naver-maps : react-naver-maps
• Plateforme NAVER CLOUD : NAVER CLOUD PLATFORM
• Développeurs Kakao : https://developers.kakao.com/
• Créer un ID Toss : https://toss.me/

Ce projet est distribué sous licence MIT. Pour plus de détails, consultez le fichier LICENSE.

Une autre invitation mobile

Pour un design plus épuré, découvrez des faire-parts pleins de charme sur SmallBigWedding.

Historique des Stars