An immersive underwater portfolio built with React, TypeScript and Vite.
Explore the ocean through cinematic scrolling, marine life identification and underwater storytelling.
DivingBook is an immersive web experience inspired by modern editorial websites and interactive documentaries.
The project combines cinematic scrolling, smooth animations and underwater storytelling to showcase diving adventures, marine biodiversity and ocean conservation.
Everything is built with a modern React architecture and optimized for a fluid browsing experience.
- Cinematic scrolling experience
- Marine species encyclopedia
- Underwater photography gallery
- Dive spot explorer
- Personal diving logbook
- Immersive background videos
- Smooth animations
- Responsive design
- Fast loading with Vite
| Technology | Usage |
|---|---|
| React | Frontend |
| TypeScript | Main language |
| Vite | Build tool |
| CSS3 | Styling |
| Tailwind CSS | Utility-first styling |
| Framer Motion | Animations |
| Radix UI | Accessible UI components |
git clone https://github.com/EnzoSCH1/Portfolio_DivingBook.git
cd Portfolio_DivingBook
npm install
npm run devOpen
http://localhost:5173
src
├── components
├── pages
├── hooks
├── assets
├── styles
└── lib
public
├── images
├── videos
└── icons
- Hero cinematic section
- Ocean storytelling
- Responsive layout
- Marine life pages
- Interactive world dive map
- Advanced search
- Favorites system
- Progressive Web App
- Multi-language support
- Language: TypeScript (95.1%)
- CSS: 3.9%
- Framework: React
- Build Tool: Vite
Contributions are welcome.
Feel free to open an Issue or submit a Pull Request.
Made with ❤️ by Enzo SCH
"Every dive has a story."
"La mer commence ici. Protégeons-la ensemble."