Movie-Search | using Solarium in conjunction with Apache SOLR | Learning library

I deployed my React app to GitHub Pages (https://github.com/qriscilla/movie-search-application), but the homepage is not displaying what it's intended to show.

Below is what I see when I open up the app in my localhost via npm start

But on the GitHub Page I deployed my code to (https://qriscilla.github.io/movie-search-application/#/), it only shows the background image as such:

And when I open up the console, it gives me these two error messages:

I have a Spring Boot ResourceServer, and a React client application. I am trying to send a POST request to one of the server endpoints (which has the @CrossOrigin annotation btw.), however, I am getting this error in the console:

Access to XMLHttpRequest at 'http://localhost:8080/api/search' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

The preflight request returns a 401 Http status, and I don't know why.

The response headers for the preflight request look like this:

I'm trying to build a simple search function for my web app. there is documentation on how to create it with real time database.

What changes do I need to make to make this work on firestore ?

this tutorial was taken from here https://angularfirebase.com/lessons/autocomplete-search-with-angular4-and-firebase/

it has a nice video as well :)

this is how to make it with real time database:

In heder there is a component with live search in which there are links for the found film or TV series depending on what came from the server.

There is an electron framework that gives you a stripped down browser to build your user interface for the desktop application. In my case, I am using jQuery for DOM navigation, Sequelize to talk to my sqlite database and a couple other libraries.

Let's say I have a text field where the user can type a movie name. My database stores a couple hundred movie names. So I would like to offer the user autocomplete suggestions.

Typically, I would use something like this to register a jQuery handler (this will echo field input back to console):

I'm making a simple search engine for movie data using omdbapi.com API. I've set up the service to fetch the data and the components to create the view but when I try to connect to the HTML i get an error:

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays. Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

Movie class