Operations Tool Development Strategy for Server Developers: Applying React and GraphQL

This article covers considerations for server developers building operations tools from the perspectives of frontend, API, and UX. For the frontend, React was chosen as the most widely used option amid the declining need for jQuery, and the component-based Ant Design was used as the design framework to improve development efficiency. GraphQL was adopted for API design instead of REST. This is because clients can request only the necessary fields, reducing unnecessary data transfer, and schema-based development facilitates documentation and testing (GraphiQL). In particular, Spring for GraphQL 1.0 was utilized to ensure flexibility in connecting types without modifying existing Entities, and it was first applied to the operations tool as a validation step before service deployment. Additionally, a UX guide was established containing GNB/LNB layout rules, permalink URL design principles, and interaction standardization for consistent UX. Developing operations tools provides server developers with a good opportunity to acquire frontend skills and validate new technologies.