티스토리 툴바


이번 카페24스마트 디자인은 기술적으로 많은 것들을 적용했다. 그 중 하나가 스킨의 상속기능이다. 이 대단한 기능은 사실 이미 외국에서는 사용되고 있는 기술이다. 다만 국내에서는 사용된 예가 없다는 것과 이걸 이해시키기가 무척 어렵다는 것이다.

 

에이전시 입장이나 기획자 입장에서 상속이 머에요? 당연한 것이다. 개발자 수준에서도 상속이 뭔지 모르는 사람이 부지기수이고 (? 아님말고) 아… 니미 코딩하기도 힘든데 그냥 코딩만 하면 되지 뭐… 지금 내가 글을 쓰면서도 사실 막막하다 ㅎㅎ 좋은 기능인데 정말 좋은 기능인데 쉽게 풀어쓸수도 없고… 뭐 하여튼 이 고생 저 고생해서 나온 기능이 바로 상속기능이다. 

어찌되었건 이 글은 최대한 쉽게 스킨 상속이라는 기능을 설명 할 것이다.

 

  스킨복사

선택한 스킨의 파일 하나하나를 복사해주는 기능을 스킨 복사라고 한다. 가장 일반적으로 사용한다. 이해하기도 쉽다. 동일한 파일이 동일하게 생성되어 있기 때문에 에디터플러스나 그 외에 IDE에서 편집하기엔 정말 편한 방법이다.

  

  스킨을 선택한 후 스킨 복사를 클릭한다. 그러면 위의 그림처럼 복사한 스킨이 하나 만들어진다. 복사한 스킨이라는 이름은 내가 알아먹기 쉽도록 이름을 네이밍 한 것이다.

 

위 그림에서처럼 스킨복사를 누르면 기본적으로 디렉토리, 스킨을 기본적으로 그대로 복사해가는 것을 뜻한다. 완전히 복사한 스킨과 동일한 스킨이 만들어지는 것을 가르킨다. 하지만 이런 경우 단점이 있다. 이제부터 그 단점을 설명하겠다. 

스킨이 하나 둘뿐인 사이트에서는 문제가 되지 않는다. 하지만 쇼핑몰을 운영하다 보면 여러 개의 스킨이 필요하게 된다. 스킨 하나, 둘, 셋, 넷 그리고 그 기능을 이용해 테마를 운영하였다고 하자. 아니 에이전시라면 여러 개의 스킨을 제작하였다고 하자.

하나의 스킨에서 관리해야 할 관리할 파일은 100개라고 해보자. 그럼 스킨을 복사할 때마다 관리해야 할 파일을 늘어나기 시작한다. 자 무릎을 맞대고 생각해보자. 스킨 열 개를 가지고 있고 파일을 하나 수정해야 한다? 그럼 파일을 열 개를 수정해야 한다. 

아 생각만해도 짜증나고 짜증난다. 바로 이런걸 삽질이라고 하고 노가다라고 한다. 스킨 10개에 변경할 파일이 10개라고 해보자. 몇 개를 수정해야 하는가? 100개의 파일을 수정해야 한다. 에이전시나 스킨을 많이 관리하는 곳에서 생기는 당연한 문제인 것이다.

  
이런 관리비용을 줄이고 최소 파일만 관리할 수 있도록 하기 위해서 바로 상속이라는 기능을 추가하였다. 스킨복사의 단점을 개선한 것이 바로 스킨상속이다. 그러니깐 더 좋은 기능이라는 것이다. 이제 그 좋은 기능에 대해서 설명해줄 터이니 겁먹지 말고 따라와 보길 바란다.

 

   

 

스킨상속

일반적으로 상속이라는 단어는 개발자들에게만 사용되는 언어이다. 그래서 디자이너 또는 에이전트 입장에서는 무척 낯선 단어이다. 뭐여? 그냥 복사를 쓰면 되는걸 왜 똑 같은 기능을 두 개를 만들어 둔거야?

 

아 그랬다. 때는 바야흐로 6개월전으로 올라가고 6개월전부터 주구장창 상속을 이해시키기 위해서 노력했지만 쉽지 않았다. 기획자도 퍼블리셔도 그리고 QA마저도..  

  너무나 낯선 기능이었던 것이다. 개발자가 개발자의 용어로 아무리 설명해도 모르며, 이해했는가 싶어서 다시 기능을 작성하고 있는데 다시 물어보면 다른 소리를 하기 시작했다. 그렇게 낯선 기능이었다. 

자 아래 그림은 이제 스킨 리스트에서의 모습이다. 무엇이 다른지 봐보자.

 

지금 나의 스킨리스트에는 3개의 스킨이 존재한다. 그리고 쇼핑몰 미리보기 버튼을 클릭해서 보면 모두 다 동일한 화면이 나온다. 뭐가 다른지도 모르겠다. 그래서 쇼핑몰 꾸미기시작을 눌러서 확인해보겠다.

 

기본스킨과 복사한 스킨의 모습은 완전히 동일한다. 하지만 기본스킨, 복사한스킨과 다르게 상속한 스킨은 모습이 좀 다르다. 푸른색의 파일들이 보인다. 저 파일의 의미는 아래와 같다. 저 푸른색의 빛깔은 '나는 가상의 파일입니다'를 나타냅니다.

 

좀 더 이해하기 쉽게 editplus에서 기본스킨과 상속한 스킨을 비교해보겠다.

기본 스킨에는 디렉토리가 보이는데 헐.. 상속한 스킨에는 아무것도 보이지 않는다.. skin2라는 폴더만 존재한다 그럼 상속한 스킨의 파일들은 다 어디로 가버렸다는 말인가? 분명 미리보기시에는 보이는데.. 

그게 바로 상속이라는 기능이다. 상속한 스킨에 없는 파일은 기본 스킨의 파일을 참조하게 되는 것이다. 아래 그림은 좀더 쉬운 그림일 것이다. 

 

 

사용자가 요청한 페이지가 상속한 스킨에 없으면 해당 파일이 부모파일에 있다면 가져와서 보여주는 것.. 그것을 상속이라고 한다. 절대 어렵지 않다. 어떤 이점이 있는지 위에서 설명했다.

 그리고 한번 더 강조하고 설명을 한다. 
위의 그림처럼 스킨이 복사된 상태라면 복사한 스킨들을 다 찾아다니면서 수정해줘야한다.  예를 들어 컨텐츠파일인 회원가입폼에 기능을 추가하고자 한다면 위의 그림에서는 기본스킨부터 복사스킨4까지 모두 회원가입폼을 변경해줘야한다는 것이다. 노가다를 뛰고 싶다면 역시 복사가 짱~ ㅋㅋ


하지만 위처럼 상속되어 만들어진 스킨들은 기본스킨 하나만 수정하면 된다.

-  만약 회원가입폼이 변경되었다면 상위에 기본스킨에 회원가입폼만 만져주면 아래에 하위의 스킨들은 자동으로 회원가입폼이 변경된다는 것이다. 
- 상속스킨3에만 회원가입 기능을 변경하고자 한다면 스킨3 파일에 html파일을 만들어주면 된다. 다시 통합하고 싶다면 지워주면 된다. 
- 부모와 자식의 의존성은 파일에 있다 파일이 삭제되면 부모를 참조한다. 자식들은 부모를 기본적으로 모든 것을 받게 된다.  

 
 

상속의 가장 큰 장점은 관리하는 파일의 수를 줄이고 스킨의 다양성을 확보할 수 있다는 것이다.

한 개의 스킨을 가질 때는 상속이라는 기능은 의미가 없는 기능일수도 있다. 하지만 쇼핑몰들은 커지고 그러한다면 디자인적인 요구사항도 늘어날 것이다. 그럴 경우 한번 써보길 바란다.

지금 바로 당장 에이전시에서는 사용해도 손해 볼 일은 없다. 다만 에디터플러스에서 파일이 없어서 당황스러운 경우를 빼고는 말이다.