Is it a good idea to mix electron with angular/react/vue?


#1

Atom doesn’t. So was wondering, is good old javascript, html, css as separate scripts a better design for native app than component based architecture like in Reactjs or angular 5 ?


#2

You can use whatever frameworks you want to use, as long as they’re compatible with the version of Node in the specific version of Electron that you choose. Electron almost always has a slightly older Node version than the latest.


#3

Using a framework depends on the type of app you want to create. If the app is simple enough - for example, a calculator - maybe using a framework like react.js or angular might be overkill. However, when the complexity of the app grows, using those frameworks and their organization system can be a life saving.

I am working at job within Electron program that, over the time has been growing in complexity. Originally I used just javascript combined with jquery and things were ok, however, as the program grow, things started to be more and more complex until, in the end, whatever thing I add or modify, had a big impact in all the components of the program, even those that are apparently unrelated. At the end it reach a situation in where nobody could help me with the development because there were too much info to take in account. At that point we migrated to React-Redux framework and, even if the migration took us a while, things paid off: Redux “single-source-of-truth” philosophy integrated with react’s “reactivity” made the program state more simple, and React’s environment made modular all the parts of the system so fixing and tuning it has become quite easy.

Of course there are some trade-offs, and one of it is that now is harder to add some jquery/jqueryui features, like drag and drop, or animations/transitions. React has its own way to deal with those, but they tend to be very low level so the integration is not as fast.

Also, I must add that the project also has a React-native android and iphone app, and making the desktop program with react enable us to reuse some of the React components and modules, and overall make both development closer, so is easier for a developer to migrate from one code to the other.

TLDR: If you want to do something that is simple, using those frameworks will make your program grow the complexity of it, so it might not we worth it. However, if your program and its internal state is complex enough, using React.js or angular its likely to save you up a lot of time and effort, and will simplify your development. I can tell that Electron is React compatible, however, I might suggest to use a react-electron boilerplate to not to bother too much with the configuration.


#4

In some cases, such as animations and transitions, you can pull some or all of the weight with the other web languages (CSS in this case) and all your JS has to do to implement an animation is to add or remove classes from your elements.


#5

Css transitions and animations are ok, I use them often, but in my developer life I have found that more often than not, things that I need to do can’t be done with pure CSS (and believe me, I try hard to use css whenever is possible).

One example is doing transition when a react element is added to or removed from the dom. In React, I found that a library that let me do quite a lot of things is react-motion, however, its a bit complex and their documentation is a bit… lacking… But once you get the hang of it it quite flexible and lets you do a lot of things

As I mention in my other post, one thing that gave me quite headache was drag and drop. With Jquery-ui was as easy as 4 lines. React… no so quite. React’s community recomends react-dnd, but is way too low level and took me a few days to add it to my project to realize that the performance was not good enough (it was likely the way I implemented, though I followed their advices), so I ended using other more straight forward dragging library but it doesnt let me do the dropping.

In those situations, I really miss using more simple structure. However, the complexity of my project has been reduced drastically and now is easy to develop in it. Only for that, I dont mind the change (before, it was hell xP).