SI Project

Netplace Marketing Admin

2024

Screens

Built as a back office for operating the marketing service, managing customer and service status.

React 18, NestJS, MySQL

React 18NestJSMySQL

Background & Cause: An internal channel was needed to view and process customer applications and manage customers, products, owners, and statuses. Operational functions that must not be exposed to customers had to be separated. Standard-administrator and super-administrator permissions also needed separation.
Decision & Rationale: Rather than conditionally place admin functions inside the customer interface, I separated them into a React application. It keeps deployment and exposure boundaries separate while reusing the same API contract. Ant Design keeps information-dense operations screens consistent.
Outcome: One admin channel now handles customer, product, and application work, owner assignment, and status changes. Standard administrators handle operational work, and super administrators manage administrator accounts and permissions. The channel was deployed to the live environment.
Retrospective: Customer and admin channels can share a data contract. Their UI, authorization, and deployment boundaries should stay separate so one channel's changes do not unnecessarily constrain the other.

Background & Cause: Customer, product, and application-management screens repeated lists, search, filters, pagination, and create/edit forms. Independent screen implementations would vary state handling and require the same code again for new screens.
Decision & Rationale: I created shared table, search, and form components and supplied only screen-specific settings and data. Custom hooks separated search, pagination, and API-call state from UI responsibility, standardizing behavior across screens.
Outcome: The interaction pattern for recurring operations UI is consistent, and the scope of adding or modifying a new admin screen is reduced.
Retrospective: For admin interfaces, share common list, search, and form patterns before expanding individual pages. That reduces long-term change cost.