nlcc-itinerary/README.md

# New Life Christian Church - Sermon Itinerary

A web application for managing and displaying weekly sermons for New Life Christian Church.

## Features

- 📝 **Sermon Management**: Create and manage sermon content with a user-friendly form
- 🔐 **Authentication**: Secure admin access with login system
- 📱 **QR Codes**: Generate QR codes for easy sermon sharing
- 📅 **Date-based URLs**: Sermons accessible via `sermon-MMDDYYYY` format
- 🎨 **Modern UI**: Clean, responsive design using Tailwind CSS and Inter font
- 📊 **Three Sections**: Bible References, Personal Appliance, and Pastor's Challenge
- 🗂️ **Smart Organization**: Recent sermons (last 3 months) displayed by default, older sermons in dropdown
- 🐳 **Docker Ready**: Fully containerized for easy deployment

## Technology Stack

- **Frontend**: Nuxt 3 (Vue.js)
- **Styling**: Tailwind CSS with Inter font from Google Fonts
- **Database**: SQLite
- **QR Codes**: qrcode library
- **Deployment**: Docker & Docker Compose

## Configuration

This application uses environment variables configured directly in `docker-compose.yml`. Edit the file to customize your deployment settings.

### Environment Variables

| Variable | Description | Default |
|----------|-------------|---------|
| `SITE_URL` | Public URL where the app is hosted (used for QR codes) | `https://nlcc.rydertech.us` |
| `AUTH_SECRET` | Secret key for authentication sessions | `change-this-secret-in-production-please` |
| `ADMIN_USERNAME` | Initial admin login username | `admin` |
| `ADMIN_PASSWORD` | Initial admin login password | `Admin123!` |
| `EMAIL_HOST` | SMTP server hostname | `smtp.example.com` |
| `EMAIL_PORT` | SMTP server port | `587` |
| `EMAIL_USER` | SMTP authentication username | `noreply@example.com` |
| `EMAIL_PASSWORD` | SMTP authentication password | `your-email-password` |
| `EMAIL_FROM` | Email sender address and name | `New Life Christian Church <noreply@example.com>` |

### Customizing Configuration

Edit `docker-compose.yml` and update the values in both the `build.args` and `environment` sections:

```yaml
services:
  nlcc-itinerary:
    build:
      args:
        - SITE_URL=https://your-church-domain.com
        - AUTH_SECRET=your-secure-random-secret-here
        - ADMIN_USERNAME=your-admin-username
        - ADMIN_PASSWORD=your-secure-password
        - EMAIL_HOST=smtp.gmail.com
        - EMAIL_PORT=587
        - EMAIL_USER=your-email@gmail.com
        - EMAIL_PASSWORD=your-app-password
        - EMAIL_FROM=Your Church Name <your-email@gmail.com>
    environment:
      - SITE_URL=https://your-church-domain.com
      - AUTH_SECRET=your-secure-random-secret-here
      - ADMIN_USERNAME=your-admin-username
      - ADMIN_PASSWORD=your-secure-password
      - EMAIL_HOST=smtp.gmail.com
      - EMAIL_PORT=587
      - EMAIL_USER=your-email@gmail.com
      - EMAIL_PASSWORD=your-app-password
      - EMAIL_FROM=Your Church Name <your-email@gmail.com>
```

**Generate a secure AUTH_SECRET:**
```bash
openssl rand -hex 32
```

## Getting Started

### Prerequisites

- Docker and Docker Compose installed on your system

### Installation & Deployment

1. Clone the repository:
```bash
git clone <repository-url>
cd nlcc-itinerary
```

2. Edit `docker-compose.yml` and configure your settings:
   - Update `SITE_URL` to your public domain
   - Generate and set a secure `AUTH_SECRET` (use `openssl rand -hex 32`)
   - Set your desired `ADMIN_USERNAME` and `ADMIN_PASSWORD`
   - Make sure to update values in BOTH `build.args` AND `environment` sections

3. Build and run with Docker Compose:
```bash
docker-compose up -d --build
```

The application will be available at `http://localhost:3002` (or your configured port)

**Important**: The `SITE_URL` must be set correctly for QR codes to work. This should be the public URL where your application is accessible (e.g., `https://church.example.com`).

### Initial Admin Account

The initial admin account is created automatically on first run using the credentials specified in `docker-compose.yml`:

**Default values**:
- **Username**: admin
- **Password**: Admin123!

⚠️ **Important**: 
- Change these credentials in `docker-compose.yml` before deploying to production
- After the first build, you can change the admin password through the user management interface
- Additional users can be created through the registration page

## Project Structure

```
nlcc-itinerary/
├── assets/css/          # Global styles
├── components/          # Vue components
│   ├── SermonCard.vue
│   ├── QRCodeButton.vue
│   └── QRCodeModal.vue
├── middleware/          # Route middleware
│   └── auth.ts
├── pages/              # Application pages
│   ├── index.vue       # Main sermon listing
│   ├── login.vue       # Admin login
│   ├── admin.vue       # Sermon creation form
│   └── [slug].vue      # Individual sermon page
├── server/
│   ├── api/            # API endpoints
│   │   ├── auth/       # Authentication endpoints
│   │   └── sermons/    # Sermon CRUD endpoints
│   └── utils/          # Server utilities
│       ├── database.ts # SQLite database functions
│       └── auth.ts     # Authentication helpers
├── logos/              # Church logos
├── Dockerfile          # Docker configuration
├── docker-compose.yml  # Docker Compose configuration
└── nuxt.config.ts      # Nuxt configuration
```

## Usage

### Creating a Sermon

1. Navigate to `/login` and sign in with admin credentials
2. You'll be redirected to `/admin`
3. Fill in the sermon details:
   - **Date**: Select the sermon date (URL will be auto-generated as `sermon-MMDDYYYY`)
   - **Title**: Enter the sermon title
   - **Bible References**: Add one or more Bible verses (use +/- buttons)
   - **Personal Appliance**: Enter personal application content
   - **Pastor's Challenge**: Enter the pastor's challenge content
4. Click "Create Sermon"

### Viewing Sermons

- **Main Page** (`/`): Shows recent sermons (last 3 months) with option to view older ones
- **Individual Sermon** (`/sermon-MMDDYYYY`): Full sermon details with QR code
- **QR Code**: Click the QR code button on any sermon card or page to generate a scannable code

## Database

The application uses SQLite with the following schema:

### Sermons Table
- `id`: Primary key
- `slug`: Unique sermon identifier (e.g., sermon-09282025)
- `title`: Sermon title
- `date`: Sermon date
- `bible_references`: Newline-separated Bible verses
- `personal_appliance`: Personal application content
- `pastors_challenge`: Pastor's challenge content
- `created_at`: Timestamp

### Users Table
- `id`: Primary key
- `username`: User's username
- `password`: User's password (plain text - should be hashed in production)

## Security Notes

⚠️ **For Production Use**:

1. Change the default admin credentials in your `.env` file
2. ✅ Password hashing is implemented using bcrypt
3. Use a strong `AUTH_SECRET` in environment variables (generate with `openssl rand -hex 32`)
4. Enable HTTPS
5. Consider implementing rate limiting
6. Add CSRF protection

**Note**: Passwords are now securely hashed using bcrypt with 10 salt rounds before being stored in the database.

## Docker Commands

```bash
# Build and start
docker-compose up -d

# View logs
docker-compose logs -f

# Stop containers
docker-compose down

# Rebuild after changes
docker-compose up -d --build

# Access container shell
docker exec -it nlcc-itinerary sh
```

## Data Persistence

The SQLite database is stored in the `./data` directory, which is mounted as a volume in Docker. This ensures sermon data persists across container restarts.

## License

This project is created for New Life Christian Church.

## Support

For issues or questions, please contact the development team.