puffin-app/README.md

Puffin Offset - Carbon Offsetting for Yachts

This application helps users calculate and offset the carbon footprint of yachts through verified carbon offset projects.

Features

• Carbon footprint calculation for yacht trips
• Integration with Wren carbon offset projects
• Responsive UI for mobile and desktop
• Contact forms powered by Formspree

Setup

Local Development

1. Install dependencies:

npm install

2. Create a .env file with your API tokens:

VITE_WREN_API_TOKEN=your-token-here
VITE_FORMSPREE_CONTACT_ID=your-formspree-contact-form-id
VITE_FORMSPREE_OFFSET_ID=your-formspree-offset-form-id

3. Run the development server:

npm run dev

Docker Setup

This project can be run in Docker containers using Docker Compose.

Prerequisites

• Docker
• Docker Compose

Running with Docker Compose

1. Build and start the containers:

docker compose up -d

2. Access the application at http://localhost:80

3. Stop the containers:

docker compose down

Environment Variables

When using Docker, the environment variables are mounted as a volume from your local .env file. Make sure it contains:

VITE_WREN_API_TOKEN=your-token-here
VITE_FORMSPREE_CONTACT_ID=your-formspree-contact-form-id
VITE_FORMSPREE_OFFSET_ID=your-formspree-offset-form-id

Backend Service (Optional)

The docker-compose file includes a commented section for running the backend script (app.js) in a separate container. To enable it:

1. Uncomment the backend service in docker-compose.yml
2. Ensure your .env file contains the needed variables
3. Run docker compose up -d to start both services

API Documentation

For Wren API documentation, visit: https://wren.co/api

Building for Production

# Without Docker
npm run build

# With Docker
docker compose build

The production build will be available in the dist directory, or served by Nginx in the Docker container.