Could you introduce your app in a few sentences?
Everything started ~2 years ago. I was scrolling down Instagram, seeing some photos, and suddenly I saw an awesome place. It was a square full of small restaurants and street food. I saw the location and it was “Rome”. I was in Rome 2 months before seeing that picture. I said: “I was 3 blocks from there and I never saw it?!”.
There I started looking for some apps “to see the best photo/landscape locations around the world”. All of them were really bad quality apps, or non-free.
Some months after that situation, I started creating this app with a UX/UI designer. So, NoFilter is a project of only 2 people (the UX/UI designer, and me as full-stack dev)
Available for iOS and Android.
If I had to summarize the whole app in a couple of words, I would say: “NoFilter helps you to find the best photo spots around the world”.
Some of our users are using NoFilter for planning their honeymoon. Some others are wedding photographers that use NoFilter to find new places to take photos. But most of the users are just travelers that use NoFilter to discover “what to see” on their trips.
What made you decide to use/switch to React Native?
I’m a full stack developer who in the past years has been working with React on the frontend. So, React Native was the first idea that came up. After doing some research (and some prototypes) about the different alternatives, I chose using React Native over Expo.
How did you transition to React Native?
Actually, there was no transition. That was my first time developing mobile apps, but the Expo+RN ecosystem was pretty similar to the one we have in frontend with React. So, it was pretty smooth.
The main goal at the beginning was to discover which were the limitations that Expo and React Native had, but, fortunately, the roadmaps were well defined in Expo, so, it was really easy to understand where they were, and where they were going.
Anyway, in an app where the goal is “just to show some pictures on a map”, the limitations were not a problem at all.
To sum it up, the combination of StackOverflow + React Native + Expo, made everything move pretty smoothly during the whole dev process.
Have your tried other cross platform technologies before using React Native?
No, I didn’t. After doing the research about the different alternatives, React Native was the only way to go. My past experience with React helped me to make that decision.
What has your experience been working with React Native in terms of app performance, have you noticed any impacts?
I didn’t have performance issues because of React Native. There were only a few situations where I had some performance issues, for example:
- Showing too many points on a map: I solved it by creating clusters of points, which even gets a better user experience.
- Searching spots: When the user searches “Iceland” (for example), the app needs to search if any of the 2000 spots (and growing…) has any kind of relation with that word. Due to the big amount of spots, it takes a few seconds (no more than 2) to get the results. Anyway, it’s a performance issue that is not present in any of the most used devices (the 2 seconds of delay is present only in iPhone SE, the one that I use to test)
The app is pretty simple, with no animations, so, right now, I’m not dealing with performance issues.
How has adopting React Native affected developer productivity?
Since it was my first time developing a mobile app, I was expecting to deal with more estimations/productivity problems than the ones that I had.
The fact that I am the only developer in the team may make it easer, as I remember every single line of code in the whole project, so, the productivity exceeded my expectations.
Even, the app is getting bigger and bigger, and it is escalating pretty well. I’m pretty happy with the whole RN ecosystem.
Which tools, libraries and frameworks are part of your development process with React Native?
I’m mainly using:
- VS Code
- React Native
- Expo: which also provides the Map, Sentry and Amplitude integration.
- Duix: for sharing the state in the whole app. Kind of pub+sub+state (as an alternative to Redux)
- i18n-js: For app translation
- Sentry: For error tracking
- Amplitude: For analytics tracking
- The whole cropping + uploading photo is made by Expo sub-libraries.
- Firebase Functions as backend
I was generating the Spots-Clusters in the app, but I moved it to the backend in the last app version. For the clustering generation, I was using the whole @turf suite.
What resources have you used to learn React Native? Books, tutorials, courses etc. Anything you can recommend?
Honestly, none. I have more than 12 years of experience in the dev world, using a lot of different technologies (even Microsoft Silverlight!!!), so, everything was pretty much intuitive.
Migrating from frontend to React Native is really really simple. There are not too many things which may cause problems. One of the few things that was a bit hard to understand (and that I actually don’t use) is the navigation inside the app. But in the end, it was just the same as we do in React: switching components.
What are some things that you don’t like about React Native or that need to be improved?
The roadmap. The roadmap of Expo is excellent, we can even request features and the Expo team is going to work on the ones that have the most votes.
React Native doesn’t provide something like that (or I never saw it!).
NoFilter is pretty much a simple app, so I didn’t have to deal with all the fronts of this ecosystem. There may be some pain points, as usual (there are no silver bullets), but I didn’t find them yet.
Anything else you would like to mention?
Something to mention? Yes: Creating mobile apps is REALLY much easier than people thought (Thank you React Native and Expo!).
I don’t know how, but encouraging people to navigate in these seas is a really good idea for the community. They just have to try it!
Finally, don’t forget to download NoFilter app to find the best photo spots for your next trip.
If you like the NoFilter design (it was pretty well received in Product Hunt), you can get in touch with Daniela, the UX/UI designer here: https://danielamanzotti.com/, and with me by email: email@example.com