← Errors
React requires every function component to return a React element, null, or undefined. This error is thrown when a component's render function returns nothing (undefined) because the JSX expression was written without a return statement.
Why it happens
- •The return keyword is missing before JSX in a function component.
- •An arrow function uses {} body syntax instead of () which requires an explicit return.
- •A conditional render accidentally returns undefined on some code path.
- •A component function has a missing return in a branch.
Examples
JavaScript
Code that triggers the error
function Button({ label }) {
// forgot return keyword
<button>{label}</button>;
}Error output
Error: Nothing was returned from render. This usually means a return statement is missing.
How to fix it
Add the return keyword before your JSX. For arrow function components, either use the parenthesis form (=> (...)) or add an explicit return inside the braces. Return null instead of undefined if the component should render nothing conditionally.
Fixed code
function Button({ label }) {
return <button>{label}</button>;
}Related errors
Ready to practice your English at work?
Lingua-e has interactive exercises built around real developer conversations: standups, code reviews, retrospectives, and more. Practice until it comes naturally.
Try Lingua-e for free