Donald Groce

Crafting elegant and efficient web solutions.

Professional and responsive websites.

I'm a software engineer dedicated to designing and implementing high-quality, user-centric web applications. With a commitment to modern design principles and mobile-friendly interfaces, my focus is always on delivering the best possible experience for users and clients alike. Constantly improving my skills and staying updated with emerging technologies is crucial to my approach.

This website is a testament to the power of modern web development technologies. It's hosted on Amazon's AWS platform, with a frontend crafted using the React framework, styled with TailwindCSS, and written in TypeScript. The backend is powered by Next.js and Node.js.

🌶️Repositories:

Twitch Clone

Click here

Portfolio Site

Click here

Where's Waldo?

Click here

Building scalable apps, with thoughtful UI and UX.

All products have a responsive designed with both cost and scalabilty in mind.Finding the right balance of plain javascript, native React apps, and 3rd party plugins is one that involves constant learning. I have worked with a wide range of platforms and continue to update my knowledge and understanding of web development every day. Thank you for taking the time to view my work.

Building today's

Mobile ready app's

Maintaining multiple

community projects.

Alumni of:

The University of Missouri

Built with:
some of the apps and frameworks you use daily.

This application encapsulates my personal style and my professional abilities as a web developer, showcasing my commitment to efficient design and user experience.

Twitch.tv Clone

Twitch Clone - Project Description

The purpose of this project was to demonstrate my acquired competencies from the Odin Project and further advance my understanding through independent exploration. While the assignment required the replication of a frequently used social media platform, I opted for twitch.tv as my model, given my extensive engagement within numerous streaming communities during and post-college.

The cornerstone of my development skill progression has been the T3 Stack, which is not part of the Odin Project's curriculum but has served as a critical resource throughout my learning journey. The stack comprises Next.js, Tailwind, PrismaDb, tRPC, next-Auth, react-query, among others.

A significant learning milestone was the realization of SQL's power despite its perceived complexity compared to no-SQL. Despite this, time constraints led me to adopt tRPC and Prisma,enabling me to utilize my foundational knowledge of databases while benefiting from next auth's user-friendliness and TypeScript's type safety.

The Twitch clone can be segmented into three main components for brevity, even though the user pages technically offer infinite possibilities.

Home Page

Constructing the user interface (UI) proved more intricate than initially anticipated, especially the creation of the spotlight slider and the card-lift effect for suggested streamers and game category cards. Despite several refreshes and asynchronous data calls, I successfully ensured smooth data flow and component construction using lazy loading and skeleton components. tRPC and Prisma played crucial roles in facilitating back-end operations, enabling easier site modifications and augmentations compared to solely relying on Express or Next.js' default routes.

Stream Page

This section can be succinctly described as a result of "Webhooks and Websockets". My introduction to these technologies came about while developing the site, particularly in managing the data flow when a user uploads a video, which requires storage of a temporary value in the database, handled by the webhook. The chatroom's speed and efficiency were greatly enhanced by Pusher, enabling the seamless handling of a large volume of messages in a cost-effective manner.

Mobile Page

The Mobile Home posed a unique challenge, as I initially struggled to replicate Twitch's device recognition and sizing due to devtools usage. However, I eventually managed to closely emulate Twitch's device management strategies.

Closing Notes

A primary focus throughout this project was maintaining a lightweight codebase without compromising the application's integrity, significantly influencing my choice of technologies. Although this project was initially daunting, the learning experience and outcome have been profoundly rewarding. There's a long list of pending updates, improvements, and modifications that I plan to address. For further insights into the project criteria or other student submissions, please follow this link.

View Repository

Proof Pudding:

Github Repo One Github Repo Two

Donald Groce

Crafting elegant and efficient web solutions.

🌶️Repositories:

Built with:some of the apps and frameworks you use daily.

This application encapsulates my personal style and my professional abilities as a web developer, showcasing my commitment to efficient design and user experience.

Twitch.tv Clone

Twitch Clone - Project Description

Home Page

Stream Page

Mobile Page

Contact:

Built with:
some of the apps and frameworks you use daily.