This is a submission for Frontend Challenge: Office Edition sponsored by Axero, Holistic Webdev: Office Space

What I Built

For this challenge, I built "Nexus", a modern, single-page intranet dashboard designed to be a company's digital heartbeat. My goal was to create a clean, intuitive interface that masterfully balances high-efficiency productivity with vibrant community engagement, directly addressing the core challenge of information overload in the modern workplace.

The layout is a responsive two-column design featuring a main content area and a right sidebar for tools and events. Nexus provides a central hub for company news, team events, and essential tools, all while fostering a positive culture through features like a "Kudos" feed.

Demo

You can experience the live application and view the complete source code at the links below.

Live Demo URL: https://nexus-drab-ten.vercel.app/

GitHub Repository: https://github.com/praveen-sripati/nexus

Journey

My journey in building Nexus was a fantastic deep dive into creating a polished application using a modern frontend stack: React, Vite, TypeScript, Tailwind CSS, and shadcn/ui.

The Process & Key Decisions

From the start, I began by setting up the project with Vite for a blazing-fast development experience. The choice of TypeScript was deliberate to ensure type safety and code quality from the ground up.

For the UI, the combination of Tailwind CSS and shadcn/ui was a game-changer. Tailwind's utility-first approach made it easy to implement the responsive two-column layout, while shadcn/ui provided beautifully designed, accessible components like Cards, Buttons, and Dropdown Menus, which saved a huge amount of time.

A Choice I'm Proud Of: The Custom Theme Provider

One of the first features I implemented was a light/dark mode theme switcher. Instead of reaching for a library like next-themes, I decided to build it from scratch. This was a great learning experience and something I'm particularly proud of.

Ultimately, this project was a rewarding challenge that took me from a detailed concept to a complete, deployed, and polished application.

Thanks to DEV and Axero for the opportunity.

Made with ❤️ by Praveen Sripati

DEV Username: @praveen-sripati