Posts

Showing posts from October, 2018

Build React Native App (4) - Redux, Jest, and NativeBase

Image
From this blog, typescript feature will be added. There are couple of ways to implement static type checking like; flow from facebook, PropTypes and Typescript.Typescript is well integrated with Visual Studio Code and supports better linter, error messages, and intellisense.Reference siteGithub Sample Ex4Currnet versionD:\GitRepo\reactnative>npm --version 6.3.0 D:\GitRepo\reactnative>react-native --version react-native-cli: 2.0.1 react-native: n/a - not inside a React Native project directory D:\GitRepo\reactnative>yarn --version 1.9.4 Creating React Native App$ react-native init ex4 If you want to specify the version, add "--version 0.57.3" at the end.Add NativeBase to React Native$ npm install native-base --save ... + native-base@2.8.1 added 71 packages from 42 contributors, removed 50 packages, updated 829 packages and audited 34989 packages in 138.542s found 0 vulnerabilities $ $ yarn yarn install v1.9.4 warning package-lock.json found. Your project contains l…

Build React Native App (4) - Redux, Jest, and NativeBase

Image
From this blog, typescript feature will be added. There are couple of ways to implement static type checking like; flow from facebook, PropTypes and Typescript.Typescript is well integrated with Visual Studio Code and supports better linter, error messages, and intellisense.Reference siteGithub Sample Ex4Currnet versionD:\GitRepo\reactnative>npm --version 6.3.0 D:\GitRepo\reactnative>react-native --version react-native-cli: 2.0.1 react-native: n/a - not inside a React Native project directory D:\GitRepo\reactnative>yarn --version 1.9.4 Creating React Native App$ react-native init ex4 If you want to specify the version, add "--version 0.57.3" at the end.Add NativeBase to React Native$ npm install native-base --save ... + native-base@2.8.1 added 71 packages from 42 contributors, removed 50 packages, updated 829 packages and audited 34989 packages in 138.542s found 0 vulnerabilities $ $ yarn yarn install v1.9.4 warning package-lock.json found. Your project contains l…

Build React Native App (3) - Adding unit test with Jest

Image
From this blog, the redux library will be added to handle REST service. There are so many good tutorial from blogs and Youtube about the Redux, so I am skipping the redux introduction.Reference siteJest HomepageGithub Sample Ex3Currnet versionD:\GitRepo\reactnative>npm --version 6.3.0 D:\GitRepo\reactnative>react-native --version react-native-cli: 2.0.1 react-native: n/a - not inside a React Native project directory D:\GitRepo\reactnative>yarn --version 1.9.4 Creating React Native App$ react-native init ex3 If you want to specify the version, add "--version 0.57.3" at the end.Add NativeBase to React Native$ npm install native-base --save ... + native-base@2.8.1 added 71 packages from 42 contributors, removed 50 packages, updated 829 packages and audited 34989 packages in 138.542s found 0 vulnerabilities $ $ yarn yarn install v1.9.4 warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package…

Build React Native App (2) - Setup NativeBase and Buttons

Image
From this series, we will NativeBase library to the programNote. I spent almost one day to return 500 error from 0.57.2 and today I noticed that 0.57.3 is released and this version fixed the "return 500" error.Reference siteNativeBase HomepageGithub Sample Ex2Currnet versionD:\GitRepo\reactnative>npm --version 6.3.0 D:\GitRepo\reactnative>react-native --version react-native-cli: 2.0.1 react-native: n/a - not inside a React Native project directory D:\GitRepo\reactnative>yarn --version 1.9.4 Creating React Native App$ react-native init ex2 If you want to specify the version, add "--version 0.57.3" at the end.Add NativeBase to React Native$ npm install native-base --save ... + native-base@2.8.1 added 71 packages from 42 contributors, removed 50 packages, updated 829 packages and audited 34989 packages in 138.542s found 0 vulnerabilities $ $ yarn $ $ react-native link rnpm-install info Linking assets to ios project rnpm-install WARN ERRGROUP Group 'Reso…

Build React Native App (1) - Setup Dev Environment

From this series, we will create simple testing app with Redux and NativeBase which retrieve rest data and display on the screen.Reference siteJest https://jestjs.io/React-devtools https://github.com/facebook/react-devtoolsGithub Sample Ex1Currnet versionD:\GitRepo\reactnative>npm --version 6.3.0 D:\GitRepo\reactnative>react-native --version react-native-cli: 2.0.1 react-native: n/a - not inside a React Native project directory D:\GitRepo\reactnative>yarn --version 1.9.4 The development server returned response error code: 500React Native version 0.57.2 has issue with "response error code: 500". Must use 0.57.1.Two ways;Create project with specific version$ react-native init --version 0.57.1 ex1 Update package.json file{ "name": "ex1", "version": "0.0.1", "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": &q…