title: TypeError: this.setState is not a function
body: <p>This is my code:</p>
  
  <pre><code>const cookies = new Cookies();
  var name = (cookies.get('name'));
  var key = (cookies.get('key'));
  console.log(key);
  const theme = createMuiTheme({
    palette: {
      primary: amber,
      secondary: blue
    },
    root: {
      flexGrow: 1,
    },
    bottomView: {
  
      width: '25%',
      height: 50,
      backgroundColor: '#FF9800',
      justifyContent: 'center',
      alignItems: 'center',
      position: 'absolute',
      bottom: 0
    },
  });
  class Base {
    constructor() {}
  }
  
  class Homework extends Base {
    constructor() {
      super();
  
      this.state = {
        topicBox: null,
        payloadBox: null
      };
  
      this.publish = this.publish.bind(this);
      this.handleChange = this.handleChange.bind(this);
    }
   publish(event) {
      this.setState({value: event.target.value});
    }
    handleChange(event) {
      this.setState({value: event.target.value});
    } 
  
  
    async loadTest() {
      try {
        //grab courses
        const response = await fetch('https://classroom.googleapis.com/v1/courses?access_token=' + key);
        const json = await response.json();
        //coursemax vars will eventually be user defined
        var coursemax = [2, 2, 2, 2, 2, 2, 2, 2];
  
        if (json.courses != null) {
          for (var course = 0; course &lt; json.courses.length &amp;&amp; course &lt; 9; course++) {
            //grab course info
            var coursework = await fetch('https://classroom.googleapis.com/v1/courses/' + json.courses[course].id + '/courseWork?access_token=' + key);
            var coursejson = await coursework.json();
            console.log(coursejson);
            var assignment = "";
            for (var assignmentnum in coursejson.courseWork) {
              if (assignmentnum &lt;= coursemax[course] - 1) {
                //add in assignment
                assignment += "&lt;p&gt;" + coursejson.courseWork[assignmentnum].title + "&lt;/p&gt;";
                //"Due: "+coursejson.courseWork[assignmentnum].dueDate.month+"/"+coursejson.courseWork[assignmentnum].dueDate.day
              }
            }
            //making ids to render
            document.getElementById('class' + (course + 1) + 'info').innerHTML = assignment;
            document.getElementById('class' + (course + 1)).innerHTML = json.courses[course].name + '&lt;/b&gt;' + ':' + '&lt;br/&gt;';;
          }
        }
      } catch (err) {
        console.log(err);
      }
    }
  }
  var app = new Homework();
  var config = {
    apiKey: "xxx",
    authDomain: "xxx",
    databaseURL: "xxx",
    projectId: "xxx",
    storageBucket: "xxx",
    messagingSenderId: "xxx"
  };
  firebase.initializeApp(config);
  app.loadTest();
  
  function publish() {
    console.log(this.state.topicBox, this.state.payloadBox);
    const itemsRef = firebase.database().ref('Users');
    const item = {
      title: this.state.topicBox,
      user: this.state.payloadBox
    }
    itemsRef.push(item).set("name");
    this.setState({
      topicBox: '',
      payloadBox: ''
    });
  
  }
  
  const LoginPage = () =&gt;
  &lt;MuiThemeProvider theme={theme}&gt;
        &lt;div&gt;
          &lt;AppBar position="static" id='title'&gt;
            &lt;Toolbar&gt;
              &lt;Typography type="title" color='inherit'&gt;
                MVHS Homework App
              &lt;/Typography&gt;
              &lt;div id='avatar' color='inherit'&gt;&lt;Avatar&gt;{name[0]}&lt;/Avatar&gt;&lt;/div&gt;
            &lt;/Toolbar&gt;
          &lt;/AppBar&gt;
  
        &lt;input 
          type="text" 
          name="topicBox" 
          placeholder="Name" 
          value={ this.state.topicBox }
          onChange={ this.handleChange } 
        /&gt;
        &lt;input 
          type="text" 
          name="payloadBox" 
          placeholder="Details"
          value={ this.state.payloadBox } 
          onChange={ this.handleChange } 
        /&gt;
        &lt;Button variant="raised" color="secondary" style = {theme.bottomView} onClick={ this.publish }&gt;
          Secondary
        &lt;/Button&gt;
        &lt;/div&gt;
  
      &lt;/MuiThemeProvider&gt;
  
  
  
  export default LoginPage
  </code></pre>
  
  <p>In the code above, there is an error on:</p>
  
  <blockquote>
    <p>this.setState({value: event.target.value});</p>
  </blockquote>
  
  <p>And the Error is:</p>
  
  <blockquote>
    <p>TypeError: this.setState is not a function</p>
  </blockquote>
  
  <p>Why is this happening? </p>
  
  <p><strong><em>EDIT:</em></strong> The error I believe is the only issue with the code right now. Feel free to tell me if any more errors. :) (Am I nor establishing the car correctly?)</p>
  
  <blockquote>
    <p><strong><em>EDIT:</em></strong> Will this code sent a value with the edited text inputs to the database?</p>
  </blockquote>