A full-stack TypeScript application where users can share and view feedback on events they attended (workshops, webinars, conferences) in real-time.

• Real-time feedback stream with auto-refresh
• Interactive feedback submission form with star ratings
• Event selection dropdown from available events
• Advanced filtering by event and rating
• Pagination for large datasets
• Responsive design with Tailwind CSS
• Modern UI/UX with beautiful components

• GraphQL API with Apollo Server
• Real-time data updates through polling
• Input validation and error handling
• In-memory database with sample data
• CORS enabled for frontend integration
• Type-safe with TypeScript

• React 19
• TypeScript
• Apollo Client (GraphQL)
• Tailwind CSS
• Vite
• Lucide React (Icons)

• Node.js with Express
• TypeScript
• Apollo Server (GraphQL)
• In-memory database

• Node.js (v18 or higher)
• npm or yarn

1. Navigate to backend directory:

   cd back

2. Install dependencies:

   npm install

3. Start development server:

   npm run dev

The backend will run on http://localhost:4000

1. Navigate to frontend directory:

   cd front

2. Install dependencies:

   npm install

3. Start development server:

   npm run dev

The frontend will run on http://localhost:3000

1. Open the application in your browser
2. The "View Feedback" tab shows all feedback in real-time
3. Use filters to narrow down by event or minimum rating
4. Navigate through pages using pagination

1. Click on the "Submit Feedback" tab
2. Select an event from the dropdown
3. Enter your name
4. Rate the event using the interactive star system
5. Write your feedback comment
6. Submit the form

The application comes with pre-loaded sample data:

• 5 Events: React 19 Workshop, GraphQL Best Practices, TypeScript Conference 2024, Full-Stack Development Bootcamp, AI in Web Development
• 3 Sample Feedback: Various ratings and comments for different events

• GraphQL Playground: http://localhost:4000/graphql
• Health Check: http://localhost:4000/health
• Auto-restart on file changes with ts-node-dev

• Hot reload with Vite
• TypeScript compilation
• Tailwind CSS with JIT compilation

Event_Feedback_Hub/
├── back/                    # Backend (Express + GraphQL)
│   ├── src/
│   │   ├── database/       # In-memory database
│   │   ├── graphql/        # GraphQL schema & resolvers
│   │   ├── types/          # TypeScript type definitions
│   │   └── index.ts        # Main server file
│   ├── package.json
│   └── tsconfig.json
├── front/                   # Frontend (React 19)
│   ├── src/
│   │   ├── components/     # React components
│   │   ├── graphql/        # GraphQL queries & mutations
│   │   ├── types/          # TypeScript type definitions
│   │   ├── App.tsx         # Main app component
│   │   └── main.tsx        # Entry point
│   ├── package.json
│   └── vite.config.ts
└── README.md

cd back
npm run build
npm start

cd front
npm run build
npm run preview

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Test thoroughly
5. Submit a pull request

This project is licensed under the MIT License.

Built with ❤️ using React 19, TypeScript, and GraphQL