"Lesson Plan Generator" is a web-based platform for educators to create, manage, and print lesson plans in Arabic. It supports multiple subjects, dynamic form handling, and modern styling using Tailwind CSS and custom styles. The system is modular, easy to maintain, and designed for RTL (right-to-left) content.
This project is designed to be a simple and efficient tool for teachers to generate lesson plans for various subjects in Islamic studies (Islamiyyaat). The application is entirely client-side.
- Dynamic Lesson Plan Generation: Easily generate lesson plans for multiple subjects.
- RTL Arabic Support: The entire interface is designed for right-to-left languages like Arabic.
- Modern Styling: The application uses Tailwind CSS for a clean and modern look and feel.
- Print-Friendly: The generated lesson plans are optimized for printing.
- Modular and Extensible: The project has a modular structure that makes it easy to add new subjects or modify existing ones.
- Client-Side: The application is fully client-side, requiring no backend or database, so make sure to save your documents locally.
- Clone the repository:
git clone https://github.com/your-username/Lesson-Plan.git
- Open
index.html
: Navigate to the project directory and open theindex.html
file in your web browser. - Enter your name: You will be prompted to enter your name, which will be displayed on the main page.
- Select a subject: Click on one of the subject buttons to open the lesson plan form for that subject.
- Fill out the form: Fill out the lesson plan form with the required information.
- Generate the lesson plan: Click the "submit" button to generate the lesson plan. The lesson plan will be displayed on a new page, ready to be printed.
Lesson-Plan/
├── 404.html
├── index.html
├── README.md
├── workspace.code-workspace
├── assets/
│ └── logo.png
├── pages/
│ ├── adhkar/
│ │ ├── adhkar.html
│ │ ├── adhkarformhandle.html
│ │ ├── adhkarformhandler.js
│ │ └── adhkarformlogic.js
│ ├── arabic/
│ │ ├── arabic.html
│ │ ├── arabicformhandle.html
│ │ ├── arabicformhandler.js
│ │ └── arabicformlogic.js
│ ├── fiqh/
│ │ ├── fiqh.html
│ │ ├── fiqhformhandle.html
│ │ ├── fiqhformhandler.js
│ │ └── fiqhformlogic.js
│ ├── hadith/
│ │ ├── hadith.html
│ │ ├── hadithformhandle.html
│ │ ├── hadithformhandler.js
│ │ └── hadithformlogic.js
│ ├── huroof/
│ │ ├── huroof.html
│ │ ├── huroofformhandle.html
│ │ ├── huroofformhandler.js
│ │ └── huroofformlogic.js
│ ├── new_template/
│ │ ├── new_template.html
│ │ ├── new_templateformhandle.html
│ │ ├── new_templateformhandler.js
│ │ └── new_templateformlogic.js
│ ├── quran/
│ │ ├── formhandle.html
│ │ ├── formhandler.js
│ │ ├── formlogic.js
│ │ └── quran.html
│ ├── seerah/
│ │ ├── seerah.html
│ │ ├── seerahformhandle.html
│ │ ├── seerahformhandler.js
│ │ └── seerahformlogic.js
│ ├── tajweed/
│ │ ├── tajweed.html
│ │ ├── tajweedformhandle.html
│ │ ├── tajweedformhandler.js
│ │ └── tajweedformlogic.js
│ └── tawheed/
│ ├── tawheed.html
│ ├── tawheedformhandle.html
│ ├── tawheedformhandler.js
│ └── tawheedformlogic.js
├── script/
│ └── select-sub.js
└── style/
└── styleit.css
- HTML5
- CSS3
- Tailwind CSS
- JavaScript
This project is licensed under the MIT License.