Table of Contents 📗

• About the Project 📖
• Built With 🛠
  • Tech Stack 🗜️
  • Key Features 🏷️
• Getting Started 💻
  • Setup ⚙️
  • Prerequisites 🧱
  • Install 🏗️
  • Usage 📂
• Author 👤
• Future Features 🔭
• Contributing 🤝
• Show your support 🌟
• Acknowledgements 🙏
• License 📝

My Todos 📖

My Todos, built with React JS and Sass, offers easy task management. Add, edit, and delete tasks in a user-friendly interface with local storage for persistence

Built With 🛠

Tech Stack 🗜️

My Todos project leverages the following technologies:

• React JS: A popular JavaScript library for building user interfaces, particularly single-page applications where UI updates are frequent.
• JavaScript: A versatile programming language commonly used for adding interactivity and functionality to web applications.
• Sass: A CSS preprocessor that enhances the capabilities of CSS with features like variables, nesting, and mixins.
• HTML5: The latest version of Hypertext Markup Language, providing semantic markup, improved accessibility, and advanced form elements for web development.

Key Features 🏷️

My Todos provides the following core functionalities:

• Add New Tasks: Easily add new tasks by entering task descriptions.

• Edit Existing Tasks: Modify task descriptions as needed.

• Delete Tasks: Remove completed or unnecessary tasks from your list.

• Data Persistence: Your todo list is automatically saved to local storage, preserving your tasks after page refresh.

• Responsive Design: The app is designed to work seamlessly on various devices and screen sizes.

• Simple and Lightweight: A lightweight application focused on essential task management features.

• Accessibility: Follows accessibility best practices to ensure a seamless experience for all users.

• Custom Styling: Features basic styling for customization and design enhancements.

• Easy Integration: The codebase can be easily integrated into other projects and extended with additional features.

• Minimalistic Design: A clean and minimalistic design that keeps the focus on task management.

Getting Started 💻

Prerequisites 🧱

To successfully run and contribute to this project, make sure you have the following:

• A Github account: To fork and collaborate on the project.
• Node JS: Required for installing project dependencies and running the development server.
• A web browser: You'll need a web browser to view the project output. We recommend using Microsoft Edge for the best experience.
• An Integrated Development Environment (IDE): We suggest using Visual Studio Code as your code editor, but you can use any IDE of your choice.
• A terminal: You'll use the terminal to run various commands during development. If you're using Visual Studio Code, it comes with an integrated terminal.

Additionally, you might want to consider the following for an enhanced development experience:

• Git: Familiarize yourself with Git and Github if you're planning to collaborate or contribute to the project.
• npm: Learn how to manage project dependencies using npm (Node Package Manager).

With these prerequisites in place, you'll be well-equipped to explore, run, and contribute to My Todos.

Setup ⚙️

To set up My Todos project on your local machine, clone this repository to your desired folder:

 git clone https://github.com/lily4178993/my-todos.git

Install 🏗️

Once you have cloned the repository, you can run the following command to install the project's dependencies:

  npm install

Usage 📂

To use My Todos application, follow these steps:

1. Track linter errors

   Track errors with the following command:

   • Track CSS linter errors, run:

   npx stylelint "**/*.{css,scss}" --fix
   

   • Track JavaScript linter errors, run:

   npx eslint "**/*.{js,jsx}" --fix
   

2. Run the Development Server:

   • Open your terminal/command prompt.
   • Navigate to the project's root directory.
   • Run the following command:

       npm start
     

     This will start the development server.

3. Access the Application:

   • Open your web browser.
   • Navigate to the following URL:

       http://localhost:3000
     

     You will now be able to interact with My Todos application in your browser.

👤 Author

Nelly Telli

• LinkedIn: Nelly T.

Future Features 🔭

Here are two future features we're considering:

• Add About and Contact Pages
• User Feedback: Provides visual feedback to users when adding, editing, or deleting tasks.

Contributing 🤝

My Todos welcomes contributions from the community. Whether you have suggestions, ideas, or bug reports, your input is valuable and can help make this project even better.

• To report bugs 🐛 or request features 📝, please open an issue on GitHub. Be sure to provide detailed information about the issue or the feature you'd like to see.
• If you'd like to contribute code to My Todos, you can fork this repository, create a new branch for your changes, and submit a pull request. Your contributions will be reviewed and merged if they align with the project's goals and standards.

Remember, even small contributions can make a big difference!

Show your support 🌟

Thank you for exploring My Todos! Your support means the world to us. If you find this project valuable and want to show your appreciation, here are some ways to do it:

• Star the project ⭐️: If you like what you see, give My Todos a star on GitHub. It's a simple way to show your love for the project.
• Fork the project 🍴 🎣: Interested in making your own version or contributing in a big way? Fork the repository and let your creativity flow.
• Share with others 🗺️: Help us spread the magic! Share My Todos with your friends, colleagues, and fellow math enthusiasts. The more, the merrier!

Acknowledgments 🙏

I would like to express my sincere gratitude to my family.

License 📝

My Todos is open-source software licensed under the MIT.

The MIT License grants users the freedom to use, modify, and distribute this software while ensuring that the original authors are not liable for any issues arising from its use. For full details, please see the LICENSE file.