6 ms·
Open-Sourcing CloudFlare’s UI Framework
- deleted 10y ago[deleted]
- _RPM 10y agoIs that TypeScript in the examples? Haven't done JS in a while(angular), so it seems like TypeScript has become the de facto standard now.
- xnxn 10y agoI think it's just ES2015 with JSX.
- savanaly 10y agoTypeScript is quite popular but I wouldn't say it's anything like the de facto standard for frontend development. If anything, writing ES6 (and transpiling with Babel) is the standard.
- mikeryan 10y agoIn the React world it seems that ES6 or ESNext transpiled has the most mindshare. That's what this is.
- jgrahamc 10y agoRelated blog post that explains what this is and why we open sourced it: https://blog.cloudflare.com/cf-ui/ https://blog.cloudflare.com/cf-ui/
- deleted 10y ago[deleted]
- thejameskyle 10y agoHi, I'm one of the devs on this team. Let me know if you have any questions. It's a super awesome feeling to have open sourced this after working on it for months, and I think we've done some interesting things. So I want to share our ideas and opinions. I'm hoping to publish more about them in the coming weeks.
- kkirsche 10y agoThanks for open sourcing this. I know that can be hard to get through legal and can be something that is hard for people. Great to see this!
- jgrahamc 10y agoIt's dead easy to open source stuff at CloudFlare. We have an internal mailing list. Email was sent on March 11, 2016 requesting this. Everyone signed off (including legal) that day.
- jsprogrammer 10y agoWhy the quarter delay in making the source available?
- jgrahamc 10y agoWe were busy doing other stuff.
- thejameskyle 10y agoHeh, yeaah boss. OBVIOUSLY I do TONS of things. Where would I even begin to talk about all the things I do? There's just so many! No time to open source something with all the things I definitely do... closes 30 browser tabs
- thejameskyle 10y agoThats about how long it takes me to write a blog post :P Also I was trying to get a number of things in a good place, like https://lernajs.io/ https://lernajs.io/
- misiti3780 10y agoLooks useful and interesting - thanks!
- rtsao 10y agoLerna [1] is very cool. I was firmly against monorepos, but the ability to easily manage and coordinate between individually versioned packages in a single repo is awesome. You get the benefits of a monorepo but also the benefits of small modules so it's the best of both worlds. [1]: https://github.com/lerna/lerna https://github.com/lerna/lerna
- michaelmior 10y agoAfter seeing the Lerna reference in the post I think I'm more interested in that than the UI framework (although that seems cool too :)
- eltaco 10y agoJames is also on the Lerna team as well! He and I can answer questions about that too. (We also have a slack https://slack.lernajs.io/ https://slack.lernajs.io/)
- netghost 10y agoI noticed there are components for all the standard HTML typography like <kbd> is <Kbd> and such. Is there a perf hit in wrapping everything in a react component? Any particular reason to do this?
- exogen 10y agoNot sure about the perf difference between DOM elements and component elements, but the primary reason would be: let's say later on you decide each <kbd> should have a className, or a little tooltip helper, or a title attribute, or some ARIA role or something. Since you can't modify the built-in DOM elements, you'd have to find each instance where you used <kbd> throughout the codebase. If they're wrapped, you can just modify the <Kbd> wrapper in one place and the new output is rendered everywhere.
- thejameskyle 10y agoThis is exactly it. Also if we ever choose to use React Native (cough), it would be good not to have hard coded DOM elements. I haven't tested the performance heavily but I'm not really concerned about it.
- Ruud-v-A 10y agoA shame they didn’t rewrite it in Elm while they had the opportunity.
- thejameskyle 10y agoTo start, I love Elm. I'm super interested in compilers and I've looked a lot into theirs. However, Elm is still making breaking changes on the language level [1]. To bet on a language like that right now is tough for a larger company. Also, we're not dropping everything and rewriting it all from the ground up. I'm not sure that Elm has a good story for incremental migrations yet, where React has an excellent one. [1]: http://elm-lang.org/blog/farewell-to-frp http://elm-lang.org/blog/farewell-to-frp
- zedadex 10y agoBetween what they're doing and the example text in their image, I like these guys :)
- pbreit 10y agoIs this really how to do tables in React? <Table striped> <TableBody> <TableRow> <TableCell>One</TableCell> <TableCell>Two</TableCell> </TableRow> <TableRow> <TableCell>Three</TableCell> <TableCell>Four</TableCell> </TableRow> </TableBody> </Table>
- pests 10y agoThat is just an abstraction over regular tables allowing them additional functionality not present in regular HTML. Of course you can use the standard table markup.
- badthingfactory 10y agoIt might seem a bit strange, but there is a good amount of value in wrapping native DOM elements. The easiest way to describe it would be when using bootstrap. <Input /> could return <input class="form-control" /> Now, you don't have to type `class="form-control"` on every single input, and if you want to move away from bootstrap, you can remove it all in one place.
- mahmoudawadeen 10y agoHey, i recently saw your team's blog post and i was playing around with your new framework. i was wondering how to add ids and classes to the elements.