Five Ways to Write a Functional Component

Functional components are the bread-and-butter of any React application, especially with the addition and expansion of React Hooks. This post breaks down a simple functional component (Version #1) and then shows four additional ways it could be written. Enjoy:

Version #1: ES5 and Props Object

This first version is very simple. It’s a simple function called `Button` that takes an argument, .

Version #2: ES6 and Props Object

Version #3: ES6 and In-Function Destructured Props

Version #4: ES6 and Destructured Props

Version #5: ES6 and Export Default Anonymous Function

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store