티도리 6.0

프레임워크의 방향성

티도리를 사용하여 티스토리 스킨을 여러번 개발해보니 거의 사용하지 않는 기능이 다수 있었으며 오버엔지니어링(Overengineering) 에 가까운 기능을 프레임워크가 제공하고 있었다는 것을 알게 되었습니다. 오지랖 이 너무 넓었다는 얘기가 되겠지요. 본 프레임워크는 뷰(Vue.js) 프레임워크를 롤모델로 삼아 진입장벽 을 낮추고 빠른 러닝코스 를 갖추도록 하고자합니다.

복잡한 것들은 안녕

티도리 1.0 부터 티도리 5.2 까지 추가하고 또 추가하는, 추가의 연속이었습니다. 이제는 간결하게 잘라낼 시간이 왔습니다. 티도리 API, 라우팅과 데이터베이스, 테스팅, 스킨 미리보기 기능을 제거했습니다.

티도리 API

티도리 API 는 기존에 제공하던 inline 속성 이외에 tidory.config.js 에서 사용하던 것들 (전역변수, 사용자 지정 디렉티브, 이벤트, 비동기 데이터) 을 모두 제거하였습니다. 런타임중에 일어나는 것들이 아니라, 컴파일타임에서 제공하는 기능들은 크게 의미가 없기 때문입니다. 개인적으로 기능이 많은 스킨을 개발하면서도 티도리 API는 거의 사용하지 않았습니다.
그나마 사용하던 것이 전역변수 쪽인데, 이마저도 .env 환경설정을 사용하는 것과 퍼그에서 제공하는 믹스인 을 포함하는 것으로 커버가 가능합니다.

라우팅과 데이터베이스

라우팅과 데이터베이스 기능은 위에서 언급한 오버엔지니어링(Overengineering) 입니다. 아래에서 이야기 하게될 뷰 & 리액트 컴포넌트 를 사용하는 것만으로도 관련 모듈을 통해 충분히 커버가 가능하며 프레임워크에서 특정 모듈을 지정해주는 것은 결과적으로 자유도 를 해치는 행위가 되었으며, 진입장벽을 높히는 원인이되었습니다.

테스팅

테스팅티도리 API 를 테스트하기 위해 만들어졌엇습니다만, 이제는 그것을 사용하지 않기때문에 자연스럽게 같이 사라지게 되었습니다.

스킨 미리보기

스킨 미리보기 기능은 도움이 될 수 있었으나, 어떤 때는 동작하고 어떤 때는 동작하지 않는 것으로 매우 불안정했으며, 테스팅 과정또한 바람직하지 못했습니다. 티스토리가 공식적으로 지원하지 않는 이상은 추가 되지 않을 것으로 보여집니다.

뷰 & 리액트면 충분해!

라우팅과 데이터베이스와 같은 삭제당한 기능은 뷰 & 리액트 컴포넌트를 사용하는것으로 해결할 수 있습니다. npm 이 가지고 있는 방대한 레포지토리로는 많은 것을 할 수 있습니다. webpack 을 사용하면서 자바스크립트 프레임워크를 사용하지 않는 것은 득보다 실이 많습니다.

컴포넌트(Component)

기존에는 뷰(Vue) 컴포넌트 만을 프로젝트에 포함했으나, 이제 리액트(React) 컴포넌트 도 사용할 수 있습니다. assets/components 폴더에 컴포넌트를 작성하고 webpack.entry.js 에서 등록하고 템플릿에서 사용합니다.

티도리 모듈

티도리 모듈 의 사용법이 일부 변경되었습니다. 스킨 미리보기 등의 기능이 사라져 명령 수가 줄었으며 프로젝트를 생성하는 방법이 변경되었고, 빌드 모드에 따른 명령어 분기도 사라졌습니다. 프로젝트를 생성하는 방법은 시작하기 를, 빌드 모드 변경에 대해서는 빌드 및 배포모드 를 참고합니다. npm 를 참고해도 좋습니다.

디렉토리 간소화

기능 삭제로 인해 해당 기능들이 점유하고 있던 디렉토리들이 제거되었습니다. 스킨제작을 위한 필수 디렉토리만 존재하며 컴포넌트(Component) 또한 옵션이기 때문에 assets 폴더 아래로 이동되었습니다.
├── assets/
├── docs/
│     ├── index.xml
│     ├── preview256.jpg
│     ├── preview560.jpg
│     └── preview1600.jpg
├── images/
├── layouts/
│     └── default.pug
├── views/
├── .env
├── app.pug
├── index.pug
├── webpack.base.conf.js
└── webpack.entry.js

인라인 속성

스타일과 스크립트를 style.cssscript.js 로 분리하지 않고 그대로 두기 위해 사용하던 inline 속성의 이름이 혼동을 야기할 수도 있는 것으로 판단되어 scoped 라는 이름으로 재명명 되었습니다. 리소스 부분을 참고해주세요.