React Jammming no communicating with Spotify

Language Help React.js
1

I am working on the React Jammming Project

I am having problems getting communication with Spotify working, I have all the components working with test data, When I try to connect to Spotify, I get a question mark at the end of my redirect uri “http://localhost:3000/?”

I even tried using the solution code for the Spotify component, and I still get the same result.

I started moving some of my other component code into the sample code, and when I made a small change to SearchBar.js I found the problem:

import React, { useState, useCallback } from "react";

import "./SearchBar.css";

const SearchBar = (props) => {
  const [term, setTerm] = useState("");

  const handleTermChange = useCallback((event) => {
    setTerm(event.target.value);
  }, []);

  const search = useCallback(() => {
    props.onSearch(term);
  }, [props.onSearch, term]);

  return (
    <form className="SearchBar">
      <input placeholder="Enter A Song Title" onChange={handleTermChange} />
      <button className="SearchButton" onClick={search}>
        SEARCH
      </button>
    </form>

    // <div className="SearchBar">
    //   <input placeholder="Enter A Song Title" onChange={handleTermChange} />
    //   <button className="SearchButton" onClick={search}>
    //     SEARCH
    //   </button>
    // </div>
  );
};

export default SearchBar;

The only difference is line 17. Changed from a

to a . Then save and run, and it goes from working to getting “http://localhost:3000/?” in the address bar.

Does the topmost HTML tag have to be a

??