Finding a time to meet people is super difficult since everyone is so busy nowadays. I wanted to make a website that made finding a meeting time simple and easy.

What it does

HaveTime allows a user to create a meeting and invite others to vote on it. Users vote by entering all of the times that they are available. The website then visually displays the most optimal meeting times using overlapping colors.

How I built it

The frontend is developed in SvelteKit and the backend uses Firebase. The website and serverless functions are deployed to Vercel. Authentication is handled by Firebase and users can login with Email/Password, Google, GitHub, or Twitter. I used TailwindCSS for styling because the class-based approach allowed me to rapidly prototype new designs.

Challenges I ran into

Making the user interface responsive and accessible was a big challenge. Oftentimes, the UI would create horizontal scroll bars on mobile or be completely unusable by people using a screenreader. Also, deploying the website onto Vercel caused some issues since I needed to use a special build adapter to get it to work.

Accomplishments that I'm proud of

I spent a long time working on the core date and time selection components that drove the user experience and I'm pretty happy with how they turned out.

What I learned

This was my first time using Svelte so I was excited to see what all the hype was about. I really enjoyed using it even though it was more difficult to deploy than Next.js. I will definitely be using it again in the future and I think it has potential to become my main web development framework.

What's next for HaveTime

I would like to add calendar integrations that allow users to directly import their schedule instead of having to input it manually. I would also like to add a commenting system so users can easily ask questions about the meeting and discuss agenda items.

Built With

Share this project: