This interactive documentary bears witness to the ongoing humanitarian catastrophe in Gaza. It is a digital memorial, a call to consciousness, and a platform for voices that the world must not ignore.
Gaza, home to over 2 million people, has endured a severe humanitarian crisis. The blockade, ongoing conflict, and destruction have created one of the most pressing humanitarian emergencies of our time.
The Human Cost:
- Over 50,000 lives lost, with 75% being children and women
- 2 million people displaced from their homes
- 70% of infrastructure destroyed, including hospitals, schools, and homes
- Families torn apart, generations traumatized
- A population denied basic human rights: freedom of movement, access to clean water, medical care, and education
This is not just about numbers—each statistic represents a human being with dreams, families, and aspirations. Mothers, fathers, children, teachers, doctors, artists. People who deserve to live in peace and dignity.
This interactive documentary takes you through the reality of Gaza with:
An immersive hero section that introduces you to the spirit of Gaza—a people who, despite unimaginable hardship, continue to hope, to resist, and to dream of freedom.
Animated statistics that reveal the devastating toll of the conflict. These numbers represent real lives, real families, real futures cut short.
A chronological journey through key moments that have shaped Gaza's recent history, helping you understand how we arrived at this crisis.
First-hand accounts from people living through the crisis. Their stories put faces and voices to the statistics, reminding us of the humanity at the heart of this tragedy.
Visual stories exploring symbols like the olive tree—ancient, rooted, resilient—that represent Palestinian identity and the unbreakable spirit of a people who refuse to be erased.
Information and resources for those who wish to stand in solidarity with Gaza, raise awareness, or support humanitarian efforts.
"They tried to bury us. They didn't know we were seeds." - Palestinian Proverb
This website exists because:
- Silence is complicity. The world must know what is happening.
- Every life matters. Behind every number is a human story that deserves to be told.
- History is watching. How we respond to this crisis will define our collective humanity.
- Hope persists. Even in the darkest times, the resilience of the Palestinian people shines through.
We invite you to witness, to learn, to feel, and to act. This is not just Gaza's story—it is a test of our shared humanity.
- React 18 - Modern UI library
- TypeScript - Type-safe development
- Vite - Lightning-fast build tool
- Tailwind CSS - Utility-first styling
- shadcn/ui - Beautiful, accessible component library
- GSAP - Professional-grade animation library with ScrollTrigger
- React Router - Client-side routing
- Lucide React - Modern icon system
- Node.js (v18 or higher)
- npm or bun
# Clone the repository
git clone <YOUR_GIT_URL>
# Navigate to project directory
cd <YOUR_PROJECT_NAME>
# Install dependencies
npm install
# Start development server
npm run devThe application will be available at http://localhost:8080
- Open your Lovable Project
- Click the Publish button in the top right
- Follow the deployment steps
# Build for production
npm run build
# Preview production build
npm run previewThe build output will be in the dist directory, ready to deploy to any static hosting service.
src/
├── components/ # Reusable UI components
│ ├── ui/ # shadcn/ui components
│ ├── Hero.tsx # Hero section with parallax
│ ├── Statistics.tsx # Animated statistics
│ ├── Timeline.tsx # Event timeline
│ ├── Testimonials.tsx # User testimonials
│ ├── Gallery.tsx # Image gallery
│ └── CallToAction.tsx # CTA section
├── pages/ # Page components
│ ├── Index.tsx # Main landing page
│ └── NotFound.tsx # 404 page
├── assets/ # Images and static files
├── hooks/ # Custom React hooks
├── lib/ # Utility functions
├── App.tsx # Main app component
├── main.tsx # App entry point
└── index.css # Global styles & design tokens
The project uses a semantic design system defined in:
src/index.css- CSS custom properties for colors, gradients, shadowstailwind.config.ts- Tailwind theme extensions
All components use semantic tokens (e.g., primary, secondary, muted) for consistent theming.
npm run dev # Start development server
npm run build # Build for production
npm run preview # Preview production build
npm run lint # Run ESLint- Components use TypeScript with strict typing
- Functional components with hooks
- Tailwind CSS for styling (no custom CSS classes)
- GSAP for animations with proper cleanup
- Semantic HTML for accessibility
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
This project is part of the Gaza Voices initiative to raise awareness about the humanitarian situation in Gaza.
This is a humanitarian documentation project. If you'd like to contribute or have suggestions, please reach out through the project's official channels.
For technical issues or questions about the project:
- Visit Lovable Documentation
- Join the Lovable Discord Community
This project is dedicated to:
- Every life lost in Gaza—may their memory be a blessing and a call to action
- The survivors who continue to show the world what resilience truly means
- The journalists, aid workers, and activists risking everything to tell the truth
- Everyone around the world standing in solidarity with Palestine
If you've scrolled through this website, you've witnessed only a fraction of Gaza's reality. The real experience is lived every day by 2 million people who deserve freedom, dignity, and peace.
Don't let this be just another website you visit and forget. Let it move you to:
- Learn more about the history and current situation
- Share these stories with your community
- Speak up against injustice wherever you are
- Support humanitarian organizations working in Gaza
- Remember that every human life has equal worth
The people of Gaza are not asking for pity—they are demanding justice, freedom, and the right to live as equals in their homeland.
For developers who wish to contribute or deploy this project:
- React 18, TypeScript, Vite
- Tailwind CSS, shadcn/ui components
- GSAP for scroll-driven animations
- React Router for navigation
git clone <YOUR_GIT_URL>
cd <YOUR_PROJECT_NAME>
npm install
npm run devVisit http://localhost:8080 to view locally.
For full technical documentation, deployment instructions, and contribution guidelines, see the Lovable Documentation.
"We teach life, sir." - Refaat Alareer, Palestinian poet and educator
This project is not neutral. It stands with the oppressed, the displaced, and those fighting for their fundamental human rights. Free Palestine. 🇵🇸