이른바 빅 사이트들의 웹 테크놀로지가 어떻게 구성되어 있는지에 대한 정보를 공유하겠습니다. 웹 서비스 설계에 있어서 가장 중요한 부분이 High Scalability일 것입니다. 수많은 트래픽을 어떻게 극복할 것인가?
이런 부분을 고민하다보면 웹의 H/W, S/W 아키텍처를 어떻게 구성할 것인가 부분이 나오게 되는데 해외의 빅 사이트들의 구성도를 보면서 이렇게 구성해도 High Scalability에 문제가 없구나하면서 레퍼런스 사이트만으로도 가능성을 타진할 수 있습니다.

물론 개발 기능들의 높은 성숙도가 더 중요하겠지만요. 이런 다양한 사이트들의 사례를 통해 High Scalability의 문제를 보완해 나가고 타당성의 검증 근거로 삼게 되죠.
참고로 빅 사이트들은 Flickr, YouTube, PlentyOfFish, Digg, TypePad, LiveJournal, Friendster, MySpace, Wikipedia의 9개 사이트입니다.

위의 그램을 요약해보면..

• OS: Linux 7 - Windows 2
• Web server: Apache 7 - IIS 2 - Lighttpd 2
• Scripting: PHP 4 - Perl 4 - ASP.NET 2 - Python 1 - Java 1
• Database: MySQL 7 - SQL Server 1 (possibly 2)

윈도우 서버보다는 리눅스 서버가 많고 웹 서버는 아직까지 Apache가 많네요. 데이터 베이스틑 MySQL이 많은 사용률을 갖고 있네요. 물론 네트워크 인프라 등의 정보도 중요하겠죠. ^^

• 참고 사이트 : http://royal.pingdom.com/?p=173
  

1. root권한으로 sendmail이 SMTP 포트를 점유해서 바인딩 에러 조치
 - #vi /etc/sysconfig/sendmail  -> DAEMON=no로 수정
 -#/etc/rc.d/init.d/sendmail restart 처리하면 25 port Listen하지 않음

2. james-2.3.1 다운
 - #wget http://apache.tt.co.kr/james/server/binaries/james-binary-2.3.1.tar.gz

3. #cd /home/k2/server/james-2.3.1
 - #chmod 755 run.sh phoenix.sh
 - #./run.sh(root) or ./phoenix.sh start &
   Using PHOENIX_HOME:   /home/k2/server/james-2.3.1
   Using PHOENIX_TMPDIR: /home/k2/server/james-2.3.1/temp
   Using JAVA_HOME:      /home/k2/jdk1.5.0_01
   Running Phoenix:

   Phoenix 4.2

   James Mail Server 2.3.1
   Remote Manager Service started plain:4555
   POP3 Service started plain:110
   SMTP Service started plain:25
   NNTP Service started plain:119
   FetchMail Disabled

4. 설정 추가
 - #/home/k2/server/james-2.3.1/apps/james/SAR-INF/config.xml
  : <servername>mimul.com</servername>
  : <server>211.1.111.11</server>

5. 유저 생성
  #/home/k2/server/james-2.3.1/bin> telnet localhost 4555
  Trying 211.245.104.40...
  Connected to kth (211.245.104.40).
  Escape character is '^]'.
  JAMES Remote Administration Tool 2.3.1
  Please enter your login and password
  Login id:
  root
  Password:
  root
  Welcome root. HELP for a list of commands
  adduser pepsi password
  User pepsi added
  quit
  Bye
  Connection closed by foreign host.

6. 메일 발송
  #/home/k2/server/james-2.3.1/bin> telnet mimul.com 25
  Trying 211.245.104.40...
  Connected to sss (211.245.104.40).
  Escape character is '^]'.
  220 sss SMTP Server (JAMES SMTP Server 2.3.1) ready Wed, 12 Sep 2007 23:54:53 +0900 (KST)
  ehlo mimul.com
  250-sss Hello mimul.com (sss [211.245.104.40])
  mail from: <pepsi@mimul.com>
  250 2.1.0 Sender <pepsi@mimul.com> OK
  rcpt to: <pepsi@mimul.com>
  250 2.1.5 Recipient <pepsi@mimul.com> OK
  data
  354 Ok Send data ending with <CRLF>.<CRLF>
  subject: test to pepsi@mimul.com
  test
  .
  250 2.6.0 Message received
  quit
  221 2.0.0 sss Service closing transmission channel

7. 메일 확인
 - #/home/k2/server/james-2.3.1/apps/james/var/mail/inboxes/pepsi> more 4D61696C313138393630393138383933372D30.Repository.FileStreamStore
Return-Path: <pepsi@mimul.com>
Message-ID: <29215192.01189609188977.JavaMail.root@sss>
MIME-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Content-Transfer-Encoding: 7bit
Delivered-To: pepsi@mimul.com
Received: from sss ([211.245.104.40])
          by kth (JAMES SMTP Server 2.3.1) with SMTP ID 92
          for <pepsi@mimul.com>;
          Wed, 12 Sep 2007 23:59:47 +0900 (KST)
Date: Wed, 12 Sep 2007 23:59:47 +0900 (KST)
From: pepsi@mimul.com
subject: test to pepsi@mimul.com
test

1. jdk 1.5이상이면 아래 설정을 JAVA_OPTS안에 추가한다면 YourKit을 가지고 힙덤프를 분석할 수 있다.
 -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=/logs/heapdump

2. Jasper 2 JSP Engine 지원을 위해 $CATALINA_BASE/conf/web.xml 설정 변경하라.
 - development : false, genStringAsCharArray : true, modificationTestInterval : true, trimSpaces : true
 - 자세한 건 여기를 참조하라.

3. 가용성 확보를 위해 Tomcat의 clustering/session replication을 사용하라.
 - 사용방법은 여기를 참조하라.

4. error pages를 작성하여 적용하라.(web.xml)
 - <error-page>
      <error-code>404</error-code>
      <location>/error/404.html</location>
   </error-page>

5. 어플리케이션에서 System.out과 System.err를 제거하고 Log4j를 사용하라.

6. application마다 같은 라이브러리는 WEB-INF/lib에서 CATALINA_HOME/shared/lib로 옮겨서 공유하라.
 - 메모리를 절약할 수 있다.

7. memory parameters를 잘 활용하라.

8. 불필요한 어플리케이션을 제거하라.

9. Manager서버의 보안을 강화하라.
 - CATALINA_HOME/conf/tomcat-users.xml
  <role rolename="manager">
   <user username="darren" password="ReallyComplexPassword" roles="manager"></user>
  </role>
 - CATALINA_HOME/conf/server.xml에 IP 블럭킹 기능도 유용하다.
  <Valve className="org.apache.catalina.valves.RemoteAddrValve" allow="192.168.1.*"></Valve>

10. server.xml을 최적화 하라.
 - 서버 환경에 맞는 CATALINA_HOME/conf/server-original.xml, CATALINA_HOME/conf/server-minimal.xml 선택하여 server.xml로 변경하라.

11. 톰켓 업그레이드는 설치디렉토리를 분리하여 적용하라.

12. Tomcat 서버는 root로 띄우지 마라.
 - 자세한 내용은 여기를 참조하라.

13. Precompile JSPs (at build time)
 - 자세한 내용은 여기를 참조하라.

14. 디렉토리 보이는 걸 막아라.
  - CATALINA_HOME/conf/web.xml
  <servlet>
   <servlet-name>default</servlet-name>
   <servlet-class>org.apache.catalina.servlets.DefaultServlet</servlet-class>
   <init-param>
   <param-name>debug</param-name>
   <param-value>0</param-value>
   </init-param>
   <init-param>
   <param-name>listings</param-name>
   <param-value>false</param-value>  <!-- make sure this is false -->
   </init-param>
   <load-on-startup>1</load-on-startup>
  </servlet>

15. 듀얼 코어 CPU를 사용할 경우 쓰레드풀을 250개 이상 설정하라.

16. Tomcat MBeans이나 다양한 모니터링 도구를 활용하여 서버를 모니터링하라.
 - 자세한 내용은 여기를 참조하라.

17. jdk1.5, 1.6이 성능이 좋다.

18. -server JVM option을 사용하라.

19. GZIP compression을 사용하라.
 - <Connector>compression="on"
   compressableMimeType="text/html,text/xml,text/plain,application/xml"
   </Connector>
 - 자세한 건 여기를 참조하라.

20. Security Manager를 잘 사용하라.
 - 자세한건 여기를 참조하라.

• 참고 자료 : http://www.digitalsanctum.com/2007/08/18/20-tips-for-using-tomcat-in-production/

Ajax기반의 웹 메일 오픈 소스를 하나 소개하겠습니다. James와 구성하여 자체 웹 메일 서비스 기능 구현을 해도 손색이 없을 것 같네요. 그리고 다양한 채팅이나 주소록을 지원하기 때문에 개인 커뮤니티 서비스로도 가능할 듯 합니다.

1. 주요 기능들

• Ajax Webmail
   - Ajax기반의 웹 메일을 임. po3나 imap 지원되는 메일 서버로 접근하여 메일을 가져옴
• Bayesian Spam Protection
   - 스팸 필터링 기능 제공
• MIME Compatible
   - 마임 타입 지원
• RSS Reader
   - 탑 사이트에서 RSS지원(하나의 사이트만)
• Multi-language
   - 다양한 언어 지원
• Instant Messenger
   - 구글 메신저와 통신 가능
• Multi-protocol Supports
   - Pop3, IMAP 지원
• Contacts
   - 주소록 지원
• Post-it Notes
   - 포스트잇 지원

2. 설치 방법

• Install the Java 2 SDK, version 1.5 or 이상의 버젼을 설치한다.
• Install Tomcat 5.x, 6.x 설치를 한다.
• Install MySQL후 intouch-mysql.sql을 intouch 데이터 베이스 생성후에 실행한다.
• intouch2.war파일을 CATALINA_HOME/webapps 에 카피해서 디플로이한다.
• CATALINA_HOME/webapps/intouch2/WEB-INF/config/config.xml 파일을 수정한다.
   - /tmp 디렉토리 지정, 메일 서버 셋팅, mysql 데이터 베이스 설정
• Tomcat 리스타트
  

JSCalendar 1.0을 기반으로 하여 생년월일이나 일자등을 UI에서 선택할 수 있도록 해주는 Javascript입니다.
다운 사이트는 dynarch이며 jscalendar-1.0다운 받아서 카피한 다음에 필요한 js와 css를 삽입하여 원하는 화면을 구성할 수 있습니다.

1. 화면 UI

2. 사용 방법

<!-- main calendar program -->

<script type="text/javascript" src="/calendar.js"></script>

<!-- language for the calendar -->

<script type="text/javascript" src="/lang/calendar-ko.js"></script>

<!-- the following script defines the Calendar.setup helper function, 

which makes adding a calendar a matter of 1 or 2 lines of code. -->

<script type="text/javascript" src="/calendar-setup.js"></script>

<!-- calendar stylesheet -->

<link rel="stylesheet" type="text/css" media="all" 

href="/calendar-white.css" title="white" />

.........

 <td><input type="text" name="dob" id="dob" readonly="1" /></td>

 <td><img src="img.gif" id="f_trigger_c" 

style="cursor: pointer; border: 1px solid red;" title="Date selector"

      onmouseover="this.style.background='red';"

 onmouseout="this.style.background=''" /></td>

<script type="text/javascript">

    Calendar.setup({

        inputField     :    "dob",     // id of the input field

        ifFormat       :    "%Y-%m-%d", // format of the input field

        button         :    "f_trigger_c",// trigger for the calendar(button ID)

        align          :    "Tl",       // alignment (defaults to "Bl")

        singleClick    :    true

    });

</script>

1. JFreeChart
 - 지원 기능 : pie charts (2D and 3D), bar charts (horizontal and vertical, regular and stacked), line charts, scatter plots, time series charts, high-low-open-close charts, candlestick plots, Gantt charts, combined plots, thermometers
 - 지원 언어 : Java 지원
 - 예제 사이트 : http://www.jfree.org/jfreechart/samples.html

2. Cewolf
 - 지원 기능 : Line [XY], [3D] Pie, [3D] Horizonal Bar, [3D] Vertical [XY] Bar, [3D] Stacked Vertical Bar, Area [XY], Scatter Plot, Candlestick, High Low, Gantt, Overlaid, Combined
 - 지원 언어 : Java 지원
 - 예제 사이트 : http://cewolf.sourceforge.net/new/demo.html

3. PHP/SWF Charts
 - 지원 기능 : Line, Column, Stacked column,  Floating column, 3D column, Stacked 3D column, Parallel 3D column, Pie, 3D Pie, Bar, Stacked bar,  Floating bar, Area, Stacked area, Candlestick, Scatter, Polar, Mixed, Composite, Joined
 - 지원 언어 : PHP + Flash (swf), SP, CFML, Perl언어에서도 지원
 - 예제 사이트 : http://www.maani.us/charts/index.php?menu=Gallery

4. Open Flash Chart(플래시 기반)
 - 지원 기능 : Data Lines, Bar Chart, 3D Bar Chart, Glass Bar Chart, Fade Bar Chart, Sketch Bars, Area Chart, Bars + Lines, Pie Chart, Pie Chart Links, Scatter Chart, Mixed Scatter, High Low Close, Candle
 - 지원 언어 : 플래시 기반으로 Java, Perl, Python, Ruby and Rails, php, .net 지원
 - 예제 사이트 : http://teethgrinder.co.uk/open-flash-chart/index.php

5. AmCharts(플래시 기반)
 -  지원 기능 : Animated or static, Value axis, Linear, logarithmic value axis scale, bullets, Clickable columns/bars, Gradient fills, plot area Axis
 - 지원 언어 :  플래시 기반으로 PHP, .NET, Java, Ruby on Rails, Perl, ColdFusion 언어 지원
 - 예제 사이트 : http://www.amcharts.com/column

6. FusionCharts(플래시 기반)
 - 지원 기능 : 다양한 기능 지원함
 - 지원 언어 : cross-browser, cross-platform flash chart로서 ASP.NET, ASP, PHP, JSP, ColdFusion, Ruby on Rails, simple HTML pages 지원
 - 예제 사이트 : http://www.fusioncharts.com/Free/Gallery.asp?gMenuItemId=3

7. Flot
 - 지원 기능 : Line 기능 등 기본적인 기능에 줌 등 다양한 옵션을 줄 수 있음
 - 지원 언어 : Javascript + jQuery로 구성되어 있어 웹기반 언어는 모두 지원, Cross Browser지원
 - 예제 사이트 : http://people.iola.dk/olau/flot/examples/

8. Flotr
 - 지원 기능 : Basic Axis, Basic Bar, Basic Legend, Mouse Track, Mouse Zoom, JSON Data
 - 지원 언어 : Javascript + Prototype 1.6.0.2로 구성되어 있어 웹기반 언어는 모두 지원, Cross Browser지원
 - 예제 사이트 : http://www.solutoire.com/experiments/flotr/examples/basic.html

9. PlotKit
 - 지원 기능 : HTML Canvas: Safari 2+, Opera 9+, Firefox 1.5+, IE 6 (in emulated mode), SVG: Opera 9+, Firefox 1.5+ (see note), IE6 with Adobe SVG
 - 지원 언어 : Javascript + MochiKit 1.3로 구성되어 있어 웹기반 언어는 모두 지원, Cross Browser지원
 - 예제 사이트 : http://media.liquidx.net/js/plotkit-tests/svg-sweet.html

10. Emprise JavaScript Charts
 - 지원 기능 : Interactive, Axis Scaling, Auto Zooming, Scrolling, Stackable Series, Multiple Chart Types, Ajax-Driven Data, Compatible, Plugin Free, Customizable
 - 지원 언어 : Javascript로 구현되어 있고 Cross Browser지원
 - 예제 사이트 : http://www.ejschart.com/examples/index.php

11. Visifire
 - 지원 기능 : 실버 라이트 설치되면 다양한 차트 기능이 지원됨
 - 지원 언어 : Silverlight Charts
 - 예제 사이트 : http://www.visifire.com/silverlight_charts_gallery.php

자신만의 UCC 사이트를 구축하기 위해서 필요한 프로그램들을 나열하고 이들의 용도와 설치 방법, 사용 방법을 설명함으로써 동영상 사이트 만드는데 도움을 주고자 이글을 적습니다.

1. FFmpeg란?
FFmpeg은 stream audio와 video를 스트리밍하고, 레코딩하고, 컨버팅하는 오픈소스 솔루션입니다. 여기에는 또한 libavcodec라는 우수한 audio/video 라이브러리를 내장하고 있습니다.
거의 대부분의 OS에서 컴파일되므로 활용이 가능하다는 장점이 있죠.
ffplay multimedia player를 내장도 하고 있습니다. ffserver라는 스트리밍 서버 기능도 있고 다양한 파일 포멧(AVI, MPEG, OGG, Matroska, ASF, …)과 인코딩 포멧(MPEG, DivX, MPEG4, AC3, DV, …)을 지원합니다.
간략하게 요역하자면 아래와 같습니다.

• ffmpeg: 비디오 파일 포맷을 다른 포맷으로 변환할 수 있는 커맨드라인 툴. TV 수신 카드로부터 실시간 영상을 받아 인코딩할 수 있음
• ffserver: HTTP 프로토콜을 사용하는 스트리밍 서버이다. 실시간 재생 도중 재생 위치 변경 기능을 제공함
• ffplay: SDL과 ffmpeg 를 사용해서 구현된 간단한 재생 프로그램임
• libavcodec: ffmpeg에서 사용하는 모든 오디오/비디오 코덱이 들어있는 라이브러리이다. 최고의 효율과 코드 재사용성을 목표로 만들어졌음
• libavformat: ffmpeg에서 사용하는 모든 오디오/비디오 코덱을 파싱하고 생성하는 루틴들이 들어있는 라이브러리

2. 필요한 라이브러리
ffmpegFLV audio codec은 mp3이다. 그래서 오디오 변환을 위해서 LAME 이 필요하고 flv를 플레이하기 위해서는 다양한 Metadata가 필요하다. 그래서 FLVTool2가 필요합니다. FLVTool2는 루비를 설치해야만 합니다. ^^ 그리고 php로 운영하신다면 ffmpeg-php가 필요하겠죠.
마지막으로 플레이를 하기 위해서는 FlowPlayer를 다운받아서 활용하시는게 좋을 겁니다.
그럼 LAME->FFmpeg->Ruby->FLVTool2->FlowPlayer 순으로 설치를 하시면 됩니다.

 - LAME 설치
   . shell>wget http://downloads.sourceforge.net/lame/lame-398.tar.gz?
            modtime=1215212728&big_mirror=0
   . shell>./configure --enable-shared --prefix=/home/k2/server/lame;make;make install
 - FFMpeg 설치
   . shell>svn checkout svn://svn.mplayerhq.hu/ffmpeg/trunk ffmpeg
   . shell>cd ffmpeg
   . shell>./configure --prefix=/home/k2/server/ffmpeg
            --enable-gpl --enable-shared --enable-mp3lam;make;make install
   . 사용 방법 : ffmpeg -i "mimul.avi" -vcodec flv -f flv -r 29.97 -s 320×240
          -aspect 4:3 -b 300kb -g 160 -cmp 2 -subcmp 2 -mbd 2 -flags
          +aic+cbp+mv0+mv4+trell -ac 1 -ar 22050 -ab 56k "mimul_avi.flv"
 - Ruby
   . shell>wget ftp://ftp.ruby-lang.org/pub/ruby/1.8/ruby-1.8.7-p22.tar.bz2
   . shell>./configue --prefix=/home/k2/server/ruby;make;make install
 - FLVTool2
   . shell>wget
   . shell>ruby setup.rb config;ruby setup.rb setup;ruby setup.rb install
   . 사용방법 : RUBYLIB=lib ruby bin/flvtool2 -U <path to>/movie.flv
 - Flowplayer
   . http://flowplayer.org/download.html 사이트에서 파일을 다운 받음
   . 사용방법

<object type="application/x-shockwave-flash" data="[your site]/FlowPlayer.swf"

    width="320" height="263" id="FlowPlayer">

  <param name="allowScriptAccess" value="sameDomain"/>

  <param name="movie" value="[your site]/FlowPlayer.swf"/>

  <param name="quality" value="high"/>

  <param name="scale" value="noScale"/>

  <param name="wmode" value="transparent"/>

  <param name="flashvars" value="baseURL=[base URL]&amp;videoFile=movie.flv

    &amp;autoPlay=false&amp;loop=false&amp;autoBuffering=false

    &amp;splashImageFile=movie.jpg"/>

</object>

[참조 사이트]

• http://lame.sourceforge.net/
• http://ffmpeg.mplayerhq.hu/
• http://www.ruby-lang.org/
• http://flowplayer.org/

1. jqac
 - jQuery를 활용한 Auto-complete/suggest javascript 라이브러리
 - 다운로드 : http://code.google.com/p/jqac/downloads/list
 - 데모 : http://www.cs.bgu.ac.il/~ygleyzer/files/utils/jqac/jqac_example.html

2. AutoComplete 1.2
 - prototype과 scriptaculous를 활용한 Auto-complete javascript 라이브러리
 - 다운로드 : http://www.beauscott.com/examples/autocomplete/autocomplete.zip
 - 데모 : http://www.beauscott.com/examples/autocomplete/doc/examples.html
 
3. AutoCompleter(mootools)
 - MooTools를 활용한 Auto-complete javascript 라이브러리
 - 다운로드 : http://digitarald.de/project/autocompleter/#download
 - 데모 : http://digitarald.de/project/autocompleter/1-1/showcase/delicious-tags/, http://digitarald.de/project/autocompleter/1-1/showcase/local/

4. AJAX AutoComplete
 - Jim Roos가 자체로 만든 Ajax framework
 - 다운로드 : http://jimroos.com/AutoComplete.zip
 - 데모 : http://www.jimroos.com/2007/05/ajax-autocomplete.html

5. YUI Autocomplete
 - Yahoo! UI Library로 만든 Auto-complete
 - 다운로드 : http://brandspankingnew.net/download.php?file=autosuggest_v2.zip
 - 데모 : http://developer.yahoo.com/yui/examples/autocomplete/index.html

6. AutoSuggest
 - 심플한 Javascript를 활용한 Auto-complete
 - 다운로드 : http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html
 - 데모 : http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html

7. dhtmlxCombo
 - 콤보형 Auto-complete
 - 다운로드 : http://www.dhtmlx.com/docs/download/dhtmlxCombo.zip
 - 데모 : http://dhtmlx.com/docs/products/dhtmlxCombo/index.shtml

8. AutoComplete (mootools)
 - scriptaculous를 활용한 Auto-complete
 - 다운로드 : http://script.aculo.us/
 - 데모 : http://demo.script.aculo.us/ajax/autocompleter