first commit
This commit is contained in:
commit
a00a62f928
173
README.md
Normal file
173
README.md
Normal file
@ -0,0 +1,173 @@
|
||||
# Webflow Website Deployment Guide
|
||||
|
||||
This repository contains a framework for deploying static websites exported from Webflow. Using Docker and Nginx with optional Cloudflare integration, you can quickly deploy your Webflow site with professional-grade hosting.
|
||||
|
||||
## Webflow Code Export
|
||||
|
||||
This deployment method requires exporting your Webflow site as static code. To do this:
|
||||
1. In your Webflow project dashboard, go to "Publish"
|
||||
2. Click on "Export Code"
|
||||
3. Download the ZIP file containing your site's code
|
||||
|
||||
For detailed instructions, see the [official Webflow Code Export guide](https://help.webflow.com/hc/en-us/articles/33961386739347-Code-export).
|
||||
|
||||
> **⚠️ Important Limitation Warning ⚠️**
|
||||
> The following Webflow features will NOT work in exported code:
|
||||
> - CMS and database content
|
||||
> - User accounts and authentication
|
||||
> - Ecommerce functionality
|
||||
> - Logic flows
|
||||
> - Localized content
|
||||
> - Form submissions (due to GDPR compliance)
|
||||
> - Site search functionality
|
||||
> - Password protection for pages
|
||||
>
|
||||
> Collection lists will show empty states, and Collection pages won't display content bound to Collection fields.
|
||||
|
||||
## Technology Stack
|
||||
|
||||
### Core Technologies
|
||||
- **[Webflow](https://webflow.com/)**: Visual web design platform for the original site creation
|
||||
- **[Docker](https://www.docker.com/)**: Containerization for consistent deployment
|
||||
- **[Nginx](https://nginx.org/)**: High-performance web server for static content
|
||||
- **[Cloudflare](https://www.cloudflare.com/)** (Optional): For secure tunneling, DDoS protection, and CDN
|
||||
|
||||
### Benefits of This Setup
|
||||
- **Portability**: Runs consistently on any system with Docker
|
||||
- **Security**: Minimal attack surface with Alpine-based containers
|
||||
- **Performance**: Optimized Nginx with gzip compression and proper caching
|
||||
- **Scalability**: Easily deployable to any server or cloud environment
|
||||
|
||||
## Directory Structure
|
||||
|
||||
- `website/` - Contains all the website files (place your Webflow export here)
|
||||
- HTML pages
|
||||
- `css/` - Stylesheets
|
||||
- `js/` - JavaScript files
|
||||
- `images/` - Images and media
|
||||
- `fonts/` - Custom fonts
|
||||
- `docker-compose.yml` - Docker Compose configuration for standard deployment
|
||||
- `docker-compose-with-cloudflare.yml` - Extended configuration with Cloudflare Tunnel
|
||||
- `nginx.conf` - Nginx web server configuration with performance optimizations
|
||||
- `deploy.sh` - Helper script for deployment
|
||||
- `cloudflared-config.yml` - Configuration for Cloudflare Tunnel (optional)
|
||||
- `CLOUDFLARE-SETUP.md` - Instructions for Cloudflare integration
|
||||
|
||||
## Deployment Instructions
|
||||
|
||||
### Prerequisites
|
||||
- Docker and Docker Compose installed on your server
|
||||
- [Install Docker Engine](https://docs.docker.com/engine/install/)
|
||||
- [Install Docker Compose](https://docs.docker.com/compose/install/)
|
||||
- Basic knowledge of terminal commands
|
||||
|
||||
### Steps to Deploy
|
||||
|
||||
1. Clone or copy this repository to your server
|
||||
|
||||
2. Extract your Webflow code export into the `website/` directory
|
||||
|
||||
3. Navigate to the project directory:
|
||||
```bash
|
||||
cd path/to/webflow-deployment
|
||||
```
|
||||
|
||||
4. Start the Docker container:
|
||||
```bash
|
||||
docker-compose up -d
|
||||
```
|
||||
|
||||
5. The website should now be available at `http://localhost` or your server's IP address.
|
||||
|
||||
6. For public access, you can either:
|
||||
- Configure your DNS and firewall to expose port 80/443
|
||||
- Deploy using the [Cloudflare Tunnel](./CLOUDFLARE-SETUP.md) for secure access
|
||||
|
||||
### Management Commands
|
||||
|
||||
- To stop the server:
|
||||
```bash
|
||||
docker-compose down
|
||||
```
|
||||
|
||||
- To view logs:
|
||||
```bash
|
||||
docker-compose logs -f
|
||||
```
|
||||
|
||||
- To restart the server:
|
||||
```bash
|
||||
docker-compose restart
|
||||
```
|
||||
|
||||
- To deploy using the helper script:
|
||||
```bash
|
||||
./deploy.sh
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
- The Nginx configuration is located in `nginx.conf`
|
||||
- The Docker Compose configuration is in `docker-compose.yml`
|
||||
- Website files are served from the `website/` directory
|
||||
|
||||
## Technical Details
|
||||
|
||||
### Nginx Configuration
|
||||
The Nginx web server is configured with several optimizations:
|
||||
|
||||
- **Gzip Compression**: Reduces the size of transferred files
|
||||
- **Asset Caching**: Sets proper cache headers for static assets
|
||||
- **Error Handling**: Custom error pages
|
||||
- **SPA Support**: Fallback to index.html for client-side routing
|
||||
|
||||
### Docker Configuration
|
||||
The Docker setup uses:
|
||||
|
||||
- **nginx:alpine**: A lightweight, Alpine Linux-based Nginx image
|
||||
- **Volume Mounting**: Maps the local website directory to the container
|
||||
- **Port Mapping**: Exposes port 80 for HTTP traffic
|
||||
- **Automatic Restart**: Container restarts automatically if it crashes
|
||||
|
||||
## Alternative: Self-Hosted Website Builders
|
||||
|
||||
If you need more functionality than a static Webflow export provides, consider these alternatives:
|
||||
|
||||
### GrapesJS
|
||||
Webflow is built on a framework similar to [GrapesJS](https://grapesjs.com/), an open-source web builder framework. GrapesJS can be self-hosted and integrated with your own backend for dynamic content.
|
||||
|
||||
### Changemaker V5
|
||||
[Changemaker V5](https://gitea.bnkhome.org/bnkops/Changemaker) is a battle-tested, lightweight, self-hosted productivity suite developed by The Bunker Operations in Edmonton, Alberta, Canada.
|
||||
|
||||
It empowers you to deploy secure, locally-built websites, blogs, newsletters, and forms – from personal projects to full-fledged campaigns – giving you complete control, inherent security, and true freedom of speech.
|
||||
|
||||
Changemaker V5 provides a digital campaign alternative to mainstream American systems and can be paired with your own infrastructure at [changemaker.bnkops.org](https://changemaker.bnkops.org).
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
#### Container won't start
|
||||
```bash
|
||||
# Check for detailed error messages
|
||||
docker-compose logs
|
||||
```
|
||||
|
||||
#### Cannot connect to website
|
||||
```bash
|
||||
# Verify the container is running
|
||||
docker ps
|
||||
|
||||
# Check if port 80 is in use by another service
|
||||
sudo lsof -i :80
|
||||
```
|
||||
|
||||
#### Permission issues
|
||||
```bash
|
||||
# Fix permission issues with Docker socket
|
||||
sudo chmod 666 /var/run/docker.sock
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
This deployment framework is provided under the MIT License.
|
||||
Loading…
x
Reference in New Issue
Block a user