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 for configuration. These must be set before building the Docker image.

Environment Variables

Variable	Description	Required	Default
SITE_URL	Public URL where the app is hosted (used for QR codes)	Yes	https://nlcc.rydertech.us
AUTH_SECRET	Secret key for authentication sessions	Yes	change-this-secret-in-production
ADMIN_USERNAME	Admin login username	Yes	admin
ADMIN_PASSWORD	Admin login password	Yes	admin123

Setting Up Environment Variables

Create a .env file in the project root:

SITE_URL=https://your-church-domain.com
AUTH_SECRET=your-secure-random-secret-here

Generate a secure AUTH_SECRET:

openssl rand -hex 32

Getting Started

Prerequisites

• Docker and Docker Compose installed on your system

Installation & Deployment

1. Clone the repository:

git clone <repository-url>
cd nlcc-itinerary

2. Create a .env file from the example:

cp .env.example .env

3. Edit .env and configure your settings:

# Required: Set your public URL (used for QR codes)
SITE_URL=https://your-domain.com

# Required: Set a secure authentication secret
# Generate with: openssl rand -hex 32
AUTH_SECRET=your-secure-random-secret-here

# Required: Set your admin credentials
ADMIN_USERNAME=your-admin-username
ADMIN_PASSWORD=your-secure-password

4. Build and run with Docker Compose:

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).

Admin Credentials

Admin credentials are now configured via environment variables (ADMIN_USERNAME and ADMIN_PASSWORD). Set these in your .env file before building the Docker image.

Default values (if not set in .env):

• Username: admin
• Password: admin123

⚠️ Important: Always change these default credentials in production by setting ADMIN_USERNAME and ADMIN_PASSWORD in your .env file.

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

# 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.