Skip to content

This project is a simple website created for practicing basic HTML, CSS, JavaScript and react skills.

Notifications You must be signed in to change notification settings

Dor-Ka/todolist-react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

To Do List - React

Demo

Link to the page

About

This project is a simple website created for practicing basic HTML, CSS, JavaScript, and React skills.

Technologies Used

  • HTML: Structuring the content of the web page.
  • CSS: Styling the web page using modern techniques.
  • JavaScript: Adding interactivity and logic to the web page.
  • React: Building a dynamic user interface with components.

Key Features and Libraries

  • BEM: Block Element Modifier methodology for writing structured and maintainable CSS.
  • ES6+ features: Modern JavaScript features for cleaner and more efficient code.
  • CSS Grid: For creating complex and responsive layouts.
  • Media Queries: For responsive design to ensure the application looks good on all devices.
  • Immutability in JavaScript: Ensuring data is not mutated directly for predictable state management.

React Features

  • useState: Hook for managing state within components.
  • useEffect: Hook for performing side effects in function components.
  • Custom Hooks: Reusable logic across different components.
  • styled-components: For writing CSS in JavaScript and styling React components.

Redux Features

  • Slice: Creating slices of the Redux state for modular and maintainable code.
  • Provider: Making the Redux store available to the entire application.
  • useSelector: Selecting state from the Redux store.
  • useDispatch: Dispatching actions to the Redux store.

demo:

demo.img

demo.img-mobile

demo.search

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.