An open API service indexing awesome lists of open source software.

https://github.com/rusticflare/random-hour


https://github.com/rusticflare/random-hour

Last synced: 8 months ago
JSON representation

Awesome Lists containing this project

README

          

# Random Hour Habits

A habit tracking app built with Next.js and InstantDB that helps you manage your habits and get random suggestions for what to do next.

## Features

- **Add, Edit, Delete Habits**: Full CRUD operations for managing your habits
- **"What should I do?" Button**: Prominently displays a random habit suggestion
- **Magic Code Authentication**: Simple email-based authentication
- **Real-time Updates**: Changes sync instantly across devices
- **Modern UI**: Clean, responsive design with Tailwind CSS

## Getting Started

### Prerequisites

- Node.js 18+
- An InstantDB account (free at [instantdb.com](https://instantdb.com))

### Setup

1. **Clone and install dependencies:**
```bash
npm install
```

2. **Set up environment variables:**
Create a `.env.local` file in the root directory:
```bash
NEXT_PUBLIC_INSTANT_APP_ID=your_app_id_here
```

3. **Get your InstantDB App ID:**
- Go to [instantdb.com](https://instantdb.com) and create a new app
- Copy the App ID from your app dashboard
- Replace `your_app_id_here` in `.env.local` with your actual App ID

4. **Run the development server:**
```bash
npm run dev
```

5. **Open your browser:**
Navigate to [http://localhost:3000](http://localhost:3000)

## Usage

1. **Sign up/Login**: Enter your email to receive a magic code
2. **Add habits**: Use the input field to add new habits
3. **Edit habits**: Click the "Edit" button on any habit to modify it
4. **Delete habits**: Click the "Delete" button to remove habits
5. **Get random suggestions**: Click the prominent "What should I do?" button to get a random habit suggestion

## Tech Stack

- **Frontend**: Next.js 15, React 19, TypeScript
- **Database**: InstantDB (real-time database)
- **Styling**: Tailwind CSS
- **Authentication**: InstantDB Magic Code Auth

## Project Structure

```
├── app/
│ ├── layout.tsx # App layout and metadata
│ ├── page.tsx # Main habit tracking UI
│ └── globals.css # Global styles
├── lib/
│ └── db.ts # InstantDB client setup
├── instant.schema.ts # InstantDB schema definition
└── package.json
```

## Deployment

The app can be deployed to any platform that supports Next.js:

- **Vercel** (recommended): Connect your GitHub repo
- **Netlify**: Deploy from Git
- **Railway**: Deploy with one click

Make sure to set the `NEXT_PUBLIC_INSTANT_APP_ID` environment variable in your deployment platform.

## License

MIT