Enphase API Reader

A React Router application for reading and visualizing data from the Enphase API. Built with TypeScript and deployed on Cloudflare Workers.

Features

• 📊 Data visualization with Recharts
• 🗄️ Database integration using Drizzle ORM with D1
• 📄 PDF generation capabilities with @react-pdf/renderer
• 🎨 Styled with TailwindCSS
• ⚡ Serverless deployment on Cloudflare Workers
• 🔒 TypeScript for type safety

Tech Stack

• Frontend: React 19, React Router 7
• Database: Cloudflare D1 with Drizzle ORM
• Styling: TailwindCSS
• Charts: Recharts
• PDF Generation: @react-pdf/renderer
• Deployment: Cloudflare Workers

Getting Started

Prerequisites

• Node.js (v22 or higher recommended)
• npm or bun package manager
• Cloudflare account (for deployment)

Installation

Install the dependencies:

npm install

Or with bun:

bun install

Development

Start the development server:

npm run dev

Your application will be available at http://localhost:5173.

Type Checking

Run TypeScript type checking:

npm run typecheck

Building for Production

Create a production build:

npm run build

Deployment

Cloudflare Workers

This application is configured to deploy to Cloudflare Workers. Make sure you have:

1. Configured your D1 database binding named enphase_db
2. Set up your wrangler.jsonc configuration
3. Authenticated with Cloudflare CLI

Deploy using:

wrangler deploy

Docker Deployment

To build and run using Docker:

docker build -t enphase-api-reader .

# Run the container
docker run -p 3000:3000 enphase-api-reader

Database

This project uses Drizzle ORM with Cloudflare D1. Configuration can be found in drizzle.config.ts.

To manage database migrations:

# Generate migrations
npx drizzle-kit generate

# Push migrations
npx drizzle-kit push

License

This project is licensed under the MIT License - see the LICENSE file for details.

---

Built with React Router and Cloudflare Workers