Artsy React Native App

A React Native client for Artsy, the online marketplace for art and collectibles. The app browses artists, artworks, and gallery shows through Artsy's public GraphQL API (Metaphysics), and adds an augmented-reality view for previewing artwork in your own space.

Built as a personal project to explore React Native, Apollo GraphQL, and AR on mobile.

Features

• Artist discovery — popular and trending artists on the home screen
• Artist detail — biography, artworks, and current/upcoming shows
• Artwork detail — zoomable artwork image and full artwork information
• Augmented reality view — place an artwork's image on a real-world surface using the device camera (@viro-community/react-viro, ARKit/ARCore)
• Show detail — gallery show information and imagery
• In-app web view — opens Artsy web pages without leaving the app
• Light/dark theme — toggleable app-wide theme
• GraphQL data layer — Apollo Client against Artsy's Metaphysics API, with mocked responses for offline development

Screenshots

Home	Artist Works	Artwork Detail

Tech Stack

• React Native 0.64
• Apollo Client for GraphQL data fetching
• React Navigation (native-stack) for routing
• React Native Paper for UI components/theming
• @viro-community/react-viro for AR
• ESLint (Airbnb config) + Prettier + Jest

Project Structure

src/
├── apollo/        # Apollo Client + cache setup
├── components/    # Shared UI components (buttons, loader, theme toggle)
├── graphql/       # GraphQL queries (artists, artwork, show)
├── hooks/         # Custom hooks (dark mode, mocked queries, etc.)
├── mocks/         # Mock data for offline development
├── screens/
│   ├── ArtistListScreen/
│   ├── ArtistDetailScreen/
│   ├── ArtworkDetailScreen/
│   ├── ArtworkARScreen.js
│   ├── ShowDetailScreen/
│   └── WebviewScreen.js
├── utils/         # Routes, theming, helpers
└── Navigations.js # Screen stack + navigation options

Getting Started

npm install
npm run ios       # or: npm run android

Requires a working React Native environment (Xcode for iOS, Android Studio/SDK for Android). Start the Metro bundler separately with npm start if it doesn't launch automatically.

Other scripts

npm test          # run Jest tests
npm run lint       # run ESLint
npm run build:apk  # assemble a release APK