ViteReactAdmin dashboard

church-website-template — Vite Admin dashboard Template

By amy14rubio

A full-stack website template for churches, with a public site, role-based calendar, and admin panel, packageable as a mobile app.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-09-30View source

What stands out

A quick read of the recorded project description.

01

Public site includes Home, About, Ministries, Blog, and Contact pages

02

Five roles are enforced server-side via Firestore security rules, not merely hidden in the frontend

03

Hero, About page, ministry descriptions, and other copy can be edited directly in the in-app admin mode

04

The same codebase can be packaged as iOS and Android apps via Capacitor

05

An optional Cloud Function is provided for connecting Facebook/Instagram accounts

Template Details

This is a general-purpose template extracted from a real church website. The frontend uses React, TypeScript, Vite, Tailwind CSS, and React Router; the backend relies on Firebase Authentication, Cloud Firestore, Storage, and Cloud Messaging. The public portion includes Home, About, Ministries, Blog, and Contact pages, plus a role-based events calendar and an admin panel for managing content and user roles.

The permission model defines five roles: Pastor, Co-admin, Encargado (ministry leader), Ministry member, and Public. Role checks are written into Firestore security rules and enforced server-side, rather than merely hiding entry points in the frontend. Much of the site copy (hero text, About page paragraphs, ministry descriptions, etc.) can be edited directly in the in-app admin mode, so many customizations require no code changes.

All [square brackets] in the template are intentional placeholders that need to be replaced with the user's church information. The repository does not include some assets such as the logo; the README points to SETUP.md for environment configuration and customization instructions. The same codebase can be packaged as an iOS/Android app via Capacitor, and an optional Cloud Function is provided for connecting the church's Facebook/Instagram accounts.

ViteReactAdmin panel

Is it right for your project?

Use Cases

  • A church needs a public website with content management and an events calendar
  • Access needs to be differentiated among pastors, admins, ministry leaders, members, and visitors
  • The website and mobile app should share the same codebase
  • Site copy needs to be modified directly from within the app without code changes

Suitable For

  • Developers with Firebase configuration experience
  • Churches or religious organizations that need a role-based calendar and admin panel
  • Teams that want to build on React and TypeScript for further development

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Complete environment configuration according to SETUP.md, and prepare assets not included in the repository, such as the logo

  2. 2

    You must create and configure a Firebase project, enabling Authentication, Firestore, Storage, and Cloud Messaging

  3. 3

    Replace all [square bracket] placeholders in the template with actual church information

  4. 4

    Before enabling Facebook/Instagram integration, deploy and configure the optional Cloud Function

  5. 5

    Before use, check Firebase quotas and billing, as well as the licenses for third-party assets such as demo images, fonts, and icons

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version under the MIT license in the public repository; the free scope applies to that version's code and does not mean external services or third-party assets are free.

Must comply with when using

  • You may use, modify, commercialize, and distribute this version's code for free.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Facebook/Instagram integration is optional and requires deploying and configuring a Cloud Function, and depends on external accounts and OAuth credentials.
  • The repository intentionally does not include assets such as the logo; you need to prepare these resources before use.
  • Running it requires creating and configuring your own Firebase project and enabling the above services, which may incur Firebase usage fees.
  • The README mentions Firebase integration; before enabling related dynamic features, you must configure it yourself and check Firebase quotas and billing.
  • Demo images, fonts, icons, and other third-party assets must be checked against their respective licenses; the code's MIT license alone is not sufficient to determine this.
  • External services such as domains, hosting, databases, payments, or AI may incur separate charges.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

an optional Cloud Function for connecting a church's Facebook/Instagram account

Original README

a couple of things that were intentionally left out of this repo (like logo images)

Original README

Firebase Authentication, Cloud Firestore, Storage, Cloud Messaging

Original README
https://github.com/amy14rubio/church-website-template/blob/main/LICENSEhttps://github.com/amy14rubio/church-website-template/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-09-30. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 85 / 100
Technologies
Vite · React
Website type
Admin dashboard
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2026-09-09
Screenshot last checked
2026-09-30

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Vite as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Automatically checked against source and license rules; no manual editorial review.

Inspect the recorded source material

SHA-256: 10f0ac8e53c659f25edeeda58f1514f62a6cafb81f305ad371818e6b925f77ee

2026-09-30T09:00:43.177Z

Source file / repository
# Church Website Template

A full-stack website I originally built for my own church, pulled apart into a genericized
template so other developers — or churches without a website at all — can start from something
real instead of a blank repo. It includes a public site (home, about, ministries, blog, contact),
a role-based event calendar, and an admin panel for managing content and user roles.

Everywhere you see a `[bracket]`, that's on purpose — it's a placeholder that still needs your
own church's information before this looks like a real site, not something left over by mistake.


## What's Inside

Five roles — Pastor, Co-admin, Encargado (ministry leader), Ministry member, and Public — are
enforced server-side in Firestore's own security rules, not just hidden in the UI. Most of the
site's copy (hero text, about-page paragraphs, ministry descriptions) is also editable live from
an in-app admin mode, so a good chunk of customizing this for a real church doesn't require
touching code at all. The same codebase wraps with Capacitor into an iOS/Android app, and there's
an optional Cloud Function for connecting a church's Facebook/Instagram account.


## See It In Action

[Live example](https://comunidadcristianalapalabradefe.com) — a real church site built on this template

To run this yourself, see [SETUP.md](SETUP.md) — it covers environment setup, a couple of things
that were intentionally left out of this repo (like logo images), and how to customize it for
your own church.


## Tech Stack

**Frontend:** React, TypeScript, Vite, Tailwind CSS, React Router <br>
**Backend:** Firebase Authentication, Cloud Firestore, Storage, Cloud Messaging <br>
**Mobile:** Capacitor (iOS/Android) <br>
**Optional:** Cloud Functions (Facebook/Instagram OAuth) <br>
**Development Tools:** Git, Firebase CLI


## License

MIT © [Amyruth Rubio](https://github.com/amy14rubio) — see [LICENSE](LICENSE).
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

kiaalap

kiaalap

Kiaalap is a free, open-source admin template from Colorlib for education, online courses, and school management.

Vite · Admin dashboard

react-vite-admin

react-vite-admin

A backend management starter built on Vite and React, integrating Recoil, React Query, TypeScript, and Axios, with Ant Design-style interface screenshots. Suitable as a starting point for management-side projects, licensed under MIT, with Chinese documentation and common scripts.

Vite · Admin dashboard

admin-antd-react

admin-antd-react

A Vite + React 18 admin template using Ant Design and Recoil, with login, logout, and registration flows; page, button, and permission configuration verification; internationalization; dynamic sidebar and breadcrumbs; Svg Sprite icons; Mock data; and list, form, and detail page examples.

Vite · Admin dashboard

arco-admin-template

arco-admin-template

A Vite + React mid-to-back-office template using Arco Design, react-router-dom v6, mockjs, and less, with internationalization, theme customization, and light/dark switching. Includes login, dashboard, resource, component examples, settings, and 404 pages.

Vite · Admin dashboard

super-admin

super-admin

A React, Vite, and Antd admin template that implements multi-tab route caching similar to Vue keepalive and route-based permission control.

Vite · Admin dashboard

react-vite-tailwind-typescript-firebase-auth-template

react-vite-tailwind-typescript-firebase-auth-template

A starter template for backend applications using Vite, React, TypeScript, TailwindCSS, and Firebase Auth, featuring login and dashboard interfaces. Requires your own Firebase project and credentials in .env; no backend logic included.

Vite · Admin dashboard