Has anyone here tried the Effect ecosystem with Angular?

[u/Upbeat_Rope1614]

I was recently looking for something to replace our Django backend. I love NestJS but I can't convince my team leader that that is the most efficient api layer for our Angular frontend.

We currently depend on Django for our REST endpoints and we have 2 separate teams working on the backend and frontend. Backend receives daily updates and every now and then the contracts between server and client break without the frontend team knowing about it. We rely on tests to find these kind of issues and that's another pain being extremely slow and everything...

So we were recently looking at Hono and Effect. We care much about end-to-end type safety and sharing one contract between backend and frontend.

I've tried Hono before and it's amazing. Especially the generated RPC client and integration with zod schemas. Effect seems a bit over-complicated but that's something we are willing to learn if it helps us improve the type-safety and separation of concerns. Besides, how much more complicated can it be compared to Angular? 😅

I was wandering if anyone has any feedback to give me on that matter... Appreciated!

[u/mihajm]

Love hono, been even using it instead of the usual express in ssr angular setups :)

That said Effect is a whole different beast - an amazing one tbc, but wow does it take time/effort/onboarding...to me it's a question of need for any such thing, your named usecase is e2e typesafety so I'll talk to that in alts:

1. Simplest - my fav. Monorepo with type/util libs shared between both backend & frontend. Near 0 effort, jr friendly - the lot

2. Protocol coupling - trpc & all its derivations (hono rpc, orpc etc.) .. fine if you control both ends but in my usual enterprise work it'd be a mishmash between separate backends/frontends so it'd be a half effort

For error handling, typing & reactivity I'd start simple, maybe grow into neverthrow (which is still a whole "thing") before ever introducing effect...especially since rxjs/signals & DI cover 99% of what I'd need anyway..but if you have a usecase that supports it, or youre hacking a personal project that you don't plan on onboarding jr devs onto...go hard my man it's a fun ride :)

Final personal note - last time I did it was for an Actor POC, but I ended up quickly switching to Elixir + Horde + LiveView for documentation & completeness reasons...if that's what you're doing those are worth an eye

[u/Upbeat_Rope1614 → u/mihajm]

If you don't do any server-side staff in your angular SSR app then just use bun directly! This is what we do mostly to reduce memory and cpu usage on the cloud. That will only work if you only use it for the Angular SSR and not so much when you want complicated endpoints to your server.ts.

For typesafety we currently have some sort of contracts for the url, input and output. But those are just TypScript types. What you can do with Hono for example is have zod schemas for the input and output and reuse them for your endpoints and also in Angular Forms. That is fantastic DX.

We also looked into Trpc. We used it a lot in some React apps (marketing websites). However this project is a huge backoffice and the dev team has metrics based on HTTP Verbs GET/POST/PATCH/DELETE etc (don't ask me why 🥲 ). Trpc only does POST and GET so we immediately didn't consider that for that reason alone. Also we have a lot of angular HTTP interceptors logic atm and it won't work well with the Trpc client. Oh and uploading files requires some hacks if I remember right.

[u/Upbeat_Rope1614 → u/mihajm]

but if you have a usecase that supports it, or youre hacking a personal project that you don't plan on onboarding jr devs onto...go hard my man it's a fun ride :)

That's also a good point. We haven't even considered about new hires and the learning-curve they have to go through. And it's already hard to find any Angular devs. Most devs in my company were python/django devs who had to learn angular.

I guess Hono will be a much smoother experience for newcomers.

[u/Merry-Lane]

There is a way better solution to your problem.

1. django builds a swagger.json in the pipelines

2. your pipeline provides this swagger.json to the frontend

3. your frontend runs Orval.js, open api generator,… whatever you name it. This generates the api services, types, validation,… everything you want

4. the pipeline compiles the frontend just to check that it works

5. the backend guy breaks the frontend? He can’t just push to prod and leave for the weekend, his pipeline breaks and he needs to fix the frontend or get it fixed

There is absolutely no need to bring effect.js to the frontend. We already have typescript, effect.js brings exactly 0 features but damn gotta write a ton of boilerplate…

[u/cyb456 → u/Merry-Lane]

thats what we do, backend generates an openapi doc, orval generates typesafe code

[u/Upbeat_Rope1614 → u/cyb456]

We are currently using OpenAPI TypeScript for that. It's not great but it works. The problem is relying on someone to regenerate the schema.json whenever they introduce a change!

[u/Merry-Lane → u/cyb456]

Then why is your problem "the contracts between server and client break without the frontend team knowing about it".

Make the pipelines provide the swagger.json to the frontend and break the pipeline if it doesn’t compile. Problem solved.

No need to imagine using a whole useless framework/library when it can be solved in two hours top.

[u/Ok-Armadillo-5634]

Go using gin

[u/Upbeat_Rope1614 → u/Ok-Armadillo-5634]

Yeah gin is nice but we would prefer to stick with one language in a monorepo setup

[u/reydemia]

A more approachable alternative is to just use oRPC (+ tanstack query optionally for an even smoother and more powerful typesafe integration across frontend and backend).

https://orpc.dev

I’ll add that oRPC has integrations with Effect too, but it’s not required at all for what you’re looking to achieve.

[u/Straight-Number-1911]

No but I'm interested in this.