Application of builder design pattern

Taken from pexels.com

Recently, I have been assigned to the task to migrate the AngularJS scheduler to Angular. The scheduler uses external library, FullCalendar. This blog handles a part of its processes. Especially, it focuses on a builder design pattern.

Briefly, the builder design pattern is the one of the creational design patterns, commonly used to create a complex object. The following code is a very condensed version of builder I have implemented. Its objective is to create the Json data from plain object data. The most important methods are createJsonData and build, the rest of them are involved in the data manipulation such as converting data type, changing key or value. To put it simple, the JsonDataBuilder class accepts the plain object and keys to be included into the final Json as parameters and transforms that plain object into the Json format(createJsonData), additionally data type conversion and key name change are implemented, finally build method returns the newly created Json. The way how to consume the JsonDataBuilder is shown at the line, 46. First the JsonDataBuilder is instantiated with the plain object data and keys to be sustained, and then the createJsonData (line: 47) method creates the basic Json format data. After the necessary data manipulation (line: 48–50), the build (line: 51) method returns the final Json data.

Databuilder which transforms the plain object to Json by using builder design pattern

From now on, it is so specific to my personal task, so it is okay to skip.
I consumed the above DataJsonBuilder (DataBuilder from now) to convert our backend API driven data model (Plain object model) to the FullCalendar’s data model (Json key-value pair). Especially, to comply the principle, ‘Program to an interface not an implementation’, the databuilder was abstracted and was defined with generic type so that it can extend to any other types besides our data model. The createJsonData (createData from now) method is defined as abstract so that the subclass is able to implement it depending on its data model.

Abstract DataBuilder class
Implementation of DataBuilderService by extending the abstract DataBuilder
Client program to consume the DataBuilderService

The fullcalendar has two main data sets, such as resources and events, they were finally customized to be compatible with FullCalendar by using the databuilderservie like above in a more readable and maintainable way.

This article is written for personal interest with the very brief introduction of the builder design pattern. If it is not so detailed, please understand it.

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Coding habits for data scientists

Welcome to Adventure Land!

Extend your Kubernetes APIs with CRDs

💪Using Service Principals for Bicep deployments

Linux on my Laptop

Advantages that Odoo ERP Offer.

Nested discriminator with mongoose

Format specifiers in C language

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Miki Lee

Miki Lee

More from Medium

Integration of Bootstrap UI Framework in the Angular Application

State Management in Angular using Redux

Implement FB Conversion API on Angular

NgRx effect use to cache Get request