@X27 Ah, yeah. What gets me is that that's how it appears most other people do it, but it works for them. So I gave up for now.

@CJ101 the code I gave is expected to not work, a fix would be checking if data is null and displaying a loading graphic/message.

Reason why it doesn't work is below the code block

@X27 I have almost exactly that and it does just about flip all lol.

@CJ101 wondering if you figured it out, and not sure if what I'm mentioning applies to you.

Basically wondering if you have something like this:

function MyComponent(props) {
  const [data, setData] = useState(null);

  useEffect(() => {
    const data = /* fetch, error checking, etc */
    setData(data);

    // Sounds like you're logging in a location similar to here, aka right after fetch completes
  })

  // If you log here you'll know if data is available on first render
  return <div>{data.map(/* element */)}</div>;
}

Code above basically makes a request, then renders `data` (might not be the exact order). Yet `data` is null until the request completes, and React will render before it completes.

I'm guessing you have an entirely diff situation so this prob doesn't help or you already know this lol

@X27 it's being logged in the api routing I built. So, instantly, when the data hits.

@CJ101 are you sure data exists on first render? Need to know if you're logging right before the return or in the hook.

@CJ101 hmmm this sounds vaguely familiar to me but I can't recall what issue I'm thinking of.

update: this crap is still killing me. Fixed the cors garbage, and it's back to not populating the page after I call the API. What gets me is that if I go to the API url, I get a nice pretty JSON output, when I go to the browser page, it spits it out into console, but it will always, always say that data.map is not a function, despite having fetched the data, even with useState/useEffect. It's a never-ending cycle and I cannot understand how people just get this to work right off the bat with the basic boilerplate examples.

@X27 Nono, I'm saying I had a react issue, which took forever, which gave way into a separate issue, which is not a react issue. I'm just frustrated because it's one thing after another. But, giving my requests the right headers in my react project seem to do absolutely nothing lmao

I'm really lost on how headers is a React issue since it's a client side library. Wouldn't this be a node/express/whatever server issue even if you're working with server side React?

@CJ101 Clearly is react. Try dart & flutter instead?

@CJ101 weird.

@.:A-MAN:. I like all the libraries and frameworks available, but this problem is impossible to diagnose because I've done all the possible fixes that I know of. It's not even a React problem at this point

I'm not a huge fan of react. :/