A Modern Office Community App – Frontend Built with React

#frontendchallenge #devchallenge #css

This is a submission for Frontend Challenge: Office Edition sponsored by Axero, CSS Art: Office Culture.

Inspiration

As remote and hybrid work becomes the norm, scheduling meetings efficiently is more important than ever. I wanted to create a simple, intuitive Meeting Scheduler app using React and Tailwind CSS that allows users to quickly add, view, and organize meetings with multiple attendees. My goal was to build something clean, functional, and easy to extend for future features.

Demo

Live Demo: [https://office-iq.vercel.app/]

Source Code: [https://codesandbox.io/p/sandbox/github/SumitDesai-21/OfficeIQ]

Journey

This project was a great opportunity to practice building a React app with modern hooks and state management. I focused on:

User Experience: The form is simple, with clear fields for title, date/time, description, and attendees. I used a multi-select dropdown for attendees, making it easy to add multiple people to a meeting.
State Management: All meetings are managed in local state for simplicity, and the list is sorted by upcoming date/time.
Styling: Tailwind CSS made it easy to create a clean, responsive UI with minimal custom CSS.
Learning: I learned more about handling multi-select inputs in React, and how to keep forms accessible and user-friendly.

What I'm proud of:

The app is easy to use and visually appealing. The code is organized and ready for future enhancements, like persistent storage, notifications, or integration with a real user directory.

Next steps: