Tech TutorBangla Web Documentation
Portfolio
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • Expo Documentation40টি অধ্যায়
প্রযুক্তি নির্বাচন
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • Expo Intro
  • Expo vs React Native
  • RN Basics
  • Environment Setup
  • Project Setup
  • Project Structure
  • App Config
  • Expo Router Intro
  • Stack Navigation
  • Tabs Navigation
  • Core Components
  • Styling & Flexbox
  • Safe Area
  • Scroll & Lists
  • Forms & State
  • AsyncStorage
  • Project: Task Actions
  • Project: Screens
  • Images & Assets
  • Icons & Fonts
  • Theming
  • Camera & Picker
  • Notifications
  • Location & Maps
  • SQLite
  • API & Fetch
  • Loading & Errors
  • Secure Store & Auth
  • Auth Session
  • AppState & Network
  • Performance
  • Debugging & Tests
  • Config & Env
  • Splash & Updates
  • EAS Build
  • EAS Update
  • Store Submission
  • Common Mistakes
  • Best Practices
  • Interview Questions
  1. Docs
  2. Expo
  3. expo-location ও react-native-maps
ExpoAdvanced

expo-location ও react-native-maps

টাস্ক-এ location attach করা ও map view-এ দেখানো।

7টি অংশবাংলা ভাষায়
terminalbash
bash
npx expo install expo-location
import * as Location from "expo-location";

async function getCurrentPlace() {
  const { status } = await Location.requestForegroundPermissionsAsync();
  if (status !== "granted") return null;
  const pos = await Location.getCurrentPositionAsync({});
  const coord = { lat: pos.coords.latitude, lng: pos.coords.longitude };
  const places = await Location.reverseGeocodeAsync(coord);
  return places[0]?.city ?? places[0]?.name ?? "নিজের স্থান";
}

মানচিত্র দেখাতে চাইলে react-native-maps:

terminalbash
bash
npx expo install react-native-maps
import MapView, { Marker } from "react-native-maps";

<MapView
  style={{ flex: 1 }}
  initialRegion={{
    latitude: task.lat,
    longitude: task.lng,
    latitudeDelta: 0.01,
    longitudeDelta: 0.01,
  }}
>
  <Marker coordinate={{ latitude: task.lat, longitude: task.lng }} />
</MapView>
  • foreground permission এই সেটআপেই app config-এ auto-add হয়
  • background location — বিশেষ permission, সাবধানে
  • reverseGeocodeAsync — lat/lng → city/name
map-এর API key

expo-go-এ react-native-maps gratis চলে; standalone build-এ (Android/iOS) নিজের Google Maps API key দরকার — app.config-এ দিন।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।
আগেরexpo-notifications — local reminderপরেরexpo-sqlite — local SQL database
Tech Tutor

বাংলায় ওয়েব ডেভেলপমেন্ট ডকুমেন্টেশন শিখুন — ধাপে ধাপে।

Homeসব ডকুমেন্টেশনQuick Startআমার নোটস

© 2026 Tech Tutor. বাংলায় শিখুন, বাংলায় গড়ুন।

mdanamolhasan1998@gmail.com