title: LoadError (Unable to autoload constant Board_Game, expected /models/board_game.rb to define it)
body: <p>Full server error: </p>
  
  <p><code>LoadError (Unable to autoload constant Board_Game, expected /Users/michellegarcia/coding_personal_projects/board_game_app/app/models/board_game.rb to define it):</code></p>
  
  <p><code>app/controllers/api/board_games_controller.rb:3:in `index'</code></p>
  
  <p>I have a spelling or capitalization mistake here, but I can't find where. I want to console.log all <code>Board_Games</code> that I have manually seeded into my database so that I list them.</p>
  
  <h3>controller</h3>
  
  <pre><code>class Api::BoardGamesController &lt; ApplicationController
  
    def index
      render json: Board_Game.all
    end
  
    def show
      render json: @board_games
    end
  
    def create
      board_game = Board_Game.new 
      if board_game.save
        render json: board_game 
      else
        render json: board_game.errors
      end 
    end
  
    def update
      if @board_game.update(board_game_params)
        render json: @board_game 
      else 
        render_error(@board_game)
      end 
    end
  
    def destroy 
      @board_game.destroy 
    end 
  
    private 
  
    # def set_board_game 
    #   @board_game = Board_Game.find(params[:id])
    # end 
  
    def board_game_params
      params.require(:board_game).permit(
      :title,
      :min_players,
      :max_players,
      :base_game,
      :time_needed,
      :company 
      )
    end 
  
  end
  </code></pre>
  
  <h3>model</h3>
  
  <pre><code>class BoardGame &lt; ApplicationRecord
    has_many :game_sessions, through: :game_session_games 
    has_many :rounds 
  end
  </code></pre>
  
  <h3>routes</h3>
  
  <pre><code>Rails.application.routes.draw do
    mount_devise_token_auth_for 'User', at: 'api/auth'
    namespace :api do
      resources :board_games do 
        resources :game_sessions 
      end 
      #API ROUTES SHOULD GO HERE
    end
  
    #Do not place any routes below this one
    get '*other', to: 'static#index'
  end
  </code></pre>
  
  <h3>board game component</h3>
  
  <pre><code>import React, { Component } from 'react';
  import axios from 'axios'; 
  
  //needs to do a call to the API to get the user's games from the user_board_game table 
  //if the user has no games, it needs to default to "You have no games. Add games to your library by clicking
  //"Add Game""
  //don't know if "Add Game" should be its own component or a conditional render. 
  //I want people to be able to add multiple games at once. Search Games. And have the option to add a game
  //not on the list and auto-add it to their library. Also should have a checkbox for 
  //"I have played this game before" so their backlog can be easily sorted. 
  //if they've clicked on Add a Game, it should no longer render in the other component
  
  class Games extends Component {
  
    state = { games:[] }
  //wasn't hitting debugger in componentDidMount because I had Component capitalized. 
  //then I was getting a 500 from my server because I didn't have resources :board_games in my routes.rb
  //now getting 404
  //this error "ActionController::RoutingError (uninitialized constant Api)" in server 
  //created an api folder in my controllers folder and moved my proprietery controllers inside it
  //new error: app/controllers/api/board_games_controller.rb:15: 
  //syntax error, unexpected tINTEGER, expecting keyword_end
  //got rid of 422 on line 15 
  //new error: LoadError (Unable to autoload constant 
  //Api::BoardGamesController, expected 
  ///Users/michellegarcia/coding_personal_projects/board_game_app/app/controllers/api/board_games_controller.rb
  // to define it):
  // my has_many :blank didn't have colons in board_game.rb 
    componentDidMount() {
  //runs when the user wants to add a game from the database
  //link to more info and button to add the game if it's not in their library already 
      axios.get('/api/board_games')
        .then(res =&gt; {
          // const games = res.data;
          console.log(res); 
          // this.setState({games});
        })
    }
  
    getUserGames = () =&gt; {
  //runs when component mounts and then goes to the Games_List Function
  //checks if the user has games user.games? return { the list} : return {&lt;h1&gt;You have no games&lt;/h1&gt;}
    }
  
    gamesList = () =&gt; {
  //gives each game with a link to more info  
    }
  
    render() {
      return (
        &lt;div&gt;
          &lt;h1&gt;Games&lt;/h1&gt;
          &lt;button&gt;Add a Game&lt;/button&gt; 
          &lt;h3&gt;Your Games&lt;/h3&gt; 
        &lt;/div&gt;
      )
    }
  }
  
  export default Games;
  </code></pre>
  
  <p>I've left all of my dumb notes and undefined logic in the app in case you can foresee a problem coming or have any other notes. I'm just here to learn so I'm open to critiques on anything.</p>
  
  <p>Most other posts here that have a similar title seem to have issues with the same class name in different namespaces, which I don't have yet.</p>