Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Reapp – hybrid apps, fast

reapp.io

Post reply on HN
Print view View original

31–40 of 47 posts

Re: Reapp – hybrid apps, fast

#31

Post by marknutter »

danabramov wrote: post #18
marknutter wrote: post #15

I far prefer the hybrid approach to the js-to-native approach Facebook and Appcelerator are taking. If you go fully native, you get the complete benefit of the SDK, Native API's, and performance that comes along with it. If you go hybrid native/html5 you get the flexibility, productivity, and reusability of js/html/css with the option to write custom native components as needed. With React Native (AFAIK) and Appceler…

>They've gone so far as to abstract away the entire DOM and ignore coming standards like Web Components. Web Components don't solve the problems React is solving. They are completely different (and sometimes complementary tools). >I believe that the negative feedback on their original hybrid mobile app deeply affected Facebook as an organization and as a result they have swung so far in the opposite direction they ar…

> Web Components don't solve the problems React is solving. They are completely different (and sometimes complementary tools).

No, they don't solve the same problem, but that's not what I was suggesting. What Web Components are trying to solve is the problem of sharing code, and if React doesn't play nicely with Web Components it's going to make it very difficult for React developers to partake in that sharing. Contrast that with the Angular team who are drastically overhauling their entire framework in order to be compatible with Web Components. I prefer that strategy over the long term (Ember is also actively preparing for Web Components).

> I can't speak for Facebook but I think you're missing the point of React Native. It's not a solution to run webapps on native platforms.

I am not missing the point. I get that it's goal isn't to allow web apps to run inside native wrappers.

> React Native is a solution to write native UI code with declarative paradigm. That it runs in JS is an implementation detail. If you look at it from that point of view, hybrid vs native doesn't even come into equation. "Native" is the original requirement here, as far as I understand it. Unless you propose to not write native apps at all.

I'm proposing it's better to either choose to write native apps using native languages and SDKs, or write them as web apps and embed them inside native wrappers like Reapp is doing. Hybrid vs. native does come into the equation because it's worth pointing out the pros and cons of every approach to mobile app development.

People are frothing at the mouth in response to React Native without fully understanding the tradeoffs inherit with that approach, so it's worth properly setting expectations in response to overwhelming hype. Appcelerator has been around for years and solves the same problem in the same way (minus React's declarative pattern) and it hasn't been a panacea.

Re: Reapp – hybrid apps, fast

#32

Post by nwienert »

jimmytucson wrote: post #30
moondowner wrote: post #9

Earlier quoted context omitted.

I've checked out quickly both Reapp and Touchstone. At the moment Reapp seems more mature: has better tooling (e.g. the command line tool to generate projects), uses Webpack, has quite big UI kit, etc...

When you say Reapp seems more mature, what do you mean? It seems like Touchstone has been around longer. (Touchstone's Github repo has 1,469 followers and first commit was October 14th, 2014 vs. 200 followers and December 19th, 2014 for Reapp.)

Maturity !== Github stars

I like the guys who made TouchstoneJS but for comparison sake, touchstonejs.io shows a list of features. Here are the "unchecked" ones that Reapp currently has (7 out of 9 of them):

Retain scroll position Dynamic headerbar View nesting Partial view transitions Gesture navigation Cross-platform themes Project generator Landscape mode (just about)

Also, I'd say the Gesture navigation and theming support took up 90% of Reapp's development, they were by far the hardest parts. It's what birthed the React animation mixin we use, which is really cool and powers all our animations.

Re: Reapp – hybrid apps, fast

#33

Post by karl42 »

danabramov wrote: post #14
karl42 wrote: post #11

Earlier quoted context omitted.

So why doesn't the website say anything about the part of wrapping it for Android/iOS? I'm just as confused as unwind.

To run a webapp inside a native app, wrap it in a web view. What gets you confused?

It's supposed to help me build hybrid apps. But from what I can see, it only helps me build web apps. So I still don't see what is hybrid about this.

I can wrap a simple HTML page with phonegap. Does this make HTML hybrid, too?

Re: Reapp – hybrid apps, fast

#34

Post by nwienert »

Hey hackers, Nate with Reapp here. I'll add some technical background. This has been a solo project of mine for the last five months. I actually was relatively green to npm and React in general at the beginning, but I've been working on this full-time since. I think it's a great testament to React's power and ease of understanding.

I spent a large part of the development on the animations. Reapp has a custom animation mixin designed for React that works through props. It's really cool and I'll be writing a blog post on it this week. It's what drives all the animations you see including the fully interactive "swipe view from edge to go back", as well as modals and popovers. You can see the animations here:

https://github.com/reapp/reapp-ui/blob/master/themes/ios/ani...

Another thing I've spent a lot of time on was getting the view animations to match iOS. Notice how the TitleBar text animates, while the icons remain in the same position. This took quite a bit of effort and resulted in several refactors of the animation library.

Finally, theming. The theme system is quite robust, though the iOS theme itself needs work. It's fully JS-powered CSS, and we use Flexbox for the default theme. It uses two teirs: Constants and Styles. You can override any of our constants or styles to make your own theme, or load an entire new one. I'll also be writing about this more because it's really a big feature. Here's an example of loading a custom theme:

https://github.com/reapp/hacker-news-app/blob/master/app/the...

That folder also contains more interesting usage.

Feel free to ask me any questions you all have, I'm happy to answer.

Re: Reapp – hybrid apps, fast

#35

Post by rajington »

nwienert wrote: post #34

Hey hackers, Nate with Reapp here. I'll add some technical background. This has been a solo project of mine for the last five months. I actually was relatively green to npm and React in general at the beginning, but I've been working on this full-time since. I think it's a great testament to React's power and ease of understanding. I spent a large part of the development on the animations. Reapp has a custom animatio…

Although everyone is going to jump on the React Native bandwagon, there's good reasons not to. It's not like every write-once framework is going to go away. How far do you think you are from a components library that can compete in breadth and maturity with Ionic and do you think you'll go down the path of what Supersonic is doing with Ionic, but with React (the semi-native components/transitions/views aspect)? The answer probably lies in whether you're starting with an incubator like Drifty did or going to rely on community support. I think there's enough people out there that don't like Angular, but aren't ready for the commitment of a React Native project.

Also, it seems to be looking for a "http://kitchen.reapp.io/assets/sunrise.jpg" in the drawers demo, which isn't there.

Re: Reapp – hybrid apps, fast

#36

Post by mgkimsal »

karl42 wrote: post #33
danabramov wrote: post #14

Earlier quoted context omitted.

To run a webapp inside a native app, wrap it in a web view. What gets you confused?

It's supposed to help me build hybrid apps. But from what I can see, it only helps me build web apps. So I still don't see what is hybrid about this. I can wrap a simple HTML page with phonegap. Does this make HTML hybrid, too?

No but it makes phonegap 'hybrid'. I think that's the point.

Re: Reapp – hybrid apps, fast

#37

Post by peregrine »

nwienert wrote: post #34

Hey hackers, Nate with Reapp here. I'll add some technical background. This has been a solo project of mine for the last five months. I actually was relatively green to npm and React in general at the beginning, but I've been working on this full-time since. I think it's a great testament to React's power and ease of understanding. I spent a large part of the development on the animations. Reapp has a custom animatio…

It feels like you are using click for touch events. Which causes a ~300ms delay only on mobile phones.

Makes me a little concerned about what other "common" hybrid bugs you've missed. Is this your first rodeo with Hybrid apps or have you pushed them to production?

Re: Reapp – hybrid apps, fast

#38

Post by nwienert »

rajington wrote: post #35
nwienert wrote: post #34

Hey hackers, Nate with Reapp here. I'll add some technical background. This has been a solo project of mine for the last five months. I actually was relatively green to npm and React in general at the beginning, but I've been working on this full-time since. I think it's a great testament to React's power and ease of understanding. I spent a large part of the development on the animations. Reapp has a custom animatio…

Although everyone is going to jump on the React Native bandwagon, there's good reasons not to. It's not like every write-once framework is going to go away. How far do you think you are from a components library that can compete in breadth and maturity with Ionic and do you think you'll go down the path of what Supersonic is doing with Ionic, but with React (the semi-native components/transitions/views aspect)? The a…

Thanks. As per ionic: give it a few months, but I think it's already gotten pretty far. I tried to throw as much in as I could while still launching within a reasonable time. I've had a ton on my plate between the launch site, docs, apps, platform, cli, etc.

For now I'm going to start doing consulting using Reapp, starting today. So as I go I'll be pushing stuff back to it.

I'm considering funding, I think it would help to really build it out right. Would open it to cool native features, easier build/deploy tools, and focusing on the tech and featureset.

Re: Reapp – hybrid apps, fast

#39

Post by nwienert »

peregrine wrote: post #37
nwienert wrote: post #34

Hey hackers, Nate with Reapp here. I'll add some technical background. This has been a solo project of mine for the last five months. I actually was relatively green to npm and React in general at the beginning, but I've been working on this full-time since. I think it's a great testament to React's power and ease of understanding. I spent a large part of the development on the animations. Reapp has a custom animatio…

It feels like you are using click for touch events. Which causes a ~300ms delay only on mobile phones. Makes me a little concerned about what other "common" hybrid bugs you've missed. Is this your first rodeo with Hybrid apps or have you pushed them to production?

There's a bug on the hamburger menu that's actually not the 300ms delay but seems like it.

Everything else avoid the 300ms delay. We are using react-tappable[0] as a mixin into many of our components that allows a nice onTap={this.handleTap} usage.

It is alpha. For example, I need to fix behavior that allows you to overflow scroll the entire body, which will require some thought and care in it's implementation, but I've already gotten it most the way there. More optimizations will come.

As far as rodeo's it's not my first with hybrid though, I made a large mobile hybrid site in 2u.fm (now deceased, it avoided the 300ms delay though :)), and with my previous employer's site in production quite a bit.

[0] https://github.com/JedWatson/react-tappable

Re: Reapp – hybrid apps, fast

#40

Post by lewisl9029 »

Looks interesting.

Although at it's current stage I feel it doesn't do nearly a good enough job at "looking native", which is one of the best things about the Ionic Framework.

I do remember hearing that Ionic is looking to eventually move towards a framework agnostic approach with its components. In fact, a lot of the library code is already somewhat separated from Angular itself by layers of abstractions.

I personally can't wait for the day when I can use React + Om + ClojureScript with Ionic components. =D

Post reply on HN