TrackIt - Single Page Application that helps the user track their habits.

Overview

Track It

An application to help the user track their daily habits, being able to sign-up and sign-in, creating a personal space!
First time using libs like react-circular-progressbar and dayjs!

Overview
- About
- Built with
How to run
Author

Overview

Try it out now here.

obs: has a certain responsivity to Tablet and Desktop.

About

This app has the following features:

Enables the user to sign in their account
In case they don't have any, it's possible to create one in the sign up page
- To sign up, the user needs to inform their Email, Password, Name and an available URL image chosen by them.
After logging in the TodayPage is shown, in which the user can:
- Check their daily habits, if they have any
- Click on the checkmark to mark it as done in that day
- Track their current streak and record of days that task/habit has been done
- And shows the user their daily progress in a circular progress bar on the botton center of the page
In the case the user has no habits to be tracked, they can go to the HabitsPage, being able to:
- Create their habits
- Choose the days to do the habit
- Save or Cancel the habits' creation
- And delete the habit by clicking on the trashcan icon
Besides that, on the HystoryPage the user can track their progress on a month calendar, where it's possible to track the days the habis have been done or not
- To be implemented

Built with

The following tools and libs were used in the construction of the project:

How to run

Clone this repository
Install dependencies

npm i

Run the front-end with

npm start

You can optionally build the project running

npm run build

Finally, access http://localhost:3000 on your favorite browser (unless it is Internet Explorer. In this case, review your life decisions)

Author

LinkedIn - Lucas Azzolini Vieira
Frontend Mentor - @Lucas-zz
Twitter - @zulenno

NestJS module for adding translations to the application, with a pipe for translating validation errors

nestjs-translates NestJS module for adding translations to the application, with a pipe for translating validation errors Installation npm i --save ne

Jul 26, 2022

A simple implementation of a task list application that can be used to add, remove, edit and check users tasks

"To-do list" is a tool that helps to organize daily activites. It simply lists the things which are needed to be done and allows user to mark them as complete. In this step of project, the CRUD (create, update, delete) methods are implemented. This simple web page is built using webpack and served by a webpack dev server.

Mar 28, 2022

API routes are great for APIs, but for small projects where you have to access server data or hide application logic, you can just call a server function from the client.

Mar 6, 2022

A PHP Laravel web application that uses most of Laravel technologies to build that gym system

A PHP Laravel web application that uses most of Laravel technologies to build that gym system.The System is based on rules. Admin, City Manager, Gym Manager. All Crud operations running using data tables.

Dec 29, 2022

This web application retrieves real live data from the SpaceX API

This web application retrieves real live data from the SpaceX API. It provides commercial and scientific space travel services, by allowing users to book rockets and join selected space missions.

Aug 9, 2022

This project entails a To-do-List whereby a user can input the tasks they want to do, check the tasks done and also clear all tasks when all of them are completed. It is efficient for a user who want to manage their time and keep track of their day.

Screenshot Here is a screenshot for the project. To-Do-List Project This is a Microverse project that entails a to-do-list which one is able to add an

Jun 16, 2022

A single-page application that allows users to keep track of their books. Users can add the book details (book title and author) and also, and the books can also be removed. Built with JavaScript, HTML, and CSS

Project Name Awesome book with ES6 Description the project. This is a single page application that allows users to keep track of their books. Users ca

Oct 13, 2022

⚡️The Fullstack React Framework — built on Next.js

The Fullstack React Framework "Zero-API" Data Layer — Built on Next.js — Inspired by Ruby on Rails Read the Documentation “Zero-API” data layer lets y

Jan 4, 2023

The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

TO-DO-LIST This is a To Do List Project that dynamically displays tasks to be done with interactions for removing and adding task when completed or no

Nov 1, 2021

A complete habits manager, where you can track your progress and complete each daily activity in an organized way.

TrackIt Habit manager in a dynamic, clear and simple way. TackIt is an application that seeks to make it simple and accessible for any user to control

Dec 31, 2022

Habitapp is a simple app that helps you build positive habits, measure progress and achieve your goals

habitapp Habitapp is a simple app that helps you build positive habits, measure progress and achieve your goals. ✨ Features Working without registrati

Sep 11, 2022

See a banned user's profile, their friends, their favorite games, their followers etc.

Roblox-Banned-User-Viewer AKA BanView See a banned user's profile, their friends, their favorite games, their followers etc. Ever wondered how to view

Nov 18, 2022

Projeto 10° da Driven Education - TrackIt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Jun 29, 2022

This restaurant project is a SPA (single-page application) website. The user can navigate between the home, menu and contact page. I used the MealDB API to display some menu items.

Fresh Cuisine This restaurant project is from the Odin Project and it is a SPA (single-page application) website. The user can navigate between the ho

Nov 2, 2022

Project [Personal] - Web application for managing habits. Technologies used: HTML5, CSS3 and React.

A SPA (Single Page Application) that can track your books on your browser! Made with ES6 modules,JavaScript, HTML 5 and CSS 3.

Awesome-Books-project Recreate awesome book app using ES6 syntax and modules. Built With HTML CSS Javascript Live Demo (if available) Live Demo Link G

Jul 14, 2022

OSI helps you to track your all open-source Internships and Program in a single place ⚡

Open Source Internships Overview 👀 Dark Theme Light Theme Run locally 🛠 Fork this repo. open-source-internships 🚀 Clone the repo. ⏬ git clone https

Jan 2, 2023

This is an app that helps people keep track of all their activities for a period of time.

To-Do List This is an app that helps people keep track of all their activities for a period of time. They can be able to see what activities they have

Oct 17, 2022

A single-page application that allow users to add their To Do items. The items could be checked as completed and the completed task can be removed. Built with JavaScript, HTML and CSS

To Do list Application This is a single page application that allows users to keep track of their tasks. Users can add the task and also check the che

Oct 14, 2022