<repo_name>seoulpm/PerlKr-Web<file_sep>/README.md
PerlKr-Web
==========

Perl.Kr Web<file_sep>/run
#!/bin/sh

starman --port=5000 --workers=5 perlkr-web.pl
<file_sep>/public/gallery/about.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Account Setting</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link href="css/icon-style.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
	<link href="source/jquery.fancybox.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
    <link rel="icon" href="img/favicon.ico" type="image/x-icon">
  </head>

  <body>

    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container-fluid">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="index.html"><img src="img/logo.png"/></a>
          <div class="nav-collapse">
            <ul class="nav">
			  <li class="divider-vertical"></li>
              <li class="active"><a href="about.html">About</a></li>
			  <li class="divider-vertical"></li>
              <form class="navbar-search pull-left" action="">
                <input type="text" class="search-query span2" placeholder="Search" required>
              </form>
			  <li class="divider-vertical"></li>
            </ul>
            <ul class="nav pull-right">
            <li class="divider-vertical"></li>
            <li class="gravatar"><a href="profile.html"></a></li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown"><NAME> <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="account_setting.html"><i class="icon-user"></i> Account Setting</a></li>
                <li class="divider"></li>
                <li><a href="signin.html"><i class="icon-off"></i> Sign out</a></li>
              </ul>
            </li>
            <li class="divider-vertical"></li>
          </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>
    
    <div class="container">
        <div class="row">
            <div class="span12 about-wrapper">
                <div class="row">
                    <div class="span3 about-title">
                        <h2>About</h2>
                    </div>
                    <div class="span9 about-content">
                        <div class="row">
                            <div class="span3">
                                <h3>Lorem ipsum dolor sit amet.</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae nunc lectus, sit amet viverra ligula. 
                                Integer dignissim aliquam laoreet. Sed eleifend tempor ante, id fermentum enim vulputate vitae. 
                                Donec ac ultricies ante. Ut lacus lorem, lacinia et pretium non, posuere suscipit dui. 
                                Nulla eget mauris sapien, in laoreet nibh.</p>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempor felis et orci facilisis sodales. 
                                Nunc dignissim turpis sed sapien euismod tincidunt. Integer pretium neque.</p>
                                <p><a href="#" class="btn btn-large">Join Now &rarr;</a></p>
                            </div>
                            <div class="span6 img-thumbnail marg10-left">
                                <ul class="thumbnails">
                                    <li class="span4">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/360x268" alt="">
                                      </a>
                                    </li>
                                    <li class="span2">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/160x120" alt="">
                                      </a>
                                    </li>
                                    <li class="span2">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/160x120" alt="">
                                      </a>
                                    </li>
                                    <li class="span2">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/160x120" alt="">
                                      </a>
                                    </li>
                                    <li class="span2">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/160x120" alt="">
                                      </a>
                                    </li>
                                    <li class="span2">
                                      <a href="#" class="thumbnail">
                                        <img src="http://placehold.it/160x120" alt="">
                                      </a>
                                    </li>
                                  </ul>
                            </div>
                            <div class="span4">
                                <h3>Lorem ipsum dolor sit amet.</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae nunc lectus, sit amet viverra ligula. 
                                Integer dignissim aliquam laoreet. Sed eleifend tempor ante, id fermentum enim vulputate vitae. 
                                Donec ac ultricies ante. Ut lacus lorem, lacinia et pretium non, posuere suscipit dui. 
                                Nulla eget mauris sapien, in laoreet nibh.</p>
                            </div>
                            <div class="span5">
                                <h3>Lorem ipsum dolor sit amet.</h3>
                                <p class="marg20-right">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae nunc lectus, sit amet viverra ligula. 
                                Integer dignissim aliquam laoreet. Sed eleifend tempor ante, id fermentum enim vulputate vitae. 
                                Donec ac ultricies ante. Ut lacus lorem, lacinia et pretium non, posuere suscipit dui. 
                                Nulla eget mauris sapien, in laoreet nibh.</p>
                            </div>
                        </div>
                    </div>
                     <div class="span3 about-title">
                        <h2>Partners</h2>
                    </div>
                    <div class="span9 about-content">
                        <div class="row">
                            <div class="span3">
                                <h3>Lorem ipsum dolor sit amet.</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vitae nunc lectus, sit amet viverra ligula. 
                                Integer dignissim aliquam laoreet. Sed eleifend tempor ante, id fermentum enim vulputate vitae. 
                                Donec ac ultricies ante. Ut lacus lorem, lacinia et pretium non, posuere suscipit dui. 
                                Nulla eget mauris sapien, in laoreet nibh.</p>
                            </div>
                            <div class="span6 img-thumbnail marg10-left">
                                <ul class="thumbnails">
                                    <li class="span3">
                                      <div class="thumbnail">
                                        <img src="http://placehold.it/260x180" alt="">
                                        <div class="caption">
                                          <h5><NAME></h5>
                                          <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        </div>
                                      </div>
                                    </li>
                                    <li class="span3">
                                      <div class="thumbnail">
                                        <img src="http://placehold.it/260x180" alt="">
                                        <div class="caption">
                                          <h5><NAME></h5>
                                          <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        </div>
                                      </div>
                                    </li>
                                  </ul>
                            </div>
                        </div>
                    </div>
                   
                </div>
            </div>
        </div>
    </div>
            
    
    <div class="container footer">
        <hr class="alt" />
        <div class="row">
            <div class="span6">&copy; 2012 Fransisca Gallery. All right reserved.</div>
            <div class="span6">
                <ul>
                    <li><a href="#">Terms Of Service</a></li>
                    <li><a href="#">Privacy</a></li>
                </ul>
            </div>
        </div>
    </div>

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.7.2.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/image-gallery.js"></script>
    <script src="js/jquery.mousewheel-3.0.6.pack.js"></script>
    <script src="source/jquery.fancybox.js"></script>

  </body>
</html>
<file_sep>/INSTALL.md
설치
=====

Perl 의존 모듈
---------------

- Const::Fast
- Mojolicious
- Plack
- Plack::Middleware::Expires
- Starman
- Text::MultiMarkdown


apache 설정
------------

5000번 포트를 perl.kr로 연결하기 위한 아파치
리버스 프록시 설정은 다음과 같습니다.

    LoadModule proxy_module          modules/mod_proxy.so
    LoadModule proxy_balancer_module modules/mod_proxy_balancer.so
    LoadModule proxy_http_module     modules/mod_proxy_http.so
    LoadModule proxy_connect_module  modules/mod_proxy_connect.so
    
    <IfModule mod_proxy.c>
    ProxyRequests Off
    <Proxy *>
        Order deny,allow
        Allow from all
    </Proxy>
    
    <VirtualHost *:80>
        ServerName       perl.kr
        ProxyPass        /     http://127.0.0.1:5000/
        ProxyPassReverse /     http://127.0.0.1:5000/
        ErrorLog         /var/log/apache2/perl.kr/error_log
        CustomLog        /var/log/apache2/perl.kr/access_log combined
    </VirtualHost>

또한 아파치는 모르는 확장자에 대해서는 `text/plain`으로
보내므로 캐싱을 위해 폰트 관련 타입을 추가로 설정 합니다.

    AddType application/vnd.bw-fontobject .eot
    AddType application/x-font-ttf        .ttf
    AddType application/x-woff            .woff
