maulanasdqnandClaude Opus 4.6
4e9d110bb0
VITE_API_URL was never set in the Nix build, so getBaseURL() returned empty string causing all API calls to hit the current origin (e.g. hackathon.imphnen.dev) instead of api.imphnen.dev. This caused 405 errors on login since the frontend server doesn't handle POST. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
IMPHNEN Frontend Service
Monorepo for all frontend services of IMPHNEN (Ingin Menjadi Programmer Handal Namun Enggan Ngoding) — Indonesia's largest programmer community.
Apps
| App | Framework | URL |
|---|---|---|
| Landing | Next.js 16 | imphnen.dev |
| Backoffice | Vite + React | backoffice.imphnen.dev |
| Hackathon | Vite + React | hackathon.imphnen.dev |
| Dimentorin | Vite + React | dimentorin.imphnen.dev |
| Gacha | Vite + React | gacha.imphnen.dev |
| QR Campaign | Vite + React | qr.imphnen.dev |
| Infra | Vite + React | infra.imphnen.dev |
Shared Libraries
| Lib | Purpose |
|---|---|
utils |
Pure utilities — cn(), For, Show, useQueryState, useModalLogin |
service |
Business logic — API clients, auth hooks, storage, constants |
ui |
UI components — atoms, molecules, organisms (atomic design) |
Getting Started
Prerequisites
- Node.js 22
- Nix (optional, for reproducible builds)
Setup
git clone https://github.com/IMPHNEN/imphnen-frontend-service.git
cd imphnen-frontend-service
npm install
Or with Nix:
nix develop # enters dev shell with node 22, bun, git, jq
Environment Variables
Copy .env.example to .env in the app directory:
cp apps/<app>/.env.example apps/<app>/.env
Development
nx dev <app> # e.g. nx dev landing, nx dev backoffice
Build
nx build <app> # build single app
nx run-many -t build --all # build everything
nx affected -t build # build only what changed
Nix Build
nix build .#<app> # e.g. nix build .#landing, .#dimentorin
All Nix config lives in flake.nix. When package-lock.json changes, update npmDepsHash using lib.fakeHash.
Testing
nx test <project> # unit tests (vitest)
nx e2e <app>-e2e # e2e tests (playwright)
nx lint <project> # eslint
Storybook
nx storybook ui # run storybook for ui lib
nx build-storybook ui # build static storybook
CI/CD
GitHub Actions pipeline (.github/workflows/nix-build.yml):
- detect — uses
nx affectedto find changed apps - build — matrix strategy builds only affected apps with Nix, pushes to Cachix
- deploy — updates
flake.lockin imphnen-infrastructure and deploys to the server using clan
Tech Stack
- Monorepo: Nx 22.6
- Frontend: React 19, TypeScript
- Styling: Tailwind CSS v4, CVA
- State: Zustand, TanStack React Query
- Forms: react-hook-form + zod
- Build: Nix flakes, Cachix
- CI: GitHub Actions
Contributing
- Fork and clone the repository
- Create a branch:
git checkout -b feat/feature-name - Make changes, commit, and push
- Open a pull request to the
developbranch
Issues and feedback welcome via GitHub Issues.