Morzaram

Best workflow between JS Frontend w/ Elixir backend as a solo-dev?

Hey guys, I’m legit struggling with deciding the stack setup for my next project. I really want to code in elixir for the backend but I want the front end to be easily editable by other developers. I cannot afford an Elixir developer, but a JS frontend developer is much more within my range. I much prefer being in the backend.

Right now I’m thinking about either having a Phoenix or Absinthe backend with a JS frontend, or to do full on sveltekit. Ideally, I’d like to have the first, but I’m not sure how to most productively implement this.

So how best to I optimize the workflow between an Elixir backend and a JS frontend? As a solo-dev, that aims to expand how would you recommend doing this? Do I have a sveltekit server in between for SSR and file based routing? That would mean I’d have two servers I’d have to deal with, which doesn’t make much sense…

It’s very overwhelming for me and I definitely have analysis paralysis but I would love to have some guidance on this.

Thank you in advance!

PS- I’m still quite new to all of this so maybe I’m missing some concepts that would make this easier.

27 comments

/phoenix #absinthe #javascript-frameworks

2 5913 27

2025-01-17 07:36:00 UTC

Marked As Solved

dewetblomerus

LiveView might be a no-go if you really don’t want to touch any view code or HTML at all, but hear me out, it really sounds to me like it would fit your use case perfectly.

Have you considered hiring someone that only knows HTML and CSS? And ideally some design skills. You mentioned cost being a concern, that would be even cheaper than hiring a front-end JS dev.

You would need to build the functionality on the LiveView pages but you can do it with no concern for CSS or aesthetics, and then they come after you and sprinkle all the beauty on the HTML and CSS.

From where I am sitting you need to weigh the cost of two things:

SPA

Setting up and maintaining a JS front-end application with Webpack, Babel, Node, NPM, A framework, api endpoints.
Authentication for those endpoints
When you switch to a different front-end dev they will want to change it all because there is no industry standard for what set of things to use… And when that happens it will be very difficult for you to convince them that the re-tooling is unnecessary, because they should be the expert and you are self-professing to “prefer being in the backend”.
When your front-end dev is working on updating Webpack or one of it’s cousins, they will run into some blocker that requires some config change in Phoenix, which they won’t know how to do, then they will ask you to help them fix it, because you are the Elixir expert, and there you will be, in the exact front-end that you want to pay someone else to work on.

LiveView

Learning how to use LiveView (assuming you don’t already know) and write some views. Making some code changes as the library matures (trust me, they have been minimal, I’ve ben keeping up with it).
Spending time writing the un-styled front-end code in LiveView.
If you switch devs, they will complain about how the last person set up the CSS and want to move a lot of the CSS around or use a different technology for writing the CSS at a higher level.

If I was a betting man, I would bet you are going to spend significantly less time and money on LiveView while delivering features faster.

Post #18

Also Liked

BartOtten

That would break the ‘solo’ project, right?

Having done a quite large solo project myself, I did regret it not being LiveView. The additional setup for SSR, API mapping etc was quite time consuming. Also the JS world has the awkward habit of hypes and breaking changes. Svelte might soon be a no-go once the JS framework train moves further.

However, when you really want to go the JS frontend route, the combo Absinth + Apollo is great. GraphQL provides some flexility and easier mental model (imho) while working on a separate backend and frontend.

Ps. The reason JS devs are cheaper is mostly because the language is popular and basics easy learned making for a good stream of newbies. It’s not a bad thing perse, but remember that 100x a cheap rate is more expensive then 20x a higher rate.

Post #1

hectorsq

I have been in that hell as a solo developer.

Rails + AngularJS
Rails + EmberJS
Phoenix + vanilla Javascript

Then LiveView appeared, and I immediately switched to it the first day it was publicly released.

LiveView is the way to go. You will save tons of time. Less overwhelm. Less frustration. Simpler. More productive. Happier.

Post #2

AstonJ

Agree with what they said! ^^

LiveView has been making leaps and bounds, not just with performance tweaks but in areas which some might have considered weak points for this type of tech.

Have a look at things like Surface - A component-based library for Phoenix LiveView and 🍿 LiveMotion - High performance animations for Phoenix LiveView and when you really must have a SPA/heavy client based JS, then you could use Hologram - full stack isomorphic Elixir web framework alongside Phoenix!

Personally I would go LiveView first and then (use it/Phoenix with) Hologram and then something like Svelte if I really really had to (tho in that case I would probably really be needing something WASM).

This is jmo, ultimately just go with your gut

Post #3

Last Post!

Morzaram

Sorry it took so long to answer you. I actually went with Inertia, and React SPA for my apps.

For the react frontend and some inertia-based requests, I use OpenApiSpex to generate a schema, and on the front, I use Heyapi to do all the heavy lifting of generating requests. It allows me to stay in the flow so I don’t have to think about coupling my code. I write backend or frontend code with low overhead. It feels good, and having that front-end type of safety is nice.

As much as I like live view, I shoot myself in the foot because I’m not the brightest developer. That and I don’t feel confident bringing on other people because I don’t have a confident way to write live view updates cleanly.

Post #27