Plugins
Templates
Blocks
Template Setup Guides

Habitly - Habits Tracking Template

Template page link: https://zeroqode.com/template/habitly---habits-tracking-template-1562336956395x270042976897146620

Introduction

Habitly is developed as an accountability partner that helps individuals track their growth in developing new habits and dropping old habits. New challenges can be taken up, recorded, managed and tracked using the Habitly app.

Features

  • Easy-to-navigate page

  • Responsive single-page design

  • Activity reminders

  • Timer

  • Calendar

  • Stripe Payment

Payments: See the documentation on how to set Stripe Payments in Bubble App.

Data Structure

A - Habit

This custom data type entails Name, remind date, Status, Timer and user details.

A - Timer

Each habit challenge activity can have End date & time, Start date & time, remind date, and be set on Repeat on days.

Day

The user selects days for activities for every challenge. This bears the dayOfTheweek, Habit, Note (activity to be carried out), Status and Time. The user selects as many or less days as is convenient.

Habit

Habits are set as challenges which the user attempts to tackle. Each habit, depending on the activities the user wishes to adopt, is worked on during the specified date, days, hours, minutes, with streaks and title.

Streak

This template is able to keep track of the user's challenge history, length of time in years, months, weeks, days, hours and seconds. The streak custom data type records Count, DateStart, EndDate, Habit, Status and User.

User

The user data contains the user's A - Habits, First Name, and Last Name.

Pages

Index

All activities are carried out on this page. Habits are added, reminders set and activities monitored. Progresses can be saved and monitored too. It also showcases a list of existing/ongoing challenges (habits).

Custom states:

State

Element

Note

show

index

upon loading, this custom state takes the value of home, new habit or settings depending on navigation on the home page

remind date

index

the user sets a reminder which the custom state reads in "week"

size rep

index

this has the value "small"

current time

index

this is the value of the timer

addnewhabit

index

this custom state enables the user add a new habit to his list

habit title

index

each habit added possesses a title. This state reads "new" when a new addition is to be made

mode

Add new HABIT group

this is set to "new" for every habit freshly added to the group

WEEKDAYS 2

index

the values of this state are Monday, Tuesday, Wednesday, Thursday, Friday

current habit

index

this reads the current habit after a new addition is made or as navigated by the user

Reusable Elements

Signup / Login Popup

This page allows signing up using email address. It also allows for login for already registered users. On this page, sign up payment is made easy using the Stripe platform. Passwords are also recoverable.

Demo to preview the template