DEV Community

Cover image for Avocado
Meg
Meg

Posted on

Avocado

Concept:

Our group decided early on that we liked the idea of doing a food related app, an ordering, back of house, reporting tool that could be used by a customer to order food, but also by the restaurant to get the food ready, and the owner to review revenue and edit menu information. Our idea was to create an app similar to Toast, so we decided to call our app "Avocado".

Team Roles:

Corey set up our Supabase schema, our initial routes and multiple table backend routes, connecting our backend and frontend servers and creating the reporting system for the back-of-house operation page.

Peter designed our brand identity and styling, creating the restaurant logos and layout with Adobe Illustrator, and implementing the menu, cart, and order confirmation pages as well as their frontend Supabase routes.

Jaye was our project manager and styling TailwindCSS specialist, leading our multiple daily standups, acting as our instructor liaison, creating our mockup flow chart in Figma and database schema in DB designer, as well as managing our Github project tracking page, setting up our Supabase storage, and deploying our project front and back ends on Render.

Meg designed the login, signup, and dashboard logic as well as the reducers slice for our Redux state, implementing state persist, our front-end routes and state logic queries, and creating our reporting in Plotly to showcase database statistics.

Blockers:

Although choosing to use Supabase allowed us to easily authenticate and grab our token to set into state, we later discovered Supabase automatically set user emails to lowercase when they were put in the authentication table, which caused an issue when we tried to query them. Other blockers were how Supabase handled image storage, and its timing delay of returning data that generated the need to conditionally render many of our designs.

Final Thoughts:

In total, our project included React, Redux, JavaScript, Supabase, Plotly, Toastify, TailwindCSS, and State Persist - many of which were used for the first time by at least one person in our group. Overall, our project definitely pushed us to learn new tools and technologies and we are proud to present our food service app, Avocado!

Project Repo - Frontend
Project Repo - Backend
Project Site
Project Walkthrough

Top comments (0)