Skip to content

julianoczkowski/Expo-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Expo Mobile Development Guide

This repository contains comprehensive documentation for getting started with Expo and Material 3 Expressive for cross-platform mobile app development.

📑 Documentation Contents

An in-depth overview of the Expo platform and its benefits, including:

  • Platform Overview - What makes Expo unique in the React Native ecosystem
  • Key Benefits - Seven major advantages of using Expo for mobile development
  • Use Cases - When Expo is the right choice for your project

Setup Guides

Platform-specific setup instructions for getting started with Expo and Material 3 Expressive:

🚀 Getting Started

  1. First, read Why Expo? to understand the platform's benefits
  2. Follow the setup guide for your operating system:
  3. Start building your first app with the provided bootstrap scripts

📱 Sample App: MyFirstApp

The repository includes a complete sample application that demonstrates Material 3 Expressive implementation with Expo. Key features include:

Material 3 Expressive Implementation

  • Dynamic Theming - Automatically adapts to light/dark mode with Material You colors
  • Typography - Uses Roboto fonts with proper Material 3 text styles
  • Component Library - Showcases Paper v5 components with Material 3 styling
  • Animations - Fluid motion using Moti for transitions and micro-interactions
  • Navigation - Tab-based navigation with Material 3 styling

App Screens

  • Home Screen - Showcases cards, buttons, and surfaces with Material 3 styling
  • Profile Screen - Demonstrates lists, avatars, and a floating action button
  • Modal Screen - Shows chips, cards, and content presentation

Technical Features

  • Expo Router - File-based routing with the latest Expo Router
  • React Native Paper - Material 3 components with proper theming
  • Expo Material 3 Theme - Dynamic color extraction from the system
  • Moti Animations - Spring-based animations for a lively interface
  • Type Safety - Full TypeScript implementation

📋 What's Included

In the Why Expo Guide:

  • Expo in a Nutshell - Core concepts and capabilities
  • Rapid Development - How Expo accelerates the development process
  • Cross-Platform APIs - Native functionality without platform-specific code
  • Platform-Independent Workflow - Build for any platform from any OS
  • Efficient Updates & Deployment - OTA updates and simplified distribution
  • Modern & Maintained - Latest React Native features and regular updates
  • Scalability - Growing with your project's needs
  • Community Resources - Support and ecosystem benefits

In the Setup Guides:

  • Quick Start - Bootstrap scripts for immediate setup
  • Environment Configuration - Required tools and dependencies
  • App Creation - Creating your first Expo app
  • Material 3 Integration - Setting up the Material 3 Expressive design system
  • Theme Configuration - Customizing appearance for your brand
  • Development Workflow - Day-to-day development practices
  • Cloud Builds - Using EAS for app building and distribution
  • Troubleshooting - Common issues and their solutions

🔍 Context7 MCP Integration

Both setup guides include instructions for integrating Context7 MCP, a powerful tool that provides:

  • Up-to-date documentation for Expo and React Native directly in your Cursor IDE
  • Instant access to API references, component guides, and code examples
  • Simple setup using the web-based MCP server URL
  • Contextual help while coding without leaving your development environment

To use Context7, simply type use context7 followed by your Expo or React Native question in Cursor's AI chat panel. This integration significantly speeds up development by providing accurate, current documentation at your fingertips.

🛠 Requirements

  • Node.js 22 LTS
  • Git
  • Android Studio (for Android development)
  • Xcode (for iOS development, macOS only)

📚 Additional Resources

All documentation includes links to official resources for further reading on specific topics.

🧪 Running the Sample App

To run the sample app:

  1. Clone this repository
  2. Navigate to the MyFirstApp directory
  3. Install dependencies: npm install
  4. Start the development server: npx expo start
  5. Use Expo Go on your device or an emulator/simulator to view the app

This documentation is designed to get you from zero to a running Material 3 Expressive app in under an hour, with no guessing and no skipped steps.

About

Expo/React Native starter aligned to the web system with shared tokens.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors