Habit Rabbit - Gamified Habit App

Habit Rabbit - Gamified Habit App

14 devlogs
33h 5m
•  Ship certified
Created by HassaanKH

Habit Rabbit is a gamified habit tracker where building habits earns you rewards(carrots), which can be used to accessorise your very own rabbit. It is a fun and cute way to stay productive, consistent and motivated. Grow your rabbit as you grow in real life.

Timeline

Earned sticker

Now the habits are saved in the backend successfully, i made options for both online and offline

Update attachment
Earned sticker

Created the authentication ui, integrated with the backend, now the user login workflow works smoothly. i have kept the option to login as guest. which will be able to work offline, but not access the online features like leaderboard, the guest can see leaderboard but cannot participate unless they create an account.

Update attachment
Earned sticker

Back at it again, i am making this online, and adding some cool features... like leaderboard and challenges.

Update attachment

Ship 1

1 payout of shell 665.0 shells

HassaanKH

19 days ago

HassaanKH Covers 11 devlogs and 29h 52m

FINALLY!!! submitted my app for review, will ship this project once the app is live.

Update attachment

Ok, so i have decided to keep it working locally, if i do the backend stuff, it will be slow and may affect user experience, so if everything is working locally why shift it online?
I removed the online logic and the app now works completely offline.
There's a bug or unfinished feature in shop where if you buy one thing it is not being added to your inventory, you just buy it, so after fixing that, i hope it will be production(offline) ready.

Update attachment

Successfully got the shop working accurately. any suggestions of ui or items to add is much appreciated, Looking good so far, much more work is remaining... currently everything is working locally, i got to make a backend to make a leaderboard and ability for the user to keep sync of the data.

Update attachment

Finally the shop's basics are working correctly, successfully bought the rabbit's headphone with hard earned carrots 🥕. Also the carrots currency was not in sync before and after visiting the shop, that is fixed too. Currently the shop screen only consists of a button that says buy headphones and the headphones are bought and carrots are deducted, next step is to improve the shop.

Update attachment

Successfully created the habit heatmap, the stats screen is looking good now, it works exactly like the github's or hackatime's heatmap. now working on the shop.

Update attachment

Added streak logic, and created stats screen, you can check your stats in the app, and most importantly, all the data is being stored locally, no data is being collected, so it will be really good user experience, really fast, no delay.

Update attachment

Made the My Habit screen, you can now add, remove and edit the habits correctly. but this is all happening locally, it will work without having internet.

Update attachment

worked on adding the habits, using @react-native-async-storage/async-storage. the habits are being added correctly, i am thinking of making the app work locally as well as online too if user chooses to, for functionalities like leaderboard etc.

Update attachment

Talked to the staff member and talked about the reason why my previous ship got a bad payout, so after going through the points, now i am fixing everything for my next projects.
and this time i am managing my github repository properly and commit side by side.

For this devlog, i am working on adding the habits, the frontend is completed. and now i will work on the proper functioning of the MyHabitsScreen. and also made a good ReadMe.md.

Update attachment

Worked on the backend, now the user management is working perfect, with proper toast messages using react-native-toast-messages.
also made this cute splash screen and i added the fade in and a subtle scale up animation using react-native-reanimated.

Update attachment

Made the user authentication screens, just the frontend yet. Previously there was a problem setting up the react-native-reanimated but after some research, it is not a problem in this project. Checkout the UI i created, any suggestions and feedback is much appreciated

Update attachment