A flagship mobile e-commerce platform built with React Native, powered by a cinematic design language and robust full-stack architecture.
Mercato is not just a digital store; it's a statement. It discards mundane application flows in favor of geometric consistency, subtle parallax transitions, and an obsession with detail.
- Cinematic Navigation: Zero-scroll monolithic authentication gateways with animated sliding panes.
- Boutique Wishlist: An immersive 2-column portrait grid that elevates your product imagery.
- Perceived Performance: Eliminated jarring native spinners and substituted them with fluid, breathing "skeleton" shimmer loaders (YouTube/Instagram style).
- The "Physical" Receipt: Checking out generates a beautifully rendered digital E-Receipt, complete with perforated dashed borders and ticket formatting.
- Dynamic Tab Mechanics: Perfectly calibrated safe-area geometry separating hardware navigation bars from the user interface.
| Layer | Technologies |
|---|---|
| Frontend/Mobile | React Native, Expo, React Navigation, Axios, Reanimated |
| Backend API | Node.js, Express.js |
| Database & ORM | PostgreSQL, Prisma ORM |
| Security | JWT (JSON Web Tokens), Bcryptjs, Native Safe Areas |
# Navigate to the backend folder
cd backend
# Install dependencies
npm install
# Configure variables
# 1. Create a `.env` file in the backend root
# 2. Add: DATABASE_URL="postgresql://user:pass@localhost:5432/Mercato"
# 3. Add: JWT_SECRET="your_secret_key"
# Bootstrap PostgreSQL Schema
npx prisma db push
# Boot up the API
npm run dev# Navigate to the mobile folder
cd mobile
# Install dependencies
npm install
# Connect to Local Backend
# Open `src/services/api.js` and change the IPv4 address
# to match your local Wi-Fi router's IP if testing on a physical phone.
# Launch Expo
npx expo start -c
Built with precision and elegance.