webpack-dev-server는 webpack 빌드를 테스트할때 유용한 http 서버다. 문서에도 간단히 설명되어 있지만 Express의 심플버전이라고 보면 된다. 결과물을 file로 쓰지 않고 메모리에서 빌드해서 테스트해 볼 수 있다. 사용법 먼저 webpack 설정을 다음과 같이 만든다. output.publicPath는 클라이언트가 빌드된 파일에 접근할 수 있도록 서버가 제공할 path이다. // webpack.config.js var path = require("path"); module.exports = { entry: { app: ["./app/main.js"] }, output: { path: path.resolve(__dirname, "build"), publicPath: "/asset..

아이폰을 쓰기 시작하면서 내 생활에서 많은 것이 바뀌었는데 가장 많이 바뀐 것 중 하나가 종이 성경책을 더이상 가지고 다니지 않게 된 것이다. 20대를 거의 교회에서 보내서 그런지 가방엔 늘 성경책이 있었다. 전공책이 너무 무거워서 어떻게든 무게를 줄이고자 했을때는 포켓 성경책을 가지고 다녔었다. 그런 내게 아이폰은 혁명과도 같은 것이었다. 책을 아이폰안에 넣고 읽을 수 있다니! 물론 처음부터 그렇게 된 것은 아니다. 아이폰에 뭔가를 넣으려면 앱을 만들어야 하는데 난 아이폰 개발을 할 줄 모른다. (지금도...) 어쩔 수 없이 내가 할 수 있는 유일한 방법인 웹으로 이걸 해결하고자 했다. 당시엔 웹사이트를 모바일에 최적화하는 것이 겨우 시작되고 있었는데 나도 이렇게 하나 만들고 싶었다.구글 앱엔진, Ap..

codemirror에 한참 빠져있을때 간단히 만든 markdown to html 에디터가 있다. 여기에 tistory api로 글 보내기도 붙이고 글 가져오기, 로컬에 임시 저장하기 등등을 붙여보고 싶었는데 솔직히 말해서 엄두가 나지 않았다. 아무래도 코드가 길어질테니 파일을 분리하는 것이 관리하기 편할텐데 분리한 모듈을 관리하고 merge해서 테스트하고 하는 과정이 굉장히 번거롭게 느껴졌다. 그러다가 react 공부하게 되었고, 부끄럽게도 아직 몰랐던 CommonJS도 알게 되었다. react에 webpack을 적용하면서는 눈이 번쩍 뜨이는 것 같았다. 이런 방법이 있는데 왜 그동안 그렇게 고생했던 것일까 싶다. (사실 CommonJS만 알았어도 더 속도가 붙었을 것 같다.) 지금부터 이전에 만들었던 ..

전에 React 체험을 했었는데 그 이후로 별다른 진전이 없다가 이제 조금 시간을 내어 더 공부해보려고 한다. 시작은 역시 시작문서로 하는게 좋을 것 같아서 Getting Started를 읽기 시작했다. 난관 We recommend using React with a CommonJS module system like browserify or webpack. 첫 문장에서 '턱!'하고 막혔다. 너무 오랜시간 javascript 세계를 떠나 있었나보다. 무슨 말인지 하나도 모르겠다. babel로 JSX를 javascript로 변환만 하면 되는거 아닌가 싶었는데 browserify, webpack를 사용한다고 한다. 그 것도 뭔지 모르지만 CommonJS module system도 뭔지 모른다. 빠르게 움직이는 ..

Syntax highlighting은 한동안 쓰다가 불편해서 중단했었다. 설치 불편한거야 어찌어찌 하면되는데 사용할때마다 class에 뭔가를 꼭 써줘야하는 건 많이 불편했다. 그러다가 자연스럽게 사용할 수 있는 좋은 라이브러리 하나 발견해서 그동안 사용했던 라이브러리들을 쭉 정리해보려고 한다. SyntaxHighlighter SyntaxHighlighter는 블로그가 떠오르던 시절 글쓰는 개발자의 가려운 부분을 긁어준 고마운 녀석이다. 티스토리에서 이 라이브러리가 한창 유행했었는데 그 뒤로 바꾸지 않은 사람도 있어서 아직도 이따금 사용 중인 블로그를 보곤한다. 지금이야 이렇게 스크립트 3개만 로딩하면 사용이 가능하지만 처음에는 그렇지 않았다. sh 로 시작하는 수많은 스크립트와 css를 로드해야했다. /..