jaslloyd / habit-tracker

Habit Tracker to make my life easier

Hi there 👋, I'm Jason I am Leader, Web Developer and Blogger

• 🔭 Senior Frontend Engineer @Layup
• 🌱 I’m currently learning leadership and trying to deepen my knownledge on everything Web development.
• 📫 Budding very occasional Blogger @thedeployguy

Connect with me:

habit-tracker's Issues

Completely rip out Bootstrap and use CSS Grid and CSS Flexbox

Most of this has been done with the latest changes, there is a bunch of small things I need to fix and remove.

Convert codebase to typescript

I am now using typescript is my day to day job, would be great to have a project outside work I am using it also.

The DB should keep track of all the dates the habit was completed instead of just the latest

Add Occurrence habit DB model

For the first version, I want a simple occurrence based system. e.g. I want to workout at least 10 times this month. At the moment I will tie to the month but maybe an extension in the future.

Occurrence_habit:

• Name
• Description
• Goal target
• Month of Goal

App doesn’t load when it’s saved to your phone homescreen

It’s seem to be an issue with React-Router. There seems be a fix for it here:
https://ayastreb.me/react-router-in-home-screen-pwa/

Implement simple login page

Since I will be only user of this site for the moment, implement simple login page.

Order challenge Habits

Challenge habits should be sorted by last updated or created date

At the end of the month, a summary should be generated to show a nice summary

Add Demo mode so I can easily showcase the project

Page loses state when page is reloaded

Go to November habits, refresh the back and it goes back to the current month's habits.

Cause:
This is caused by not using routing parameters the right way.

Implement an end date for Challenge Habits

Challenge habits are great but they need to have an end date.

Replace momentjs with date-fns

Date FNS is much lighter and is easier to use. https://github.com/date-fns/date-fns

Add dark-theme / bright-theme toggle

Something I always wanted to learn how to do and sounds like an interesting idea.

Suggest Habits Users have entered before when adding a new habit

Suggest Habits Users have entered before when adding a new habit

Can be extremely useful for when users are planning next month of habits

Deploy the application to Heroku

Buttons to change months move position depending on the size of the month which is terrible

Look at adding Styled Components and Separating out CSS

https://github.com/styled-components/styled-components

Look into Loopbook for easy backend api

Have added project files.

Need to watch a few tutorials and documentation on exactly the way we want to use it.

React + Loopback
Loopback intro

Implement 30 Day challenge type habit

Implement 30 Day challenge type habit

It will be similar to the habit streak habit but instead of having it tied to a month it will just be 30 entries

Add ability to add a new habit

Use localstorage to persist user login

When you add a habit it looses last page so you just go to / which is bad UX

Summary view should only get habits from this month, instead of trying to filter client side

Add ability to see Habits from previous months

In the monthly occurrence habits, users should be able to see the previous months of habits or even schedule ones for next month.

Add Notifications to Remind you to update your goals before end of day

When you schedule a habit in December for January of next year it doesn't work

When you schedule a habit in December for January of next year it doesn't work

e.g: Add habit for January 2018 it goes January 2017

Add feature to Edit Existing Habits

links not working

thanks for the app but please note that those links not working 404

https://github.com/TheDeployGuy/personal-habit-tracker-api

https://github.com/TheDeployGuy/personal-habit-tracker-dashboard

Save the users settings (theme etc) into localStorage

When adding Habit, the suggestions are from the same month which is not useful

Improve mobile version

Mobile version has a few issues:

• Login in portrait mode doesn’t show entire window
• Checkboxes on dashboard are misaligned

Future Plans

Features List:
Feature: Add Notifications to remind you to update your habits.
What I can learn: How to do push notifications in Javascript, permissions around notifications etc.
Time to Implement: 1-4 Hours

Feature: Completely rip out Bootstrap and use CSS Grid and CSS Flexbox
What I can learn: CSS Grid, CSS Flexbox
Time to Implement: 1-4 Weeks

Feature: Add Summary 'showcase' to review monthly habits at the end of the month
What I can learn: CSS Animations, Transitions.
Time to Implement: [tba]

Add OAuth Sign-in to Front-end

Add Google and Github OAuth Signup and login

Slight UI Improvements

Ticket to track UI improvements:

• Change Navbar color to match Background
• Put controls into a card to match the overall look of the application
• Add "mx-auto col-10" to "Add Habit" button