이 글은 2015년의 루비 코리아 대림달력을 위해 작성되었습니다.
html 파일을 열때 절대 경로를 사용한다던가등의 이유로 재대로 안보일 때 유용합니다.
ruby -run -e httpd . -p 3000
웹페이지는 "http://localhost:3000/파일명" 에서 볼 수 있습니다.
정적 페이지지만 레이아웃을 공유하고 싶다던가 할때 레일즈를 사용하기엔 배보다 배꼽이 커지는 것 같으니 부담 스러울 때는 미들맨이나 지킬이 유용합니다.
오늘은 설정이 좀 더 단순한 미들맨을 살펴보겠습니다.
먼저 설치가 필요합니다.
$ gem install middleman
$ rbenv rehash # rbenv를 사용하시는 분만 실행하세요.
$ brew update
$ brew install openssl
$ brew link openssl --force
설치가 끝났으면 폴더를 만들고 초기화를 해줍니다.
$ mkdir my-static-app
$ cd my-static-app/
$ middleman init
이 명령을 실행하면 다음과 같은 구조로 디렉토리가 만들어 집니다.
source
ㄴlayouts
ㄴstylesheets
ㄴjavascripts
ㄴimages
서버를 시작하기전에 설정파일을 열어 라이브 리로드를 활성화시키겠습니다.
...
###
# Helpers
###
# Automatic image dimensions on image_tag helper
# activate :automatic_image_sizes
# Reload the browser automatically whenever files change
configure :development do #
activate :livereload # 이부분의 주석을 해제
end #
# Methods defined in the helpers block are available in templates
# helpers do
# def some_helper
# "Helping"
# end
# end
...
이제 서버를 실행해 봅시다.
$ bundle exec middleman server
source/index.html 를 열어 수정해 보세요!
아까 라이브 리로드를 활성화 해두었기 때문에 자동으로 브라우저가 갱신되는 것을 보실 수 있습니다.
만들어진 파일을 서버에 올리실 때는 다음 명령으로 빌드할 수 있습니다.
$ middleman build
build 폴더를 보세요!
먼저 color라는 이름의 간단한 루비 스크립트를 만듭니다.
#!/usr/bin/env ruby
system "open http://www.color-hex.com/color/#{ARGV[0]}"
실행권한을 주고 실행 시켜보세요.
chmod +x color
./color 4d99d2