npm: Node Package Manager for JavaScript
Vite: Frontend build tool for modern web development
TypeScript: Typed superset of JavaScript.
Node.js: JavaScript runtime environment
Express: Minimalist web framework for Node.js
MUI: React components for Material Design UI.
Mongoose: MongoDB object modeling for Node.js.
Redux Toolkit: A simplified and efficient way to manage state in Redux applications.
Framer Motion: React animation library for smooth, high-performance UI transitions.
- Add new todos to the list
- Mark todos as complete
- Delete todos from the list
- Edit existing todos
- Filter todos by all/active/complete
- Clear all completed todos
- Toggle light and dark mode
- Sort todos by their create time in ascending (oldest first) and descending (newest first) order.
- View optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- View the last status update time of todos on hover
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
- First of all you need to clone app repository from github:
git clone https://github.com/DavitDvalashvili/todo-mern-app.git
- Next step requires install all the dependencies.
npm install
- To see project in action
npm run dev
Before every deployment you need to create build file.
npm run build
after this you can use this file to deploy project on server.
|-- api
| |-- controllers
| |-- models
| |-- routes
| |-- utils
| |-- index.js
|-- readme
|-- client
| |-- public
| |--src
| | |-- App
| | | |-- store.ts
| | | |-- hook.ts
| | |-- Feature
| | | |-- themeSlice.ts
| | | |-- todoSlice.ts
| | |-- components
| | |-- app.js
| | |-- main.js
| | |-- theme.ts
| | |-- types.ts
| | |-- moduleAugmentation.ts
| | |-- main.js
| |--index.html
- Github profile - Add your name here
- Linkedin profile - Add your name here
- Email - @your_username