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.

Project Motivation

This project was developed as a cost-effective alternative to webflow's hosting plans. We found that the cost of a monthly Webflow hosting subscriptions would equal the expense of purchasing and running a dedicated server for an entire year. To illustrate:

Webflow Site Plan

CMS = $29.00 USD / Month
Workspace = $28.00 USD / Month
Total = $56.00 USD / Month
Year Total = $672 US 0r $940.56 CAD

Self-hosted

Hardware = $150
Software = $0
Domain = $10 CAD / Year
Total = $150 / Year

It is possible to have a full webflow deployment for free and open source.

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, an open-source web builder framework. GrapesJS can be self-hosted and integrated with your own backend for dynamic content.

Changemaker V5

Changemaker V5 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. It is more the capable of providing the full backend infrastrcuture to a webflow site.

Changemaker V5 provides a digital campaign alternative to mainstream American systems and can be paired with your own infrastructure at changemaker.bnkops.org.

Webflow Code Export

This deployment method requires exporting your Webflow site as static code. To do this:

In your Webflow project dashboard, go to "Publish"
Click on "Export Code"
Download the ZIP file containing your site's code

For detailed instructions, see the official Webflow Code Export guide.

⚠️ 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: Visual web design platform for the original site creation
Docker: Containerization for consistent deployment
Nginx: High-performance web server for static content
Cloudflare (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
- Install Docker Compose
Basic knowledge of terminal commands

Steps to Deploy

Clone this repository to your server:

git clone https://gitea.bnkhome.org/bnkops/webflow.quick.server.git

Extract your Webflow code export/copy all files into the website/ directory
Navigate to the project directory:
```
cd path/to/webflow.quick.server
```
Start the Docker container:
```
docker-compose up -d
```
The website should now be available at http://localhost or your server's IP address.
For public access, you can either:
- Configure your DNS and firewall to expose port 80/443
- Deploy using the Cloudflare Tunnel for secure access

Management Commands

To stop the server:
```
docker-compose down
```
To view logs:
```
docker-compose logs -f
```
To restart the server:
```
docker-compose restart
```
To deploy using the helper script:
```
./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

Troubleshooting

Common Issues

Container won't start

# Check for detailed error messages
docker-compose logs

Cannot connect to website

# Verify the container is running
docker ps

# Check if port 80 is in use by another service
sudo lsof -i :80

Permission issues

# Fix permission issues with Docker socket
sudo chmod 666 /var/run/docker.sock

License

This deployment framework is provided under the MIT License.

README.md Unescape Escape

Webflow Website Deployment Guide