Introduction

Developing applications for iOS or Android devices normally requires one to learn the language and development tools for each platform. For iOS development one has to learn the Objective-C programming language and be able to use the Xcode development environment. For Android, one needs to learn Java and use the Android Studio environment. (Sansonetti, 2015.)

React Native is an open source JavaScript framework for building mobile applications for both iOS and Android devices. It was open-sourced on March 2015 by Facebook, and it's based on the React framework published a few years earlier. (Facebook 2015.)

Comments

Post a Comment

Popular posts from this blog

Performance

shouldComponentUpdate This chapter can be applied to all react apps. shouldComponentUpdate React is usually fast, but you still can improve performance by optimizing function  shouldComponentUpdate . By default it returns true, if returns false, the render function will be skipped. This function is frequently invoked when states or props are changed. So it's important to  keep it simple and fast . When you called  setState , the  render  function will always be excuted even if previous states are equal to current. This is where we can make some optimization. demo1 In demo1, when click button, it will set same state, but render times will still increase. demo2 In demo2, we check the value of name is equal to before or not, if equal return false, then we reduce the times of render function. But if our states structure is complicated, such as  { a: { b: { c: [1, 2, 3] }}} , we have to compare them deeply. This is obviously against the rules...
Read more

iOS and Android development with React Native

React Native is an open source JavaScript framework for building mobile applications for iOS and Android devices. It's based on React, a JavaScript framework for building websites for traditional browsers. (Eiseman 2016.) React Native provides an easy developer experience compared to traditional mobile development. When developing an application, you can instantly see changes without building the application first. You can also use your favourite tools like any text editor and terminal, and the developer tools in Chrome or Safari. You are not forced to use Xcode for iOS development or Android Studio for Android development. However, when developing for iOS, the development machines still needs to be an Apple OS X computer. (Eiseman 2016.) With React Native it's easy to use the same code for both iOS and Android applications. For some applications some functionality needs to be platform-specific, but it's possible to achieve even 87% code reuse on real-world applications ...
Read more

Flexbox

Image
1. Flexbox layout The main idea behind the flex layout is to give the container the ability to alter its items' width/height (and order) to best fill the available space (mostly to accommodate to all kind of display devices and screen sizes). A flex container expands items to fill available free space, or shrinks them to prevent overflow. 2.flex:1 const styles = StyleSheet.create({ container: { flex: 1 }, header: { height: 200 , backgroundColor: 'red' }, main: { flex: 1 , backgroundColor: 'blue' }, footer: { height: 200 , backgroundColor: 'green' }, text: { color: '#ffffff' , fontSize: 80 } }); 3.flexDirection:'row'|'column' 4.justifyContent:'flex-start'|'flex-end'|'center'|'space-between'|'space-around' 5.alignItems:'flex-start'|'flex-end'|'center'|'stretch' 6.alignSelf:...
Read more