[go: nahoru, domu]

Skip to content

Backend Habit Tracking Web Application - Enhanced UI and Animations

Notifications You must be signed in to change notification settings

SwarupDeb/HabitTracker

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Habit Tracking Web Application

Welcome to the Habit Tracking Web Application repository! This is a simple web application built using Nodejs,express, mongoDB and EJS with inline css, designed to help you track your daily and weekly habits. The application includes various animations and interactive features to enhance the user experience.

Features

  • Display a list of habits with animations.
  • Ability to add, edit, and delete habits.
  • Habit details page with a line chart displaying streak progress.
  • Dynamic background color animation.
  • Text color change animation.
  • Entry slide-in animations.

Usage

  1. Clone this repository:
git clone https://github.com/your-username/habit-tracking-web-app.git

2.Navigate to the project directory:

cd habit-tracking-web-app

3.Install dependencies:

npm install

4.Start the server:

npm start
  1. Open your web browser and visit
Open your web browser and visit http://localhost:3000.

#File directory structure:

HabitTracker/
├── controllers/
│   └── habitController.js
├── models/
│   └── habit.js
├── public/
│   └── css/
│       └── styles.css
├── routes/
│   └── habitRoutes.js
├── views/
│   ├── habitDetail.ejs
│   ├── habitForm.ejs
│   └── index.ejs
└── server.js

Screenshots

Screeshot1

HabitTrackerHome

Screenshot 2

HabitTrackerHabbits

Screenshot 3

HabitTrackerdetails

Screenshot 4

HabitTrackerstatus

Credits

  • Icons from Font Awesome.
  • Google Charts library for chart visualization.

Author

About

Backend Habit Tracking Web Application - Enhanced UI and Animations

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published