Skip to main content

​
Overview

The Rippler project includes various npm scripts for development, building, testing, and deployment. All scripts are defined in package.json and can be run using npm run <script-name>.

​
Development Scripts

Scripts for local development and testing.

​
expo:dev

npm run expo:dev
Starts the Expo development server with Replit-specific environment configuration. 
EXPO_PACKAGER_PROXY_URL=https://$REPLIT_DEV_DOMAIN \
REACT_NATIVE_PACKAGER_HOSTNAME=$REPLIT_DEV_DOMAIN \
EXPO_PUBLIC_DOMAIN=$REPLIT_DEV_DOMAIN:5000 \
npx expo start --localhost
This command sets up environment variables for Replit deployment:
  • EXPO_PACKAGER_PROXY_URL - Proxy URL for the Metro bundler
  • REACT_NATIVE_PACKAGER_HOSTNAME - Hostname for the packager
  • EXPO_PUBLIC_DOMAIN - Public domain for API connections
When to use:
  • Local mobile app development
  • Testing on physical devices or emulators
  • Hot reload during feature development

​
server:dev

npm run server:dev
Runs the Express backend server in development mode using tsx for TypeScript execution. 
NODE_ENV=development tsx server/index.ts
Features:
  • Hot reload on file changes
  • Development environment configuration
  • Enhanced error messages
  • Request logging enabled
When to use:
  • Backend API development
  • Database operation testing
  • Full-stack development (run alongside expo:dev)

​
Build Scripts

Scripts for creating production-ready builds.

​
expo:start:static:build

npm run expo:start:static:build
Starts the Expo Metro bundler in production mode for static builds. 
npx expo start --no-dev --minify --localhost
Options:
  • --no-dev - Disables development mode
  • --minify - Enables code minification
  • --localhost - Serves on localhost only
When to use:
  • Used internally by expo:static:build
  • Not typically run directly

​
expo:static:build

npm run expo:static:build
Builds static Expo bundles for iOS and Android platforms. 
node scripts/build.js
What it does:
1

Prepares build directories

Creates timestamped build directories and cleans previous builds
2

Clears Metro cache

Removes cached Metro bundler files for a clean build
3

Starts Metro bundler

Launches the Metro server in production mode
4

Downloads bundles

Fetches minified iOS and Android JavaScript bundles
5

Downloads manifests

Retrieves platform-specific Expo manifests
6

Processes assets

Extracts and downloads all app assets (images, fonts, etc.)
7

Updates URLs

Modifies bundle and manifest URLs for deployment
Output: 
static-build/
├── <timestamp>/
│   └── _expo/static/js/
│       ├── ios/bundle.js
│       ├── android/bundle.js
│       └── assets/
├── ios/manifest.json
└── android/manifest.json
When to use:
  • Production deployments
  • Creating standalone bundles
  • Deploying to Replit or similar platforms

​
server:build

npm run server:build
Builds the Express server using esbuild for production deployment. 
esbuild server/index.ts --platform=node --packages=external --bundle --format=esm --outdir=server_dist
esbuild options:
  • --platform=node - Target Node.js environment
  • --packages=external - Keep npm packages external
  • --bundle - Bundle all code into single file
  • --format=esm - Output ES modules
  • --outdir=server_dist - Output to server_dist/ directory
Output: server_dist/index.js When to use:
  • Production server deployments
  • Optimizing server bundle size
  • Before running server:prod

​
server:prod

npm run server:prod
Runs the production-built server. 
NODE_ENV=production node server_dist/index.js
You must run npm run server:build before running this command.
When to use:
  • Production deployments
  • After building with server:build
  • Performance testing with optimized code

​
Database Scripts

​
db:push

npm run db:push
Pushes database schema changes to PostgreSQL using Drizzle Kit. 
drizzle-kit push
What it does:
  • Reads schema from shared/schema.ts
  • Compares with current database state
  • Generates and executes SQL to sync schema
  • Updates database to match schema definitions
Prerequisites:
  • DATABASE_URL environment variable must be set
  • PostgreSQL database must be accessible
When to use:
  • After modifying shared/schema.ts
  • Setting up a new development environment
  • Syncing database schema changes
This command directly modifies the database without creating migration files. For production, consider using drizzle-kit generate to create migrations first.

​
Code Quality Scripts

​
lint

npm run lint
Runs ESLint to check for code quality issues. 
npx expo lint
Checks for:
  • Code style violations
  • Potential bugs
  • Best practice violations
  • Prettier formatting issues
Configuration: Uses eslint.config.js with Expo and Prettier presets When to use:
  • Before committing code
  • In CI/CD pipelines
  • During code review

​
lint:fix

npm run lint:fix
Automatically fixes ESLint issues where possible. 
npx expo lint --fix
What it fixes:
  • Formatting issues
  • Auto-fixable ESLint rules
  • Import ordering
  • Trailing whitespace
Not all issues can be auto-fixed. Manual intervention may be required for some violations.
When to use:
  • Before committing code
  • After major refactoring
  • To quickly clean up formatting

​
check:types

npm run check:types
Runs TypeScript compiler to check for type errors without emitting files. 
tsc --noEmit
Checks for:
  • Type mismatches
  • Missing type annotations
  • Invalid type assertions
  • Unused variables (with strict mode)
When to use:
  • Before building for production
  • In CI/CD pipelines
  • During development to catch type errors early

​
check:format

npm run check:format
Checks if code is formatted according to Prettier rules. 
prettier --check "**/*.{js,ts,tsx,css,json}"
Checked file types:
  • JavaScript (.js)
  • TypeScript (.ts, .tsx)
  • CSS (.css)
  • JSON (.json)
Exit codes:
  • 0 - All files are formatted correctly
  • 1 - Some files need formatting
When to use:
  • In CI/CD pipelines
  • Pre-commit hooks
  • Before code review

​
format

npm run format
Automatically formats all code according to Prettier rules. 
prettier --write "**/*.{js,ts,tsx,css,json}"
What it formats:
  • Indentation (2 spaces)
  • Line length (80 characters)
  • Quotes (double quotes)
  • Semicolons
  • Trailing commas
When to use:
  • Before committing code
  • After adding new files
  • To maintain consistent code style

​
Common Workflows

​
Full-Stack Development

# Terminal 1: Start the Expo development server
npm run expo:dev

# Terminal 2: Start the backend server
npm run server:dev

​
Code Quality Check

# Run all quality checks
npm run check:types
npm run lint
npm run check:format

​
Production Build

# Build the static Expo bundles
npm run expo:static:build

# Build the server
npm run server:build

# Run the production server
npm run server:prod

​
Pre-Commit Workflow

# Format code
npm run format

# Fix linting issues
npm run lint:fix

# Check types
npm run check:types

​
Environment Variables

Key environment variables used by these scripts:
​
DATABASE_URL
string
required
PostgreSQL connection string for Drizzle ORMExample: postgresql://user:password@localhost:5432/rippler
​
REPLIT_DEV_DOMAIN
string
Replit development domain (automatically set on Replit)
​
EXPO_PUBLIC_DOMAIN
string
Public domain for API connections (used by Expo client)
​
NODE_ENV
string
Node environment: development or production
​
PORT
string
Server port (defaults to 5000)

​
Script Chaining

You can chain multiple scripts using &&: 
# Format, lint, and type check in one command
npm run format && npm run lint:fix && npm run check:types

# Build both client and server
npm run expo:static:build && npm run server:build

​
Next Steps

Setup Guide

Set up your development environment

Project Structure

Understand the codebase layout

Testing

Learn about testing approaches

Architecture

Learn about Rippler’s architecture

Build docs developers (and LLMs) love

Get started for freeTalk to us