Hi guys, I'm new to NextJS (14). I am implementing a project, where I need to fetch data from a server component.
I have implemented a GET route handler using AppRouter, which servers a hardcoded object for testing, and I fetch that from the server component using react query

Locally, both in development and after built, the code works perfectly, but when deploying the app in Vercel, the fetcht never returns any data (await response.json())

I managed to get the response in plain text, which contains a HTML that includes this text:

           <div class="spinner_bar__VysK5"></div>
                                        <div class="spinner_bar__VysK5"></div>
                                    </div>
                                </div>
                                <p class="text_wrapper__i87JK" data-version="v1" style="--text-color:var(--ds-gray-1000);--text-size:1.5rem;--text-line-height:2rem;--text-letter-spacing:-0.029375rem;--text-weight:700">
                                    Building
                                </p>
                            </div>

Which makes me think that actually the endpoints are not served by the time the server component makes the call.
After searching for hours, what I understand is that I can't do that, for the reason stated above. Is this correct?

If so, why is this working locally?

Thanks!