Your SlideShare is downloading. ×
웹소프트웨어시대의새로운롤모델자바스크립트 김양원/@rhiokim 웹애플리케이션팀 tizie@kthcorp.com
functionhello_I_am(){return{twitter:@rhiokim,github:rhiokim,blog:rhio.tistory.com,playground:frends.kr}}hello_I_am();
1994~2008
원래는...정적인웹에생명을넣어보자.
자바애플릿
BrendanEich,MozillaCTO
그런데                     생명은커녕웹을작살내버렸다.                     툭하면에러를내뱉는웹                     브라우저를다운시키는주요원인http://bellavita.t...
마우스에게생명을...                생명을불어넣겠다는목적은                온데간데없고                “마우스를따라다니는시계”를                구현하는데쓰임        ...
수년이흐르고 자바스크립트는웹시장에서 귀찮은존재 프로그래밍언어로의가치도 잃어감 표준화단체에서도방치 Shockwave는Adobe에인수 Flash를기반으로리치웹의절대강자로군림                            ...
자바스크립트가심상치않은데.http://www.seattleks.com/files/attach/images/4303/611/005/e3f1d2c2980ad1179430481dcd47291e.jpg
Ajax와Web2.0을만났고 웹개발방식의패러다임이빠르게변화 자바스크립트의관심이증가 jQuery,Ext.js,Prototype.js와같은 유용한도구들이출시 자바스크립트는새로운분위기맞이하게됨
HTML5를만나고 네트워킹프로그래밍,3D그래픽, 데이터베이스,멀티쓰레드등등다됨 이것들은기존의데스크탑경험을웹으로 모두옮겨올수있는플랫폼으로발전 과거보다더많은자바스크립트 라이브러리,프레임워크들이출시 관심도는극에달함
모바일로확산 순식간에스마트모바일시장으로확산 PhoneGap,Appspresso,Titanium 모바일앱시장도자바스크립트의놀이터 2010년필수프로그래밍언어로추대받기시작 이제더이상자바스크립트를거부할수없음
서버거부할것만같았던서버마저...Node.js,RingoJS등등...
Corona                   PhoneGap                                    chrome                                               ...
웹기술의진화속도는                                     초속53,042,034cmhttp://justice1977.tistory.com/991
med.js tinyJSdefer.js                    Bean.js Kizzy                         Backbone.jsLAB.js     Classy           html...
딱2가지만알고가자차세대자바스크립트동향서버사이드자바스크립트
자바스크립트의역사와표준기술동향
표준화역사   FirstEdition       1997 SecondEdition        1998  ThirdEdition        1999            현재의자바스크립트  ForthEdition    ...
왜중단? 10년여동안뭘했길레중단? 의자에앉아서언어디자인만해왔다. 기존의자바스크립트는완전무시한채말도 안되는스펙을책정(묻지마책정)                           느네들 정말 이렇게 할꺼니?          ...
워킹그룹(TC39)분열      기존자바스크립트를        VS      발전시켜야한다.                              ES4를밀어부쳐야한다.                  Yahoo!     ...
차세대자바스크립트의목표 복잡한방식을해소하고좀더나은코드작성을위한언어로발전     복잡한대규모애플리케이션     그런애플리케이션을통해공유되는라이브러리     새로운버젼을위한코드제너레이터 ES5가정의된인터프리터에서많은테스트후...
표준화의흐름  ESHarmony                  CommonJS   ES6
CoffeeScriptTranspiler
트랜스파일러(Transpiler)          transfer라는단어와compiler라는용어가합쳐져만들어짐          BrendanEich에의해서최초로소개됨          자바스크립트가새로운형태의문법을파싱하여...
CoffeeScript           2011년3월16일부터소셜코딩사이트           Github에서주시하고있는개발자가가장많은           프로젝트중의하나           RubyonRails3.1부터공...
CoffeeScriptExample      varcube,square;      square=function(x){      returnx*x;      };                                 ...
CoffeeScript           Ruby,Python과Haskell에영향을받음           간결함과가독성이향상           배열함축기법,패턴매칭과같은기능이추가           큰성능저하없이짧은코드프...
Google’sDartLanguage
DartLang          Dash에서Dart로공식명칭을변경          구글에의해개발되어진웹을위한프로그래밍언어          2011년10월덴마크오르후스에서개최된GOTO컨퍼          런스에서최초공개 ...
DartLangExample        intfib(intn){        if(n=1)returnn;        returnfib(n-1)+fib(n-2);        }        main(){       ...
DartLang          기존의자바스크립트는해결할수없는문제가있다.          Dart는대규모프로젝트에도무리없고보안면에서도          더나은설계          “Brightly”라는클라우드기반통합개발환...
StandardModuleSystem               CommonJS
CommonJS         브라우저환경을벗어난자바스크립트에코시스템을위한         프로젝트이다.         ServerJS라는이름으로처음2009년         시작하여CommonJS로개명         자바...
라이크버튼                   Map모듈                                    모듈                                                       ...
라이크버튼                   Map모듈                                모듈                                                        Plu...
라이크버튼                   Map모듈                                    모듈                                                       ...
CommonJSModules       (function(define){       define(function(require,exports){       vardep1=require(“foo”);       varde...
ES-HarmonyModules       moduleSafeWidget{       importalertfromWidget;       var_private=“someValue”;       exportvardocum...
CommonJS구현체         Node.js,Narwhal,RingoJS,JSGI,Helma         jQuery1.7,Dojo,SproutCore         Akshell,JoyentSmartPlatfo...
요약          CoffeeScript,CommonJS,Dart는차세대자바스크립          트에가장큰영향을미치고있음          소개하지못한다양한프로젝트들의장점도논의후사양          으로책정할것이다....
서버사이드자바스크립트서버시장까지잠식해가는자바스크립트그끝은어딜까?
서버아키텍쳐의변환점   1세대                                 Perl기반   2세대       High-endUnix머신을기반으로한Java   3세대     클라우드를기반으로한PHP,Ruby,...
서버측자바스크립트서버시스템에서동작하는자바스크립트Netscape에서는EnterpriseServer2.0에포함된LiveWire라는서버측자바스크립트를1996년최초로개발AptanaJaxerisDeadNode.js,RingoJS...
HTTPServer         var http = require(http);         http.createServer(function (req, res) {             res.writeHead(200...
TCPserver         var net = require(net);         var server = net.createServer(function (socket) {           socket.write...
노드는손쉽게확장가능한네트워킹프로그램을제공하기위한목적을둔다.노드는솔루션이아니다.개발자를위한환경이고단순한모델이다.                                 RyanDahl
RT@andrwj:“@Rhiokim:드디어윈도우,리눅스,유닉스,POSIX할것없이서버측자바스크립트유통시장이열렸습니다.축하합시다:-)Node.jsv0.6.0isreleasedhttp://t.co/FocVJIOh”
lastest           update            create5000                                                                            ...
RoR   Ruby on Rails                       Node.js2004.12 first commit    2009.02 first commit 11250                 11400
h3.paran.comwithJavaScript@andrwj,@fallroot,@rhiokim  client:store.js,uuid.js,jQuery,socket.io-client  server:node.js+sock...
Rule모든것들이하나의언어로...
당신의집을지어보자.                      설계자:일본인   인테리어:한국인                           건축가:프랑스인
당신의집을지어보자.                                         こんにちは。     머라는거여~어~? 고만노닥거리고일하라고~~     Nice,devous                     ...
모든것이하나의룰                               client:                             JavaScript Mobile:JavaScript      Server:JavaSc...
@rhiokim           rhio.kim@gmail.com질문은메일이나트위터로언제든지해주세요.
웹 소프트웨어 시대의 새로운 롤(role) 모델, 자바스크립트
웹 소프트웨어 시대의 새로운 롤(role) 모델, 자바스크립트
Upcoming SlideShare
Loading in...5
×

웹 소프트웨어 시대의 새로운 롤(role) 모델, 자바스크립트

7,377

Published on

KTH H3 컨퍼런스 2011

웹 소프트웨어 시장의 새로운 롤, 자바스크립트 발표 자료입니다.

Published in: Technology
1 Comment
26 Likes
Statistics
Notes
  • 컨퍼런스에서 발표하신 세션 너무 재미나게 잘 들었습니다.
    좋은정보 감사드립니다.
    ps. Download 기능을 풀어주셨으면 하는^^;;.....
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
7,377
On Slideshare
0
From Embeds
0
Number of Embeds
14
Actions
Shares
0
Downloads
1
Comments
1
Likes
26
Embeds 0
No embeds

No notes for slide

Transcript of "웹 소프트웨어 시대의 새로운 롤(role) 모델, 자바스크립트"

  1. 1. 웹소프트웨어시대의새로운롤모델자바스크립트 김양원/@rhiokim 웹애플리케이션팀 tizie@kthcorp.com
  2. 2. functionhello_I_am(){return{twitter:@rhiokim,github:rhiokim,blog:rhio.tistory.com,playground:frends.kr}}hello_I_am();
  3. 3. 1994~2008
  4. 4. 원래는...정적인웹에생명을넣어보자.
  5. 5. 자바애플릿
  6. 6. BrendanEich,MozillaCTO
  7. 7. 그런데 생명은커녕웹을작살내버렸다. 툭하면에러를내뱉는웹 브라우저를다운시키는주요원인http://bellavita.tistory.com/51
  8. 8. 마우스에게생명을... 생명을불어넣겠다는목적은 온데간데없고 “마우스를따라다니는시계”를 구현하는데쓰임 그래도멋있어가져다쓰자 자바스크립트의CopyPaste부흥기 머~어~ 생며엉~?http://www.zoc.kr/977
  9. 9. 수년이흐르고 자바스크립트는웹시장에서 귀찮은존재 프로그래밍언어로의가치도 잃어감 표준화단체에서도방치 Shockwave는Adobe에인수 Flash를기반으로리치웹의절대강자로군림 JavaScript
  10. 10. 자바스크립트가심상치않은데.http://www.seattleks.com/files/attach/images/4303/611/005/e3f1d2c2980ad1179430481dcd47291e.jpg
  11. 11. Ajax와Web2.0을만났고 웹개발방식의패러다임이빠르게변화 자바스크립트의관심이증가 jQuery,Ext.js,Prototype.js와같은 유용한도구들이출시 자바스크립트는새로운분위기맞이하게됨
  12. 12. HTML5를만나고 네트워킹프로그래밍,3D그래픽, 데이터베이스,멀티쓰레드등등다됨 이것들은기존의데스크탑경험을웹으로 모두옮겨올수있는플랫폼으로발전 과거보다더많은자바스크립트 라이브러리,프레임워크들이출시 관심도는극에달함
  13. 13. 모바일로확산 순식간에스마트모바일시장으로확산 PhoneGap,Appspresso,Titanium 모바일앱시장도자바스크립트의놀이터 2010년필수프로그래밍언어로추대받기시작 이제더이상자바스크립트를거부할수없음
  14. 14. 서버거부할것만같았던서버마저...Node.js,RingoJS등등...
  15. 15. Corona PhoneGap chrome POSIX unix os iPad iPhone HPWeb Android os window server Tatanium linuxAppspresso Mobile Arduino JavaScript safari Robot chrome industry embed browser firefoxScreen car Kiosk DBMS home IE opera 3D STB Graphic Cleaner TV Cleaner Thread NetworkATM
  16. 16. 웹기술의진화속도는 초속53,042,034cmhttp://justice1977.tistory.com/991
  17. 17. med.js tinyJSdefer.js Bean.js Kizzy Backbone.jsLAB.js Classy html-minify functools UgliyJS Easel.js d3.js arguments. LazyLoadDojo Raphaeld.js Broad eventEmitter Jo Qunit Processing.js Underscore typeface.js JSGI marked Janis JSSpec Shifty.js Boostrap Events.js DragDrop.js Narwhal AMD Zepto Milk.js RingoJS Date.js Ext.js Objs CoffeeScript store.js uuid.js $dom.js 아~손아프다.LocalStoragetimed.js DartLang SproutCore hsi.js Browser.js loader.js JavaScript++ highChartAppengineJS Canvas slang.js Appspresso molt.js Jaml.js extend.js cssFx PhoneGap Require.js Vine Mootools Hyber.js WebWorker Socket.io ModernizrShinyCar.js CommonJS microcache.js Three.js WebSocket Titanium Node.js W.js Snack.js include.js Satisfy WebGL system.js jQueryMobile Sencha.io my.class.js
  18. 18. 딱2가지만알고가자차세대자바스크립트동향서버사이드자바스크립트
  19. 19. 자바스크립트의역사와표준기술동향
  20. 20. 표준화역사 FirstEdition 1997 SecondEdition 1998 ThirdEdition 1999 현재의자바스크립트 ForthEdition 2008 중단 FifthEdition 2009,2011 Harmony(sixth) progress 2013년목표
  21. 21. 왜중단? 10년여동안뭘했길레중단? 의자에앉아서언어디자인만해왔다. 기존의자바스크립트는완전무시한채말도 안되는스펙을책정(묻지마책정) 느네들 정말 이렇게 할꺼니? 이러면 나 안한다~
  22. 22. 워킹그룹(TC39)분열 기존자바스크립트를 VS 발전시켜야한다. ES4를밀어부쳐야한다. Yahoo! Mozilla Microsoft Adobe etc ect
  23. 23. 차세대자바스크립트의목표 복잡한방식을해소하고좀더나은코드작성을위한언어로발전 복잡한대규모애플리케이션 그런애플리케이션을통해공유되는라이브러리 새로운버젼을위한코드제너레이터 ES5가정의된인터프리터에서많은테스트후사양으로책정 플랫폼에중립적인아키텍처를유지,향상시키며표준을책정 가능한기존버젼을유지하고간단하고도간결하게진행 정적인검증과객체의보안기능들을제공
  24. 24. 표준화의흐름 ESHarmony CommonJS ES6
  25. 25. CoffeeScriptTranspiler
  26. 26. 트랜스파일러(Transpiler) transfer라는단어와compiler라는용어가합쳐져만들어짐 BrendanEich에의해서최초로소개됨 자바스크립트가새로운형태의문법을파싱하여자바스크립트로 변환시켜자바스크립트엔진이이해할수있도록해주는일종의 라이브러리 CoffeeScript GoogleTracuer,MozillaNarcissus, JavaScript++ BrendanEichhttp://en.wikipedia.org/wiki/Transcompiler
  27. 27. CoffeeScript 2011년3월16일부터소셜코딩사이트 Github에서주시하고있는개발자가가장많은 프로젝트중의하나 RubyonRails3.1부터공식지원 BrendanEich는블로그와JSConf.eu를통해차세대자 바스크립트에큰영향을미친언어로언급하고있습니다.http://jashkenas.github.com/coffee-script/
  28. 28. CoffeeScriptExample varcube,square; square=function(x){ returnx*x; }; square=(x)-x*x cube=(x)-square(x)*x cube=function(x){ returnsquare(x)*x; };http://jashkenas.github.com/coffee-script/
  29. 29. CoffeeScript Ruby,Python과Haskell에영향을받음 간결함과가독성이향상 배열함축기법,패턴매칭과같은기능이추가 큰성능저하없이짧은코드프로그램작성(자바스크립 트에비해1/3) 서버측자바스크립트에서널리사용되고있음http://jashkenas.github.com/coffee-script/
  30. 30. Google’sDartLanguage
  31. 31. DartLang Dash에서Dart로공식명칭을변경 구글에의해개발되어진웹을위한프로그래밍언어 2011년10월덴마크오르후스에서개최된GOTO컨퍼 런스에서최초공개 웹브라우저내장스크립트언어로자바스크립트를대처 할목적으로만들어짐http://www.dartlang.org/
  32. 32. DartLangExample intfib(intn){ if(n=1)returnn; returnfib(n-1)+fib(n-2); } main(){ print(fib(20)=${fib(20)}); }http://www.dartlang.org/
  33. 33. DartLang 기존의자바스크립트는해결할수없는문제가있다. Dart는대규모프로젝트에도무리없고보안면에서도 더나은설계 “Brightly”라는클라우드기반통합개발환경을 Dart로개발중 Dart를지원하지않는브라우저를위해ES3로 변환하는도구를제공 DartVM을크롬브라우저에통합중http://www.dartlang.org/
  34. 34. StandardModuleSystem CommonJS
  35. 35. CommonJS 브라우저환경을벗어난자바스크립트에코시스템을위한 프로젝트이다. ServerJS라는이름으로처음2009년 시작하여CommonJS로개명 자바스크립트표준화그룹인 ECMAInternational과는별도의단체이다. CommonJS도차세대 자바스크립트표준화사양의일부이다.http://www.commonjs.org/
  36. 36. 라이크버튼 Map모듈 모듈 Plugin oAuth인증Search모듈 모듈 댓글모듈 Plugin Google Facebook jQuery Plugin loader.js require.js 메일유효 체크모 MySite Sencha 주민번호유 Browsers 차트모듈 효성체크모 듈 로그인모듈 그리드모듈 데이터모듈
  37. 37. 라이크버튼 Map모듈 모듈 Plugin oAuth인증Search모듈 모듈 댓글모듈 Plugin Google Facebook jQuery Plugin Node.js RingoJS 메일유효 체크모 MySite Sencha 주민번호유 Server 차트모듈 효성체크모 듈 로그인모듈 그리드모듈 데이터모듈
  38. 38. 라이크버튼 Map모듈 모듈 Plugin oAuth인증Search모듈 모듈 댓글모듈 Plugin Google Facebook jQuery Plugin Titanium AdobeAIR 메일유효 체크모 MySite Sencha 주민번호유 Mobile 차트모듈 효성체크모 듈 로그인모듈 그리드모듈 데이터모듈
  39. 39. CommonJSModules (function(define){ define(function(require,exports){ vardep1=require(“foo”); vardep2=require(“bar”); exports.hello=function(){...}; exports.world=function(){...}; }); })(typeofdefine==”function” ?define :function(factory){factory(require,exports)});http://www.commonjs.org/
  40. 40. ES-HarmonyModules moduleSafeWidget{ importalertfromWidget; var_private=“someValue”; exportvardocument={ write:function(txt){ alert(‘Outofluck,buck’); }, ... }; }http://www.commonjs.org/
  41. 41. CommonJS구현체 Node.js,Narwhal,RingoJS,JSGI,Helma jQuery1.7,Dojo,SproutCore Akshell,JoyentSmartPlatform,v8cgi,JSBuild, XULJet Titanium,AdobeAIR CouchDB,MongoDBhttp://www.commonjs.org/
  42. 42. 요약 CoffeeScript,CommonJS,Dart는차세대자바스크립 트에가장큰영향을미치고있음 소개하지못한다양한프로젝트들의장점도논의후사양 으로책정할것이다. 제대로된기능들이추가되고있기도하지만사양에서제 외되기도한다. FirefoxSpiderMonkey와GoogleV8에서프로토타이 핑과사용자기반한테스트도진행중에있다. 2013년완료를목표로열띤논의중이다.http://www.ecmascript.org/ http://www.ecma-international.org/
  43. 43. 서버사이드자바스크립트서버시장까지잠식해가는자바스크립트그끝은어딜까?
  44. 44. 서버아키텍쳐의변환점 1세대 Perl기반 2세대 High-endUnix머신을기반으로한Java 3세대 클라우드를기반으로한PHP,Ruby,Python 4세대 서버측자바스크립트
  45. 45. 서버측자바스크립트서버시스템에서동작하는자바스크립트Netscape에서는EnterpriseServer2.0에포함된LiveWire라는서버측자바스크립트를1996년최초로개발AptanaJaxerisDeadNode.js,RingoJS,Narwhal,Helma,AppengineJS,JSGI
  46. 46. HTTPServer var http = require(http); http.createServer(function (req, res) { res.writeHead(200, {Content-Type: text/plain}); res.end(Hello H3 Conferencen); }).listen(1337, 127.0.0.1); console.log(Server running at http://127.0.0.1:1337/); % node example.js Server running at http://127.0.0.1:1337/http://nodejs.org/
  47. 47. TCPserver var net = require(net); var server = net.createServer(function (socket) { socket.write(Echo serverrn); socket.pipe(socket); }); server.listen(1337, 127.0.0.1);http://nodejs.org/
  48. 48. 노드는손쉽게확장가능한네트워킹프로그램을제공하기위한목적을둔다.노드는솔루션이아니다.개발자를위한환경이고단순한모델이다. RyanDahl
  49. 49. RT@andrwj:“@Rhiokim:드디어윈도우,리눅스,유닉스,POSIX할것없이서버측자바스크립트유통시장이열렸습니다.축하합시다:-)Node.jsv0.6.0isreleasedhttp://t.co/FocVJIOh”
  50. 50. lastest update create5000 4652 3978 38123750 3444 2700 2674 27822500 2092 1981 1749 1782 13421250 847 628 726 515 602 555 582 422 436 367 447 388 480 309 323 322 341 228 346 121 93 168 187 22 0 2010-12 2011-02 2011-04 2011-06 2011-08 2011-10
  51. 51. RoR Ruby on Rails Node.js2004.12 first commit 2009.02 first commit 11250 11400
  52. 52. h3.paran.comwithJavaScript@andrwj,@fallroot,@rhiokim client:store.js,uuid.js,jQuery,socket.io-client server:node.js+socket.io build:uglify.js,clean-css,html-minify webserver:nginx dbms:CouchDB about:5000PV,concurrency500
  53. 53. Rule모든것들이하나의언어로...
  54. 54. 당신의집을지어보자. 설계자:일본인 인테리어:한국인 건축가:프랑스인
  55. 55. 당신의집을지어보자. こんにちは。 머라는거여~어~? 고만노닥거리고일하라고~~ Nice,devous répondre.
  56. 56. 모든것이하나의룰 client: JavaScript Mobile:JavaScript Server:JavaScript
  57. 57. @rhiokim rhio.kim@gmail.com질문은메일이나트위터로언제든지해주세요.

×