Skip to content

WEB_DEPLOYMENT_GUIDE.md

Latest commit

 

History

History
205 lines (153 loc) · 4.92 KB

WEB_DEPLOYMENT_GUIDE.md

File metadata and controls

205 lines (153 loc) · 4.92 KB
Raw

🌐 Women Safety App - Web Deployment Guide

✅ Build Complete!

Your app has been successfully built for web deployment! The production files are located in:

C:\ZNEW FOLDER\4th year Project GLBITM\build\web

🚀 Deployment Options

Option 1: GitHub Pages (Recommended - FREE & Easy)

Step 1: Create GitHub Repository

  1. Go to https://github.com and sign in
  2. Click "New repository"
  3. Name it: women-safety-app
  4. Click "Create repository"

Step 2: Upload Your Web Build

# Navigate to your project
cd "C:\ZNEW FOLDER\4th year Project GLBITM"

# Initialize git (if not already done)
git init
git add .
git commit -m "Initial commit"

# Connect to GitHub (replace YOUR_USERNAME)
git remote add origin https://github.com/YOUR_USERNAME/women-safety-app.git
git branch -M main
git push -u origin main

Step 3: Enable GitHub Pages

  1. Go to your repository on GitHub
  2. Click "Settings" → "Pages"
  3. Under "Source", select "main" branch
  4. Select "/docs" or configure to use build/web folder
  5. Click "Save"
  6. Your app will be live at: https://YOUR_USERNAME.github.io/women-safety-app/

Alternative: Use GitHub Desktop (Easier)

  1. Download GitHub Desktop: https://desktop.github.com
  2. Install and sign in
  3. Click "Add" → "Add Existing Repository"
  4. Select C:\ZNEW FOLDER\4th year Project GLBITM
  5. Publish repository
  6. Go to repo settings and enable GitHub Pages

Option 2: Firebase Hosting (Professional - FREE)

Requirements:

Then run:

# Install Firebase CLI
npm install -g firebase-tools

# Login to Firebase
firebase login

# Navigate to project
cd "C:\ZNEW FOLDER\4th year Project GLBITM"

# Initialize Firebase
firebase init hosting

# When prompted:
# - Select "Use an existing project" or "Create new project"
# - Set public directory to: build/web
# - Configure as single-page app: Yes
# - Don't overwrite index.html: No

# Deploy
firebase deploy

Your app will be live at: https://YOUR-PROJECT.web.app

Option 3: Netlify Drop (Fastest - FREE)

  1. Go to https://app.netlify.com/drop
  2. Drag and drop the entire build\web folder
  3. Your site goes live instantly!
  4. You'll get a URL like: https://random-name.netlify.app
  5. You can customize the URL in settings

Option 4: Share via Google Drive

For quick testing/demo:

  1. Compress the build\web folder to ZIP
  2. Upload to Google Drive
  3. Share link with your professor
  4. They download, extract, and open index.html in browser

Or use Python Simple Server:

cd "C:\ZNEW FOLDER\4th year Project GLBITM\build\web"
python -m http.server 8000

Then access at: http://localhost:8000

📱 Access from Phone

Once deployed online:

  1. Open the URL on your phone browser
  2. Tap browser menu (⋮)
  3. Select "Add to Home Screen"
  4. Your app will work like a native app!

🔧 Test Locally First

Run this to test before deploying:

cd "C:\ZNEW FOLDER\4th year Project GLBITM"
flutter run -d chrome --release

📊 Features Working in Web Version

✅ Emergency SOS button (calls phone dialer) ✅ Quick action cards (Police, Ambulance, etc.) ✅ Legal rights information with clickable links ✅ Helpline numbers with one-tap calling ✅ Emergency contacts management (saved locally) ✅ Anonymous incident reporting ✅ Settings with persistent preferences ✅ Responsive design for all screen sizes

🎓 For Your Project Submission

What to include:

  1. Live Demo URL - Use any of the above hosting options
  2. Source Code - Upload to GitHub
  3. Documentation - Include this guide + features list
  4. Screenshots - Take screenshots of all screens
  5. Video Demo - Record screen showing all features

Presentation Points:

  • ✅ Fully functional web application
  • ✅ Real phone calling integration
  • ✅ Legal awareness content with government website links
  • ✅ Local data persistence (emergency contacts, settings)
  • ✅ Responsive Material Design 3 UI
  • ✅ Anonymous reporting system
  • ✅ Accessible from any device with a browser

🐛 Troubleshooting

Links not opening on phone:

  • Phone dialers and external links work on actual phones, not in desktop Chrome

Need to rebuild:

flutter clean
flutter pub get
flutter build web --release

Want to add more features:

  • Edit lib\main.dart
  • Run flutter build web --release
  • Re-upload/redeploy

💡 Quick Deploy Recommendation

For immediate demo (5 minutes):

  1. Use Netlify Drop: https://app.netlify.com/drop
  2. Drag build\web folder
  3. Share the URL with your professor
  4. Done! ✨

For professional portfolio:

  1. Use GitHub Pages
  2. Shows your code + live demo
  3. Looks great on resume

📞 Support

Your app is ready! All features are working in the web version. Choose any deployment method above and you're good to go! 🚀