To check the status of the servers (Frontend server and Backend server) - Click here
New to contributing? We've made it super easy to get started with mock data!
-
Clone and install:
git clone https://github.com/Sahilll94/Travel-Book.git cd Travel-Book npm install -
Set up environment:
cp .env.example .env # The default settings in .env.example enable mock mode -
Start developing:
npm run dev
-
Login with any credentials:
- Email: Any valid email format
- Password: Any password
- That's it! All features work with realistic mock data.
Read the full contributor guide →
Travel Book includes a comprehensive mock data system so contributors can test all features without needing backend access:
- Authentication: Login/signup with any credentials
- Travel Stories: Pre-loaded sample stories with realistic content
- Profile Management: Complete user profile functionality
- Image Upload: Mock image uploads with beautiful placeholders
- Search & Filters: Full search functionality
- Analytics: Sample travel statistics and charts
- Social Login: Mock Google, GitHub, and Twitter authentication
Perfect for UI/UX improvements, component development, and feature testing!
Travel Book is a modern web application designed to help users document, organize, and share their travel experiences. It serves as a digital travel journal where users can record memories, photos, and details about places they've visited. The platform provides a user-friendly interface for travelers to create a personal collection of travel stories, organize them by location and date, and optionally share them with others.
The primary purpose of Travel Book is to give travelers a dedicated space to preserve their travel memories in a structured and visually appealing way. Rather than having travel photos scattered across different devices or social media platforms, Travel Book centralizes these experiences into a cohesive travel journal that can be accessed from anywhere.
Key goals of the platform include:
- Providing an intuitive way to document travel experiences
- Creating a searchable repository of personal travel memories
- Offering data visualization of travel patterns and statistics
- Supporting offline access for users on the go
- Delivering a responsive experience across all devices
- Framework: React.js
- Styling: Tailwind CSS with custom components
- State Management: React Context API and local state
- Animations: Framer Motion
- Routing: React Router
- UI Components: Custom components with responsive design
- Offline Support: PWA (Progressive Web App) capabilities with service workers
- Data Visualization: Custom analytics with dynamic charts
- Runtime: Node.js
- Framework: Express.js
- Database: MongoDB
- Authentication: JWT (JSON Web Tokens)
- File Storage: Local storage with Multer (could be extended to cloud storage)
- API: RESTful API design
- Build Tool: Vite
- Deployment: Vercel
- Version Control: Git
- Package Management: npm
- Email/password registration and login
- OTP verification for secure access
- Password reset functionality
- JWT-based authentication
- Create, read, update, and delete travel stories
- Rich text editing for story content
- Image upload and management
- Location tagging with map integration
- Date tracking for visits
- Favorite marking for important memories
- Search functionality by title, content, or location
- Filter stories by date range
- Sort stories by various criteria (newest, oldest, A-Z, etc.)
- Categorize stories as favorites
- View recent trips at a glance
- Dark/light mode toggle with system preference detection
- Responsive design for all device sizes
- Smooth animations and transitions
- Swipe gestures on mobile devices
- Drag and drop interface for image uploads
- Progressive Web App (PWA) implementation
- Offline access to previously viewed stories
- IndexedDB storage for offline data
- Background sync for changes made offline
- Installable on mobile home screens
- Visual representation of travel statistics
- Location frequency analysis
- Travel timeline visualization
- Monthly/yearly travel patterns
- Direct link sharing for stories
- Social media integration (Facebook, Twitter, WhatsApp, etc.)
- Customizable sharing messages
-
Onboarding:
- User lands on the hero page with information about the platform
- User registers or logs in through the authentication system
- New users are welcomed with an introduction to the platform features
-
Core Experience:
- Users can view their collection of travel stories on the home page
- Adding a new story walks users through a step-by-step process:
- Title and basic information
- Date selection
- Image upload
- Story content entry
- Location tagging
- Existing stories can be viewed, edited, or deleted
- Stories can be marked as favorites for quick access
-
Discovery & Organization:
- Users can search for specific stories using the search functionality
- Advanced filtering lets users narrow down stories by date or location
- The calendar view provides a temporal perspective on travels
- Analytics section offers insights into travel patterns
-
Sharing & Exporting:
- Stories can be shared via multiple social platforms or direct links
- (Future feature) Export functionality for backup or printing options
Travel Book is designed with a mobile-first approach, recognizing that many users will document their travels while on the go:
- Touch-optimized interfaces with appropriate sizing for tap targets
- Swipe gestures for navigation between views
- Responsive layouts that adapt to different screen sizes
- Offline capabilities for areas with limited connectivity
- Optimized image handling for mobile bandwidth considerations
- Quick access to camera for adding travel photos directly
- Focused Purpose: Unlike general social media, Travel Book is specifically designed for travel documentation
- Privacy Control: Users have full control over their content, with no public sharing by default
- Structured Organization: Purpose-built organization system for travel memories
- Visual Analytics: Unique insights into personal travel patterns
- Offline First: Robust offline capabilities understanding travelers' connectivity challenges
- Cross-Device Experience: Seamless experience from desktop planning to mobile documentation
- High contrast mode support via dark/light themes
- Keyboard navigation throughout
- ARIA attributes for screen reader compatibility
- Touch-friendly interfaces with appropriate sizing
- Text scaling support
- Color choices that consider color blindness
We welcome contributions! Travel Book features a comprehensive contributors recognition system to celebrate the efforts of our community members.
- Get Started: Follow our Contributing Guide for setup instructions
- Make Your Mark: Implement features, fix bugs, or improve documentation
- Get Recognition: Submit your contributions through our Contributors Application system
Once you've made meaningful contributions to the project, you can apply to be featured on our contributors page:
- Apply Online: Visit
/contributorsto see current contributors and apply for recognition - Submission Form: Complete the form at
/contributewith details about your contributions - Review Process: Our team reviews applications within 3-5 business days
- Featured Display: Approved contributors are showcased on the main contributors page
- Fork the repository
- Set up the project with mock data (see CONTRIBUTING.md)
- Make your changes
- Test thoroughly with the mock system
- Submit a pull request
- New: Apply for contributor recognition once your PR is merged
Perfect opportunities for contributors to make meaningful impact!
- Enhanced Animations: Smooth page transitions, micro-interactions, and loading states
- Theme Customization: Multiple color schemes, custom themes, and advanced dark mode
- Accessibility Improvements: Better screen reader support, keyboard navigation, and WCAG compliance
- Mobile Experience: Gesture controls, swipe navigation, and touch optimizations
- Story Templates: Pre-designed layouts for different types of travel stories
- Interactive Widgets: Weather displays, travel tips
- Advanced Photo Gallery: Lightbox views, image filters, and slideshow modes
- Custom Map Components: Location pins, route visualization, and travel timeline maps
- Smart Search: Auto-complete, search suggestions, and advanced filtering UI
- Bulk Operations: Multi-select stories, batch editing, and mass export options
- Keyboard Shortcuts: Power user features and accessibility improvements
- Drag & Drop Interface: Intuitive file uploads and story reordering
- Enhanced Analytics: Interactive charts, travel heatmaps, and journey visualization
- Progress Tracking: Goal setting UI, travel milestones, and achievement badges
- Timeline Views: Calendar integration, trip planning interface, and memory lane browsing
- Export Features: PDF generation, print layouts, and social media templates
- Offline Enhancements: Better caching strategies, offline editing, and sync indicators
- Performance Optimization: Code splitting, lazy loading, and bundle optimization
- PWA Features: Install prompts, push notification UI, and home screen shortcuts
- Loading States: Skeleton screens, progressive loading, and optimistic updates
- Component Testing: Unit tests, visual regression tests, and accessibility testing
- Responsive Design: Cross-device compatibility and flexible layouts
- Internationalization: Multi-language support and RTL text support
- Error Boundaries: Better error handling UI and graceful degradation
All features can be developed and tested using the mock data system - no backend required!
This project is open source and available under the MIT License.
If you have any questions or need help getting started, please:
- Check the Contributing Guide
- Open an issue on GitHub
- Join our community discussions
Happy traveling and happy coding!