Brief overview of modern Javascript technologies to speed up web & mobile development process
Uber-like apps help people to request and provide any kind of service wherever it’s required. These apps can control service providers, know customers’ locations, and accept payments from customers and make payouts to service providers.
Of course, the services offered on Uber-like apps can vary a lot across domains. You can find services to help you with flat tire, fix your HVAC system, get a taxi ride, and do lots of other things.
No matter the actual service being offered, you can use the same technologies to build any type of Uber-like platform. Knowing more about technical possibilities can save you a lot of time and money on development. If you’re learning JavaScript, creating Uber-like app can be a good practice project to improve your skills in different fields including backend, frontend, and mobile development.
I won’t go really deep into technology and coding details in this article, but instead will focus on tools and components that already exist and can save a lot of time and money at the initial stages of development.
An Uber-like platform usually consists of four main components:
- Customer app — Your customers use this app to order services, follow the status of their requests, pay for service, see their order history, and so on. Think about how the Uber app works when you are a passenger.
- Service provider app — This is the app that drivers, plumbers, freelancers, and other service providers use to find and book jobs, track job performance, and get paid.
- Admin web application — A web app is usually more user-friendly for admins, moderators, and managers since they can work on a big screen using a desktop or tablet. There’s no need for mobility with an admin panel, so a web app works best. Still, the web app should be responsive to provide a good user experience on any device.
- Backend — This is where data about everything that happens in the system is stored and where requests from web and mobile apps are handled.
This setup can differ for different businesses; for example, instead of a customer mobile app there can be just a web app if that brings better user experience. But more or less these types of systems can be built on the same components.
What Javascript technologies we will use to build Uber-like app
React Native
There’s a lot of discussion about the pros and cons of native development versus hybrid development. You can find many articles about it. At Springs, we create most our mobile apps using React Native for these reasons:
- Our frontend React.js experts can easily switch to mobile development, so there’s no need to hire iOS and Android developers to create an app.
- React has many ready-made components as the community is growing extremely fast and this technology is used and supported by such huge companies as Facebook, Airbnb, and Uber, which contribute a lot to open-source components that anyone can use in their own apps.
- In most cases, developing a React app is around 50% more cost-effective than developing a native app, as we can reuse the same code for both platforms.
- React is fully customizable, so if you don’t find a suitable component you can just create your own and use it in your app. Of course, you’ll need to write this additional component in Java and Swift, but this gives you full freedom in terms of your app’s functionality, meaning you don’t have to rely only on existing components.
- The Components API is compiled into the native Java and Swift environments so you can use all native features of iOS and Android SDKs and achieve native app performance.
As you can see, React Native is a really good fit if you’re on a tight budget and want to build both Android and iOS apps. React Native is what we’ll use to create our customer and service provider apps.
React
React is a popular and super-fast JavaScript framework for building single-page web applications. The advantage is that React and React Native apps use the same React infrastructure, which makes it much easier for the same developers to work on both web and mobile solutions. There are even tools that help you build web and mobile apps with shared code in React, but they haven’t worked well for us because despite all of their commonalities, React and React Native have many differences. That’s why we prefer to create web and mobile apps separately still using React for both.
Node.js vs Firestore
We also would need a backend that will work as web server API and handle all requests from customer and service provider apps, storing data into database.
Using Node.js you can build custom backend that will work as a web server. Using such framework as Express, Koa, or Sails, you can create API endpoints to handle requests from your web and mobile apps, perform some business logic and store data in any SQL or noSQL database.
Firestore is a new noSQL database with automatic synchronization for all clients. It’s quite a modern service and is still in beta, but it’s very promising. If you’re choosing between Realtime Database and Firestore, I recommend the latter. Firestore has a lot of benefits.
Advantages of Firestore:
- No need to create an API, which is the biggest timesaver. Web and mobile apps can be connected directly to Firestore and push and pull data right from it.
- No need to create a local device database for offline mode as Firestore can handle this, which is also a huge timesaver.
- Open-source React Native components are available.
Advantages of Node.js:
- Fully customizable, so you have control over what exactly is sent to devices and can control traffic, performance, etc.
- A huge part of the business logic is performed on the server, translating into better device performance.
- Better database performance and control over data.
In Springs we use both options. Firestore is good option to start with. If you have a limited budget and want to launch ASAP, Firestore should work. But it’s possible that someday when you have more functionality in your app, Firestore won’t give the performance you need and you’ll have to switch to something else.
Stripe Connect
Adding payments into your web or mobile app has never been a problem. There are a lot of services that will help you easily integrate credit card payments and other payment methods.
The problem is with payouts, as you need not only to receive funds from your customers but also to pay your service providers. So you need to choose a payment gateway that provides payouts, or so-called adaptive payments, in the region where your service providers are located. I recommend taking a look at Stripe Connect. Stripe provides a really developer-friendly API and has different payout options in many countries.
What to start with to build an app like Uber
First of all, you need to know exactly what functionality you want to have in your system initially. Talk to your potential customers, service providers, and partners, and do all the startup things required before you go into the development phase. Work on customer development.
As soon as you have a more or less clear vision about your product, you can start development. If you’re going to involve a team, you need to have some basic specification and a design vision. Ideally, create a document that describes what you’re looking for. You can use this document to develop yourself and it will make it much easier for other developers to understand what you need. But don’t make it too detailed because once you start developing, many things may change.
The next step is to start developing. You can use Trello or Jira to better manage the development process. You can start with whatever functionality you want, but ideally you would work on all components in parallel so you can test functionality properly. For example, you can’t test functionality that lets service providers accept orders if you don’t have functionality to create those orders. So just go step by step, test, and you’ll have your MVP ready really fast.
Really hope this article gave you some ideas about how to use Javascript to build apps really fast and cost-effective. If you have any questions, would be glad to answer and assist.