@titas_mallick/wedding-site-gen 1.0.3 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +102 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -49,9 +49,109 @@ npx @titas_mallick/wedding-site-gen
|
|
|
49
49
|
- **Image Hosting**: Cloudinary (Unsigned Uploads)
|
|
50
50
|
- **Analytics**: Vercel Analytics
|
|
51
51
|
|
|
52
|
-
##
|
|
52
|
+
## 📁 Project Architecture & Codebase Map
|
|
53
|
+
|
|
54
|
+
### 1. Route Structure (`/app`)
|
|
55
|
+
- **`/invitation/[slug]`**: The core engine for personalized digital invites. It reads the `slug` (guest name) and displays a customized experience.
|
|
56
|
+
- **`/[groom]` & `/[bride]`**: (Dynamically renamed by CLI) Individual bio pages for the couple.
|
|
57
|
+
- *Modification Point*: Edit these files to change personal stories or education/work history.
|
|
58
|
+
- **`/guestbook`**: Handles real-time photo uploads and gallery display.
|
|
59
|
+
- *Tech Detail*: Uses Cloudinary for storage and Firestore to track image metadata.
|
|
60
|
+
- **`/song-requests`**: A dual-purpose route. Guests see a request form; Admins see a management queue.
|
|
61
|
+
- **`/updates/overlay`**: A specialized green-screen route for OBS.
|
|
62
|
+
- *Usage*: Add this as a Browser Source in OBS with a Chroma Key filter.
|
|
63
|
+
|
|
64
|
+
### 2. Configuration (`/config`)
|
|
65
|
+
- **`site.ts`**: The central source of truth for navigation links, site name, and SEO metadata.
|
|
66
|
+
- **Modify here** if you want to add/remove menu items or change the site description.
|
|
67
|
+
- **`firebase.ts`**: Client-side Firebase initialization.
|
|
68
|
+
- **`firebase-admin.js`**: Server-side Admin SDK configuration for secure operations (RSVP management, etc.).
|
|
69
|
+
|
|
70
|
+
### 3. Key Components (`/components`)
|
|
71
|
+
- **`ConciergeBot.tsx`**: The Gemini-powered AI assistant.
|
|
72
|
+
- *Customization*: Edit the `systemInstruction` in this file to change the bot's personality or the facts it knows about your wedding.
|
|
73
|
+
- **`CountdownTimer.tsx`**: The main landing page countdown.
|
|
74
|
+
- *Logic*: Uses a `setInterval` to calculate time until the `weddingStart` date.
|
|
75
|
+
- **`OurStory.tsx`**: The timeline component showing the couple's history.
|
|
76
|
+
|
|
77
|
+
## 🧠 Deep-Dive: How it Works
|
|
78
|
+
|
|
79
|
+
### 1. AI Wedding Concierge (`ConciergeBot.tsx`)
|
|
80
|
+
The floating assistant uses **Google Gemini 2.5-flash**.
|
|
81
|
+
- **Personality**: Defined in the `systemInstruction` constant. It's programmed to be a warm, respectful Indian wedding host.
|
|
82
|
+
- **Customization**: To update facts (like venue changes), simply edit the `Key Info` section inside the `systemInstruction` in `components/ConciergeBot.tsx`.
|
|
83
|
+
|
|
84
|
+
### 2. Personalized Invitations (`/app/invitation/[slug]`)
|
|
85
|
+
This route handles dynamic guest experiences.
|
|
86
|
+
- **Dynamic Content**: Based on the `slug` (guest ID), it fetches personalized data from Firestore.
|
|
87
|
+
- **Smart Bengali Translation**: Uses Gemini to translate invitation details into formal Bengali when the user clicks "বাংলায় দেখুন".
|
|
88
|
+
|
|
89
|
+
### 3. Digital Guestbook (`/app/guestbook`)
|
|
90
|
+
- **Image Processing**: Before uploading, photos are client-side resized and compressed (JPEG 70% quality) to ensure fast uploads even on mobile networks.
|
|
91
|
+
- **Storage**: Images go to Cloudinary, and the resulting URL is saved to Firestore.
|
|
92
|
+
|
|
93
|
+
### 4. Sentiment Wall (`/app/sagun`)
|
|
94
|
+
- **Collective Blessing**: When guests leave wishes, Gemini periodically summarizes the latest messages into a single "poetic paragraph" that updates live on the "Sentiment Wall."
|
|
53
95
|
|
|
54
|
-
|
|
96
|
+
---
|
|
97
|
+
|
|
98
|
+
## 📊 Database Structure (Firestore)
|
|
99
|
+
|
|
100
|
+
To make the site functional, create these collections in Firestore:
|
|
101
|
+
|
|
102
|
+
### `invitation` (Collection)
|
|
103
|
+
Each document ID should be a unique `slug` (e.g., `rahul-wedding`).
|
|
104
|
+
```json
|
|
105
|
+
{
|
|
106
|
+
"name": "Rahul & Priya",
|
|
107
|
+
"invitedGuests": 2,
|
|
108
|
+
"relation": "Close Friend",
|
|
109
|
+
"familySide": "groom",
|
|
110
|
+
"invitedFor": ["wedding", "reception"]
|
|
111
|
+
}
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
### `rsvps` (Collection)
|
|
115
|
+
Automatically populated when guests confirm attendance.
|
|
116
|
+
```json
|
|
117
|
+
{
|
|
118
|
+
"guestId": "rahul-wedding",
|
|
119
|
+
"attending": "yes",
|
|
120
|
+
"guests": 2,
|
|
121
|
+
"food": "non-veg",
|
|
122
|
+
"note": "Looking forward to it!",
|
|
123
|
+
"timestamp": "serverTime"
|
|
124
|
+
}
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
### `guestbook` & `wishes` (Collections)
|
|
128
|
+
Store guest memories and text blessings respectively.
|
|
129
|
+
|
|
130
|
+
---
|
|
131
|
+
|
|
132
|
+
## 🎨 Customization & Development
|
|
133
|
+
|
|
134
|
+
### How to change the Theme/Colors
|
|
135
|
+
This project uses **Tailwind CSS** and **HeroUI**.
|
|
136
|
+
- To change the primary "Wedding Gold" or "Wedding Pink" colors, edit `tailwind.config.js`.
|
|
137
|
+
- Search for the `extend.colors` section to update the hex codes.
|
|
138
|
+
|
|
139
|
+
### What to Keep vs. What to Replace
|
|
140
|
+
- **KEEP**: The `/app/invitation` logic and `/components/providers.tsx` as they handle the core framework setup.
|
|
141
|
+
- **REPLACE**:
|
|
142
|
+
- All images in `/public` (groom.jpg, bride.jpg, and gallery photos).
|
|
143
|
+
- The text content in `app/[groom]/page.tsx` and `app/[bride]/page.tsx`.
|
|
144
|
+
- The venue details in `app/mark-the-dates/page.tsx`.
|
|
145
|
+
|
|
146
|
+
### Running Locally for Development
|
|
147
|
+
1. Clone the generated repository.
|
|
148
|
+
2. Install dependencies: `npm install`.
|
|
149
|
+
3. Start the dev server: `npm run dev`.
|
|
150
|
+
4. Open [http://localhost:3000](http://localhost:3000).
|
|
151
|
+
|
|
152
|
+
---
|
|
153
|
+
|
|
154
|
+
## 🛠️ Setup & Configuration (Services)
|
|
55
155
|
|
|
56
156
|
### 1. Firebase (Database, Auth, and RSVP)
|
|
57
157
|
1. Go to the [Firebase Console](https://console.firebase.google.com/).
|