title: Reactjs: Nothing Was Returned From Render
body: <p>I have setup a basic react app using <code>create-react-app</code> and created my first component. However, the project is not able to build or render due to this error in browser window:</p>
  
  <pre><code>CountDown(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
  ./src/index.js
  D:/ReactDev/CountDownReact/countdown/src/index.js:8
  </code></pre>
  
  <p>Here's my <code>index.js</code> file code:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import './index.css';
  import Bulma from 'bulma/css/bulma.css'
  import App from './components/App/App';
  import registerServiceWorker from './registerServiceWorker';
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
  registerServiceWorker();
  </code></pre>
  
  <p>and the <code>App.js</code> where I have imported the new component:</p>
  
  <pre><code>import React, {Component} from 'react';
  import './App.css';
  import CountDown from '../countdown/Countdown';
  
  class App extends Component {
      render() {
          return(
              &lt;div className="App"&gt;
                  Hello React
                  &lt;CountDown/&gt;
              &lt;/div&gt;
          );
      }
  }
  
  export default App;
  </code></pre>
  
  <p>Finally, my <code>Countdown</code> component code:</p>
  
  <pre><code>import React from 'react';
  
  const CountDown = (props) =&gt; {
      &lt;section class="section"&gt;
          &lt;div className="hero-body"&gt;
              &lt;div class="container"&gt;
                  &lt;h1 class="title"&gt;Section&lt;/h1&gt;
                  &lt;h2 class="subtitle"&gt;
                   A simple container to divide your page into &lt;strong&gt;sections&lt;/strong&gt;, like the one you're currently
                  reading
                  &lt;/h2&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  };
  export default CountDown;
  </code></pre>
  
  <p>Do I need to also import my new component here? How do I solve this issue. Thanks.</p>