FAQ

Common questions about the AI-Powered Travel Planner template.

🧱 General

Q: Does the template include a backend?
A: No — this is a frontend-only React + TypeScript template.
It includes mock data (hotels, flights, user info) so you can test UI instantly.
You can later connect any backend, API, or database.

Q: What technologies are used?
A: The template uses React 18, Vite, Tailwind CSS 4.1, shadcn/ui (Radix-based components), CVA, Valtio, and React Router v7.

Q: Is it responsive?
A: Yes. Every layout and component adapts to mobile, tablet, and desktop out of the box.

🎨 Theming

Q: How can I change colors or theme?
A: Update CSS variables in index.css under :root and .dark.
Use useTheme() or wrap your app with ThemeProvider to toggle between Light / Dark modes.

Q: Can I add custom fonts?
A: Yes. Import them in index.css or include a Google Fonts URL, then assign with font-family or .font-second.

🤖 AI Integration

Q: Can I connect OpenAI, Gemini, or any LLM API?
A: Yes. Replace the internal request logic in your ChatProvider or create a new /api/chat route.
On each streamed token or full response, call addMessage() to display assistant replies in real-time.

Q: Is the chat system functional out of the box?
A: It’s UI-ready with typing animation and context state.
You just need to attach your API call to make it live.

⚙️ Development

Q: How do I add new routes or pages?
A: Register them in src/routes/index.tsx using React Router v7, and create the matching component under src/pages/.

Q: Can I rename folders or move files?
A: Yes — just update the import paths. The project uses Vite aliases (@ → /src) for clean references.

Q: How do I start the project?
A:

yarn
yarn dev

Visit http://localhost:5173 

🚀 Deployment

Q: Can I host it on Vercel or Netlify? A: Absolutely. It’s a static build. Run yarn build, set output folder to dist/, and deploy.

Q: Can I use it inside my SaaS or dashboard? A: Yes — the UI is modular and can be integrated into any existing React or Next.js project.

💬 Licensing & Customization

Q: Can I use it for commercial projects? A: Yes — according to the ThemeForest license you purchased (Regular / Extended).

Q: Can I modify or remove sections? A: Of course. All components are open and written in TypeScript for easy refactoring.

Didn’t find your answer?

Check the documentation or contact support through your ThemeForest download page.