9 ms·
Question for HN: I'm a systems developer and want to play a bit with frontend development (writing frontends for custom tools I built). What framework + featu
by lima 10y ago
Question for HN: I'm a systems developer and want to play a bit with frontend development (writing frontends for custom tools I built).
What framework + feature-complete component library is recommended in 2017?
React? Vue? Polymer? Plain JS with intercooler.js? I feel a bit overwhelmed.
- simooooo 10y agoI've been using Vue for a similar purpose this last week or two and I've found it very simple and easy to follow. I'd recommend that.
- lima 10y agoWhat component library to use?
- netforay 10y agoDepends on which components you need. Normal HTML with Bootstrap CSS will mostly cover the basics. And there are other individual Vue component libraries like VueTable etc.
- simooooo 10y agoCurrently I'm not using one, building my own context menu, graph and grid components as a way of testing out vue, and to see if I can do it. Reasonably straight forward so far
- thewhitetulip 10y agoI had begun to write a guide, but currently busy with something else :-( I find vue to be an amazing library, got started within a week https://github.com/thewhitetulip/intro-to-vuejs/ https://github.com/thewhitetulip/intro-to-vuejs/
- progx 10y agoIt depends on what you want todo and how complex it is. Should it run only in a Browser or Mobile (native) too? You will find 10 People that tell you use X, 10 use Y, 10 use Z, any suggestion is right and any would be wrong. Look at the frameworks and features and decide which one come close to your prefered development style. It is not easy and it took time. In the last 24 month i tried many: backbone, ember, aurelia, react, react redux and currently vue and many of which i forget the name ;-). All have there pros and cons. If you always look for a newer thing, then you will never find one. To myself: Lesson learned ;-)
- owebmaster 10y agoI'm using react (with clojurescript) & angular2, and would suggest React. It is becoming mature and stable, great ecosystem, and a clear direction while angular (and other alternatives) are still finding where to go, mostly copying React. I'd go straight to the source.
- brlewis 10y agoMithril is a very non-overwhelming framework. You can find a number of pre-built components for it at https://github.com/lhorie/mithril.js/wiki/Components https://github.com/lhorie/mithril.js/wiki/Components but I bet you'll end up building your own. How familiar are you with JavaScript? HTML?
- yesdocs 10y agoI've found Mithril to be a giant pile of crap. Buggy on most browsers and incredibly painful to use. Run, don't walk from this platform.
- bpicolo 10y agoIf you want it to feel more like backend development, give clojurescript a whirl. Best way to do that is start with this template: https://github.com/Day8/re-frame-template https://github.com/Day8/re-frame-template Which is based on this library: https://github.com/Day8/re-frame https://github.com/Day8/re-frame ClojureScript is fantastic. Being immutable as a baseline makes it work so much better in the React world of things. That said, if you haven't used any Lisps it can be a bit intimidating (for me it still is, a bit), but you get to the point fairly quickly where things can be both daunting and productive at the same time. If you prefer to stick with more raw JS, I recommend React without a data-framework until you find you need one. Raw react components are plenty to get you started.
- WhitneyLand 10y agoI would disagree. ClojureScript is very cool, but unless you're adept at functional languages it's another big jump for someone new to front end development. Plenty of time to do CS a little later.
- bpicolo 10y agoI mean, by that same metric if you aren't familiar with JS paradigms it's a leap on it's own, no? So I don't think that's the right metric on it's own. I also think that getting started with ClojureScript is pretty simple, even if you aren't super familiar with FP (though it will definitely stretch your brain a bit). ClojureScript gives you the opportunity to write code that's somewhat imperative, just with plenty of extra parentheses.
- Touche 10y ago> I mean, by that same metric if you aren't familiar with JS paradigms it's a leap on it's own, no? A smaller leap from a OO language to JS than to ClojureScript, surely you agree there.
- bpicolo 10y agoOf course! That said, I think the typical use with ClojureScript/re-frame doesn't lead you into an academic or pedantic world of heavy FP. The benefits of being functional are largely abstracted away. You're mostly going to be writing some HTML in DSL-style reagent(1), and mapping over lists/maps. That's largely why you can get productive reasonably quickly, even with the intimidation factor still present. (1): https://github.com/reagent-project/reagent#examples https://github.com/reagent-project/reagent#examples
- boubiyeah 10y agoReact is actually not that easy to pick up. Tons of ways to do things, messy data management, complex lifecycle hooks. vue or riot would be a good choice to play and develop something quickly I think.
- debaserab2 10y agoI finally spent the time to learn it recently, and it's really only hard if you make it hard on yourself. Plain old react without redux is pretty dang simple, actually.
- pdxandi 10y agoI agree that it depends on your project, but I've used all the frameworks you listed and Vue.js stands out to me. The documentation is top notch, the ecosystem is flourishing, and using the framework feels intuitive. Drop one script into your project and you have a fully reactive front-end at your disposal (or you can use a more complex build system like Webpack). I'd suggest reading the official 2.0 guide here: https://vuejs.org/v2/guide/ https://vuejs.org/v2/guide/
- weka 10y agoLet us dispel the notion that webpack is 'complex'. webpack works extremely hard to make its documentation [1] and overall tool easy to read and use. The community is ever-growing and it has one of the most helpful and enthusiastic maintainers I've ever seen a JavaScript OSS project have. Ever. (Look at you Larkin!) From egghead.io to online documentation, you will see that while webpack has a lot to it, it is easy to understand in chunks and each part of webpack serves a purpose to better optimize and structure your workflow. [1] https://webpack.github.io/docs/tutorials/getting-started/ https://webpack.github.io/docs/tutorials/getting-started/
- pdxandi 10y agoWebpack is complex in the same way that all build systems are complex – they take time to understand and configure. In the context of this thread, where a systems developer is feeling overwhelmed by front-end development options, Webpack is certainly an added complexity regardless of how well it's documented (which, I agree, have significantly improved). I understand where you're coming from (Webpack initially got a bad reputation as being complex and folks are working hard to improve it) but my note about complexity was relative to simply dropping a script in the page to get Vue.js up and running. To all the Webpack maintainers, and to all contributors of open-source projects, I can't thank you enough for your efforts. You open doors and expand the minds of developers like me and I'm forever indebted to you.
- acemarke 10y agoQuick FYI: that link is the old-old Webpack 1.x docs. The current Webpack docs, which have been completely re-written and are _vastly_ better, are at https://webpack.js.org/ https://webpack.js.org/ .
- Jamie452 10y agoI'd stick with Angular combined with Bootstrap to get stuff done quick - that said it might be useful to learn plain html/css/js first so you are aware of which features are introduced by frameworks.
- ergo14 10y agoI would suggest Polymer. Web Standards based - has comprehensive library of elements and polymer itself is a tiny library. I've had very good experience with it - if you know html/JS you will feel at home. As for being "feature complete" - it has probably best implementation of material design elements and you can find a ton of other element on https://www.webcomponents.org/ https://www.webcomponents.org/. It is also interoperable with other solutions like jquery/angular/aurelia and others.
- etimberg 10y agoPolymer works very well for it's use case, but it is very difficult to make it work with tools like webpack. It ends up requiring what feels like a lot of hacks. SystemJS seems to be a bit easier to work with since there is a plugin for requiring the necessary HTML files. Polymer 2.0 looks to be much better.
- Touche 10y agoI probably wouldn't let your build tool choice influence the UI framework choice. Other way around, actually. Polymer has an excellent build tool of its own.
- lima 10y agoCan I use Polymer components with Vue.js?
- ergo14 10y agoPolymer elements are "normal" elements so yeah you should be able to do so unless vue does something weird. https://github.com/vuejs/vue-element https://github.com/vuejs/vue-element - this might give some hints.
- netforay 10y agoNo you can not. Telling from experience. Here is the reason.. Vue is optimized to create/update your DOM elements based on data. Polymer does create a DOM node and internally implement lot os JS to create their own shadow DOM. Each Polyer component can have different life cycle (for Example and Table Component can actually creat TR,TD elements after some time of creating your Custom Table Polymer component). And Vue does not know this. Once the Dom for parent tag is created, Vue assumes its work is done. And if data change mean while it will remove it or update it. But Life Cycle of prevously create Polyermer component may still in progress...and you will get lot of exceptions in console. How to burn your fingers and see this problem..? Try to use OnsenUI Polymer components with Vue.JS. Mainly any List and Table tags with dynamic children bound to data.
- deleted 10y ago[deleted]
- aczerepinski 10y agoReact. If you're new to the front end, it makes sense to choose the most popular tool that has way more documentation, blog posts, stack overflow answers, etc than anything else.
- tracker1 10y agoWell, in terms of your most popular, Angular 1.x is still slightly ahead... I happen to prefer React + Redux + material-ui.com's components. But that's not the only option. I can see why polymer/web-components may be appealing to some... I don't really get peoples desire to use any version of Angular for new projects though, I just don't care for it. I don't know vue well enough to comment, but a lot of people seem to like it.
- progx 10y agoBut most of the posts or stack overflow entries are obsolete and confuses more than it helps, you always have to look for the version or the date (if they are mentioned)
- pas 10y agoFrontends for tools -> dashboards, right? https://github.com/akveo/ng2-admin https://github.com/akveo/ng2-admin And to conjure it alive with data: http://stackoverflow.com/questions/39905586/how-to-consume-rest-api-with-angular2 http://stackoverflow.com/questions/39905586/how-to-consume-r...
- viach 10y agoI started a simple project a week ago. I use Vue and Semantic-UI. This combination looks very good for me so far.
- true_religion 10y agoOf the 3 choices that you gave, I'd use Vue. If you broaden the scope to 'let's use anything', then I'd suggest Ember since I like their model layer better. The React ecosystem is a bit fractured at the moment, so jumping into it is a full-time job. In a year or two, I expect it to settle down when some framework rises out of the morass and gains credibility amongst the majority of dev's.
- kozikow 10y agoAs a back-end developer who recently made a trip up to frontend worlds I would recommend vue. Big advantage of vue, that you can just include vue, some component library (like the above, or vue-mdl in my case) and start building stuff. You don't need learn 5 new transpilers and build tools to get the simplest thing done like described in https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f#.h15ystm8b https://hackernoon.com/how-it-feels-to-learn-javascript-in-2... .
- Ruphin 10y agoAll the options you mention are perfectly viable, and none of them is 'strictly better' than the other. This thread will be filled with people telling you to use one of them because reason X, or not use one because reason Y. It's like arguing which brand of beer is the best, there's no definitive answer to a question like that. This thread will be filled with choice-supportive biased comments, and their arguments might not apply to you at all. It comes down to personal requirements and taste. Really like Javascript over HTML? React is probably for you. Don't care about details and just want things to work? Vue could be nice. Prefer sticking as close as possible to the W3C specifications? You will like Polymer. Telling you want you should use is like telling you what things you should value. Again, all the options are great. All of them have mature tooling, and will 'just work' if you buy in to their way of doing things. Just try them and figure out which one you like.
- spion 10y agoIf you can stomach a little build tool complexity (a one-time cost), React + MobX is basically a better, simpler Vue.
- searchfaster 10y agoFrom my experience, would strongly suggest Vue. I am a systems developer too and started playing with UI for a side project. I started building the app and started with Angular, Angular 2, React and then heard about Vue and tried it. Vue makes things super easy and is well documented. I was super productive and got things done fastest on Vue.