Why Should Js Function's Name Starts With A Capital Letter

I wrote a function. I used only simple letters for the name of that function. I didn't get any output and error. I highlighted this function. Lesson3.js import React from 'react'

Solution 1:

Here, you have tried to use FormattedDate as a component. Not as an ordinary function.

All React component names must start with a capital letter. If you start a component name with a lowercase letter, it will be treated as a built-in element like a <div> or a <span>. This is because of the way JSX works.

You can find more information here

Solution 2:

It's a naming convention to use capitalized variable/function names for components, to distinguish them from regular/helper/etc functions.

functionButton() { return<button>Test</button> }

functionsortNumbers(array) { return ... }

Solution 3:

React treats components starting with lowercase letters as DOM tags. For example, <div /> represents an HTML div tag, So in :

1. <formattedDate .../> React treat as DOM tag, Obviously which it is not

On otherhand <UpperCase /> represents a component and requires it to be in its scope

2. So, <FormattedDate /> represents a component and requires FormattedDate to be in scope.

If you want to learn more about component you can read more at React Offical docs for component and props