Which UI framework you prefer to use along with Phoenix API back-end?

I have really enjoyed using Materialize. Used it most recently for one of my projects if you want to take a look.

1 Like

Indeed, I feel immutability and the functional nature of elixir gives a huge advantage over JS.
Type safety is one thing I wish elixir did have - we have dialyzer etc, but it doesn’t really compare. I am always interested in projects like gleam https://gleam.run/ that aim to bring this to the beam.
Still, for what’s out there now, elixir is still my go to for its productivity, tooling, libraries, reliability and fun :slight_smile:

1 Like

Evercam is also a happy Phoenuxt User.

(Though we’re still in the process of migrating and haven’t moved to GraphQL, yet)

https://github.com/evercam/evercam-dashboardv2

M

1 Like

I think the immutability helps but it’s mostly pattern matching. Function heads can match the specific shape of expected data!

So what’s the best way to include independent Vue apps on different pages? Do you create a new entry in your webpack config for each one, and include the output in a script tag in the template, or just import all the Vue stuff into app.js? Or is there another way. I’ve always been confused about the best practice for that.

I simply use a decoupled pattern. Phoenix as API backend only and Vue on frontend.

There is no one “best practice”. There are a lot of ways to do it and different projects lend themselves to different approaches.

Since I generally care about SEO and want to keep things simple, I like the approach common in the Laravel community—embedding Vue components directly in the (eex) template files. You can pass data as props to the component. This won’t disrupt the page and its assets and you can easily use your normal CSS and JS in addition to Vue. This also keeps things simple in terms of sessions and everything else Phoenix provides for an app.

4 Likes