React Component mounting life cycle called twice react 16.13.1 - reactjs

Question

I am using react 16.13.1 and created react app using create-react-app 3.4.1.
Mounting lifecycle is being called twice for every component.
I created component FirstComponent.js
import React, {Component} from 'react';
class FirstComponent extends Component {
constructor(p) {
super(p);
console.log("FirstComponent constructor called")
}
componentDidMount() {
console.log("FirstComponent componentDidMount called")
}
static getDerivedStateFromProps() {
console.log("FirstComponent getDerivedStateFromProps called")
return null;
}
render() {
console.log("FirstComponent render called")
return (
<div>
Hello World
</div>
);
}
}
export default FirstComponent;
and called FirstComponent from App.js
import React, {useEffect} from 'react';
import FirstComponent from "./FirstComponent";
function App() {
useEffect(()=>console.log("App useEffect Called"));
console.log("App called");
return (
<FirstComponent/>
);
}
export default App;
console output: (ignoring getDerivedStateFromProps warning)
App called
App called
FirstComponent constructor called
FirstComponent constructor called
FirstComponent getDerivedStateFromProps called
FirstComponent getDerivedStateFromProps called
FirstComponent render called
FirstComponent render called
FirstComponent componentDidMount called
App useEffect Called

Answer 1

This is because codesandbox.io runs react applications in strict mode by using <React.StrictMode /> and in strict mode side effects are double-invoked means executed two times, if you unwrap your <App /> component from <React.StrictMode> in index.js it'll work just fine.
Here's how docs define this:
Strict mode can’t automatically detect side effects for you, but it
can help you spot them by making them a little more deterministic.
This is done by intentionally double-invoking the following functions:
Class component constructor, render, and shouldComponentUpdate methods
Class component static getDerivedStateFromProps method Function
component bodies State updater functions (the first argument to
setState) Functions passed to useState, useMemo, or useReducer