Boost Developer Productivity

with Code Generators

Diky Arga

FE - Search Experience

source : https://devrant.com/rants/1377466/im-not-lazy-im-energy-efficient

Magic CRUD

the "efficient" solutions

Too full-stack

Setup

secure-client

What if nested CRUD?

Create a CRUD framework

the "efficient" solutions

{
	endpoint: '/_exclusive/bukacryptos',
	fields: [
    	{
            name: 'Name',
            type: 'string',
            defaultValue: ''
        },
        {
            name: 'Price',
            type: 'integer',
            required: true
        }
    ]
}

<div v-for="field in fields">
	<magic-field :name="field.name" :type="field.type" :is-required="field.isRequired"/>
</div>

Config base input field

the "efficient" solutions

You may end up with too many variants

Isn't flexible, let's say you want to modify something to use it in another place

I still need the code, so I can modify it for certain use cases

Create a framework

The problem with this approach

https://stackoverflow.com/questions/638868/getting-out-of-crud

the "efficient" solutions

Create a framework

Code Generator

the "efficient" solutions

You get the actual code, so we customize it whatever we want

https://www.hygen.io/

Why Hygen?

Flexible
Programmable (JS)
Templates (EJS, frontmatter)
Can inject existing files

Demo

take a look the example at

Whitebox MicroFE

Additional benefits

Not wasting time on trivial decision
No kopi-pasta, renaming, typos
Easy for newcomer
Ensure everyone doing the "new way"

Boost Developer Productivity

with Code Generators

Magic CRUD

Create a CRUD framework

Create a framework

Create a framework

Code Generator

Why Hygen?

Demo

Additional benefits

Not wasting time on trivial decision

No kopi-pasta, renaming, typos

Easy for newcomer

Ensure everyone doing the "new way"