greatisgreat

greatisgreat

React phoenix integration - add it to my phoenix project or keep react in a separate server?

i am building a website using react but should i just add react to my phoenix project or keep react in a seperate server as i think it can only communicate using an api so which is better?

Thanks

Marked As Solved

kokolegorille

kokolegorille

I have been doing both, with pros and cons.

All in one

pros:

  • all in one, easier deployment
  • no need for cors

cons:

  • bind to backend, what if You want to reuse?

Separate

pros:

  • easier to switch and reuse
  • –no-html --no-webpack

cons:

  • not really a cons, but maybe You need to configure cors.
  • need to add phoenix.js as dependency
  • need two servers, more complex to deploy

I prefer to separate, but use only one server… and build into priv/static of the Phoenix server.

BTW You can do server side react rendering.

No, You can also use websocket.

Also Liked

mindreframer

mindreframer

You need to add “assets” and index.html to that list :wink:
like:
only: ~w(assets index.html)

kokolegorille

kokolegorille

It’s the output parameter of the front end webpack.config.js, You can specify the path to point to public/static.

Probably something like

../phoenix_app/priv/static
kokolegorille

kokolegorille

If You use --no-html --no-webpack on backend side, You don’t have templates, page_controller…

But You can still use plug static.

On the frontend, You can use webpack, webpack dev server, html webpack plugin, mini css extract plugin.

=> You build a static index.html (with just a div to mount react), but powered by app.js (which contains all frontend stuff) and styled by app.css
=> frontend communicate with json api with fetch, or axios, and with websocket with phoenix.js

Where Next?

Popular in Questions Top

Harrisonl
We have an ECS cluster with 4 services, where each task joins a single cluster, via discovery ECS discovery service. Currently when I de...
New
WestKeys
Currently suffering from paralysis by [HTTP client] analysis. This is rather unusual in Elixirland as there tends to be consensus on the ...
New
qwerescape
Is there a way to get the call stack or stack trace at any point in the code? Not from exceptions, but an expression that returns how the...
New
fireproofsocks
I’m working on defining a simple Ecto schema for a table (in PostGres), but I don’t see where I can define a column as NOT NULL. Conside...
New
vac
Hi, I’m quite new in Elixir and I’m trying to format a string to a PEM format. I have the certificate value like MIIDBTCCAe2...... and I...
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
ycv005
I have followed this StackOverflow post to install the specific version of Erlang. And When I am running mix ecto.setup then getting fol...
New
nobody
Hi! In PHP: $_SERVER[‘SERVER_ADDR’] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New
script
If I have a string “1000 cfu/ml” . I want to remove the characters and / and space . So the string is like this "1000" What is the ...
New
hariharasudhan94
Lets say I have map like this fetching from my database %{"_id" => #BSON.ObjectId<58eb1a7a9ad169198c3dXXXX>, "email" => ...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
sorentwo
Hello! tl;dr Announcing Oban, an Ecto based job processing library with a focus on reliability and historical observability. After spen...
985 43487 311
New
Patoshizzle
After calling mix ecto.create I get this error: 17:00:32.162 [error] GenServer #PID<0.412.0> terminating ** (Postgrex.Error) FATAL...
New
chrismccord
Phoenix 1.4.0 released Phoenix 1.4 is out! This release ships with exciting new features, most notably with HTTP2 support, improved deve...
688 31013 112
New
msaraiva
Surface is an experimental library built on top of Phoenix LiveView and its new LiveComponent API that aims to provide a more declarative...
564 43757 214
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
joeerl
Hello again - after a longish gap I’ve decided I really must dig into Elixir and see what’s been happening here - so I have a few questio...
New
boundedvariable
I am going through the kafka architecture. All the features what the kafka is providing are already in Erlang. I would like hear your opi...
New
lanycrost
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
New

Latest on Elixir Forum

Elixir Forum

We're in Beta

About us Mission Statement