# Technologies Used

The components of the App are built using the core components of [React Native](https://github.com/facebook/react-native) and [NativeBase](http://nativebase.io/). The theme also constantly incorporates various other latest technologies.

* [React Native](#react-native)
* [NativeBase v2.x](https://lyoneat.gitbook.io/lyon-eat/rider-app/technologies-used#nativebase)
* [Expo](#nativebase-1)
* [React Navigation](#nativebase-2)
* [Apollo GraphQL](#nativebase-3)

### [React Native](https://github.com/facebook/react-native) <a href="#react-native" id="react-native"></a>

React Native helps in making the development work easier and allowing the developers to focus on the core app features in every new release. It is the fastest-developing mobile app development that essentially permits you to create an isolated product with often outcomes. The hymn of React Native — **learn once, write anywhere**. React Native takes charge of the view controllers and programatically generates native views using javascript. This means that you can have all the speed and power of a native application, with the ease of development that comes with React.

### [NativeBase](http://nativebase.io/) <a href="#nativebase" id="nativebase"></a>

NativeBase is an open source framework from the team of [StrapMobile](https://strapmobile.com/). This framework enable developers to build high-quality mobile apps using [React Native](https://github.com/facebook/react-native) iOS and Android apps with a fusion of [ES6](https://github.com/lukehoban/es6features). NativeBase builds a layer on top of React Native that provides you with basic set of components for mobile application development. The applications stack of components is built using native UI components and because of that, there are no compromises with the User Experience of the applications. NativeBase is targeted specially on the look and feel, and UI interplay of your app. NativeBase without a doubt fits in well with mobile applications which cut downs one huge part of your app - The Front end.

**Quick links to NativeBase**

* [GitHub](https://github.com/GeekyAnts/NativeBase)
* [NativeBase Components](http://nativebase.io/docs/v2.0.0/components)
* [Documentation](http://nativebase.io/docs/v2.0.0/)
* [Blogs](https://blog.nativebase.io/)

### [Expo](https://expo.io/) <a href="#nativebase" id="nativebase"></a>

[Expo](https://expo.io/) is used to make react native applications. It provides a set of tools that simplify the development and testing of React Native app and arms you with the components of users interface and services that are usually available in third-party native React Native components. With Expo you can find all of them in Expo SDK.

LyonEat is build using [Expo](https://expo.io/) it is powered with  [Expo SDK](https://docs.expo.io/versions/latest/sdk/overview/) to give you access to your device capabilities and the Expo services to handle the heavy lifting of building your app binary and uploading it to the store, all without you touching Xcode or Android Studio. With the "bare" workflow, we also speed up your development with the [Expo SDK](https://docs.expo.io/versions/latest/sdk/overview/) and React Native, and you have full control over your iOS and Android projects.

### [React Navigation](https://reactnavigation.org/) <a href="#nativebase" id="nativebase"></a>

React Navigation is used for routing and navigation in React Native apps. Navigator has some common elements which LyonEat uses.

* **Drawer Navigator** \
  Its used to make a drawer when a user swipes from left to right or presses the drawer icon\\

* **Stack Navigator**\
  Stack Navigator stacks screens on top of each other and only one screen is shown at a time\\

* **Navigation Container**\
  Navigation Container are responsible for managing your app state and linking your top-level navigator to the app environment.

### [Apollo GraphQL](https://www.apollographql.com/) <a href="#nativebase" id="nativebase"></a>

[GraphQL](https://graphql.org) is a substitute for [REST](https://restfulapi.net/rest-architectural-constraints/) architecture modern applications aren't fit for [REST](https://restfulapi.net/rest-architectural-constraints/). The reason is the point-to-point nature of [REST](https://restfulapi.net/rest-architectural-constraints/), a procedural API technology, forces the authors of services and clients to coordinate each use case ahead of time. When frontend teams must constantly ask backend teams for new endpoints, often with each new screen in an app, development is dramatically slowed down. Both teams need to move fast independently.

For Application level state management conventionally [Redux](https://redux.js.org/) is used but in our app we have used [Apollo's](https://www.apollographql.com/) built in state management. The problem with [Redux](https://redux.js.org/) is too much boiler code which bloats code and has a strong learning curve for new user. Since we are already using [Apollo](https://www.apollographql.com/) for replacement to [REST](https://restfulapi.net/rest-architectural-constraints/) without using any third party state management libraries we have used it's built in State management provided by Apollo Client. Our application is a medium size application and works very well with it.
