# BudgetBasics | أساسيات الميزانية

A free, bilingual (English/Arabic) educational single-page website that helps students learn personal budgeting fundamentals: the 50-30-20 rule, needs vs. wants, savings goals, an expense planner, common money mistakes, and an AI-style Q&A assistant.

Highlights

• Single HTML file — no build step, no backend, no database
• Full English/Arabic toggle with automatic RTL layout switch
• Light/dark mode (respects system preference, remembers your choice)
• 50-30-20 donut-chart calculator with PNG export
• Interactive needs-vs-wants quiz, savings-goal calculator, expense planner
• Simple rule-based chatbot, searchable tips library, achievement badges
• Accessible: keyboard-navigable, visible focus states, labeled form fields

Run it

Just open index.html in any modern browser — no installation needed.

Host it free with GitHub Pages

1. Push this repo to GitHub.
2. Go to Settings → Pages.
3. Under "Build and deployment", choose Deploy from a branch, select main and /root, then Save.
4. Your site will be live at https://<your-username>.github.io/<repo-name>/ within a minute or two.

Credits

Designed & developed by Eng. Nagi Alshaikh.

Disclaimer

BudgetBasics is an educational demo. It does not provide banking services, process real transactions, or store any personal financial data — all calculations happen locally in your browser.