Finally, I created a my first CRUD web application with React and Supabase!

Introduction

I have created a web application that can do CRUD.
The name of the application is Motive Diary.
This application is sort of a diary application, but it is intended to help you achieve your goals and stay motivated.
Users set a goal and the number of days to achieve it, and record their daily progress. The daily record can then be easily reviewed.

Features

• Easy Goal Setting and Daily Logging:

Motive Diary allows users to easily set goals and log their daily progress. Users can specify their goals and the desired timeframe for achievement, making it effortless to track their progress through the application.

• Sustaining Motivation and Reflection:

Motive Diary facilitates the recording of daily progress and encourages users to reflect on their goals. Users can conveniently review their progress and visualize their accomplishments within the application. This feature not only provides a sense of achievement but also helps users maintain motivation towards their goals.

Motivation Behind Development

I also used the hashtag "100daysofcode" on Twitter. However, even if I achieved 100 days, could not easily look back at our progress later. (Because other people use the same hashtag and I tweet other things)
So I decided to create a Motive Diary, something that would make it easier to keep track of my days and something I could easily look back on later.

I wanted to create a solution that would not only simplify the process of keeping track of daily progress but also provide a centralized platform for easy review and reflection in the future. With the Motive Diary, users could have a dedicated space to record their daily activities, milestones, and achievements, making it effortless to look back and see how far they had come.
And also you can get cheer from other people who challenging their own challenge.

Built With

Motive Diary is created with React, Supabase, Material UI.
I chose ReactJS why is easily created front-end.
I utilized React component-based state management capabilities to develop a responsive and interactive user interface that seamlessly captured user input and displayed the progress.

In addition to react, I chose Supabse.
Supabase offered a real-time database with built-in authentication and authorization features, which greatly simplified the development process.
I utilized Supabase database functionality to store and manage user data, including goals, daily progress, and achievements.

release and feedback

I used Vercel for release.
I chose it because it was the easiest and I was a little familiar with its use.
You can easily send feedback from the app.(you need sign in)
Please try it. And I look forward to receiving lots of feedback.

in the future

This application is still in the testing phase, so updates will be made daily, mostly to adjust the look and feel and add new function.
Please do not worry and use it.
I intend to develop features such as rankings of those who are still challenging for long time, and notifications of what you need to do today.
I am also looking for someone to support me as I am not familiar with the UI/UX and web design.

In conclusion

If you have any inquires, please contact me via email.
yuyahirano.dev(at)gmail.com

Motive Diary.

Thank you.