When you first learn web development, everyone goes through a similar experience.
A website consists of multiple pages. Imagine having to edit dozens of pages just to update common parts like the top menu, bottom address, or phone number.
When first learning HTML, you build websites by copying and pasting these common parts.
Then, you find a typo in the phone number. Holding back tears, you have to open dozens of pages one by one to fix it.
While doing this, something feels off.
"Isn't there a way to change all of this at once?"
Among developers, there is a famous principle called DRY (Don't Repeat Yourself). Not writing the same code twice is the beginning of elegant and efficient development.
Unfortunately, pure HTML alone cannot solve this problem. To avoid this repetitive work, people often turn to programming.
However, learning programming and setting up a server environment just to avoid this level of repetition is too high of a hurdle.
Layouts and Components
Essepage provides two powerful features—'Layouts' and 'Components'—so you can easily practice this DRY principle without complex programming knowledge. They handle code 'sharing' and 'reuse', respectively.
1. Layouts: Sharing the Frame
Look at any website, and you'll see a common structure, like headers, footers, and sidebars, across all pages. In Essepage, you don't need to copy these common parts into every file.
Essepage allows you to manage these common parts in one place through the concept of a Layout.
If you create one layout file in a specific folder, all pages within that folder are automatically displayed inside that layout 'frame'. If each page is a painting, the layout is the picture frame.
Imagine changing the phone number at the bottom of the page, as mentioned earlier. If the phone number is written in the layout, you only need to modify it once in the layout file.
You will experience the magic of dozens of pages 'sharing' that layout updating to the new phone number all at once.
2. Components: Reusing Blocks
If a layout puts pages into a frame to share it, a Component is a feature that puts a small block inside a page to share (reuse) it.
For example, think of a 'Like button' used throughout a website. Copying and pasting this code whenever needed is inefficient. If you want to slightly change the button's design later, you'd have to find and edit all the copied codes.
In Essepage, you can make frequently used UI into an independent block and call it whenever needed on any page to 'reuse' it, just like assembling Lego blocks.
When you want to change the button color from blue to red, modifying just the original component file will instantly update the design across the entire site wherever the button is used.
Work Easily and Comfortably - DRY
Since pure HTML is a syntax for creating single pages, reusing code inevitably requires additional programming knowledge and environments.
However, Essepage is designed to help you avoid repetitive work without complex programming by providing 'Layouts' and 'Components' as built-in platform features.
The moment you understand these two concepts, your code will become amazingly concise, and maintenance will become marvelously easy.