Logo Lanfrica

emojiking254/RuralGlow

Domain:

education
Creator:
emo
Host:
a learning platform designed for students in rural areas of Africa (especially Kenya) who have limited access to traditional schools. # RuralGlow a learning platform designed for students in rural areas of Africa (especially Kenya) who have limited access to traditional schools. ## πŸ› οΈ Installation 1. Install dependencies: ```bash npm install # or yarn install ``` 2. Start the development server: ```bash npm start # or yarn start ``` ## πŸ“ Project Structure ``` react_app/ β”œβ”€β”€ public/ # Static assets β”œβ”€β”€ src/ β”‚ β”œβ”€β”€ components/ # Reusable UI components β”‚ β”œβ”€β”€ pages/ # Page components β”‚ β”œβ”€β”€ styles/ # Global styles and Tailwind configuration β”‚ β”œβ”€β”€ App.jsx # Main application component β”‚ β”œβ”€β”€ Routes.jsx # Application routes β”‚ └── index.jsx # Application entry point β”œβ”€β”€ .env # Environment variables β”œβ”€β”€ index.html # HTML template β”œβ”€β”€ package.json # Project dependencies and scripts β”œβ”€β”€ tailwind.config.js # Tailwind CSS configuration └── vite.config.js # Vite configuration ``` ## 🧩 Adding Routes To add new routes to the application, update the `Routes.jsx` file: ```jsx import { useRoutes } from "react-router-dom"; import HomePage from "pages/HomePage"; import AboutPage from "pages/AboutPage"; const ProjectRoutes = () => { let element = useRoutes([ { path: "/", element: }, { path: "/about", element: }, // Add more routes as needed ]); return element; }; ``` ## 🎨 Styling This project uses Tailwind CSS for styling. The configuration includes: - Forms plugin for form styling - Typography plugin for text styling - Aspect ratio plugin for responsive elements - Container queries for component-specific responsive design - Fluid typography for responsive text - Animation utilities ## πŸ“± Responsive Design The app is built with responsive design using Tailwind CSS breakpoints. ## πŸ“¦ Deployment Build the application for production: ```bash npm run build ```