App.js

import React, { Component } from 'react';
import { render } from 'react-dom';

let id = 0;

class App extends Component {
  state = { cards: [] }

  addCard(text) {
    this.setState({
      cards: [...this.state.cards, {
        id: id++,
        text
      }]
    })
  }
  
  changeCardStatus = (id, status) => { /* TODO: change card status */ }

  removeCard = (id) => { /* TODO: remove card */ }
  
  render() {
    return (
      <div>
        <input ref="name" /> 
        <button onClick={() => this.addCard(this.refs.name.value)}> 
          Add 
        </button>
        
        {this.state.cards.map((card) => 
          <p key={card.id}>{card.text}</p>
        )}
      </div>
    );
  }
}

render(<App />, document.getElementById('app'));