A modern web platform for Digital Dino, a UK-based design studio specializing in web design, engineering, and digital marketing solutions.
- 🎨 Modern UI with horizontal scrolling landing page
- 🦖 Fossil Files - Tech stack knowledge base
- 📧 Email integration with custom templates
- 🎯 Marketing and analytics integration
- 💼 Project portfolio showcase
- 📱 Responsive design across devices
- Framework: Next.js 14 with App Router
- Styling: Tailwind CSS
- Animations:
- Framer Motion
- GSAP for scroll animations
- Email: React Email & Postmark
- Analytics: PostHog & OpenPanel
- Search: Algolia
- Forms: React Hook Form with Zod validation
- UI Components: Radix UI primitives
- Fonts: Custom font implementation (Nanum Myeongjo & Karla)
First, run the development server: bash npm run dev or yarn dev or pnpm dev or bun dev
Open http://localhost:3000 with your browser to see the result.
src/ ├── app/ │ ├── company/ # Company related pages │ ├── services/ # Service pages │ │ ├── design/ # Design services │ │ ├── engineer/ # Engineering services │ │ └── market/ # Marketing services │ ├── fossil-files/ # Tech stack documentation │ └── work/ # Portfolio section ├── components/ │ ├── landing-page/ # Landing page components │ ├── emails/ # Email templates │ └── ui/ # Reusable UI components ├── lib/ # Utilities and configurations │ ├── fonts.ts # Font configurations │ └── utils.ts # Helper functions └── styles/ # Global styles and Tailwind config
- Horizontal scrolling experience
- Animated sections with GSAP
- Interactive service showcases
- Dynamic content loading
- Responsive design elements
- Comprehensive tech stack documentation
- Interactive category navigation
- Detailed tool information
- Algolia-powered search functionality
- Real-time filtering
- Custom email templates using React Email
- Postmark integration for reliable delivery
- Automated responses
- HTML and plain text versions
- Template preview functionality
- PostHog integration for user behavior tracking
- OpenPanel for detailed analytics
- Custom event tracking
- User journey mapping
- Performance monitoring
Create a .env.local file with the following variables:
env Analytics NEXT_PUBLIC_POSTHOG_KEY=your_posthog_key NEXT_PUBLIC_POSTHOG_HOST=your_posthog_host Email POSTMARK_API_TOKEN=your_postmark_token POSTMARK_FROM_EMAIL=your_from_email Search NEXT_PUBLIC_ALGOLIA_APP_ID=your_algolia_app_id NEXT_PUBLIC_ALGOLIA_SEARCH_KEY=your_algolia_search_key ALGOLIA_ADMIN_KEY=your_algolia_admin_key OpenPanel NEXT_PUBLIC_OPENPANEL_CLIENT_ID=your_openpanel_client_id
bash Install dependencies npm install Run development server npm run dev Build for production npm run build Start production server npm run start Run linting npm run lint
The project is optimized for deployment on Vercel. For other platforms, ensure:
- Node.js 18.x or higher
- Support for Edge Runtime
- Environment variables configuration
- Build output handling
- API routes support
- Image optimization with Next.js Image component
- Font optimization with next/font
- Code splitting and lazy loading
- Static page generation where possible
- Edge runtime for API routes
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Mobile browsers (iOS/Android)
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is private and proprietary to Digital Dino.
- Website: thedigitaldino.com
- Location: London, UK (51.5072° N, 0.1276° W)
- Email: [email protected]
- Next.js team for the amazing framework
- Vercel for hosting and deployment
- All open-source contributors
Built with 🦖 by Digital Dino