Skip to content

Commit 7f0dede

Browse files
committed
end documentations
1 parent 1021148 commit 7f0dede

File tree

2 files changed

+259
-1
lines changed

2 files changed

+259
-1
lines changed

AZURE_PORTAL_DEPLOYMENT.md

Lines changed: 258 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,258 @@
1+
# 🌐 Azure Portal Deployment Guide
2+
**Deploy your Calendar Integration Backend using Azure Portal**
3+
4+
## 🚀 Step-by-Step Portal Deployment
5+
6+
### **Step 1: Create Database (PostgreSQL)**
7+
8+
1. **Go to Azure Portal**: https://portal.azure.com
9+
2. **Click "Create a resource"**
10+
3. **Search for "Azure Database for PostgreSQL"**
11+
4. **Select "Azure Database for PostgreSQL flexible server"**
12+
5. **Click "Create"**
13+
14+
**Configuration:**
15+
- **Resource Group**: Create new → `calendar-integration-rg`
16+
- **Server Name**: `calendar-integration-db` (must be globally unique)
17+
- **Region**: Choose closest to you (e.g., East US)
18+
- **PostgreSQL Version**: 14
19+
- **Workload Type**: Development
20+
- **Admin Username**: `calendaradmin`
21+
- **Password**: Create a strong password (save it!)
22+
- **Pricing Tier**: Burstable → B1ms (1 vCore, 2GB RAM) - ~$20/month
23+
24+
6. **Click "Review + Create"****"Create"**
25+
7. **Wait for deployment** (takes 5-10 minutes)
26+
27+
### **Step 2: Configure Database**
28+
29+
1. **Go to your database resource**
30+
2. **Click "Databases" in left menu**
31+
3. **Click "+ Add"**
32+
4. **Database Name**: `calender_app`
33+
5. **Click "Save"**
34+
35+
6. **Configure Firewall**:
36+
- Go to **"Networking"** in left menu
37+
- Check **"Allow public access from any Azure service within Azure"**
38+
- **For Development**: Add your IP: Click **"Add current client IP address"**
39+
- **For Production**: Remove your IP rule (keep only Azure services)
40+
- Click **"Save"**
41+
42+
**⚠️ Security Note**:
43+
- The "Azure services" rule allows your App Service to connect
44+
- Users access your app through the frontend/backend, NOT directly to database
45+
- Never add 0.0.0.0/0 (all IPs) - this would be insecure
46+
47+
### **Step 3: Create Web App (Backend)**
48+
49+
1. **Go back to Azure Portal home**
50+
2. **Click "Create a resource"**
51+
3. **Search for "Web App"**
52+
4. **Click "Create"**
53+
54+
**Configuration:**
55+
- **Resource Group**: Select `calendar-integration-rg`
56+
- **Name**: `calendar-integration-backend` (must be globally unique)
57+
- **Publish**: Code
58+
- **Runtime Stack**: Node 18 LTS
59+
- **Operating System**: Linux
60+
- **Region**: Same as database
61+
- **Pricing Plan**:
62+
- Click "Create new"
63+
- Name: `calendar-plan`
64+
- Size: Basic B1 (~$13/month) or Free F1 (limited)
65+
66+
5. **Click "Review + Create"****"Create"**
67+
6. **Wait for deployment**
68+
69+
### **Step 4: Configure Environment Variables**
70+
71+
1. **Go to your Web App resource**
72+
2. **Click "Configuration" in left menu**
73+
3. **Click "Application settings" tab**
74+
4. **Add these environment variables** (click "+ New application setting" for each):
75+
76+
**CRITICAL Variables (Required):**
77+
```
78+
Name: DATABASE_URL
79+
Value: postgresql://calendaradmin:YOUR_PASSWORD@calendar-integration-db.postgres.database.azure.com:5432/calender_app?sslmode=require
80+
81+
Name: GOOGLE_CLIENT_ID
82+
Value: YOUR_GOOGLE_CLIENT_ID_HERE
83+
84+
Name: GOOGLE_CLIENT_SECRET
85+
Value: YOUR_GOOGLE_CLIENT_SECRET_HERE
86+
87+
Name: GOOGLE_REDIRECT_URL
88+
Value: https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net/api/auth/google/callback
89+
90+
Name: FRONTEND_URL
91+
Value: http://localhost:3000
92+
93+
Name: FRONTEND_CALLBACK_URL
94+
Value: http://localhost:3000/auth/callback
95+
96+
Name: FRONTEND_ERROR_URL
97+
Value: http://localhost:3000
98+
99+
Name: PORT
100+
Value: 8080
101+
(Azure App Service expects apps to listen on port 8080)
102+
103+
Name: SCM_DO_BUILD_DURING_DEPLOYMENT
104+
Value: true
105+
(Tells Azure to automatically build your TypeScript code during deployment)
106+
```
107+
108+
**OPTIONAL Variables:**
109+
```
110+
Name: NODE_ENV
111+
Value: production
112+
(Standard practice but not used in your current code)
113+
```
114+
115+
7. **Click "Save"** at the top
116+
117+
### **Step 5: Deploy Code from GitHub**
118+
119+
**Option A: Direct GitHub Connection**
120+
121+
1. **In your Web App**, click **"Deployment Center"** in left menu
122+
2. **Source**: Select **"GitHub"**
123+
3. **Sign in to GitHub** if prompted
124+
4. **Organization**: Select your GitHub username
125+
5. **Repository**: Select `Event-Management`
126+
6. **Branch**: `main`
127+
7. **Build Provider**: Select **"App Service Build Service"**
128+
8. **Application folder**: `/backend` (important!)
129+
9. **Click "Save"**
130+
131+
Azure will automatically deploy your code!
132+
133+
**Option B: Local Git (if GitHub doesn't work)**
134+
135+
1. **In Deployment Center**, select **"Local Git"**
136+
2. **Click "Save"**
137+
3. **Copy the Git URL** provided
138+
4. **In your local terminal**:
139+
```bash
140+
cd "e:\My work\Calender-Integration\backend"
141+
git remote add azure [PASTE_GIT_URL_HERE]
142+
git push azure main
143+
```
144+
145+
### **Step 6: Run Database Migration**
146+
147+
1. **In your Web App**, go to **"Development Tools"****"Console"**
148+
2. **Run these commands**:
149+
```bash
150+
cd /home/site/wwwroot
151+
npm run migrate
152+
```
153+
154+
Or use **"SSH"** option:
155+
1. **Click "SSH"** in Development Tools
156+
2. **Click "Go"**
157+
3. **Navigate to app directory**: `cd /home/site/wwwroot`
158+
4. **Run migration**: `npm run migrate`
159+
160+
### **Step 7: Test Your Deployment**
161+
162+
1. **Go to "Overview" in your Web App**
163+
2. **Click the URL** (e.g., https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net)
164+
3. **You should see**: "✅ Calendar Integration API is running!"
165+
166+
### **Step 8: Update Google OAuth**
167+
168+
1. **Go to**: https://console.cloud.google.com
169+
2. **APIs & Services****Credentials**
170+
3. **Edit your OAuth 2.0 Client ID**
171+
4. **Add to "Authorized redirect URIs"**:
172+
```
173+
https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net/api/auth/google/callback
174+
```
175+
5. **Save**
176+
177+
### **Step 9: Handle Google Verification Warning**
178+
179+
When testing OAuth, Google will show: *"Google hasn't verified this app"*
180+
181+
**This is normal!** To continue:
182+
1. **Click "Advanced"**
183+
2. **Click "Go to [Your App] (unsafe)"**
184+
3. **Complete OAuth flow**
185+
186+
**For production**: Add test users in OAuth consent screen or submit for Google verification.
187+
188+
## 🔧 Alternative: Azure Portal File Upload
189+
190+
If GitHub deployment doesn't work:
191+
192+
### **Upload ZIP File**
193+
194+
1. **Create deployment package**:
195+
- Zip your entire `backend` folder
196+
- Name it `backend.zip`
197+
198+
2. **In Azure Portal**:
199+
- Go to your Web App
200+
- **Advanced Tools****Go** (opens Kudu)
201+
- **Tools****ZIP Push Deploy**
202+
- **Drag and drop** your `backend.zip`
203+
- Wait for deployment
204+
205+
3. **Run commands in Console**:
206+
```bash
207+
npm install
208+
npm run build
209+
npm run generate
210+
npm run migrate
211+
```
212+
213+
## 🎯 Your Backend URL
214+
215+
After deployment, your backend will be available at:
216+
```
217+
https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net
218+
```
219+
220+
Test endpoints:
221+
- Health: `https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net/`
222+
- Auth: `https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net/api/auth/google`
223+
224+
## 💡 Next Steps
225+
226+
1.**Backend deployed to Azure**
227+
2. **Update your frontend** `.env.local`:
228+
```
229+
NEXT_PUBLIC_API_URL=https://calendar-integration-backend-eabkffc4gphtenfc.westus-01.azurewebsites.net/api
230+
```
231+
3. **Deploy frontend** (Vercel/Azure Static Web Apps)
232+
4. **Update environment variables** with frontend URL
233+
234+
## 🛠️ Troubleshooting
235+
236+
### **Check Logs**:
237+
1. **Web App****Monitoring****Log stream**
238+
2. Or **Diagnose and solve problems**
239+
240+
### **Common Issues**:
241+
- **App won't start**: Check environment variables
242+
- **Database connection**: Verify DATABASE_URL and firewall
243+
- **OAuth issues**: Check Google redirect URLs
244+
245+
### **Restart App**:
246+
1. **Web App****Overview****Restart**
247+
248+
## 💰 Cost Summary
249+
250+
- **PostgreSQL B1ms**: ~$20/month
251+
- **App Service B1**: ~$13/month
252+
- **Total**: ~$33/month
253+
254+
**Free Options**:
255+
- App Service F1: Free (limited)
256+
- Use Azure free credits!
257+
258+
You're all set! 🚀

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ A full-stack application for Google Calendar integration with event creation fun
1111
## 🛠️ Tech Stack
1212
- **Backend**: Node.js, Express, TypeScript, Prisma, PostgreSQL
1313
- **Frontend**: Next.js, React, Tailwind CSS
14-
- **Deployment**: Azure App Service, GitHub Actions
14+
- **Deployment**: Azure App Service, GitHub Actions , Vercel , Azure-Postgres
1515

1616
## ⚡ Quick Start
1717

0 commit comments

Comments
 (0)