Product feedback app (Next.js App Router, RSC, Tailwind, Supabase)
Design comparison
Solution retrospective
This is my first fullstack project including authentication, authorization and protected routes. I've been learning about React Server Components, which seems to be the future. It took a while for the concepts to click, but I'm happy that I could pull off this project with RSC, Next.js App Router and Server Actions.
The render is close to the original design. The design system for the colors is in-place, so adding theming in the future should be trivial.
The app also scored well in speed insights (mobile: 97, 100, 100, 100)
The login form is pretty basic, but I'll work on adding proper error messages.
What challenges did you encounter, and how did you overcome them?Supabase's SQL queries were the most challenging and time consuming as I don't know the syntax. I extensively used ChatGPT for fine-tuning the queries to achieve the desired results, but it was a very frustrating experience. But I think that's what we'll have to deal with, for relying 100% on AI.
I had to constantly visit the Next.js docs throughout the development of this project, but I think that's good. I really like the DX of working with RSCs and server actions. I think I understand them pretty well now!
What specific areas of your project would you like help with?I've added loading states to buttons that trigger server actions and they work well. But I couldn't figure out how to add the loading states for page navigations and page revalidations. Optimistic updates seem to be one choice, but I prefer loading states. Any help or feedback regarding the loading states and the entire app in general are much appreciated, thanks!
Community feedback
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord