{"id":5862,"date":"2018-06-22T21:17:41","date_gmt":"2018-06-22T12:17:41","guid":{"rendered":"https:\/\/www.vincentina.net\/?p=5862"},"modified":"2020-02-24T11:56:19","modified_gmt":"2020-02-24T02:56:19","slug":"react-native-%e3%81%a7%e3%82%b9%e3%83%9e%e3%83%9b%e3%82%a2%e3%83%97%e3%83%aa%e4%bd%9c%e3%82%8b%e3%81%9e%e3%83%91%e3%83%bc%e3%83%88%ef%bc%92","status":"publish","type":"post","link":"https:\/\/www.vincentina.net\/?p=5862","title":{"rendered":"React Native \u3067\u30b9\u30de\u30db\u30a2\u30d7\u30ea\u4f5c\u308b\u305e\u30d1\u30fc\u30c8\uff12"},"content":{"rendered":"

\u524d\u56de\uff08React Native\u3067\u30b9\u30de\u30db\u30a2\u30d7\u30ea\u958b\u767a\u3057\u3066\u307f\u308b\uff09<\/a>\u306e\u7d9a\u304d\u3067\u3059\u3002<\/p>\n

\u30a8\u30e9\u30fc\u3082\u51fa\u305f\u307e\u307e\u3060\u3063\u305f\u308a\u3057\u3066\u82e5\u5e72\u3084\u3063\u3064\u3051\u306a\u3093\u3060\u3051\u3069\u3082
\n\u307c\u3061\u307c\u3061\u6b21\u306b\u53d6\u308a\u639b\u304b\u308a\u305f\u3044\u306e\u3068\u3001\u30d6\u30ed\u30b0\u66f4\u65b0\u3057\u305f\u304f\u306a\u3063\u305f\u306e\u3067\uff01<\/p>\n

\u306f\u3058\u3081\u3066\u306e\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u958b\u767a<\/p>\n

\"\"<\/a><\/p>\n

\u306eDEMO\u30a2\u30d7\u30ea\u3092\u4f5c\u3063\u3066\u308b\u3068\u304d\u306b\u306f\u3059\u3067\u306b\u3060\u3044\u305f\u3044\u306e\u69cb\u9020\u306f\u3067\u304d\u3066\u305f\u306e\u3067\u5f8c\u306f\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u3059\u308b\u3060\u3051\u3060\u3063\u305f\u3093\u3067\u3059\u304c\u3001\u3084\u3063\u3071\u308a\u305c\u3093\u3076React\u3067\u3084\u308b\u306e\u306f\u3051\u3063\u3053\u3046\u5927\u5909\u3060\u3068\u611f\u3058\u305f\u308f\u3002<\/p>\n

React\u3060\u3051\u3067\u3084\u308b\u3068\u5927\u5909\u3084\u3067<\/font>\u3068\u3044\u3046\u306e\u3092\u611f\u3058\u308c\u3070\u3044\u3044\u306a\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n

\nhttps:\/\/www.vincentina.net\/wp-content\/uploads\/2018\/06\/uvapp.mp4<\/a><\/video><\/div>\n

\u3067\u304d\u3042\u304c\u308a\u306f\u3053\u3093\u306a\u611f\u3058\u3067\u3001\u3042\u304d\u3089\u304b\u306b\u66f8\u7c4d\u306eDEMO\u30a2\u30d7\u30ea\u306e\u611f\u3058\u304c\u6f02\u3063\u3066\u3044\u307e\u3059\u306d\u3002<\/p>\n

Java\u3067\u4f5c\u3063\u305f\u65b9\u306e\u30a2\u30d7\u30ea\u306f\u3053\u3093\u306a\u611f\u3058\u3067\u3057\u305f\u3002<\/p>\n

\"\"<\/a><\/p>\n

Java\u3068JavaScript\u3067\u306a\u3093\u304b\u9055\u3046\u304b\u306a\u3068\u3044\u3046\u3068\u3001\u6319\u52d5\u306b\u5dee\u304c\u3067\u308b\u3088\u3046\u306a\u30a2\u30d7\u30ea\u3058\u3083\u306a\u3044\u306e\u3067\u3068\u304f\u306b\u9055\u3044\u306f\u306a\u3044\u3067\u3059\u3002\u3002<\/p>\n

\u306a\u306e\u3067\u305b\u3063\u304b\u304f\u306a\u306e\u3067IOS\u3067\u3082\u8a66\u3057\u3066\u307f\u307e\u3057\u305f\u3002
\niphone\u6301\u3063\u3066\u306a\u3044\u306e\u3067\u4eee\u88c5\u7aef\u672b\u3067\u3059\u304c\u3002<\/p>\n

\u3059\u3093\u306a\u308a\u3044\u304f\u3068\u601d\u3063\u305f\u3051\u3069\u901a\u4fe1\u3067\u30a8\u30e9\u30fc\u304c\u51fa\u305f\u3002
\n\u3068\u3044\u3046\u306e\u3082IOS\u306f\u30c7\u30d5\u30a9\u30eb\u30c8\u3067HTTP\u3092\u8a31\u53ef\u3057\u3066\u306a\u3044\u3082\u3088\u3046\u3002
\n\u3053\u3053\u3067React Native\u5185\u306b\u3042\u308bIOS\u306e\u8a2d\u5b9a\u3092\u5909\u66f4\u3059\u308b\u7b87\u6240\u3092\u3044\u3058\u304f\u308a\u307e\u3059\u3002<\/p>\n

\r\nIOS > [app name] > Info.plist\r\n<\/pre>\n
\r\n<key>NSAppTransportSecurity<\/key>\r\n<dict>\r\n  <key>NSAllowsArbitraryLoads<\/key>\r\n  <true\/>\r\n<\/dict>\r\n<\/pre>\n
\u3042\u307e\u308a\u826f\u304f\u306a\u3044\u6c17\u304c\u3057\u307e\u3059\u304c\u3001\u30c6\u30b9\u30c8\u30a2\u30d7\u30ea\u3060\u3057\u3002<\/p>\n
\"\"<\/a><\/p>\n
\"\"<\/a><\/p>\n
\u5dee\u304c\u51fa\u308b\u3088\u3046\u306a\u6a5f\u80fd\u3092\u3064\u304b\u3063\u3066\u306a\u3044\u306e\u3067\u306a\u3093\u3068\u3082\u306a\u3093\u3068\u3082\u3084\u3051\u3069\u3001\u64cd\u4f5c\u611f\u3082android\u7248\u3068\u5927\u3057\u305f\u5dee\u306f\u306a\u3044\u306d\u3002<\/p>\n
\u6700\u5f8c\u306b\u30b3\u30fc\u30c9\u3002<\/p>\n
Java\u7248\u306f\u3069\u3093\u306a\u3060\u3063\u305f\u304b\u3068\u3044\u3046\u306e\u306f\u65e5\u672c\u8a9e\u3067\u3055\u3089\u3063\u3068\u66f8\u3044\u3068\u304d\u307e\u3059\u3002
\n\u5b9f\u969b\u306b\u306f3\u500b\u306e\u30a2\u30d7\u30ea\u304c\u5165\u3063\u3066\u308b\u3093\u3067\u3059\u304c\u3001\u3054\u3061\u3083\u3054\u3061\u3083\u5ea6\u5408\u3044\u3067\u3044\u3046\u3068React\u3067\u66f8\u3044\u305f\u30b3\u30fc\u30c9\u306e\u65b9\u304c\u3054\u3061\u3083\u3054\u3061\u3083\u3057\u3066\u307e\u3059w<\/p>\n
Retrofit\u306eInterface\u304c\u3042\u3063\u3066\u3001\u3044\u304f\u3064\u304b\u306eGET\u3092\u5b9a\u7fa9\u3057\u3066\u307e\u3059\u3002
\n\u3093\u3067\u3001\u305d\u308c\u305e\u308c\u306e\u6b32\u3057\u3044\u30c7\u30fc\u30bf\u306e\u578b\u3092\u5b9a\u7fa9\u3057\u305f\u30af\u30e9\u30b9\u304c\u3044\u304f\u3064\u304b\u3042\u308a\u3002
\n\u30e1\u30cb\u30e5\u30fc\u30d0\u30fc\u306b\u4f7f\u3046Fragment\u3068\u3044\u3046\u306e\u304c\u3042\u308a\u3002
\n\u3093\u3067\u304b\u3089\u3001\u305d\u308c\u305e\u308c\u306e\u30a2\u30d7\u30ea\u3054\u3068\u306eActivity\u306e\u30af\u30e9\u30b9\u3068\u3001XML\u306b\u30d0\u30a4\u30f3\u30c7\u30a3\u30f3\u30b0\u3057\u3066\u308b
\nViewModel\u304c\u3042\u308a\u307e\u3059\u3002\u305d\u3093\u306a\u611f\u3058\u3002<\/p>\n
React\u306e\u65b9\u306f\u3053\u3093\u306a\u611f\u3058\u3067\u3059\u3002<\/p>\n
\r\n\/\/ index.js\r\nimport { AppRegistry } from 'react-native';\r\nimport App from '.\/App';\r\n\r\nAppRegistry.registerComponent('HogeWeather', () => App);\r\n<\/pre>\n
\r\n\/\/ App.js\r\n\/**\r\n * Sample React Native App\r\n * https:\/\/github.com\/facebook\/react-native\r\n * @flow\r\n *\/\r\n\r\nimport React, { Component } from 'react';\r\nimport {\r\n  StackNavigator,\r\n  DrawerNavigator\r\n} from 'react-navigation';\r\nimport {\r\n  Platform,\r\n  Text,\r\n  StyleSheet,\r\n  View,\r\n  FlatList,\r\n  Image,\r\n  TextInput,\r\n  Button,\r\n  TouchableOpacity,\r\n} from 'react-native';\r\n\r\nimport styles from '.\/style';\r\nimport WeekUv from '.\/WeekUv';\r\nimport DayUv from '.\/DayUv';\r\n\r\nconst AppDrawerNavigator = DrawerNavigator({\r\n  UVDaylyCheck: {\r\n    screen: StackNavigator({ Home: { screen: DayUv } }, { initialRouteParams: { channelName: 'Uv Check' } }),\r\n    navigationOptions: { drawerLabel: 'UV Dayly Check' },\r\n  },\r\n  UVWeeklyCheck: {\r\n    screen: StackNavigator({ Home: { screen: WeekUv } }, { initialRouteParams: { channelName: 'Uv Check' } }),\r\n    navigationOptions: { drawerLabel: 'UV Weekly Check' },\r\n  }\r\n});\r\n\r\nexport default class App extends Component<{}> {\r\n\r\n  render() {\r\n    return (\r\n      <AppDrawerNavigator \/>\r\n    );\r\n  }\r\n}\r\n<\/pre>\n
\r\n\/\/ DavUv.js\r\n\/**\r\n * Sample React Native App\r\n * https:\/\/github.com\/facebook\/react-native\r\n * @flow\r\n *\/\r\n\r\nimport React, { Component } from 'react';\r\nimport { type NavigationScreenProp } from 'react-navigation';\r\nimport {\r\n\tPlatform,\r\n\tText,\r\n\tStyleSheet,\r\n\tView,\r\n\tFlatList,\r\n\tImage,\r\n\tTextInput,\r\n\tButton,\r\n\tTouchableOpacity,\r\n} from 'react-native';\r\nimport styles from '.\/style';\r\n\r\nconst baseURL = 'http:\/\/api.openweathermap.org';\r\n\r\nconst uvOneDayURL = '\/data\/2.5\/uvi?appid=hoge&lat=34.70&lon=135.50';\r\n\r\nconst weatherURL = '\/data\/2.5\/weather?q=hoge,jp&appid=hoge&units=metric';\r\n\r\n\r\ntype Props = {\r\n\tnavigation: NavigationScreenProp<*>,\r\n};\r\n\r\ntype State = {\r\n\tmessagesDayUvd: Array<DayUvd>,\r\n\tmessagesDayMain: Array<DayMain>,\r\n\tmessagesDaySys: Array<DaySys>,\r\n\tmessagesDayWea: Array<DayWea>,\r\n};\r\n\r\ntype DayUvd = {\r\n\tlat: number,\r\n\tlon: number,\r\n\tdate_iso: number,\r\n\tdate: number,\r\n\tvalue: number,\r\n}\r\n\r\ntype DayMain = {\r\n\ttemp: number,\r\n\tpressure: number,\r\n\thumidity: number,\r\n\ttemp_min: number,\r\n\ttemp_max: number,\r\n}\r\n\r\ntype DaySys = {\r\n\ttype: number,\r\n\tid: number,\r\n\tmessage: number,\r\n\tcountry: string,\r\n\tsunrise: number,\r\n\tsunset: number,\r\n}\r\n\r\ntype DayWea = {\r\n\tid: string,\r\n\tmain: string,\r\n\tdescription: string,\r\n\ticon: string,\r\n}\r\n\r\nexport default class DayUv extends Component<Props, State> {\r\n\tstatic navigationOptions = ({ navigation }: { navigation: NavigationScreenProp<*> }) => ({\r\n\t\ttitle: `${navigation.state.params.channelName}`,\r\n\t\theaderLeft:\r\n\t\t\t<TouchableOpacity style={{ padding: 8 }} onPress={() => navigation.navigate('DrawerToggle')}>\r\n\t\t\t\t<Image style={{ width: 32, height: 32 }} source={require('.\/images\/menu.png')} \/>\r\n\t\t\t<\/TouchableOpacity>\r\n\t})\r\n\tconstructor(props: Props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tmessagesDayUvd: [],\r\n\t\t\tmessagesDayMain: [],\r\n\t\t\tmessagesDayWea: [],\r\n\t\t\tmessagesDaySys: []\r\n\t\t};\r\n\t\tthis.changeUTtoDate = this.changeUTtoDate.bind(this);\r\n\t\tthis.cautionMessage = this.cautionMessage.bind(this);\r\n\t\tthis.changFtoC = this.changFtoC.bind(this);\r\n\t\tthis.changeDate = this.changeDate.bind(this);\r\n\t}\r\n\r\n\tchangFtoC = (v: number) => {\r\n\t\treturn (v - 32) \/ 1.8;\r\n\t}\r\n\r\n\tcautionMessage = (value: number) => {\r\n\t\tif (value < 2.0) {\r\n\t\t\treturn "\u3072\u304f\u3044";\r\n\t\t} else if (value < 5.9) {\r\n\t\t\treturn "\u3075\u3064\u3046";\r\n\t\t} else if (value < 7.9) {\r\n\t\t\treturn "\u305f\u304b\u3044";\r\n\t\t} else if (value < 10.9) {\r\n\t\t\treturn "\u8d85\u305f\u304b\u3044";\r\n\t\t} else {\r\n\t\t\treturn "\u3084\u3070\u3044";\r\n\t\t}\r\n\t}\r\n\r\n\tchangeUTtoDate = (value: number) => {\r\n\t\tvar d = new Date(value * 1000);\r\n\t\tvar year = d.getFullYear();\r\n\t\tvar month = d.getMonth() + 1;\r\n\t\tvar day = d.getDate();\r\n\t\tvar valueOfDay = (d.getDay());\r\n\t\tvar dayofweek = ["\u65e5", "\u6708", "\u706b", "\u6c34", "\u6728", "\u91d1", "\u571f"];\r\n\t\tvar monthName = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n\r\n\t\treturn (year + '\u5e74' + month + '\u6708' + day + '\u65e5' + dayofweek[valueOfDay] + '\u66dc\u65e5');\r\n\t}\r\n\r\n\tchangeDate = (v: number) => {\r\n\t\tvar d = new Date(v * 1000);\r\n\t\tvar hour = ('0' + d.getHours()).slice(-2);\r\n\t\tvar min = ('0' + d.getMinutes()).slice(-2);\r\n\r\n\t\treturn (hour + ' : ' + min);\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tfetch(baseURL + uvOneDayURL)\r\n\t\t\t.then((response) => response.json())\r\n\t\t\t.then((json) => {\r\n\t\t\t\tthis.setState({\r\n\t\t\t\t\tmessagesDayUvd: json\r\n\t\t\t\t})\r\n\t\t\t})\r\n\t\t\t.catch((error) => {\r\n\t\t\t\talert(error)\r\n\t\t\t});\r\n\t\tfetch(baseURL + weatherURL)\r\n\t\t\t.then((response) => response.json())\r\n\t\t\t.then((json) => {\r\n\t\t\t\tthis.setState({\r\n\t\t\t\t\tmessagesDayMain: json.main,\r\n\t\t\t\t\tmessagesDaySys: json.sys,\r\n\t\t\t\t\tmessagesDayWea: json.weather[0]\r\n\t\t\t\t})\r\n\t\t\t})\r\n\t\t\t.catch((error) => {\r\n\t\t\t\talert(error)\r\n\t\t\t});\r\n\t}\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<View style={styles.container}>\r\n\t\t\t\t<View style={styles.header}>\r\n\t\t\t\t\t<Text style={styles.title}>\r\n\t\t\t\t\t\tUV\u60c5\u5831\u3068\u4eca\u65e5\u306e\u5929\u6c17\r\n\t\t\t\t\t<\/Text>\r\n\t\t\t\t<\/View>\r\n\t\t\t\t<View style={styles.body}>\r\n\t\t\t\t\t<Text style={styles.bodyFont}>{this.changeUTtoDate(this.state.messagesDayUvd.date)}\u306e\u5929\u6c17<\/Text>\r\n\t\t\t\t\t<Text style={styles.bodyFont}>{this.state.messagesDayWea.main}<\/Text>\r\n\t\t\t\t\t<Text style={styles.bodydesc}>{this.state.messagesDayWea.description}<\/Text>\r\n\t\t\t\t\t<View>\r\n\t\t\t\t\t\t<Text style={styles.tableBody}>\u7d2b\u5916\u7dda\u91cf\uff1a{this.state.messagesDayUvd.value} - {this.cautionMessage(this.state.messagesDayUvd.value)}<\/Text>\r\n\t\t\t\t\t<\/View>\r\n\t\t\t\t\t<Text style={styles.bodyFont}>\u6c17\u6e29 \t\t\t\uff1a{this.state.messagesDayMain.temp}<\/Text>\r\n\t\t\t\t\t<Text style={styles.bodyFont}>\u65e5\u306e\u51fa\t\t\uff1a{this.changeDate(this.state.messagesDaySys.sunrise)}<\/Text>\r\n\t\t\t\t\t<Text style={styles.bodyFont}>\u65e5\u306e\u5165\t\t\uff1a{this.changeDate(this.state.messagesDaySys.sunset)}<\/Text>\r\n\t\t\t\t<\/View>\r\n\t\t\t<\/View >\r\n\t\t);\r\n\t}\r\n}\r\n\r\n\r\n<\/pre>\n
\r\n\/\/ WeekUv.js\r\n\r\n\/**\r\n * Sample React Native App\r\n * https:\/\/github.com\/facebook\/react-native\r\n * @flow\r\n *\/\r\n\r\nimport React, { Component } from 'react';\r\nimport { type NavigationScreenProp } from 'react-navigation';\r\nimport {\r\n\tPlatform,\r\n\tText,\r\n\tStyleSheet,\r\n\tView,\r\n\tFlatList,\r\n\tImage,\r\n\tTextInput,\r\n\tButton,\r\n\tTouchableOpacity,\r\n} from 'react-native';\r\nimport styles from '.\/style';\r\n\r\nconst baseURL = 'http:\/\/api.openweathermap.org';\r\n\r\nconst uvURL = '\/data\/2.5\/uvi\/forecast?lat=34.70&lon=135.50&appid=hoge&cnt=6';\r\n\r\ntype Props = {\r\n\tnavigation: NavigationScreenProp<*>,\r\n};\r\n\r\ntype State = {\r\n\tmessages: Array<Message>,\r\n};\r\n\r\ntype Message = {\r\n\tlat: number,\r\n\tlon: number,\r\n\tdate_iso: number,\r\n\tdate: number,\r\n\tvalue: number,\r\n}\r\n\r\ntype MessageCellProps = {\r\n\tmessage: Message\r\n};\r\n\r\nconst MessageCell =\r\n\t(props: MessageCellProps) =>\r\n\t\t<View>\r\n\t\t\t<View style={styles.table}>\r\n\t\t\t\t<Text style={styles.tableDate}>\u65e5\u306b\u3061\uff1a{changeUTtoDate(props.message.date)}<\/Text>\r\n\t\t\t\t<Text style={styles.tableBody}>\u7d2b\u5916\u7dda\u91cf\uff1a{props.message.value} - {cautionMessage(props.message.value)}<\/Text>\r\n\t\t\t<\/View >\r\n\t\t<\/View>\r\n\r\nlet cautionMessage = (value) => {\r\n\tif (value < 2.0) {\r\n\t\treturn "\u3072\u304f\u3044";\r\n\t} else if (value < 5.9) {\r\n\t\treturn "\u3075\u3064\u3046";\r\n\t} else if (value < 7.9) {\r\n\t\treturn "\u305f\u304b\u3044";\r\n\t} else if (value < 10.9) {\r\n\t\treturn "\u8d85\u305f\u304b\u3044";\r\n\t} else {\r\n\t\treturn "\u3084\u3070\u3044";\r\n\t}\r\n}\r\n\r\nlet changeUTtoDate = (value) => {\r\n\tvar d = new Date(value * 1000);\r\n\tvar year = d.getFullYear();\r\n\tvar month = d.getMonth() + 1;\r\n\tvar day = d.getDate();\r\n\tvar valueOfDay = (d.getDay());\r\n\tvar dayofweek = ["\u65e5", "\u6708", "\u706b", "\u6c34", "\u6728", "\u91d1", "\u571f"];\r\n\tvar monthName = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n\r\n\treturn (dayofweek[valueOfDay] + ' , ' + day + ' , ' + monthName[month] + '  ' + year);\r\n}\r\n\r\nexport default class WeekUv extends Component<Props, State> {\r\n\tstatic navigationOptions = ({ navigation }: { navigation: NavigationScreenProp<*> }) => ({\r\n\t\ttitle: `${navigation.state.params.channelName}`,\r\n\t\theaderLeft:\r\n\t\t\t<TouchableOpacity style={{ padding: 8 }} onPress={() => navigation.navigate('DrawerToggle')}>\r\n\t\t\t\t<Image style={{ width: 32, height: 32 }} source={require('.\/images\/menu.png')} \/>\r\n\t\t\t<\/TouchableOpacity>\r\n\t})\r\n\tconstructor(props: Props) {\r\n\t\tsuper(props)\r\n\t\tthis.state = { messages: [] };\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tfetch(baseURL + uvURL)\r\n\t\t\t.then((response) => response.json())\r\n\t\t\t.then((json) => {\r\n\t\t\t\tthis.setState({ messages: json })\r\n\t\t\t})\r\n\t\t\t.catch((error) => {\r\n\t\t\t\talert(error)\r\n\t\t\t});\r\n\t}\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<View style={styles.container}>\r\n\t\t\t\t<View style={styles.header}>\r\n\t\t\t\t\t<Text style={styles.title}>\r\n\t\t\t\t\t\t\uff11\u9031\u9593\u306eUV\u60c5\u5831\r\n        <\/Text>\r\n\t\t\t\t<\/View>\r\n\t\t\t\t<View>\r\n\t\t\t\t\t<FlatList\r\n\t\t\t\t\t\tstyle={styles.list}\r\n\t\t\t\t\t\tdata={this.state.messages.slice()}\r\n\t\t\t\t\t\trenderItem={({ item }) => <MessageCell message={item} \/>}\r\n\t\t\t\t\t\/>\r\n\t\t\t\t<\/View>\r\n\t\t\t<\/View >\r\n\t\t);\r\n\t}\r\n}\r\n\r\n\r\n<\/pre>\n
\r\nimport { StyleSheet } from 'react-native';\r\n\r\nexport default StyleSheet.create({\r\n\tcontainer: {\r\n\t\tflex: 1,\r\n\t\tbackgroundColor: '#f5deb3',\r\n\t},\r\n\theader: {\r\n\t\tborderBottomWidth: 10,\r\n\t\tborderColor: '#f4a460',\r\n\t\tmargin: 16,\r\n\t},\r\n\ttitle: {\r\n\t\tfontSize: 26,\r\n\t\tcolor: '#000000',\r\n\t\tmarginLeft: 10,\r\n\t},\r\n\ttable: {\r\n\t\twidth: "95%",\r\n\t\tbackgroundColor: "#f1dab0",\r\n\t\tmarginLeft: "5%",\r\n\t\tmarginBottom: 10,\r\n\t\tborderColor: '#F0F0F0',\r\n\t},\r\n\ttableBody: {\r\n\t\tfontSize: 24\r\n\t},\r\n\ttableDate: {\r\n\t\tfontSize: 16\r\n\t},\r\n\tbody: {\r\n\t\tmargin: 10\r\n\t},\r\n\tbodyFont: {\r\n\t\tfontSize: 23\r\n\t},\r\n\tbodydesc: {\r\n\t\tborderBottomWidth: 1,\r\n\t\tfontSize: 20,\r\n\t\tborderColor: '#f4a460',\r\n\t\tmarginBottom: 10,\r\n\t}\r\n});\r\n\r\n\r\n<\/pre>\n
\u3064\u304e\u306f\u30c7\u30fc\u30bf\u7ba1\u7406\u3064\u304b\u3044\u305f\u3044\u306d\u3002<\/p>\n
        
Tweet<\/a><\/div><\/div>\n
\n","protected":false},"excerpt":{"rendered":"
\u524d\u56de\uff08React Native\u3067\u30b9\u30de\u30db\u30a2\u30d7\u30ea\u958b\u767a\u3057\u3066\u307f\u308b\uff09\u306e\u7d9a\u304d\u3067\u3059\u3002 \u30a8\u30e9\u30fc\u3082\u51fa\u305f\u307e\u307e\u3060\u3063\u305f\u308a\u3057\u3066\u82e5\u5e72\u3084\u3063\u3064\u3051\u306a\u3093\u3060\u3051\u3069\u3082 \u307c\u3061\u307c\u3061\u6b21\u306b\u53d6\u308a\u639b\u304b\u308a\u305f\u3044\u306e\u3068\u3001\u30d6\u30ed\u30b0\u66f4\u65b0\u3057\u305f\u304f\u306a\u3063\u305f\u306e\u3067\uff01 \u306f\u3058\u3081\u3066\u306e\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u958b\u767a \u306e … “React Native \u3067\u30b9\u30de\u30db\u30a2\u30d7\u30ea\u4f5c\u308b\u305e\u30d1\u30fc\u30c8\uff12” \u306e<\/span>\u7d9a\u304d\u3092\u8aad\u3080<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[106],"tags":[],"class_list":["post-5862","post","type-post","status-publish","format-standard","hentry","category-programming"],"_links":{"self":[{"href":"https:\/\/www.vincentina.net\/index.php?rest_route=\/wp\/v2\/posts\/5862","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vincentina.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.vincentina.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.vincentina.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vincentina.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5862"}],"version-history":[{"count":0,"href":"https:\/\/www.vincentina.net\/index.php?rest_route=\/wp\/v2\/posts\/5862\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.vincentina.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5862"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.vincentina.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5862"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vincentina.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5862"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}