cda15991e3
- Added main HTML file (index.html) for the web app interface. - Created a sample cover template (sample_cover.html) for Yoto cards. - Implemented a simple HTTP server (server.py) to serve the web app. - Configured package.json for project metadata and scripts.
75 lines
1.6 KiB
Markdown
75 lines
1.6 KiB
Markdown
# Static Site Deployment
|
|
|
|
The Yoto Up Covers web app is a **100% static application** that can be deployed to any static site hosting service.
|
|
|
|
## Required Files for Deployment
|
|
|
|
Only these two files are needed for the web app to function:
|
|
|
|
```
|
|
web_app/
|
|
├── index.html # Main application
|
|
└── app.js # Application logic
|
|
```
|
|
|
|
## Hosting Options
|
|
|
|
### 1. GitHub Pages (Free)
|
|
```bash
|
|
# Create a new repository
|
|
git init
|
|
git add index.html app.js
|
|
git commit -m "Initial commit"
|
|
git branch -M main
|
|
git remote add origin https://github.com/yourusername/yoto-covers.git
|
|
git push -u origin main
|
|
|
|
# Enable GitHub Pages in repository settings
|
|
# Your app will be available at: https://yourusername.github.io/yoto-covers/
|
|
```
|
|
|
|
### 2. Netlify (Free tier available)
|
|
```bash
|
|
# Install Netlify CLI
|
|
npm install -g netlify-cli
|
|
|
|
# Deploy
|
|
netlify deploy --prod --dir web_app --public
|
|
```
|
|
|
|
### 3. Vercel (Free tier available)
|
|
```bash
|
|
# Install Vercel CLI
|
|
npm install -g vercel
|
|
|
|
# Deploy
|
|
cd web_app
|
|
vercel --prod
|
|
```
|
|
|
|
### 4. Manual Upload
|
|
Simply upload `index.html` and `app.js` to any web hosting service:
|
|
- AWS S3 + CloudFront
|
|
- Firebase Hosting
|
|
- DigitalOcean Spaces
|
|
- Any traditional web host
|
|
|
|
## Features That Work Offline
|
|
|
|
- ✅ Template customization
|
|
- ✅ Color picker
|
|
- ✅ Image upload and editing
|
|
- ✅ Live preview generation
|
|
- ✅ HTML export
|
|
- ✅ Print functionality
|
|
|
|
## Browser Requirements
|
|
|
|
- Modern browser with HTML5 support
|
|
- File API (for image uploads)
|
|
- Blob URLs (for previews)
|
|
- No server-side dependencies
|
|
|
|
## Demo
|
|
|
|
A live demo can be viewed by opening `index.html` in any modern web browser. |