MeetVPN

- Published on
- Duration
- 3 Months
- Since
- December 2022
- Role
- Frontend Developer
- Repository
- github.com/meetvpn




MeetVPN is a cross-platform VPN client built on the Shadowsocks protocol, designed to run on Android and desktop from a single codebase. The project required building a complete client interface that could reflect real-time VPN connection state while feeling native on both mobile and desktop platforms.
The Challenge
Building a VPN client is a different kind of frontend challenge. Beyond the visual layer, the app needed to manage and display real-time connection state — disconnected, connecting, connected — and surface server selection in a way that felt fast and intuitive. The team also needed to target both Android and desktop without the overhead of maintaining separate native codebases.
What I Built
The client was developed with Ionic and React using TypeScript, with CSS handling the styling layer. Cross-platform deployment was handled through Capacitor for Android and Electron for desktop:
- Connection flow UI — built the full connection state machine interface across three views: disconnected, connecting, and connected — each with real-time visual feedback that keeps the user informed at every step
- Server list & discovery — developed the server browsing and selection screens, allowing users to view available VPN servers, filter by region, and connect with a single tap
- Ionic + React component architecture — structured reusable UI components across all screens using Ionic's mobile-first kit on top of React, keeping the codebase clean and scalable as features grew
- Capacitor integration (Android) — configured the Capacitor bridge to package and run the app natively on Android, enabling access to native device APIs where needed alongside the web-based interface
- Electron (desktop) — set up the Electron wrapper to compile the same React codebase into a native desktop application for Windows and macOS
- TypeScript throughout — enforced strict typing across the entire client, reducing runtime errors and improving development confidence during rapid iteration
Outcome
A working cross-platform VPN client shipped in three months — running on Android via Capacitor and on desktop via Electron from a single Ionic + React codebase. The project remains active on GitHub, with ongoing contributions from the team.