substream

KO | EN

gitlite — search

#react #typescript #llm #go #deep-learning #linux #docker #nodejs #java #cli #kubernetes #pytorch #ios #mcp

(★ 21)

Subscription tracking application that helps users manage recurring payments, visualize spending patterns, and avoid forgotten charges.

substream Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# SubStream

A modern subscription tracking application that helps users manage recurring payments, visualize spending patterns, and avoid forgotten charges.

## Overview

SubStream provides a centralized dashboard for tracking all subscription services. Users can monitor monthly and yearly spending, receive renewal reminders, and identify unused subscriptions that could be cancelled.

## Screenshots

## Technology Stack

| Category | Technology |
|----------|------------|
| Frontend | React 18, TypeScript |
| Build Tool | Vite |
| Styling | Tailwind CSS, shadcn/ui |
| Animation | Framer Motion |
| State Management | Zustand, TanStack Query |
| Authentication | Firebase Auth |
| Database | Neon PostgreSQL |
| Charts | Recharts |

## Prerequisites

- Node.js 18 or higher
- npm or bun package manager
- Firebase project with Authentication enabled
- Neon PostgreSQL database

## Installation

1. Clone the repository:
   ```bash
   git clone https://github.com/yassnemo/substream.git
   cd substream
   ```

2. Install dependencies:
   ```bash
   npm install
   ```

3. Configure environment variables:
   ```bash
   cp .env.example .env
   ```

4. Update `.env` with your credentials (see Configuration section)

5. Initialize the database by running the schema in your Neon console:
   ```
   src/integrations/neon/schema.sql
   ```

6. Start the development server:
   ```bash
   npm run dev
   ```

## Configuration

Create a `.env` file in the project root with the following variables:

```env
# Firebase Authentication
VITE_FIREBASE_API_KEY=
VITE_FIREBASE_AUTH_DOMAIN=
VITE_FIREBASE_PROJECT_ID=
VITE_FIREBASE_STORAGE_BUCKET=
VITE_FIREBASE_MESSAGING_SENDER_ID=
VITE_FIREBASE_APP_ID=
VITE_FIREBASE_MEASUREMENT_ID=

# Neon Database
VITE_NEON_DATABASE_URL=
```

Refer to `.env.example` for the expected format of each variable.

## Available Scripts

| Command | Description |
|---------|-------------|
| `npm run dev` | Start development server |
| `npm run build` | Create production build |
| `npm run preview` | Preview production build locally |
| `npm run lint` | Run ESLint code analysis |

## Project Structure

```
src/
├── components/        # Reusable UI components
│   └── ui/           # shadcn/ui component library
├── hooks/            # Custom React hooks
├── integrations/     # External service integrations
│   ├── firebase/     # Firebase Auth configuration
│   └── neon/         # Database client and queries
├── lib/              # Utility functions
├── pages/            # Route page components
└── store/            # Zustand state stores
```

## Features

- Subscription tracking with customizable categories
- Monthly and yearly spending calculations
- Renewal date reminders and notifications
- Spending analytics with visual charts
- Usage tracking to identify inactive subscriptions
- Dark theme interface

## Deployment

Build the application for production:

```bash
npm run build
```

The `dist` directory can be deployed to any static hosting service:
- Vercel
- Netlify
- Cloudflare Pages
- AWS S3 / CloudFront

## Security

- Environment variables are excluded from version control
- Authentication handled through Firebase Auth
- Database connections use SSL encryption
- No sensitive credentials are hardcoded in the source code

## License

MIT

substream

substream Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

substream

substream Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README