Welcome to Fox Island, a whimsical and fantastical digital world where curious foxes roam and playful adventures unfold.
This is a React application which uses three.js to render a 3D sland with foxes. The user can interact with the island by dragging it causing it to rotate and clicking on the popups as they appear to visit the respective pages.
Demo.mp4
-
🚀 React & Three.js: The application is built with React and Three.js, providing a robust and efficient user experience.
-
🦊 Interactive 3D Fox Island: Users can interact with the 3D island by dragging it to rotate and clicking on popups to visit respective pages.
-
🔍 Fox Facts: Discover interesting facts about foxes and their behaviors.
-
📝 Contact Form: A dynamic contact form powered by EmailJS. Watch as the fox model reacts to your typing and starts running when you successfully submit the form!
-
📱 Responsive Design: The application is fully responsive and works seamlessly across all devices and screen sizes.
To run Fox Island locally, follow these steps:
- Clone the repository
- Navigate to the project directory:
cd fox-island - Install dependencies:
npm install - Start the development server:
npm run dev - Open http://localhost:3000 with your browser to see the result.
- Create a
.env.localfile in the root directory and add the following environment variables:
VITE_EMAILJS_SERVICE_ID=
VITE_EMAILJS_TEMPLATE_ID=
VITE_EMAILJS_PUBLIC_KEY=
- Create a EmailJS account and add the service ID, template ID and public key to the
.env.localfile.