-
-
Notifications
You must be signed in to change notification settings - Fork 26.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
* pattern:implemented the Template View pattern (#1320) * fix:added links in README and updated package name (#1320) --------- Co-authored-by: Ilkka Seppälä <iluwatar@users.noreply.github.com>
- Loading branch information
1 parent
ebcc070
commit 5ba4570
Showing
13 changed files
with
635 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,144 @@ | ||
--- | ||
title: "Template View Pattern in Java: Streamlining Dynamic Webpage Rendering" | ||
shortTitle: Template View | ||
description: "Learn about the Template View design pattern in Java, which simplifies webpage rendering by separating static and dynamic content. Ideal for developers building reusable and maintainable UI components." | ||
category: Behavioral | ||
language: en | ||
tag: | ||
- Abstraction | ||
- Code simplification | ||
- Decoupling | ||
- Extensibility | ||
- Gang of Four | ||
- Inheritance | ||
- Polymorphism | ||
- Reusability | ||
--- | ||
|
||
## Intent of Template View Design Pattern | ||
|
||
Separate the structure and static parts of a webpage (or view) from its dynamic content. Template View ensures a consistent layout while allowing flexibility for different types of views. | ||
|
||
## Detailed Explanation of Template View Pattern with Real-World Examples | ||
|
||
### Real-World Example | ||
|
||
> Think of a blog website where each post page follows the same layout with a header, footer, and main content area. While the header and footer remain consistent, the main content differs for each blog post. The Template View pattern encapsulates the shared layout (header and footer) in a base class while delegating the rendering of the main content to subclasses. | ||
### In Plain Words | ||
|
||
> The Template View pattern provides a way to define a consistent layout in a base class while letting subclasses implement the specific, dynamic content for different views. | ||
### Wikipedia Says | ||
|
||
> While not a classic Gang of Four pattern, Template View aligns closely with the Template Method pattern, applied specifically to rendering webpages or views. It defines a skeleton for rendering, delegating dynamic parts to subclasses while keeping the structure consistent. | ||
## Programmatic Example of Template View Pattern in Java | ||
|
||
Our example involves rendering different types of views (`HomePageView` and `ContactPageView`) with a common structure consisting of a header, dynamic content, and a footer. | ||
|
||
### The Abstract Base Class: TemplateView | ||
|
||
The `TemplateView` class defines the skeleton for rendering a view. Subclasses provide implementations for rendering dynamic content. | ||
|
||
```java | ||
@Slf4j | ||
public abstract class TemplateView { | ||
|
||
public final void render() { | ||
printHeader(); | ||
renderDynamicContent(); | ||
printFooter(); | ||
} | ||
|
||
protected void printHeader() { | ||
LOGGER.info("Rendering header..."); | ||
} | ||
|
||
protected abstract void renderDynamicContent(); | ||
|
||
protected void printFooter() { | ||
LOGGER.info("Rendering footer..."); | ||
} | ||
} | ||
``` | ||
### Concrete Class: HomePageView | ||
```java | ||
@Slf4j | ||
public class HomePageView extends TemplateView { | ||
|
||
@Override | ||
protected void renderDynamicContent() { | ||
LOGGER.info("Welcome to the Home Page!"); | ||
} | ||
} | ||
``` | ||
### Concrete Class: ContactPageView | ||
```java | ||
@Slf4j | ||
public class ContactPageView extends TemplateView { | ||
|
||
@Override | ||
protected void renderDynamicContent() { | ||
LOGGER.info("Contact us at: contact@example.com"); | ||
} | ||
} | ||
``` | ||
### Application Class: App | ||
The `App` class demonstrates rendering different views using the Template View pattern. | ||
```java | ||
@Slf4j | ||
public class App { | ||
|
||
public static void main(String[] args) { | ||
TemplateView homePage = new HomePageView(); | ||
LOGGER.info("Rendering HomePage:"); | ||
homePage.render(); | ||
|
||
TemplateView contactPage = new ContactPageView(); | ||
LOGGER.info("\nRendering ContactPage:"); | ||
contactPage.render(); | ||
} | ||
} | ||
``` | ||
## Output of the Program | ||
```lessRendering HomePage: | ||
Rendering header... | ||
Welcome to the Home Page! | ||
Rendering footer... | ||
Rendering ContactPage: | ||
Rendering header... | ||
Contact us at: contact@example.com | ||
Rendering footer... | ||
``` | ||
## When to Use the Template View Pattern in Java | ||
- When you want to enforce a consistent structure for rendering views while allowing flexibility in dynamic content. | ||
- When you need to separate the static layout (header, footer) from the dynamic parts of a view (main content). | ||
- To enhance code reusability and reduce duplication in rendering logic. | ||
|
||
## Benefits and Trade-offs of Template View Pattern | ||
**Benefits:** | ||
- Code Reusability: Centralizes shared layout logic in the base class. | ||
- Maintainability: Reduces duplication, making updates easier. | ||
- Flexibility: Allows subclasses to customize dynamic content. | ||
|
||
**Trade-offs:** | ||
- Increased Number of Classes: Requires creating separate classes for each type of view. | ||
- Design Overhead: Might be overkill for simple applications with few views. | ||
|
||
## Related Java Design Patterns | ||
- [Template Method](https://java-design-patterns.com/patterns/template-method/): A similar pattern focusing on defining a skeleton algorithm, allowing subclasses to implement specific steps. | ||
- [Strategy Pattern](https://java-design-patterns.com/patterns/strategy/): Offers flexibility in choosing dynamic behaviors at runtime instead of hardcoding them in subclasses. | ||
- [Decorator Pattern](https://java-design-patterns.com/patterns/decorator/): Can complement Template View for dynamically adding responsibilities to views. | ||
|
||
## Real World Applications of Template View Pattern | ||
- Web frameworks like Spring MVC and Django use this concept to render views consistently. | ||
- CMS platforms like WordPress follow this pattern for theme templates, separating layout from content. | ||
|
||
## References and Credits | ||
- [Effective Java](https://amzn.to/4cGk2Jz) | ||
- [Head First Design Patterns: Building Extensible and Maintainable Object-Oriented Software](https://amzn.to/49NGldq) | ||
- [Refactoring to Patterns](https://amzn.to/3VOO4F5) | ||
- [Template Method Pattern](https://refactoring.guru/design-patterns/template-method) | ||
- [Basics of Django: Model-View-Template (MVT) Architecture](https://angelogentileiii.medium.com/basics-of-django-model-view-template-mvt-architecture-8585aecffbf6) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
@startuml | ||
package com.iluwater.templateview { | ||
class App { | ||
+ App() | ||
+ main(args : String[]) {static} | ||
} | ||
|
||
abstract class TemplateView { | ||
- LOGGER : Logger {static} | ||
+ TemplateView() | ||
+ render() : void {final} | ||
# printHeader() : void | ||
# renderDynamicContent() : void {abstract} | ||
# printFooter() : void | ||
} | ||
|
||
class HomePageView { | ||
- LOGGER : Logger {static} | ||
+ HomePageView() | ||
+ renderDynamicContent() : void | ||
} | ||
|
||
class ContactPageView { | ||
- LOGGER : Logger {static} | ||
+ ContactPageView() | ||
+ renderDynamicContent() : void | ||
} | ||
} | ||
|
||
App --> TemplateView | ||
TemplateView <|-- HomePageView | ||
TemplateView <|-- ContactPageView | ||
@enduml |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
<?xml version="1.0" encoding="UTF-8"?> | ||
<!-- | ||
This project is licensed under the MIT license. Module model-view-viewmodel is using ZK framework licensed under LGPL (see lgpl-3.0.txt). | ||
The MIT License | ||
Copyright © 2014-2022 Ilkka Seppälä | ||
Permission is hereby granted, free of charge, to any person obtaining a copy | ||
of this software and associated documentation files (the "Software"), to deal | ||
in the Software without restriction, including without limitation the rights | ||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
copies of the Software, and to permit persons to whom the Software is | ||
furnished to do so, subject to the following conditions: | ||
The above copyright notice and this permission notice shall be included in | ||
all copies or substantial portions of the Software. | ||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
THE SOFTWARE. | ||
--> | ||
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> | ||
<modelVersion>4.0.0</modelVersion> | ||
<parent> | ||
<groupId>com.iluwatar</groupId> | ||
<artifactId>java-design-patterns</artifactId> | ||
<version>1.26.0-SNAPSHOT</version> | ||
</parent> | ||
<artifactId>templateview</artifactId> | ||
<dependencies> | ||
<dependency> | ||
<groupId>org.junit.jupiter</groupId> | ||
<artifactId>junit-jupiter-engine</artifactId> | ||
<scope>test</scope> | ||
</dependency> | ||
<dependency> | ||
<groupId>org.mockito</groupId> | ||
<artifactId>mockito-inline</artifactId> | ||
<scope>test</scope> | ||
</dependency> | ||
</dependencies> | ||
<build> | ||
<plugins> | ||
<plugin> | ||
<groupId>org.apache.maven.plugins</groupId> | ||
<artifactId>maven-assembly-plugin</artifactId> | ||
<executions> | ||
<execution> | ||
<configuration> | ||
<archive> | ||
<manifest> | ||
<mainClass>com.iluwatar.templateview.App</mainClass> | ||
</manifest> | ||
</archive> | ||
</configuration> | ||
</execution> | ||
</executions> | ||
</plugin> | ||
</plugins> | ||
</build> | ||
</project> |
59 changes: 59 additions & 0 deletions
59
templateview/src/main/java/com/iluwatar/templateview/App.java
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,59 @@ | ||
/* | ||
* This project is licensed under the MIT license. Module model-view-viewmodel is using ZK framework licensed under LGPL (see lgpl-3.0.txt). | ||
* | ||
* The MIT License | ||
* Copyright © 2014-2022 Ilkka Seppälä | ||
* | ||
* Permission is hereby granted, free of charge, to any person obtaining a copy | ||
* of this software and associated documentation files (the "Software"), to deal | ||
* in the Software without restriction, including without limitation the rights | ||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
* copies of the Software, and to permit persons to whom the Software is | ||
* furnished to do so, subject to the following conditions: | ||
* | ||
* The above copyright notice and this permission notice shall be included in | ||
* all copies or substantial portions of the Software. | ||
* | ||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
* THE SOFTWARE. | ||
*/ | ||
package com.iluwatar.templateview; | ||
|
||
import lombok.extern.slf4j.Slf4j; | ||
|
||
/** | ||
* Template View defines a consistent layout for rendering views, delegating dynamic content | ||
* rendering to subclasses. | ||
* | ||
* <p>In this example, the {@link TemplateView} class provides the skeleton for rendering views | ||
* with a header, dynamic content, and a footer. Subclasses {@link HomePageView} and | ||
* {@link ContactPageView} define the specific dynamic content for their respective views. | ||
* | ||
* <p>The {@link App} class demonstrates the usage of the Template View Pattern by rendering | ||
* instances of {@link HomePageView} and {@link ContactPageView}. | ||
*/ | ||
@Slf4j | ||
public class App { | ||
|
||
/** | ||
* Program entry point. | ||
* | ||
* @param args command line args | ||
*/ | ||
public static void main(String[] args) { | ||
// Create and render the HomePageView | ||
TemplateView homePage = new HomePageView(); | ||
LOGGER.info("Rendering HomePage:"); | ||
homePage.render(); | ||
|
||
// Create and render the ContactPageView | ||
TemplateView contactPage = new ContactPageView(); | ||
LOGGER.info("\nRendering ContactPage:"); | ||
contactPage.render(); | ||
} | ||
} |
42 changes: 42 additions & 0 deletions
42
templateview/src/main/java/com/iluwatar/templateview/ContactPageView.java
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
/* | ||
* This project is licensed under the MIT license. Module model-view-viewmodel is using ZK framework licensed under LGPL (see lgpl-3.0.txt). | ||
* | ||
* The MIT License | ||
* Copyright © 2014-2022 Ilkka Seppälä | ||
* | ||
* Permission is hereby granted, free of charge, to any person obtaining a copy | ||
* of this software and associated documentation files (the "Software"), to deal | ||
* in the Software without restriction, including without limitation the rights | ||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
* copies of the Software, and to permit persons to whom the Software is | ||
* furnished to do so, subject to the following conditions: | ||
* | ||
* The above copyright notice and this permission notice shall be included in | ||
* all copies or substantial portions of the Software. | ||
* | ||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
* THE SOFTWARE. | ||
*/ | ||
package com.iluwatar.templateview; | ||
|
||
import lombok.extern.slf4j.Slf4j; | ||
|
||
/** | ||
* ContactPageView implements the TemplateView and provides dynamic content specific to the contact page. | ||
*/ | ||
@Slf4j | ||
public class ContactPageView extends TemplateView { | ||
|
||
/** | ||
* Renders dynamic content for the contact page. | ||
*/ | ||
@Override | ||
protected void renderDynamicContent() { | ||
LOGGER.info("Contact us at: contact@example.com"); | ||
} | ||
} |
41 changes: 41 additions & 0 deletions
41
templateview/src/main/java/com/iluwatar/templateview/HomePageView.java
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
/* | ||
* This project is licensed under the MIT license. Module model-view-viewmodel is using ZK framework licensed under LGPL (see lgpl-3.0.txt). | ||
* | ||
* The MIT License | ||
* Copyright © 2014-2022 Ilkka Seppälä | ||
* | ||
* Permission is hereby granted, free of charge, to any person obtaining a copy | ||
* of this software and associated documentation files (the "Software"), to deal | ||
* in the Software without restriction, including without limitation the rights | ||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell | ||
* copies of the Software, and to permit persons to whom the Software is | ||
* furnished to do so, subject to the following conditions: | ||
* | ||
* The above copyright notice and this permission notice shall be included in | ||
* all copies or substantial portions of the Software. | ||
* | ||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR | ||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, | ||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE | ||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER | ||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, | ||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN | ||
* THE SOFTWARE. | ||
*/ | ||
package com.iluwatar.templateview; | ||
|
||
import lombok.extern.slf4j.Slf4j; | ||
|
||
/** | ||
* HomePageView implements the TemplateView and provides dynamic content specific to the homepage. | ||
*/ | ||
@Slf4j | ||
public class HomePageView extends TemplateView { | ||
/** | ||
* Renders dynamic content for the homepage. | ||
*/ | ||
@Override | ||
protected void renderDynamicContent() { | ||
LOGGER.info("Welcome to the Home Page!"); | ||
} | ||
} |
Oops, something went wrong.