search

jansmolders86 / mediacenterjs

A HTML/CSS/Javascript (NodeJS) based Media center
http://mediacenterjs.com
1.29k stars 243 forks source link

Rewrite frontend #185

Open jansmolders86 opened 9 years ago

jansmolders86 commented 9 years ago

For MCJS 2.0 I really want to make the move to react/webpack for the entire project. Even though nearly all apps are angular already.

lucienimmink commented 9 years ago

Anuglar 1.x or Angular 2? They differ quite a lot, so be sure to make the correct choice :)

jansmolders86 commented 9 years ago

haha, good question. First of all version 2.0 of MCJS has nothing to do with Angular's versioning ;) It'll probably be 1.0 seeing as 80% of the application is already written in 1.x. Unless you can convince me otherwise of course ;)

benzen commented 9 years ago

Have you seen react ? The fact that Netflix us it to target Tv, make me wondering how is mediacenter perform in regard with usage of angular.

Is this something you want to look into ?

tracker1 commented 9 years ago

@benzen given the DOM interactions for mediacenterjs are probably not significant enough for either Angular or React to have a clear advantage. Personally, I really like the Flux+React paradigm more, but don't think performance is a significant real world difference between the two in usage here.

If this was moving forward to Angular 2, then I would definitely suggest at least considering alternatives like Flux+React, Mercury, Meteor, and others...

hoffi commented 9 years ago

I really like React in general (whether with Flux or not). But i would agree with @tracker1 that React in comparison with Angular would not give any noticeable Performance differencies so far.

jansmolders86 commented 9 years ago

Hmm, I'll dive into React more to make an educated discussion! Thanks guys for pointing this out!

benzen commented 9 years ago

Given the hint you provided, I totaly agree with your choice. What about the coming 2.0 version of Angular.

Wont this mean a lot of rewrite for you ?

jansmolders86 commented 9 years ago

It would ;)

I would stick to 1.x for now I guess. What I'm wondering is hoe well react and angular work together.

So say I use angular for the routing and other Model controller stuff and use React for the view. Eg components.

Would that work? Or would that just get messy ?

Thanks!

hoffi commented 9 years ago

Hm i would not mix both together. You can use React-Router for routing.

Jon889 commented 9 years ago

I've started reading up on react, and it seems flux goes with it fairly often. Though I'm unsure about the what the difference between flux and react is, does anyone here know?

benzen commented 9 years ago

I've spent some time arround react. In fact react is really only about stop using the dom directly. Let react handle that for you, and make "intelligent" decision about that.

IMO what is really awesome is more flux. Flux is just a pattern on how to organize your data in the front end, how move the data in the front end.

WE can use react for build directive (https://github.com/davidchang/ngReact ).

What in my opinion make more sense, is looking at flux, and apply it to your app.

But again this will change radically the way you build pages.

Hope this helps

2015-03-06 10:52 GMT-05:00 Jonathan Bailey notifications@github.com:

I've started reading up on react, and it seems flux goes with it fairly often. Though I'm unsure about the what the difference between flux and react is, does anyone here know?

— Reply to this email directly or view it on GitHub https://github.com/jansmolders86/mediacenterjs/issues/185#issuecomment-77581251 .

Benjamin DREUX

Jon889 commented 9 years ago

So flux is for data whereas react is more view/Dom stuff?

I think the weather app is the only one not on on Angular, should it be converted or wait until angular 2.0/react is decided?

jansmolders86 commented 9 years ago

I'm still very much on the fence. I've been running through demo's and tutorials of all these libraries and think all of them have a thing going for them. Personally I'm most familiar with Angular 1x but that shouldn't be the reason to pick that one. I like the component driven syntax of react /flux but haven't been able to make an educated decision to be honest. If we port the weather app and redo the routing in angular, we'll be able to wrap the entire app in atom shell which is (for me at least) is a big goal to achieve :)

jansmolders86 commented 9 years ago

So I've been playing with React and so far I'm really liking it. Sometimes it feels a bit more barebone than angular, but the virtual dom and the component driven development are awesome and would work great for this project. I'm first going to do a couple smaller scale react projects before I'm starting on the rewrite though.

Karnith commented 9 years ago

Hi Jan, long time no hear!

Looks like things are going good with mediacenterjs. Just my two cents, I would go angular 1.x. I don't know much about react, but with angular you can create dynamic routing based on a compiled template and the state provider. At run time the template is compiled with the routes from different controllers. This enables each controller to specify it's route and be separate from other routes in the $stateprovider. Have a look at https://github.com/Karnith/JMedia/tree/Dev/assets/src/app for an example. If you have questions, let me know.

Karnith

Jon889 commented 9 years ago

There's also now: http://jsblocks.com which they claim is faster than react

jansmolders86 commented 9 years ago

For work I've been using https://github.com/rackt/react-router a lot recently and I have to say, although not as full featured as Angulars routing it helps to route to specific react components.

I really liked working with React these last few weeks. Everything is very flat and transparent. State and stack management are intuitive and easily manageable.

I'm currently building a mini MCJS locally in React to gauge the speed pitfalls etc of porting to angular. I'll upload it to a branch once I'm satisfied so you guys can check it out as well!

Still thanks for keeping the conversation alive, sorry I haven't been as responsive as I used to!

plessbd commented 8 years ago

what about something like http://ionicframework.com/ or http://reapp.io/ seems like they might help running on different devices as well.

Karnith commented 8 years ago

I can't speak for the other frameworks, but angular has ui-router for states and is able to use future states with a plugin. I'm just starting to play around with future states now, but from what I understand future states allow for dynamic states to be used, say coming from a db on the fly verses needing to reload your app every time a new state is added...

tracker1 commented 8 years ago

@jansmolders86, I think it may be worth looking at how Redux handles state, and workflows... it's a flux-like framework that's pretty simplified over Flux and has become pretty popular... it's about consistent, and immutable state.

I find that Redux + React + Router is a pretty good combination for application workflow and rendering.

jansmolders86 commented 8 years ago

@tracker1 :) I am using it for work atm and love it as well! Now I just have to find time to rewrite MCJS with it haha

tracker1 commented 8 years ago

@jansmolders86 true enough... been following this project with great interest for a while, and honestly still haven't had the time to dig in... was thinking on doing something similar, that could run on a desktop/server, then have a tablet/phone UI that then "plays" through a chromecast...

I've seen some chromecast bits in npm, and combined with the work here, I think it's entirely doable, it's just a matter of getting the free time... thanks for all your work on this project.

KatFrog commented 5 years ago

Hello, are you still looking at doing this? If so, I can help out with the transition to react. The other framework you might want to consider is vue.js

jansmolders86 commented 5 years ago

I wish I had the time, sadly work has kept me way too busy to start such a huge endeavor

tracker1 commented 5 years ago

Wow, totally forgot about this... haven't looked at it in a long time... today, my choice for UI in general is absolutely React + Redux + Material-UI ... Couldn't be happier. Have done a little with Vue and for a mid-large app it's difficult to get it all working together.

jansmolders86 commented 5 years ago

Even Redux wouldn't be necessary. I'd go React 16.8 (hooks FTW) with styled components and React spring. If only the days were longer and more plentiful!