AllTrip is a modern travel agency application designed to provide a seamless and engaging user experience. Built with Next.js and Tailwind CSS, it offers a robust platform for showcasing travel destinations, itineraries, and packages.
- Framework: Next.js
- Language: TypeScript
- Styling: Tailwind CSS, PostCSS
- UI Components: Shadcn/ui, Radix UI
- State & Logic: React hooks,
react-hook-formfor forms,zodfor validation - UI/UX Enhancements:
lenisfor smooth scrolling,framer-motionfor animations,rechartsfor data visualization,lottie-reactfor Lottie animations - Performance & SEO:
@vercel/analytics,@vercel/speed-insights, custom service worker, and dynamic SEO functions
Follow these steps to set up the project locally.
- Node.js (version 18 or newer)
- npm or Yarn
- Clone the repository:
git clone [your-repository-url]
- Navigate to the project directory:
cd alltrip - Install dependencies:
npm install # or yarn install
Start the development server with:
npm run dev
# or
yarn dev
Open your browser and visit http://localhost:3000 to see the application.After the dev server is running, open the site at http://localhost:3000 and perform a quick accessibility and performance check:
- Open Chrome DevTools (F12) → Lighthouse. Run audits for Mobile and Desktop to get Performance, Accessibility, Best Practices, and SEO scores.
- Keyboard test: press
Tabto navigate through interactive elements. Use the skip link (press Tab from top) to jump to main content. - Reduced motion: toggle OS-level
prefers-reduced-motionto verify Lottie and motion-reduced fallbacks are respected.
Recommended commands:
cd 'd:\New folder\AllTripp\AllTrip'
npm install
npm run dev
# Then open http://localhost:3000 in Chrome and run LighthouseContribution We welcome contributions! Feel free to open an issue or submit a pull request.
License This project is open-sourced under the MIT License.