Ethwork

EthWork is a modern Web3 job platform that focuses on task-based work and milestone escrow so developers get paid fairly and on time. The MVP ships a polished, responsive frontend where employers can post roles, candidates can search/filter jobs by skills and salary, and both sides see transparent milestone statuses. Payments are modeled around PYUSD (stablecoin) and escrowed milestones (concept in MVP), with a wallet-ready UI and a clear path to on-chain settlement. This version stores data in the browser via localStorage for a zero-backend demo: post a job, it appears instantly in listings; save jobs, apply, and view a lightweight dashboard—everything persists across refreshes. The UI prioritizes clarity, accessibility, and speed with a clean, professional visual system.

Framework & UI

Next.js (App Router) + React 18 for routing and server/client components.

Tailwind CSS + shadcn/ui for a consistent, accessible component system.

Motion-ready with Framer Motion patterns (fade-up, hover-lift), kept optional.

State & Data

Lightweight state via React hooks (useState, useMemo, useEffect).

localStorage as the persistence layer (lib/storage.ts) with typed helpers and simple versioning.

Seed data on first run; keys like ethwork_jobs, ethwork_companies, ethwork_applications.

Domain Models

Job, Company, Milestone, Application, Contract, Payout TypeScript interfaces in lib/types.ts.

Post-a-Job form writes to localStorage; Jobs page reads + filters in real time.

Search & Filters

Text search across role/company/description.

Skill-tag multi-select (chip input).

Robust salary parser supporting $120,000–$150,000, 120k–150k, 100k+, Up to 90k, etc.; handles single-bound values by setting min=max; uses range-overlap logic so realistic matches aren’t excluded.

Wallet-ready UX

WalletBadge and WalletButton components prepared for wagmi/viem or ConnectKit/RainbowKit.

Network hinting (e.g., “Sepolia • Beta”) wired for later chain detection.

Pages & Flows

Landing, How-It-Works, Jobs (list/detail), Companies (list/detail), Post Job, Developer Dashboard, Support.

Clear CTA flow: browse → filter → view details → save/apply (local).

Accessibility & DX

Semantic HTML, focus rings, color contrast ≥4.5:1, keyboard-friendly.

TypeScript strict mode for safer refactors.

Notable/Hacky bits (worth mentioning)

Salary parsing is resilient to messy input and international punctuation.

LocalStorage as a mini-DB with key namespacing + simple schema versioning for forward compatibility.

Optimistic UI: instant updates to lists after posting/applying to simulate on-chain TX success; easy to swap for real APIs or contract calls.

Feature flags (featureFlags.ts) to toggle charity/disputes/beta banners without code churn.

Upgrade path

Replace storage with Supabase/REST/GraphQL or on-chain indexer.

Wire PYUSD approvals + milestone releases via wagmi/viem on Sepolia first, then mainnet.

Add verification, messaging, disputes, and on-chain reputation badges.