React calling function?

Slightly new to react and playing around with lists, not sure why my code isn't performing as required, when I call the method it just displays plain html

Ive tried putting it between tags but nothing

Can someone point out what I'm doing wrong?

import React, {Component} from 'react';
import logo from './logo.svg';
import './App.css';
import List from './List'

class App extends Component { //different
  render() { //different
    // The rest of the file is the same
    return(
    <div className="App"> 
    Liste();

    </div>)
  };


}

function Liste(){
  const names=['d','d']

  return(<div>
  <h2>{names[0]}</h2>
   <h2> {names[1]}</h2>
  </div>)
}

export default App;