GenDev Coding Challenge 2025

Hi, I'm Saket Veerubhotla - 2nd semester Computer Science student at TUM - and this is my submission for this year's GenDev Challenge.

I thank the CHECK24 team for providing such a fun challenge. It was a pleasure to take part!

Tech Stack

• Frontend: React

• Backend: Node.js / Express

• Database: Firebase Firestore

• Deployment: Vercel (frontend + serverless backend)

My Approach

In the following, I will break down my approach/ideas behind this project by going through each of the challenge requirements that I have fulfilled.

At the end, I will provide a reflection based on what I learnt in this challenge and what I would definitely improve, if I had more time.

Minimum Requirements

Robust API handling

• Delays:

  • Used async generator functions which ran in parallel
  • Stream of SSEs (offers) is displayed as they load in from the APIs straight to the frontend
  • User doesn't have to wait, as faster providers load instantly

• Failures:

  • Use try/catch blocks to handle individual product failures
  • Retry up to 20 times (due to unstable providers)
  • If still failing, disable that provider
  • If 2 or fewer providers remain, prompt user to refresh (a comparison site needs variety)

• Randomness:

  • Important to ensure a variety of offers for the user
  • Achieved by cycling through generators at random (500ms timeout for each offer to maintain app performance)

Sorting/Filtering Options

• Sorting:

  • Runs client-side for near-instant feedback.

  • Users can sort by: Price (asc.) • Duration (asc.) • Speed (desc.)

  • Sorting options are intentionally limited to the most meaningful ones — similar to how CHECK24 does it.

• Filtering:

  • Filters offer strong personalization:
    • User can filter by providers, if they have any favourites
    • User can choose their preferred connection type
    • They can choose a minimum speed they might want for their household
    • User chooses whether they want offers with an inclusive TV contract and/or installation
    • The youth can filter specifically for Young Deals

Share Links

• On share, a snapshot of all current offers (unfiltered) is sent to the backend.

• Backend saves offers under a share ID made from 8 base64 chars of the Unix timestamp.

• Simple and collision-resistant hash function

Optional Features

Address Autocompletion / Verifying user input

• Used the Geoapify Address Autocompletion API
• Like on the CHECK24 site, the next address element can only be entered after selecting an option from the autocomplete results
• ZIP Code inputs are restricted to Germany
• Street inputs are restricted to the given ZIP Code
• This ensures the user input is an actual German address

Reflection

What I learnt

• TypeScript/TSX: After I first learnt React in JSX, this project made me consider using TypeScript/TSX in order to maintain cleaner code. Admittedly, this brought a few struggles too, but it taught me a lot.

• Error Handling: In order to write maintainable and especially scalable code, server-side error handling is very important. This project made me realise how many things can always be going wrong, and the effort required to write even decently robust code.

• Importance of Performance: While testing the website myself, I realised how important app performance and quick feedback is for the end user. Slow runtimes make a user either think they did something wrong or lose trust the service entirely.

  This must be on a completely different scale for CHECK24.

What I would improve

• Session State: This is the one optional feature I missed. Adding this would make the project well-rounded.

• Better Type Usage: As I said above, I was new to TypeScript during this project. Therefore, I definitely feel like I can improve the cleanliness of my code by following better TS practices.

• Better Component Usage: Some React components seem a bit too bulky. Modularization ensures better scalability. So, I'd like to divide my components better for a more maintainable codebase.

• More Immersive UI/UX: I kept my UI rather minimalist, also inspired by the CHECK24 style. With more time, I would explore a unique aesthetic, with more animations and a light/dark mode option.

• CSS Framework: I planned on using Tailwind for this project, but I was already learning a lot and couldn't make the time for it. If I had more time, I would try to create an immersive UI with this.

Overall, this project taught me a lot in the world of web development, and has definitely motivated me to learn and explore more. Thank you for taking your time to review my work!