diff --git a/Gemfile b/Gemfile
new file mode 100644
index 0000000..ddd9997
--- /dev/null
+++ b/Gemfile
@@ -0,0 +1,4 @@
+source 'http://rubygems.org'
+
+gem 'sinatra'
+gem 'slim'
\ No newline at end of file
diff --git a/Gemfile.lock b/Gemfile.lock
new file mode 100644
index 0000000..0e64964
--- /dev/null
+++ b/Gemfile.lock
@@ -0,0 +1,19 @@
+GEM
+  remote: http://rubygems.org/
+  specs:
+    rack (1.2.1)
+    sinatra (1.1.2)
+      rack (~> 1.1)
+      tilt (~> 1.2)
+    slim (0.8.3)
+      temple (~> 0.1.6)
+      tilt (~> 1.1)
+    temple (0.1.6)
+    tilt (1.2.2)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  sinatra
+  slim
diff --git a/app.rb b/app.rb
new file mode 100644
index 0000000..d0c6c88
--- /dev/null
+++ b/app.rb
@@ -0,0 +1,19 @@
+require "bundler"
+Bundler.setup
+Bundler.require :default
+
+unless Sinatra::Templates.instance_methods.include?(:slim)
+  module Sinatra::Templates
+    def slim(template, options={}, locals={})
+      render :slim, template, options, locals
+    end
+  end
+end
+
+get '/' do
+  slim :index
+end
+
+get '/:text' do
+  slim :show, {}, :text => params[:text], :source => 'en', :target => 'ja'
+end
\ No newline at end of file
diff --git a/config.ru b/config.ru
new file mode 100644
index 0000000..785bf5c
--- /dev/null
+++ b/config.ru
@@ -0,0 +1,2 @@
+require './app'
+run Sinatra::Application
\ No newline at end of file
diff --git a/views/index.slim b/views/index.slim
new file mode 100644
index 0000000..e69de29
diff --git a/views/layout.slim b/views/layout.slim
new file mode 100644
index 0000000..1e26834
--- /dev/null
+++ b/views/layout.slim
@@ -0,0 +1,37 @@
+! doctype html
+html
+  head
+    title en2ja
+    meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"
+    meta http-equiv="Content-Type" content="text/html; charset=UTF-8"
+    script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"
+    css:
+      body { padding: 0; margin: 0; font-size: 13.5px; font-family: Verdana, Arial; }
+      h1 { margin: 8px; padding: 0; font-size: 120% }
+      h1 a { color: #666 }
+      a { color: blue; text-decoration: none; }
+      #wrap { max-width: 600px; margin: 0 auto; }
+      #footer { text-align: right; margin: 8px; color: #999; clear: both; }
+      #footer ul li { list-style: none; margin: 2px 2px; padding: 0; }
+      #powerd-by-google-translate-api { color: #666; font-size: 80%; text-align: right; }
+      .source, .target { margin: 4px 8px; padding: 8px; border: solid 1px #CCC; border-radius: 8px; }
+      .arrow { text-align: center; color: #CCC; }
+      .bookmarklet { font-weight: bold; }
+      .created-by { font-size: 80%; }
+      .created-by a { color: #666; }
+
+  body
+    #wrap
+      #header
+        h1
+          a href="http://en2ja.heroku.com/" en2ja
+        
+      == yield
+      #footer
+        ul
+          li.bookmarklet
+            span Bookmarklet ➜ 
+            a href="javascript:var%20u='http://en2ja.heroku.com/' + document.getSelection();window.open(u, 'en2ja', 'toolbar=0,resizable=0,status=1,width=320,height=480');" en2ja
+          li.created-by
+            span created by 
+            a href="http://jugyo.org/jugyo" @jugyo
diff --git a/views/show.slim b/views/show.slim
new file mode 100644
index 0000000..fefc725
--- /dev/null
+++ b/views/show.slim
@@ -0,0 +1,21 @@
+.source = text
+
+.arrow ⬇
+
+.target
+  #google-translate-result ...
+  #powerd-by-google-translate-api
+    span powerd by 
+    a href="http://code.google.com/intl/ja/apis/language/translate/overview.html" Google Translate API
+
+javascript:
+  function googleTranslate(response) {
+      var result = response.data.translations[0].translatedText;
+      $('#google-translate-result').text(result);
+  }
+  $(function() {
+      $('<script>').attr({
+          type: "text/javascript",
+          src: "https://www.googleapis.com/language/translate/v2?key=AIzaSyDf3VkeewjJd884BrTyOBiw-1KggQ0537g&source=#{source}&target=#{target}&callback=googleTranslate&q=#{text}"
+      }).appendTo($('head'));
+  });