Stop Using JavaScript Fetch - Do This Instead!

Показать описание

Modern JavaScript frameworks don't want to you to use fetch like you used to. The best practices with Single Page Applications no longer apply. You should be taking full advantage of the server instead of making API requests from the frontend.

**Newsletter**

**DISCORD**

**QUESTIONS ABOUT MY SETUP**

**TIMESTAMPS**
00:00 - Intro
00:45 - Use of JavaScript Fetch
01:20 - My Mistake Using Fetch
03:00 - Moving Logic To the Server WITHOUT Fetch
04:30 - Database Setup
05:40 - Wrap Up

Рекомендации по теме

Комментарии

Doesn't this cause close coupling where the frontend is really dependent on backend

jerins

Behold, the js frameworks slowly morph back into a PHP/Perl/ColdFusion/etc architecture. The more things change... =) Thanks for covering this, James. Since you asked, I prefer fetch, though I still sometimes am even known to crank out a new XMLHttpRequest...

onejdc

Sveltekit does this automatically, when you fetch an internal api endpoint server side, it automatically calls the endpoint handler instead of actually making the http request !

romaindurand

Really like the way you create these to the point web "snip-it's". Your like laser focus and spot on with info new to my vocabulary coming from a network, security and "OS system" API background. It's taken me a while to swallow what a "web" API is. MAJOR paradigm shift.

bradg

0:25 I always use fetch, you can easily wrap it around a function or class to suit your needs and you do not need to install a library for it

LePhenixGD

Hey james, what courses do you recommend for node/express?

lostinthenarrativve

Svelte does this automatically... converts server fetch to a procedure if to same backend.

jonathangamble

Hi does anyone know which theme James is using in VSCode?

naveen.design

Everything old is new again :)

This feels SO much like the ye olde PHP that we were writing 15-20 years ago. Feels _exactly_ like the views we were writing in some ancient version of Zend framework

JoelPeltonen

Two questions:
- 1/ Is there a way to organize this type of backend code in a more maintainable way? I think about Clean Architecture or something like that.
- 2/ If I understand well. The server code is running on netlify servers, as a type of node server. But your database is hosted by Xata, on another server. So, there will be a request from the code running on netlify and Xata instance ? Am I right ?

JeromeAbelDev

Hola James, ¿tu curso de Astro tiene subtítulos en español? Saludos...

steeldragon-

Missed opportunity for "Stop trying to make fetch happen"

RayAndrewsDev

you are awesome can you tell which font-family and theme you are using or you can paste setting.json in vscode
]

SaivivekRaavi-xr

So true much easier to be able to manage backend end code and consume on the frontend in the same file, especially with Astro. One thing that limits this behavior with Astro it's when you're using island components. For example with a click event you want to call the API. If you declare your function in the Astro file and want to pass that function as props into your React component (for example), you can't. You will still have to use a fetch method in your react component creating an api endpoint. The good thing of having an endpoint in another file is that you can reuse it in different pages, no need to re-write the function in every Astro file that need it. Anyway, totally agree that in most cases no need to have to fetch, which is pretty cool!!!

christopheanfry

Maybe I'm the odd one out but I don't use frameworks for my apps (engineering materials and price calculation). To get data from the server Fetch and a few lines of PHP code works just fine for me...I convert static non-confidential data from Excel to a JS object that's included in the build...I'm a great fan of KISS ;-)

montebont