Facebook은 왜 React를 만들었을까? 슬라이드 및 동영상입니다

 

FBDG 2015 Nov - Facebook은 React를 왜 만들었는가?

 



중국 바이두(baidu, 百度)에서 만든 자바스크립트 차트 라이브러리 Echart



IE6이상 버전 및 Firefox, Opera, Safari에서 동작함. 


보통 돈을 내고 Javascript 차트 상용라이브러리인 highchart(http://www.highcharts.com/)를 사용함. 

Echart은 highchart와 다르게 오픈소스에다 highchart보다 기능이 더 많고 highchart보다 더 나은 기능을 제공. 거기에 IE8이하 IE6까지 지원되는 호환성에 감탄함.

추가로 Echart의 표기방식이 Highchart와 비슷하여 금방 적응됨. ( 한국어로도 적용 쉽게 될듯함.) 


ps. 중국 개발 기술력이 무서움을 느낌.

AngularJS & ReactJS 비교 동영상


요즘, 각광받고 있는 AngularJS와 ReactJS에 대한 분석을 한 동영상 입니다.


문서: https://docs.google.com/presentation/d/1m_vVivj1fxyLQHPJnemR9etZZPGIX1Fshw8zbh9ZwsU/edit?usp=sharing

영국 FT(Financial times) Lab의 github repository에 올라온 Fastclick 사용


위와 관련된 Google의 Article - "Creating Fast Buttons for Mobile Web Applications"


5 Ways to Prevent the 300ms Click Delay on Mobile Devices


Remove Mobile Safari Click Delay


2015년 1월 28~29일 양일간 미국 캘리포니아 Facebook 본사에서 열린 React.js Conf 강연 동영상 목록을 정리하여 포스팅합니다.


참고로, 현재인 2월 3일에는 1월 28일자(1일차) 강연은 모두 올라왔지만 1월 29일자(2일차) 강연은 Keynote(기조연설,基調演說)만 올라왔습니다. 추후에 1월 29일자 강연도 추가하여 올릴 예정입니다.


Day 1 (1월 28일자)

React.js Conf 2015 Keynote - Introducing React Native

React.js Conf 2015 - Tweak your page in real time

React.js Conf 2015 - Unlocking the structure of your React applications with the AST

React.js Conf 2015 - Data fetching for React applications at Facebook

React.js Conf 2015 - Communicating with channels

React.js Conf 2015 - react-router increases your productivity

React.js Conf 2015 - Full Stack Flux

React.js Conf 2015 - Making your app fast with high-performance components

React.js Conf 2015 - Formatting with FormatJS and react-intl

React.js Conf 2015 - Hype!


Day 2 (1월 29일자)

React.js Conf 2015 Keynote 2 - A Deep Dive into React Native



Angular 2 Core slides




2014년 12월 11일 추가 

Angular js 2.0 preview


JavaScript 2014 Front-End(프론트엔드) 기술리뷰

AngularJS Tutorial Video List



Youtube에 올라온 Google에서 밀고 있는 AngularJS의 튜토리얼 비디오 모음

AngularJS Hello World

출처: AngularJS Homepage : https://angularjs.org/

Google이 밀고 있는 AngularJS의 소개 동영상.

input box에 글자를 입력하는 jQuery와 AngularJS의 예제를 보이며 AngularJS이 어떤 것인지 알려주는 동영상

AngularJS가 jQuery보다 간편하니 배울만한 가치가 있다는 결론을 내림.

Angular 2.0 Core by Igor Minar & Tobias Bosch at ng-europe 2014

Slides: http://goo.gl/ZyUU3Q


Google - "javascript namespace minify" - 검색결과: 세이프서치로 음란물이 필터링되었습니다. 자세히 알아보기 실행취소

구글에서 javascrip에서 namespace를 자바패키지 이름(com.XXX.YYY.*** 식) 처럼 사용할수 있게 하는 유틸리티 Namespace.js (https://github.com/maximebf/Namespace.js) 축약을 검색하기 위해서

javascript namespace minify

를 검색해보았다.


그런데 구글에서는

세이프서치로 음란물이 필터링되었습니다. 자세히 알아보기 실행취소

뜹니다.


  1. javascript가 음란물이였나?
  2. namespace가 음란물이였나?
  3. minify가 음란물이였나?


javascipt는 프로그래밍언어명이고, namespace도 언어에서 사용하는 단어이고 minify도 자바스크립트 축약에서 많이 쓰는단어인데, 이상하네요.

구글님, 왜 javascript관련 내용이 음란물로 검색되죠? 왜죠?

평소에 일하느라 정신 없는데다, 음란물, 성인물에 대해서 관심도 없는데 참 구글이 사람 당황스럽게 하네요.


자바스크립트를 이용하여 GNOME에서 창을 띄어보기


출처: YES! Gnome JS Bindings Documentation is now available! 

#!/usr/bin/gjs

//The previous line is a hash bang which tells how to run the script.
// Note that the script has to be executable (run in terminal in the right folder: chmod +x scriptname)
// Initialize GTK+
var Gtk = imports.gi.Gtk;
Gtk.init(null, 0);
// Create your window, name it, and connect the “click x to quit” function.
// The word “window” is a JavaScript keyword, so we have to
// call it something different.
var mywindow = new Gtk.Window({type: Gtk.WindowType.TOPLEVEL});
mywindow.title = "Hello World!";
mywindow.connect("destroy", function(){Gtk.main_quit()});
// Add some text to your window
var label = new Gtk.Label({label: "Hello World"});
mywindow.add(label);
// Make the label and the window itself visible to the user
label.show();
mywindow.show();
// Let the user run the app
Gtk.main();


chmod +x helloworld.js

./helloworld.js


Hello World!




아니 이게 뭐시당께? 이게 뭐꼬? 이게 뭐에유? 이게 뭐야? 這是什麼? 这是什么? 何それ? What is it? 


Psy(싸이)의 "강남스타일(GangNam Style)"에 영감을 얻어 만들어진 자바스크립트 프레임워크 Opa(오빠)가 있습니다

Opa(오빠)와 개발을 해보세요 :)

Opa framework는 이름으로 인기를 노린건가? -_-;;


추가. opa는 2011년도에 이미 있었다는데, 싸이의 강남스타일이 뜨면서 저렇게 변했다는 제보가 있었습니다


ps. 이거 뭐야! 싸이의 강남스타일이 서양인들에게 얼마나 강력하게 다가왔으면, 뇌리에 심하게 박혀있어! 

어튼 서양인들에게 강남스타일이 정말 인기가 있는건 확실함


Zygote body는 3D로 인체 내부 장기 및 근육들을 보여주는 일종의 해부학 서비스입니다. 

(zygote(수정란, 접합자) - 암컷과 수컷의 배우자의 생식세포가 합쳐져 만들어진 생식 세포라는 말입니다. 참고로 해부학은 Anatomy)

Zygote라는 단어가 어려운 단어이긴 한데 왜 해부학 서비스와 연결되었는지는 아직 이해 불가 --;;


예전에 Google Body라고 해서 Google에서 서비스하다 한동안 서비스가 중단되었다, Zygotebody라는 사이트에서 서비스를 제공합니다.

참고로, Google body는 안드로이드용 어플로도 나왔지만, 허니콤 전용 어플이라 한번도 실행해본적이 없군요



Zygote body의 경우는 Javascript(jQuery와 jQuery UI)와 WebGL을 이용하여 서비스를 하더군요. 

ActiveX나 Java applet이 아닌 자바스크립트만드로도  서비스할수 있다는 것이 신기할 따름입니다.


아래는 구글 바디 서비스 소개 동영상

Google Body Browser


A 2 minute demo of Google Body Browser 3D plus how to get it!






2010년 6워 29일 제 10회 다음 DevDay가 열렸더군요. 

안드로이드 앱 만든다고 Daum API에 대해 알기 위해서 DNA블로그를 둘어보다 보니 저의 뇌를 자극하는 포스트가 나왔더랍니다. - 10회 DevDay 지도API 퀴즈

여기서 나온 퀴즈를 보니 재미있는 문제들이 많이 있더군요.



Daum 지도API와 자바스크립트를 이용하면 금방 해결될 문제들입니다.

문제를 제대로 해결하면 다른 회사 API와 Mashup을 하는 것은 쉬울듯?

ps. 빨리 풀어보고 블로그에 올릴까... (후다닥)

이 글은 DroidEgo님의 2010년 2월 1일미투데이 내용입니다.

+ Recent posts