InteractiveKICA / Korea In-house Counsel Association / 2023
Membership Platform
Member website · Admin · API
I independently designed and developed the Korea In-house Counsel Association’s web service from frontend to backend. It included Korean and English public sites, registration, membership payments, boards, events and an admin interface. Public pages and tools for managing members and content were connected within the same service.
Korean/English pages and SSR
I built the Korean and English sites with Next.js. On each homepage request, the server fetched posts and banners and passed them to the page. User-facing features were connected according to membership status.
Payments and membership status
The client’s payment-complete response was not used directly to update membership. The server queried the payment provider again, checked the order amount and payment status, and only then updated payment and membership-tier information.
Content managed by operators
The admin interface managed members, dues, boards and events, as well as desktop/mobile banner images and their order. I integrated Tiptap for formatting, links and image uploads, and connected the analytics screens to Google Analytics Data API results.
Next.js · React · NestJS · TypeORM · PostgreSQL · Tiptap
ENC / Law firm website & CMS
Website & CMS
Website · Content editing · Publishing
I developed ENC’s public website and admin CMS. Alongside practice-area and insight pages, I built the screens for replacing banners and editing articles. The CMS fields matched the public page structure, with API integration carrying edits through to the website.
Shared structure across pages
Pages used shared Next.js App Router layouts and practice-area templates. Query parameters selected sections within practice areas, while insight pages connected API-loaded content with previous and next articles.
Editing images and order
Each banner had separate desktop and mobile images, a link and a display order. Drag-and-drop changes were saved, then query data was refreshed so the admin UI showed the stored result.
Direct control over article images
I customized Tiptap’s image extension to persist size and alignment, and implemented drag-to-resize behavior in a React NodeView. The create and edit screens sent the resulting HTML and attachment data to the API.
Next.js · React · TanStack Query · Tiptap · Tailwind CSS
