DEV Community

Top 10 React.js Tips and Tricks Everyone Should Know

Vishal Yadav on June 29, 2024

1. Embrace JSX for Cleaner Code 📝 JSX is a syntax extension for JavaScript that allows you to write HTML-like code directly within JavaS...

Read full post

Manvendra Singh • Jun 29

Use TypeScript so that you don't need to rely on PropTypes. Moreover, TS will give you type safe context ysage if you opt for it.

Enamul Haque • Jun 29

Good article

Vishal Yadav • Jun 29

Thanks!

kalynux • Jun 30

Thanks

almogzur • Jun 30

Grate but EroorBoundaries is only for class components and you recomeded
React.FC

Vishal Yadav • Jun 29

Nice

Rong Sen Ng • Jun 29

useReducer is over-complicating your implementation. Avoid using this whenever you can, unless you're a Redux fans.

Rense Bakker • Jun 29

You can make reducers as complicated or as simple as you want. It's much simpler to manage a state object with different properties, using a reducer, than with useState:

function simpleReducer(currentState, newState){
  return {...currentState, ...newState}
}

const initialState = {
  name: '',
  email: ''
}

function SomeComponent(){
  const [person, setPerson] = useReducer(simpleReducer, initialState)
  return <button onClick={() => setPerson({ name: 'hello' })}>click</button>
}