Location

Location means finding where the phone is using GPS, Wi-Fi and cell towers. The expo-location module returns coordinates and can turn them into an address. Let us add a "Your city" line to the blog profile.

Installing

npx expo install expo-location

The module is included in Expo Go and works on a phone, in an emulator and in a browser.

Permission and coordinates

Location is personal data, so you first ask for permission and only then read the coordinates:

// app/(tabs)/profile.tsx
import * as Location from 'expo-location';
import { useState } from 'react';
import { Button, Text, View } from 'react-native';
 
export default function Profile() {
  const [message, setMessage] = useState('City unknown');
 
  async function detectLocation() {
    const { status } = await Location.requestForegroundPermissionsAsync();
    if (status !== 'granted') {
      setMessage('No access to location');
      return;
    }
 
    const position = await Location.getCurrentPositionAsync({});
    const { latitude, longitude } = position.coords;
    setMessage(`Coordinates: ${latitude.toFixed(3)}, ${longitude.toFixed(3)}`);
  }
 
  return (
    <View style={{ flex: 1, padding: 16, gap: 12 }}>
      <Text>{message}</Text>
      <Button title="Detect city" onPress={detectLocation} />
    </View>
  );
}

On the first press the system shows a dialog asking for location access. After you allow it, the coordinates appear within a second or two, for example "Coordinates: 52.520, 13.405". In an emulator, the coordinates are set in its settings.

From coordinates to a city

reverseGeocodeAsync turns coordinates into an address, an array of candidates with city, country, street and other fields:

// app/(tabs)/profile.tsx
const [place] = await Location.reverseGeocodeAsync({ latitude, longitude });
setMessage(place?.city ? `Your city: ${place.city}` : 'City not found');

Replace the last line of detectLocation with these lines. Now instead of numbers you see, for example, "Your city: Berlin". Address lookup works on iOS and Android; in a browser, test only the coordinates.

Kinds of permission

The first one is enough for the blog. Background access needs extra setup and is strictly reviewed by the app stores.

The permission message

As with the camera, the explanation for the user is set in the plugin in app.json:

{
  "expo": {
    "plugins": [
      ["expo-location", { "locationWhenInUsePermission": "Your city is used to show local news." }]
    ]
  }
}

A clear explanation makes it more likely that the user taps "Allow".

Common mistake

Asking for permission as soon as the app starts. The user does not yet understand why it is needed and often refuses, and the system will not show the dialog again: access can then only be turned on in the phone settings. Ask at the moment the person taps a button related to location.