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

Getting Started

Prerequisites

  • Docker and Docker Compose installed on your system

Installation & Deployment

  1. Clone the repository:
git clone <repository-url>
cd nlcc-itinerary
  1. Update environment variables in docker-compose.yml:
environment:
  - AUTH_SECRET=your-secret-key-change-in-production
  - SITE_URL=https://newlife-christian.com
  1. Build and run with Docker Compose:
docker-compose up -d

The application will be available at http://localhost:3000

Default Credentials

  • Username: admin
  • Password: admin123

⚠️ Important: Change these credentials in production by modifying server/utils/database.ts

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
  2. Implement proper password hashing (bcrypt, argon2, etc.)
  3. Use a strong AUTH_SECRET in environment variables
  4. Enable HTTPS
  5. Consider implementing rate limiting
  6. Add CSRF protection

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.

Description
Sermon app for New Life Christian Church
Readme 641 KiB
Languages
Vue 60%
TypeScript 38.4%
Dockerfile 1.2%
JavaScript 0.2%
Shell 0.2%