DEV Community

Cover image for A Complete React Todo App using React, Redux, Framer Motion
Shaif Arfan
Shaif Arfan

Posted on

4 1

A Complete React Todo App using React, Redux, Framer Motion

React Todo App.

A complete todo application with all features.

Made with ❤️ by Shaif Arfan

live demo: https://wc-react-todo-app.netlify.app/

Watch On Youtube: https://youtu.be/W0Uf_xu350k

More Projects on https://github.com/ShaifArfan/wc-project-tutorials



Project Description

In the project, we will be creating a Complete Todo Application with all features. We will do all the CRUD operations. We will to use React.js and to manage our states, we will use Redux. Also we will learn to make simple animations using Framer Motion. This will be a complete beginner friendly app. Hope you enjoy it.

What we are going to learn/use

Requirements

  • Basic ReactJs knowledge
  • Basic HTML, CSS knowledge

Starter files

You can find all the starter files in starter-files branch. You can to go to the starter-files branch and download zip the the starter files or You can clone the project and git checkout to starter-files branch.

Getting Started

The recommended way to get started with the project is Follow the YouTube tutorial. You will find all the step-by-step guides. Or you Can start the project on your own by following the guide below.

After getting the starter files, you need to go the file directory and run

npm install
Enter fullscreen mode Exit fullscreen mode

and after that start the dev server.

npm start
Enter fullscreen mode Exit fullscreen mode

Tools Used

  1. Favicon: Flaticon.com
  2. Code Editor: VS Code

FAQ

Q: How can i get started?

You can get started by following the YouTube tutorial of this project. Here is the full tutorial video link: [coming soon].

Q: What i need to start the project?

Just open your favorite code editor and follow along with the YouTube tutorial.

Q: Who the project is for?

The project is for the people who wanna get more skilled in ReactJs.


Feedback

If you have any feedback, please reach out to us at @web_cifar

Support

For support, join our Community Group.

License

MIT

More Projects on https://github.com/ShaifArfan/wc-project-tutorials

Happy Coding! 🚀

AWS Q Developer image

Your AI Code Assistant

Automate your code reviews. Catch bugs before your coworkers. Fix security issues in your code. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay