DEV Community

Matthias Andrasch
Matthias Andrasch

Posted on • Edited on

SvelteKit frontend + GraphQL backend hosting in the EU?

In the recent months I tried to get an overview of how to build simple web apps with SvelteKit and a backend solutions, e.g. simple personal side projects. I look for open source solutions (if available). This is my current state of research, happy for every suggestion!

1. How can I use GraphQL?

It took me so while to understand that GraphQL is just meant to be a better alternative to the REST api, the next evolutionary step so to speak (GraphQL allows you query multiple data objects with one request and aimes at prevent overfetching. See e.g. GraphQL vs REST).

How can GraphQL apis be connected to SvelteKit? Rodney Lab has a good tutorial on using fetch: SvelteKit GraphQL Queries using fetch Only. Backend solutions like supabase offer a JS-client (supabase JS client) to connect to the api.

If I should choose a solution immediately, it would definitely be Supabase because of the easy setup and row level security integration. Crazy how simple web app building became! See this multi user TODO app example from James Q Quick, where users can only edit their own TODOs:

But it comes at a price: $25/project/month is not something which is suitable for a lot of sideprojects. Therefore I looked for alternatives (see 3.).

2. How can I host it on EU servers (GDPR-compliance)

Hosting in EU server regions is (still) not a standard for every hosting solution, e.g. vercel and netlify have no such option currently as far as I know. (Why is this important? See the recent discussion about austrias data protection agency which found that the use of google analytics is a violation of EU data protection rules).

Luckily there are hosting solutions such as render.com or supabase which let you select a european server region:

Screenshot select option for Frankfurt/EU as server region on render.com

Screenshot of server region options on supabase

3. Alternatives like Supabase

Because Supabases starter pricing of 25$/month/project won't be a fit for most side projects, I found the following alternatives:

Node Backend (selfhosted)

  • Strapi
  • Directus

Strapi has a convincing way of building a backend, everything is nicely tracked in git. I didn't tested directus, but it seems to offer a similiar experience. But - coming from a PHP background - I still find it very challenging to deploy nodeJS backends. See e.g. the guide Deploy Strapi, lots of options and every service will cost a monthly fee (of course).

SaaS:

There are of course a lot of "Software as a Service"-type of services, e.g. Supabase for web apps, Storyblok for editorial workflows.

  • Supabase
  • Storyblok
  • Hasura, Fauna, GraphCMS ... a lot more

While these all look convincing, their pricing can vary as well and selfhosting the open source ones would be overkill for side projects.

PHP (selfhosted):

So funnily enough my current state of research ended where it began - looking at PHP options. PHP backends are easy to deploy, there are tons of hosters in EU-regions, no pricy rate limits and there are as well green hosters.

I currently evaluate the following approaches, looking for a simple and secure way of building simple web apps:

  • WordPress WPGraphQL (follow Jason Bahl for twitter fun ;-)). Building the simple multi user TODO app example from above is theoretically possible with WPGraphQL as well, but there are no tutorials yet and it will take some custom work (see answer of Jason in WPGraphQL slack).

Side note: WPEngine recently launched the platform Atlas: The Future of Headless WordPress, will be interesting to see if this will be a major push for headless wordpress and GraphQL in the wordpress world.

  • Laravel Lighthouse seems very promising and there are a few tutorials and online courses available for it yet (beginner advice from RamboVivaldi). I currently research on how to get a nice and simple dashboard experience for Laravel (like the ones you saw in the Supabase SvelteKit tutorial above).

Let's see where I'll come up in the next months. :-)

How about you? Where do host your frontend and backend? How do you build simple web apps for side projects with SvelteKit?

Updates:

Other providers / tools I found after writing this article.

Top comments (4)

Collapse
 
gevera profile image
Denis Donici • Edited

So deploying node.js might be somewhat complicated. But once you get it, it is very easy. Basically, you need a server with Linux, install nginx with reverse proxy to the port you'll be running your app. Say 3000. And you also want pm2 for running your nose apps. Plenty of examples online. Strapi and Director both are great

Collapse
 
mandrasch profile image
Matthias Andrasch

Thanks for your reply! :-) In comparison to managed server/shared webspace options for PHP, a custom linux nodejs server still need to be managed and updated (=> security). I'm personally not into server admin stuff, but if you have these skills (or personal resources), that's great.

render.com/ offers managed node hosting and has a tutorial for the different strapi deployment strategies render.com/docs/deploy-strapi.

I guess in the future there will be more and more easy hosting options for nodejs, like the ones already existing for PHP.

Cheers!

Collapse
 
mariaalonso2705 profile image
Maria Alonso

Hi Matthias, Really interesting post comparing EU hosting providers.

For your SaaS category, you might find Northflank interesting. You can select to deploy your servers in the Europe region, you only pay for the resources you use and we have a comprehensive UI.

Project Region

Let me know your thoughts when you get to try it! Also happy to answer any questions: maria@northflank.com

Collapse
 
mandrasch profile image
Matthias Andrasch

Update: There is a new contender, which connects to EU providers like Hetzner -> cleavr.io/

See twitter.com/m_andrasch/status/1494... for more info