A lightning-fast, customizable PDF generator for Assignment and Lab Report front pages, built using HTML, CSS, and JavaScript—no frameworks, no bundlers.
🔗 Live Demo: Front Page Generator
- 📄 Multiple templates (Assignment & Lab Report)
- 🖊️ Customize name, subject, roll number, department, faculty and more
- 📦 Real-time preview
- 🧾 One-click PDF download
- 📱 Fully mobile-responsive
- ⚡ Optimized for PageSpeed & Core Web Vitals
- 🎯 Vanilla JS — no React/Vite
| Tech | Purpose |
|---|---|
| HTML5 | Markup and structure |
| CSS3 | Styling and layout |
| JavaScript | DOM logic and interactivity |
| jsPDF | PDF generation |
| pdf-lib | Precise PDF text/image manipulation |
| GitHub Pages | Free hosting and deployment |
Front-Page-Generator/
├── App_favicon.png # Website favicon
├── Contents.pdf # Sample output or reference
├── LICENSE # Open source license
├── README.md # This readme file
├── Script_Assignment.js # JS logic for assignment template
├── Script_LabReport.js # JS logic for lab report template
├── cartographer.avif # Background image
├── index.html # Main template (UI)
├── index2.html # Alternate template
└── style.css # All CSS styling
-
Clone the repository
git clone https://github.com/Gitanaskhan26/Front-Page-Generator.git
-
Navigate to the project directory
cd Front-Page-Generator -
Open in your browser
# Simply open index.html in your preferred browser # Or use a local server like Live Server in VS Code
-
Start generating front pages!
- Fill in your details (name, subject, roll number, etc.)
- Choose between Assignment or Lab Report template
- Preview in real-time
- Download as PDF with one click
- jsPDF GitHub Repository
- pdf-lib Documentation
- PageSpeed Insights
- Web.dev: Core Web Vitals
- MDN Web Docs: JavaScript, CSS, HTML references
We welcome contributions! If you'd like to improve the UI, add new templates, or enhance features:
- Fork the repository
- Create a feature branch
git checkout -b feature/amazing-feature
- Make your changes
- Commit your changes
git commit -m 'Add some amazing feature' - Push to the branch
git push origin feature/amazing-feature
- Open a Pull Request
- Follow existing code style and formatting
- Test your changes thoroughly
- Update documentation if needed
- Add screenshots for UI changes
Found a bug or have a feature request? Please check our Issues page first to see if it's already reported.
To report a new issue:
- Go to the Issues tab
- Click "New Issue"
- Provide a clear description and steps to reproduce
This project is licensed under the MIT License. See the LICENSE file for details.
If this project helped you, please consider giving it a ⭐ on GitHub! It helps others discover the project and motivates us to keep improving it.
- Additional template designs
- Custom logo upload support
- Integration with IUSMS & Other LMS platforms
- Theme customization options