Ultra Fuel

Ultra Fuel is a Jamstack web-app developed with React for the front-end and SCSS for styling; it is designed from a mobile-fist perspective, is responsive, optimized and addresses several issues that could impare accessibility.

Fetch API calls are made to the Fauna database to retrieve the foods collection and hourly logs collection. The foods are saved as an object, and data is handled with the map and reduce methods. Ternary operators are frequently utilized to reduce the line count and speed up operations. React Hooks are also heavily used, specifically useState, useEffect and useRef; the latter is used in conjunction with the useEffect Hook to only load the foods collection on initial render. During some functions a loading screen shows to allow the API calls to the serverless functions to finish and prevent errors.

Currently, this web-app is insecure in that anyone can add or remove food to any hour. (However, the database key is not exposed.) This is done for demonstration purposes. It is also catered to the hours of the event I developed the app for. The end goal is to develop Ultra Fuel into a mobile app, and offer it for download. Several changes will be made before that happens, such as adding a log-in option, and the ability for a user to add new foods to the database. The end-goal is to utilize an API to simply search for a food and add it, as well as having a manual option.

Full code on GitHub | Contact AC