티도리 프레임워크

티스토리 스킨 제작 프레임워크

티도리 프레임워크는 티스토리 스킨을 제작하기 위한 전용 프레임워크입니다. 티스토리 스킨을 개발하기 위해 프레임워크까지 배워야 할까요? 우리가 기본적으로 티스토리 스킨을 개발할 때는 개발, 테스트, 스킨적용 및 배포를 거치게됩니다. 프레임워크는 각 단계에서 발생하는 여러가지 불편사항을 해결하기 위해 사용되는데, 프레임워크를 사용하지 않은 상태로 기존의 티스토리 스킨 제작시 발생하는 문제를 알아보겠습니다.

티도리 프레임워크는 개발자 정상우에 의해 설계 및 개발되었습니다.

디자인과 코드 작성

  • 다양한 기능을 제공하는 확장 HTML 언어인 Pug, Ejs 와 SCSS, Stylus 등의 확장 언어는 수동으로 컴파일해서 사용해야 하며, 티스토리 스킨에서 사용할 모든 기능을 모두 한 개의 마크업 파일에 작성해야합니다.

    템플릿 - 템플릿과 코드 분할

  • 뷰, 리액트 등 SPA(Single Page Application) 프레임워크와 NPM(Node Package Manager) 사용에 제약이 많고, 개발방식이 Bower 와 같은 과거에만 머물러있어 효과적인 개발방식을 취할 수 없습니다.

    프레임워크 - 뷰 & 리액트

  • 템플릿과 컴포넌트를 따로 분리하여 필요할 때 재활용하거나 다른 사람이 작성한 코드를 포함시키기 어렵습니다.

    패키지 - 템플릿과 컴포넌트 재활용

테스트

  • 적용된 스킨의 모습을 확인하려면 스킨편집에 들어가서 코드를 복사 붙여넣기 하고, 정적 리소스 파일(.js, .png 등)을 업로드 해야합니다. 소스코드에 변경사항이 있을 경우에는 파일을 다시 업로드 해야하며 이 과정이 반복적으로 발생하여 불필요한 시간이 요소됩니다.

    시작하기 - 개발 서버와 프리뷰 서버

빌드 및 배포

  • 스킨을 적용하려면 스킨편집에 직접 들어가서 코드를 복사 붙여넣기하고 파일을 업로드해야하거나 스킨저장소에 수동으로 업로드해야 합니다.

    빌드 및 배포 - 자동화