Live data from Hacker News

Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

touchstonejs.io

1–10 of 28 posts

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#2
I stumbled upon this the other day and was immediately impressed. There's still a way to go but look at the detail in the transitions - not just a straightforward slide but with the previous page parallaxing and the shadow effect - very similar to native.

I think react is a wonderful technology. I also think that there's a real gap for a lightweight mobile-only framework like this, and this work is a great start.

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#4

I stumbled upon this the other day and was immediately impressed. There's still a way to go but look at the detail in the transitions - not just a straightforward slide but with the previous page parallaxing and the shadow effect - very similar to native. I think react is a wonderful technology. I also think that there's a real gap for a lightweight mobile-only framework like this, and this work is a great start.

Thanks! we're putting a lot of detail into the animations to make it feel as native as possible. The touch events too - you'll notice that if you touch a link, and move too far away, it'll un-hilight; then if you move back it activates again, just like on iOS. Or in a scrolling panel, scrolling cancels the touch event.

We've had a great experience building with React, and browserify - it keeps everything organised and modular, and is pretty much perfect for mobile app architecture.

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#5
post #3

Looks great. Presumably being React powered means it would work nicely with the various ClojureScript React wrappers such as Om and Reagent.

I'm not sure. Off of the feature list, it looks like a framework, not a component library. It takes over your app structure, build process, etc etc.

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#7
post #5
post #3

Looks great. Presumably being React powered means it would work nicely with the various ClojureScript React wrappers such as Om and Reagent.

I'm not sure. Off of the feature list, it looks like a framework, not a component library. It takes over your app structure, build process, etc etc.

The app framework is structured as a React mixin, everything else (lists, form controls, etc) is just React Components you can drop into your app. So for the most part how you structure your app is up to you (except for the scaffolding necessary for the view transitions). It's inspired by react-router (after the recent changes) in terms of getting out of your way.

Other than that, aside from needing some sort of compilation step for the JSX (our demo project uses browserify and gulp) the rest is up to you.

I haven't used Om or Reagent yet but I don't think there'd be anything preventing them from working with Touchstone.

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#8
post #5
post #3

Looks great. Presumably being React powered means it would work nicely with the various ClojureScript React wrappers such as Om and Reagent.

I'm not sure. Off of the feature list, it looks like a framework, not a component library. It takes over your app structure, build process, etc etc.

@jed_watson will be able to say more but I don't think that's the case. Take a look at the starter project here:

https://github.com/Thinkmill/touchstone-starter/tree/master/...

You should be able to piece together the UI parts you need. The starter also happens to include the build process run browserify and create a phonegap build, that's all.

(disclaimer - I might be totally wrong)

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#9
post #5

Earlier quoted context omitted.

I'm not sure. Off of the feature list, it looks like a framework, not a component library. It takes over your app structure, build process, etc etc.

The app framework is structured as a React mixin, everything else (lists, form controls, etc) is just React Components you can drop into your app. So for the most part how you structure your app is up to you (except for the scaffolding necessary for the view transitions). It's inspired by react-router (after the recent changes) in terms of getting out of your way. Other than that, aside from needing some sort of comp…

Is there any reason not to just use react-router?

Edit: ok I found the createApp mixin and I can see you're doing a lot of stuff in there to support the touchstone app... It would be sweet if you could delegate some of that heavy lifting and integrate with react-router at the same time...

Re: Show HN: TouchstoneJS, a React powered UI framework for beautiful mobile apps

#10

Earlier quoted context omitted.

The app framework is structured as a React mixin, everything else (lists, form controls, etc) is just React Components you can drop into your app. So for the most part how you structure your app is up to you (except for the scaffolding necessary for the view transitions). It's inspired by react-router (after the recent changes) in terms of getting out of your way. Other than that, aside from needing some sort of comp…

Is there any reason not to just use react-router? Edit: ok I found the createApp mixin and I can see you're doing a lot of stuff in there to support the touchstone app... It would be sweet if you could delegate some of that heavy lifting and integrate with react-router at the same time...

You need a lot more control over how the views transition, pass state, etc. in order to create a native-feeling app.

The paradigm of links and parameters falls short, and eventually TouchstoneJS will exert a lot more control over the transitions. Right now we're using CSSTransitionGroup, but I expect we'll move to a JS-based transition method (possibly with tween-state) so you can do controlled or partial transitions (required for things like drawers or swipe-from-left to go back)

We have spent a lot of time looking at react-router though, and are using it on other projects, and are / will be borrowing quite a few things :)

Post reply on HN