سعر الذهب فى مصر

A modern React Native (Expo) mobile app that shows live Egyptian gold prices per gram and includes a gram-to-EGP calculator. Built for anyone who follows the local jeweler market (صاغة) and wants fast, readable prices on their phone.

---

demo_.webm

Features

Live gold prices (Home)

• Egyptian market rates for 24K, 21K, 18K, and 14K gold per gram
• Buy (بيع) and sell (شراء) columns — aligned with how Egyptian boards label prices
  • بيع — price when you buy gold from the jeweler
  • شراء — price when you sell gold to the jeweler
• Highlighted main price — 21K buy rate (gold21Sell) shown in a prominent card
• Pull-to-refresh style updates with automatic refresh every hour
• Offline-friendly — last successful prices cached locally via React Query persistence

Gold calculator

• Convert grams → Egyptian pounds (EGP)
• Choose karat — 24, 21, 18, or 14 (not limited to 21K)
• Uses the selected karat’s شراء (sell-to-dealer) rate per gram
• Live formula display: grams × price = total

Bilingual UI (Arabic & English)

• Full Arabic and English translations
• Language toggle on the home screen (globe icon)
• RTL layout for Arabic, LTR for English
• Cairo font for Arabic, Inter for English
• Western numerals (0–9) everywhere, even when the UI is in Arabic

Modern experience

• Custom floating bottom tab bar (Prices · Calculator)
• Black & gold branding with custom app icon and splash screen
• Safe area support for notched devices
• Clean loading and error states with retry

---

Tech stack

Layer	Technology
Framework	Expo SDK 54
UI	React Native 0.81, React 19
Language	TypeScript
Navigation	React Navigation 7 (bottom tabs)
Data fetching	TanStack React Query 5 + AsyncStorage persist
HTTP	Axios
Fonts	Expo Font, Cairo, Inter
Price API	GoldAPI.io (XAU/EGP)

---

How prices are calculated

International spot gram prices from GoldAPI are adjusted to match the Egyptian jeweler board style (calibrated against iSagha-style spreads):

Parameter	Value	Meaning
Buy premium	+1.5%	Applied to spot for بيع (customer buys)
Buy–sell spread	0.74% of buy	Gap between بيع and شراء

All formatted amounts use Western digits and 2 decimal places for prices on the home screen.

---

Prerequisites

• Node.js 18+ (LTS recommended)
• Yarn or npm
• Expo Go on your phone (for development), or Android Studio / Xcode for native builds
• A free GoldAPI.io API key

---

Getting started

1. Clone and install

git clone <your-repo-url>
cd Golden-Price
yarn install

2. Environment variables

Create a .env file in the project root:

EXPO_PUBLIC_GOLD_API_KEY=your_goldapi_io_key_here

Variable	Required	Description
EXPO_PUBLIC_GOLD_API_KEY	Yes	API key from goldapi.io

.env is gitignored. Never commit API keys. Copy from .env.example if needed.

3. Run the app

yarn start

Then:

• Scan the QR code with Expo Go (Android / iOS), or
• Press a for Android emulator, i for iOS simulator, w for web

Clear Metro cache if needed:

yarn start --clear

Other scripts

yarn android   # Expo start → Android
yarn ios       # Expo start → iOS
yarn web       # Expo start → web

---

Project structure

Golden-Price/
├── App.tsx                 # Root providers & navigation
├── app.json                # Expo config (icon, splash, slug)
├── assets/
│   └── appIcon.png         # App icon & splash image
└── src/
    ├── api/                # GoldAPI client & price service
    ├── components/         # AppText, KaratPicker, LanguageToggle
    ├── constants/          # Market tuning, layout
    ├── Hooks/              # useGoldPrice (React Query)
    ├── i18n/               # Arabic & English strings
    ├── lib/                # Query client & keys
    ├── navigation/         # Tab navigator & custom tab bar
    ├── providers/          # Font, locale, React Query
    ├── screens/            # Home & Calculator
    ├── theme/              # Colors, fonts
    ├── types/              # TypeScript types
    └── utils/              # Pricing, formatting, calculator logic

---

Configuration

Setting	Location	Default
Auto-refresh interval	src/constants/CalcGolden.ts	1 hour
Main highlighted price	src/utils/goldCalculator.ts	21K sell (gold21Sell)
Splash / icon background	app.json	#000000

---

Building for production (APK / AAB)

.env works in Expo Go and local dev only. APK builds do not include your .env file — you must inject the API key at build time.

Step 1 — Add the API key to EAS (one time)

From the project folder, log in and create an environment variable:

npm install -g eas-cli
eas login

Recommended — use GOLD_API_KEY (supports --visibility secret):

eas env:create --name GOLD_API_KEY --value paste_your_real_key_here --environment production --visibility secret
eas env:create --name GOLD_API_KEY --value paste_your_real_key_here --environment preview --visibility secret

Or use EXPO_PUBLIC_GOLD_API_KEY — must not use secret visibility (it is embedded in the app bundle). Use sensitive instead:

eas env:create --name EXPO_PUBLIC_GOLD_API_KEY --value paste_your_real_key_here --environment production --visibility sensitive

Replace paste_your_real_key_here with your actual GoldAPI.io key — not the literal text YOUR_ACTUAL_KEY.

Or in the Expo dashboard → your project → Environment variables → add GOLD_API_KEY (secret) for production and preview.

Step 2 — Build a new APK

eas build --platform android --profile production

When the build finishes, install the new APK. The old APK was built without the key and will always show the error until you replace it.

Local production build (optional)

If you build locally, ensure .env exists in the project root (same key as above), then:

eas build --platform android --profile production --local

Custom icon and splash require a development or production build. Expo Go uses its own shell and may not show your final icon.

---

Troubleshooting

Issue	Suggestion
EXPO_PUBLIC_GOLD_API_KEY / API key missing	Expo Go: add .env and restart Metro. APK: set EXPO_PUBLIC_GOLD_API_KEY in EAS env and rebuild the app
Android crash on navigation	Ensure react-native-screens@~4.16.0 (see package.json)
Font / module errors	Run yarn install then yarn start --clear
Stale prices	Tap Refresh prices on the home screen

---

License

This project is private. Add your license here if you open-source it.

---

Acknowledgments

• Spot data: GoldAPI.io
• Egyptian market spread model inspired by local jeweler boards (iSagha-style)