Show HN: SmartyPlants – my first iOS app, written entirely in React Native

Show HN: SmartyPlants – my first iOS app, written entirely in React Native(smartyplantsapp.com)

2 points by jsh7 9 years ago | 6 comments

jsh7 9 years ago |

Happy to answer any questions. I really enjoyed working with React Native and I can't wait to start my next RN app. I was also able to open source a couple libraries I wrote while building this app: https://github.com/jshanson7/react-native-swipeable and https://github.com/jshanson7/react-native-interactions

throwmenow_0140 9 years ago | |

Your app looks great! Thanks for open-sourcing your code, the swipeable component looks promising, I hope I get the chance to use it.

I like that

- you've made a video showing all the features

- every interaction has nice animations (which library did you use?)

- the goal of the app is simple but very useful

I can imagine that you can build many specialized todo apps using this as a boilerplate.

Do you have any resources you've used for this project? - https://github.com/VctrySam/AirBnb and https://github.com/fbsamples/f8app were very helpful for inspiration, do you have any recommendations?

jsh7 9 years ago | | |

Thanks!! Using this as boilerplate for multiple specialized todo/reminder apps was exactly my plan :)

For animations I just used Animated (https://facebook.github.io/react-native/docs/animated.html) and LayoutAnimation (https://facebook.github.io/react-native/docs/layoutanimation...) -- the latter makes things so easy I'll probably end up overusing it.

One resource I looked at was https://github.com/Thinkmill/react-conf-app -- but your f8app looks even better than that! I like going through the package.json of other RN apps to learn about new tools. Some of my favorite packages so far are react-native-code-push, react-native-google-analytics-bridge, react-native-image-picker, react-native-smart-splash-screen, react-native-vector-icons, and redux-persist.

thisischichi 9 years ago |

A todo app for the greenfingered. Nice! Might get people talking if you had a social share function... How easy was it to integrate the upload functionality in React Native? And where do the pictures go? Amazon S3?

I posted my first thing to Hacker News today too: https://news.ycombinator.com/item?id=13938994

jsh7 9 years ago | |

Congrats on your launch! Your site is well-designed. And definitely, I'm thinking that building in some social features should be my next step. One idea I have is adding a timeline for each of your plants so you can see how they've grown over time, and then letting you share those timelines with your friends.

Regarding the photos -- for this MVP, I made it a point to not build any server whatsoever. So for now, all pictures are stored on the device's file system. For this I use https://github.com/marcshilling/react-native-image-picker to take/choose the photos and then https://github.com/johanneslumpe/react-native-fs to manage them in the application's storage.

thisischichi 9 years ago | | |

Thanks for the kind words on the site. It is written in Elixir and runs on the Phoenix framework. There's also a fair bit of React for the real-time functionality, which is powered by Phoenix channels. Perhaps I should have mentioned that in my post, seeing as this is Hacker News...!!

Thanks also for sharing the React Native libraries you used.

I think it will be wise in the long run to keep the pictures on device, and maybe store details about the timeline instead, should you wish to add that social feature. As mentioned by @throwmenow_0140 this could do really well with similar, daily capture type apps. Maybe think of one for capturing a selfie a day: http://metro.co.uk/2017/02/23/man-takes-a-photo-of-himself-e...

In its current incarnation, this could go down a storm with allotment owners in the UK though! And that's not something to be sniffed at :) Keep it up. http://www.allotment-garden.org/