.like-button {
background-color: #009688;
color: white;
border: none;
padding: 10px 20px;
cursor: pointer;
border-radius: 5px;
}

Creating a Like Button in React JS

In this tutorial, we will learn how to create a simple button that acts as a like button in a React JS application.

class LikeButton extends React.Component {
constructor(props) {
super(props);
this.state = {
liked: false
};
}

handleClick = () => {
this.setState({ liked: !this.state.liked });
}

render() {
const text = this.state.liked ? ‘Unlike’ : ‘Like’;
return (

{text}

);
}
}

ReactDOM.render(
,
document.getElementById(‘likeButton’)
);