Light

harunjonuzi / app-todo-this Goto Github PK

View Code? Open in Web Editor NEW

2.0 2.0 1.0 5.14 MB

Literally the best todolist application in my neighborhood.

Home Page: https://harunjonuzi.github.io/app-todo-this/

HTML 9.07% JavaScript 51.71% SCSS 39.22%

javascript scss vitejs local-storage responsive todolist-application

app-todo-this's Introduction

Application | Todo This

I wanted to build the best todo-app in the world, it ended up being the best one in my neighborhood.

Features

Responsive
Local Storage
UI/UX Design

Tech Stack

Client: Scss, JavaScript, Vite

Server: #

Preview

Run Locally

Clone the project:

  git clone https://github.com/harunjonuzi/app-todo-this.git

Go to the project directory:

  cd my-project

Install dependencies:

  npm install

Start the server:

  npm run dev

Contributing

This is an open-source project and I welcome contributions from the community.

If you'd like to contribute, please fork the repository and make changes as you'd like. Pull requests are warmly welcome.

Links

app-todo-this's People

Contributors

Stargazers

Watchers

Forkers

app-todo-this's Issues

Delete all button for all lists (include warning modal)

Add dark/light mode toggle

Refactor to SCSS

I had to find a folder structure first in order to apply to all of my projects
Now that I am ready with the structure I can slowly move to start refactoring to SCSS, but first I must find new class names for my project as a whole, draw it, and then execute it correctly.

Rename feature for the lists

Add Priority Tasks with Colors

Alot of refactoring can be done in javascript and scss

Edit feature for the tasks

https://www.youtube.com/watch?v=MkESyVB4oUw

https://www.youtube.com/watch?v=Ttf3CEsEwMQ

Delete icon on the side of buttons when hovering (include warning modal)

Refactor JavaScript logic by removing the html template element

Try to add the whole task template element manually through javascript, that will give you more freedom to select elements and modify them.

Added permanent lists and did a complete overhaul of the app in general

Create Inbox, Today, and Upcoming permanent sections in the sidebar.
Every time we load the page, make a function that populates the local storage with inbox, etc...

When no active list is selected, display an SVG beautiful design in the whole main area, and name the div the same as the main outer one, for example
.
OPTIONAL: Try to make different designs for 3 permanent lists.

Make the header and footer always appear in lists, only to show the SVG design element if no tasks are in the main section.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.