Islamic Roots Academy

Empowering Minds, Enriching Souls

---

A premium digital gateway for Islamic Roots Academy, connecting students worldwide with authentic Quranic studies and comprehensive Islamic education through a modern, spiritually focused platform.
Features • Tech Stack • Getting Started • Architecture

🌟 Overview

Islamic Roots Academy provides a high-end digital experience for seekers of knowledge. From foundational Arabic to advanced Tajweed and Seerah, the platform serves as a trusted companion in every student's spiritual journey, combining traditional scholarship with cutting-edge web technology.

---

✨ Features

• 🕌 Spiritual Hub: A tranquil and inspiring landing page that guides students toward learning.
• 📖 Quranic Excellence: Specialized sections for Quran memorization, recitation, and understanding.
• 🎓 Comprehensive Curriculum: Structured courses covering Fiqh, Seerah, and Islamic History.
• 📝 Educational Resources: A curated blog and library of articles for continuous growth.
• 📱 Fluid Responsive UI: Seamlessly optimized for mobile, tablet, and desktop learning environments.
• 📩 Secure Communication: Integrated hCaptcha protection for all contact and registration forms.
• ⚡ Performance First: Built with the latest Angular 21 for blazing-fast navigation and interaction.

---

🛠 Tech Stack

• Framework: Angular 21 (Standalone Architecture, Zoneless Change Detection)
• Styling: Tailwind CSS (Custom Brand Palette, Prose Plugins)
• Deployment & Hosting: Firebase
• Forms & Security: ng-hcaptcha & Web3Forms
• Build Tool: Esbuild / Vite (via Angular Application Builder)

---

🚀 Getting Started

To get a local copy up and running, follow these simple steps.

Prerequisites

• Node.js: v20.x or higher
• npm: v10.x or higher

Installation

1. Clone the repository

   git clone https://github.com/Abdullah-k0de/Islamic-Roots-Academy-Website.git
   cd Islamic-Roots-Academy-Website

2. Setup Environment

   cp .env.example .env
   # Edit .env and add your hCaptcha and Web3Forms keys

3. Install dependencies

   npm install

4. Start the development server

   npm run dev

5. Open your browser Navigate to http://localhost:3000 to see the application in action.

---

📂 Project Structure

Islamic-Roots-Academy-Website/
├── src/
│   ├── assets/               # Branding, images, and static resources
│   └── components/           # Standalone Page & UI components
├── app.component.ts          # Root application architecture
├── index.tsx                 # Application bootstrap & routing
├── index.html                # Main entry point & global metadata
├── angular.json              # Angular build & project configuration
├── firebase.json             # Firebase deployment settings
├── tailwind.config.js        # Custom theme & color definitions
├── tsconfig.json             # TypeScript rules & path mappings
└── package.json              # Versioning & dependency management

---

☁️ Deployment

The project is pre-configured for Firebase Hosting.

# Production Build
npm run build

# Deploy to Firebase
firebase deploy

---

📄 License

🔒 PROPRIETARY AND CONFIDENTIAL

This project and its original assets are the exclusive property of Islamic Roots Academy. All rights reserved. Unauthorized use, reproduction, or distribution is strictly prohibited. See the LICENSE file for the full legal terms.

---

Built with Imaan for IslamicRootsAcademy.com by Abdullah