MeetHere Frontend

This is the frontend part of the MeetHere project - a social platform for organizing events and connecting people.

Project Structure

Frontend/
├── index.html         # Main HTML entry point
├── static/            # Static assets
│   ├── router.js      # Client-side router implementation
│   ├── main.js        # Main application logic
│   ├── styles.css     # Global styles
│   ├── icon/          # Icons and images
│   └── js/            # Additional JavaScript files
├── src/               # Source code
│   ├── utils/         # Utility functions
│   ├── types/         # TypeScript type definitions
│   └── services/      # API services
├── nginx.conf         # Nginx configuration for deployment
└── Dockerfile         # Docker configuration for containerization

Features

• Client-side routing with dynamic page loading
• User authentication (login/register)
• User profile management
• Event creation and management
• Responsive design for mobile and desktop
• Offline mode support
• Image optimization

Getting Started

1. Clone the repository
2. Make sure the backend server is running
3. Open index.html in your browser or set up a local server

Development

To start development server:

# Using Python's built-in HTTP server
python -m http.server

# Or using Node.js with http-server
npx http-server

Deployment

The project includes Docker configuration for easy deployment:

docker build -t meethere-frontend .
docker run -p 80:80 meethere-frontend

Technologies Used

• Vanilla JavaScript (ES6+)
• HTML5 & CSS3
• Fetch API for network requests
• IntersectionObserver for lazy loading
• LocalStorage for caching

API Integration

The frontend connects to the MeetHere backend API for all data operations. Configuration for the API endpoint is located in src/services/api.service.js.

Contributing

1. Fork the repository
2. Create a feature branch
3. Submit a pull request

License

MIT