Samsung Asset Management
The best data-driven rendering project ever
All investments in the world
Hybrid React
In order to connect with the backend team and meet customer requirements, React was used in the necessary parts in the form of a view library on top of Spring boot.
Except for simple post lists, all parts for data integration were handled with React.
Main transition
ETF/Fund is divided into two domains, so there are two main pages.
To enable users to interactively move between two pages by clicking, the screen was switched using pushState, and the cards in Key Visual were classified according to the design guide.
Product list parameters
One of the key features of this project was to retrieve appropriate product data by calling numerous parameters through the API and elegantly render the product list.
Filter properties were made into a common state to be shared between components, and in active, an advancement project, zustand and provider were used to make components render according to changes in the filter property bundle.
Due to the tight schedule, we were unable to properly define the interface of the product model, so it was unfortunate that we were unable to take full advantage of typescript.
Product component/template
Another key feature, componentization/templating of product pages, also benefited from React's strong structural capabilities. I created about 20 components according to the previous screen design/design components and then combined them and rendered them according to the data and product type.