Case Study 01

Building my first
React Native App.

Imagify is a learning experiment designed to explore mobile architecture, component logic, and the Expo ecosystem.

Role

Frontend Development

UI Design

Stack

React Native

Expo Go

Year

2025

Repo

github.com/pstarz7
App User Flow Walkthrough

The Objective

I didn't build Imagify to launch a startup. I built it to break things. My goal was to step away from the web browser and understand the constraints and capabilities of a mobile environment.

Guided by documentation and AI assistance, I tackled file structure, state management, and the specific styling quirks of React Native compared to standard CSS.

  • Expo Setup & Configuration
  • Stack Navigation Logic
  • Component Reusability
  • AI-Assisted Debugging

Interface Design

Exploring layout constraints on small screens.

Onboarding

Onboarding Flow

Initial user engagement screen.

Home Screen

Dashboard

Main navigation and prompt inputs.

Features

Interaction

Copy to clipboard and share functionality.

Technical Takeaways

Transitioning from web to mobile required a shift in mental models.

01

Native Components

Learned to use <View> instead of div and <Text> for typography. Understanding that text strings cannot exist without a wrapper was a key adjustment.

02

Flexbox is King

React Native relies heavily on Flexbox. I mastered `flexDirection`, `alignItems`, and `justifyContent` to handle responsiveness across different device sizes.

03

AI Pair Programming

Used AI tools to quickly generate boilerplate code and debug cryptic error messages, speeding up the learning curve significantly.