sarthakm21 / worktrack

A nodejs, express and mongodb based productivity tracker application.

Work Track

A Nodejs, express and mongodb based productivity tracker app that keeps track of the work you did and the amount of time you spent doing it.

It uses Charts to represent the data for the day as well as the overall working time for the past 30 days pictorially. You can also share your work for others to see and view what others have shared by going to the inspire me section

To install locally

$ git clone https://github.com/GeekHaven/WorkTrack
$ cd WorkTrack
$ npm install

For adding mongodb

• Install mongodb from https://www.mongodb.com/try/download/community if you want to store the data locally onto your computer
• You can also use mongodb Atlas for cloud storage of your data
  • To do that, first create a mongodb atlas account
  • Go to your cluster and then click on the connect button
  • Select Connect your application and then copy the connection string
  • Now, into the project folder, create a file named .env and add the following code
  • MONGODB_URI = <your_connection_string>

Finally

• Run npm run dev or npm start and navigate to localhost:3000 on your browser

worktrack's Issues

Add a show password icon on the login and signup form

You can use this for reference Show my password

Font awesome is already included in the app so you can use the eye icon classes directly.

Give the user some notification when they try to visit a section without logging in

It is not possible for the user to view the Home page, Add Work page and the Statistics page without logging in. Right now, when they try to do so, the app simply redirects to the login page. Some notification like Please login first would be much better.

Add a Feature for User to visit his/her profile.

• In the navbar, there is a "Logged In As " item. We can use it as a link for the user, to visit his/her profile.
• So we can add some more options in the User Schema, like an option for an Image URL, social links, like twitter, facebook, linked in, etc
• We will ask for all these as an optional value, while registering, and accordingly render them on his profile.
• We will make a new route for a user to reach his/her profile!

I would like to work on this issue, can you please assign this to me.

Use of MVC Architecture

As of now, the app has all the controller functions inside of Routes. Just like any other scalable Node App, I think we should follow the MVC Architecture. So we should make a controllers folder, and move all the controller functions inside that folder, inside separate files, and then link them to the respective routes files. Also, we can use Nodemon, for automatic restarting of the server.
Can I please work on this Issue?

Add Support for Sass and convert existing CSS into Sass

• In this, I would convert the existing CSS stylesheet into Sass.
• Also, I would use our NPM ecosystem to add support for Sass.
• We will be using BEM (Block Element Modifier) Methodology to name our classes.

Hey @sarthakm21, I would like to work on this, can you please assign it to me!

Improve the alerts and confirms

As of now, the application uses simple js alerts and confirm messages for warnings and confirmation. Instead, implement custom dialog boxes for alerts and confirmation with a better UI that matches the overall theme of the app.

Add the starting time and ending time to the Work cards

At the moment, the users work cards do not show the starting time and ending time of that task. They just display the total time. Add the feature for displaying the start and end time as well.

Improve the Header in Inspire Me section

Currently, it looks like this.

Its pretty basic. Change it so that it does not look so bland. Maybe add some image or icons(something relevant to the section of course) that makes it slightly more attractive!

Add a register now option on login screen for mobile view

Currently, on mobile screen view there is a hamburger menu which has an option of registering to the app which is not visible at once to user. Hence there should be an option below the login screen to register and similarly below the register screen to login

Reset Password

• In this issue, 2 new Routes will be added, a route for Forgot Password, where User can enter his mail ID, and can request for a Password Reset Token.
• Then, with the help of his Password Reset Token, he will react another route, where he can Reset his password.
• Also, as soon as he create his new password, he will be signed up!

Hey @sarthakm21 , I would like to work on this issue, can you please assign this to me!

Redesign of Register Page

• Some new fields have been added in the Register form, like social links, image URL, etc, which has made the register form quite long, following the present design.
• So, a new design of Register Page is needed.
• Feel free to change the semantic of Register.ejs file.
• The work needs to be done in the profile branch, so make sure that you fetch from it, and create a PR into that branch only.
• The current preview of the Register Page is attached below!

Redesign of Profile Page

• A new feature has been added, in which a user can visit his/her profile.
• So, a design of Profile Page is needed.
• Feel free to change the semantic of userProfile.ejs file.
• The work needs to be done in the profile branch, so make sure that you fetch from it, and create a PR into that branch only.
• The current preview of the Profile Page is attached below!

Add a better background throughout the app

It's plain white right now, and rather boring tbh. Select and add a new backgound that adds some life to the app. Nothing too flashy though. Something that matches with the overall theme of the app.

Change the Header text for a new user to make it more visible

Currently, it looks like this.

Its not very clearly visible. Change the top text's styles to increase its visibility.
Do not change anything that will affect other elements as well

Edit Profile & User Information

• In this issue, we will create 2 new Routes and Controller Functions, for a User to edit his profile.
• We will also add a view page, which will contain a form, where the user can see and change his current information from.

Hey @sarthakm21, I want to work on this. Can you please assign this to me?

Add a option on the home screen for the user to select the duration for which they want to see their works

The user can select the time(in days) for which they wan't their works to be displayed. A dropdown menu would do the job!

Add a timer to the AddWork section

The timer would display the time elapsed since the user started the task. Looking for something along the lines of this or maybe something more challenging like this (Not so flashy though)

Redesign of Forgot Password & Reset Password Page

• Recently, a feature has been added in the website, in which, a user can reset his/her password, in case, the user forgets the Password.
• For that, 2 new view files have been added, which need a redesign.
• As a reference, I am attaching the screenshots of the current state of the Pages.