<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://mediawiki.zeropage.org/index.php?action=history&amp;feed=atom&amp;title=SeparatingUserInterfaceCode</id>
	<title>SeparatingUserInterfaceCode - Revision history</title>
	<link rel="self" type="application/atom+xml" href="https://mediawiki.zeropage.org/index.php?action=history&amp;feed=atom&amp;title=SeparatingUserInterfaceCode"/>
	<link rel="alternate" type="text/html" href="https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;action=history"/>
	<updated>2026-05-15T19:01:44Z</updated>
	<subtitle>Revision history for this page on the wiki</subtitle>
	<generator>MediaWiki 1.39.8</generator>
	<entry>
		<id>https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=87615&amp;oldid=prev</id>
		<title>Maintenance script: Repair MoniWiki formatting after migration</title>
		<link rel="alternate" type="text/html" href="https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=87615&amp;oldid=prev"/>
		<updated>2026-03-29T00:34:30Z</updated>

		<summary type="html">&lt;p&gt;Repair MoniWiki formatting after migration&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 00:34, 29 March 2026&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l7&quot;&gt;Line 7:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 7:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;----&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;----&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;이는 UI 부분에만 적용되지 않는다. 일종의 InformationHiding 의 개념으로 확장할 수 있다. 예를 들면 다음과 같이 응용할 수 있지 않을까.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;이는 UI 부분에만 적용되지 않는다. 일종의 InformationHiding 의 개념으로 확장할 수 있다. 예를 들면 다음과 같이 응용할 수 있지 않을까.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 퍼시스턴스 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 퍼시스턴트 레이어 코드와 관련이 없도록 해야 한다. 만일 MySQL Repository을 작성했을때 당신은 MySQL 인터페이스를 통해 할 수 있는 모든 것들을 Flat File Repository interface 로 작성할 수 있어야 한다. MySQL 코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 퍼시스턴스 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 퍼시스턴트 레이어 코드와 관련이 없도록 해야 한다. 만일 &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/ins&gt;MySQL&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/ins&gt;Repository을 작성했을때 당신은 &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/ins&gt;MySQL&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/ins&gt;인터페이스를 통해 할 수 있는 모든 것들을 Flat File Repository interface 로 작성할 수 있어야 한다. &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[&lt;/ins&gt;MySQL&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;]] &lt;/ins&gt;코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Maintenance script</name></author>
	</entry>
	<entry>
		<id>https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=87243&amp;oldid=prev</id>
		<title>Maintenance script: Table transclusion repair v1</title>
		<link rel="alternate" type="text/html" href="https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=87243&amp;oldid=prev"/>
		<updated>2026-03-27T12:46:19Z</updated>

		<summary type="html">&lt;p&gt;Table transclusion repair v1&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 12:46, 27 March 2026&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l2&quot;&gt;Line 2:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 2:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;전에 TDD 기사 썼을때 읽으면서 굉장히 감명깊었던 구절. 디자인에서 로직/UI 분리가 어떻게 이루어져야 하는가를 아주 간단하면서도 명료하게 말해준다. 개인적으론 RefactoringBook 을 읽었을때보다 이 글을 본 것이 더 충격적이였던것으로 기억된다. (특히, RefactoringBook 을 읽었을때보다 상대적으로 디자인에 대한 지식이 더 있었을때임에도 충격이 더 컸음에.) :&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;전에 TDD 기사 썼을때 읽으면서 굉장히 감명깊었던 구절. 디자인에서 로직/UI 분리가 어떻게 이루어져야 하는가를 아주 간단하면서도 명료하게 말해준다. 개인적으론 RefactoringBook 을 읽었을때보다 이 글을 본 것이 더 충격적이였던것으로 기억된다. (특히, RefactoringBook 을 읽었을때보다 상대적으로 디자인에 대한 지식이 더 있었을때임에도 충격이 더 컸음에.) :&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{|&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;When separating the presentation from the domain, make sure that no part of the domain code makes any reference to the presentation code. So if you write an application with a WIMP (windows, icons, mouse, and pointer) GUI, you should be able to write a command line interface that does everything that you can do through the WIMP interface -- without copying any code from the WIMP into the command line.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;When separating the presentation from the domain, make sure that no part of the domain code makes any reference to the presentation code. So if you write an application with a WIMP (windows, icons, mouse, and pointer) GUI, you should be able to write a command line interface that does everything that you can do through the WIMP interface -- without copying any code from the WIMP into the command line.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 프레젠테이션 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 presentattion 코드와 관련이 없도록 해야 한다. 그리하여 만일 WIMP GUI 어플리케이션을 작성했을때 당신은 WIMP 인터페이스를 통해 할 수 있는 모든 것들을 command line interface 로 작성할 수 있어야 한다. WIMP 코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 프레젠테이션 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 presentattion 코드와 관련이 없도록 해야 한다. 그리하여 만일 WIMP GUI 어플리케이션을 작성했을때 당신은 WIMP 인터페이스를 통해 할 수 있는 모든 것들을 command line interface 로 작성할 수 있어야 한다. WIMP 코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;|}}&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;----&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;----&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;이는 UI 부분에만 적용되지 않는다. 일종의 InformationHiding 의 개념으로 확장할 수 있다. 예를 들면 다음과 같이 응용할 수 있지 않을까.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;이는 UI 부분에만 적용되지 않는다. 일종의 InformationHiding 의 개념으로 확장할 수 있다. 예를 들면 다음과 같이 응용할 수 있지 않을까.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;{{|&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 퍼시스턴스 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 퍼시스턴트 레이어 코드와 관련이 없도록 해야 한다. 만일 MySQL Repository을 작성했을때 당신은 MySQL 인터페이스를 통해 할 수 있는 모든 것들을 Flat File Repository interface 로 작성할 수 있어야 한다. MySQL 코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;도메인모델로부터 퍼시스턴스 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 퍼시스턴트 레이어 코드와 관련이 없도록 해야 한다. 만일 MySQL Repository을 작성했을때 당신은 MySQL 인터페이스를 통해 할 수 있는 모든 것들을 Flat File Repository interface 로 작성할 수 있어야 한다. MySQL 코드로부터 어떠한 코드도 복사하지 않고.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;|}}&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Maintenance script</name></author>
	</entry>
	<entry>
		<id>https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=84964&amp;oldid=prev</id>
		<title>Maintenance script: Repair batch-0003 pages from live compare</title>
		<link rel="alternate" type="text/html" href="https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=84964&amp;oldid=prev"/>
		<updated>2026-03-27T00:29:10Z</updated>

		<summary type="html">&lt;p&gt;Repair batch-0003 pages from live compare&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;en&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Older revision&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Revision as of 00:29, 27 March 2026&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l1&quot;&gt;Line 1:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 1:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;[[:File:&lt;/del&gt;separation.pdf&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;|separation.pdf]]&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;separation.pdf&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br/&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;전에 TDD 기사 썼을때 읽으면서 굉장히 감명깊었던 구절. 디자인에서 로직/UI 분리가 어떻게 이루어져야 하는가를 아주 간단하면서도 명료하게 말해준다. 개인적으론 RefactoringBook 을 읽었을때보다 이 글을 본 것이 더 충격적이였던것으로 기억된다. (특히, RefactoringBook 을 읽었을때보다 상대적으로 디자인에 대한 지식이 더 있었을때임에도 충격이 더 컸음에.) :&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;전에 TDD 기사 썼을때 읽으면서 굉장히 감명깊었던 구절. 디자인에서 로직/UI 분리가 어떻게 이루어져야 하는가를 아주 간단하면서도 명료하게 말해준다. 개인적으론 RefactoringBook 을 읽었을때보다 이 글을 본 것이 더 충격적이였던것으로 기억된다. (특히, RefactoringBook 을 읽었을때보다 상대적으로 디자인에 대한 지식이 더 있었을때임에도 충격이 더 컸음에.) :&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot; id=&quot;mw-diff-left-l14&quot;&gt;Line 14:&lt;/td&gt;
&lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Line 14:&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;&lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;--&amp;amp;#91;1002&amp;amp;#93;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;&lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;&lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;&lt;/del&gt;&lt;/div&gt;&lt;/td&gt;&lt;td colspan=&quot;2&quot; class=&quot;diff-side-added&quot;&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Maintenance script</name></author>
	</entry>
	<entry>
		<id>https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=38996&amp;oldid=prev</id>
		<title>imported&gt;Unknown at 05:28, 7 February 2021</title>
		<link rel="alternate" type="text/html" href="https://mediawiki.zeropage.org/index.php?title=SeparatingUserInterfaceCode&amp;diff=38996&amp;oldid=prev"/>
		<updated>2021-02-07T05:28:01Z</updated>

		<summary type="html">&lt;p&gt;&lt;/p&gt;
&lt;p&gt;&lt;b&gt;New page&lt;/b&gt;&lt;/p&gt;&lt;div&gt;[[:File:separation.pdf|separation.pdf]]&lt;br /&gt;
&lt;br /&gt;
전에 TDD 기사 썼을때 읽으면서 굉장히 감명깊었던 구절. 디자인에서 로직/UI 분리가 어떻게 이루어져야 하는가를 아주 간단하면서도 명료하게 말해준다. 개인적으론 RefactoringBook 을 읽었을때보다 이 글을 본 것이 더 충격적이였던것으로 기억된다. (특히, RefactoringBook 을 읽었을때보다 상대적으로 디자인에 대한 지식이 더 있었을때임에도 충격이 더 컸음에.) :&lt;br /&gt;
{{|&lt;br /&gt;
When separating the presentation from the domain, make sure that no part of the domain code makes any reference to the presentation code. So if you write an application with a WIMP (windows, icons, mouse, and pointer) GUI, you should be able to write a command line interface that does everything that you can do through the WIMP interface -- without copying any code from the WIMP into the command line.&lt;br /&gt;
&lt;br /&gt;
도메인모델로부터 프레젠테이션 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 presentattion 코드와 관련이 없도록 해야 한다. 그리하여 만일 WIMP GUI 어플리케이션을 작성했을때 당신은 WIMP 인터페이스를 통해 할 수 있는 모든 것들을 command line interface 로 작성할 수 있어야 한다. WIMP 코드로부터 어떠한 코드도 복사하지 않고.&lt;br /&gt;
|}}&lt;br /&gt;
----&lt;br /&gt;
이는 UI 부분에만 적용되지 않는다. 일종의 InformationHiding 의 개념으로 확장할 수 있다. 예를 들면 다음과 같이 응용할 수 있지 않을까.&lt;br /&gt;
{{|&lt;br /&gt;
도메인모델로부터 퍼시스턴스 부분이 분리되었을때, 도메인 코드의 어떠한 부분도 퍼시스턴트 레이어 코드와 관련이 없도록 해야 한다. 만일 MySQL Repository을 작성했을때 당신은 MySQL 인터페이스를 통해 할 수 있는 모든 것들을 Flat File Repository interface 로 작성할 수 있어야 한다. MySQL 코드로부터 어떠한 코드도 복사하지 않고.&lt;br /&gt;
|}}&lt;br /&gt;
너무 이상적이라고 말할지 모르겠지만, DIP 의 원리를 잘 지킨다면(Dependency 는 Abstraction 에 대해서만 맺는다 등) 가능하지 않을까 생각. 또는, 위에서의 WIMP를 그대로 웹으로 바꾸어도. 어떠한 디자인이 나올까 상상해본다.&lt;br /&gt;
--&amp;amp;#91;1002&amp;amp;#93;&lt;br /&gt;
&lt;/div&gt;</summary>
		<author><name>imported&gt;Unknown</name></author>
	</entry>
</feed>