Skip to content

Instantly share code, notes, and snippets.

npm install -g expo-cli
$ expo init
? Choose a project name: test-project
? Choose a template: expo-template-blank
? Yarn v1.12.3 found. Use Yarn to install dependencies? Yes
[22:35:26] Extracting project files...
[22:35:27] Customizing project...
[22:35:27] Initialized a git repository.
[22:35:27] Installing dependencies...
yarn install v1.12.3
info No lockfile found.
$ cd test-project/
$ yarn start
yarn run v1.12.3
$ expo start
[22:49:43] Starting project at /private/tmp/test-project
[22:49:43] Expo DevTools is running at http://localhost:19002
[22:49:43] Opening DevTools in the browser... (press shift-d to disable)
[22:49:49] Starting Metro Bundler on port 19006.
[22:49:51] Tunnel ready.
yarn add react-navigation
import React from "react";
import { StyleSheet, Text, View } from "react-native";
import { createStackNavigator, createAppContainer } from "react-navigation";
class CitiesScreen extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Cities Screen</Text>
</View>
import React from "react";
import { Button, StyleSheet, Text, View } from "react-native";
import { createStackNavigator, createAppContainer } from "react-navigation";
class CitiesScreen extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Cities Screen</Text>
<Button
import React from "react";
import { Text, View, FlatList } from "react-native";
export default class FlatListDemo extends React.Component {
state = {
data: [0, 1, 2, 3, 4]
};
render() {
return (
render() {
return (
<View style={styles.container}>
<FlatList
data={this.state.data}
renderItem={({ item }) => <Text>{`item ${item}`}</Text>}
keyExtractor={(item, index) => `key-${index}`}
/>
</View>
);
class ListsScreen extends React.Component {
state = {
data: [0, 1, 2, 3, 4],
isRefreshing: false
};
refreshData = () => {
this.setState({ isRefreshing: true });
const data = this.state.data.map(x => x * 2);
this.setState({ data, isRefreshing: false });
import React from "react";
import {
Text,
View,
FlatList,
Dimensions
} from "react-native";
const numItems = 10;
const { height, width } = Dimensions.get("window");