SlideShare a Scribd company logo
1 of 46
Download to read offline
突如現れたコードネーム Calypso と、
その概念についてのお話
第48回 WordBench 大阪 「運用とチームと構成の理想論 & 突如現れたコード
ネーム Calypso & WordBench大坂座談会」
2015.12.5
自己紹介
• かみやん (Twitter@kamiyam)

http://nantokaworks.com

Engineer
Calypso
その前に……
なぜ
私がここで話しているのか…
かみやんを支える技術
JavaScript界隈から来ました
AGENDA
• Calypso概要
• WordPress.com
• Calypsoが我々にもたらすもの
Calypso
改めて..
https://developer.wordpress.com/calypso/
https://en.blog.wordpress.com/2015/11/23/the-new-wordpress-dot-com/
(観測範囲内の)
JS界隈の人たちがざわつく
https://nodejs.org/
https://facebook.github.io/react/
WordPressがPHPからNode.jsに…?
Calypso is the new WordPress.com
front-end – a beautiful redesign of the
WordPress dashboard using a single-
page web application, powered by the
WordPress.com REST API. Calypso is
built for reading, writing, and managing
all of your WordPress sites in one
place.
Calypso
WordPress.com REST APIを使った
Front End の Dashboard
フロントエンド?
Dashboard
WordPress Jetpack 有効
WordPress.com 連携サイト
WordPress.com
Management sites
https://developer.wordpress.com/docs/api/console/
すべてAPIを使ってRESTfulにすれば…
Node.js の Blogging Platform
Ghost の場合
https://ghost.org/download/
フロント部分は
サーバサイドレンダリング
APIによる Angular.js + SPA
レンダリングを実装しているのは
管理画面のみ
なぜか…?
SPAによる検索エンジン
インデックス問題
今のところ管理画面に利用される
https://github.com/Automattic/wp-calypso
wp-admin が wp-calypso となる
可能性はある?
更にJavaScriptの動的レンダリングに
対するクロールも評価され
フロントエンドもSPAになる
可能性はある?
http://v2.wp-api.org/
Calypsoは突如現れたものではない
https://developer.wordpress.com/2015/11/23/the-story-behind-the-new-wordpress-com/
Calypsoが我々にもたらすもの
device、platformを問わないCMS管理
https://apps.wordpress.org/
https://desktop.wordpress.com/
http://electron.atom.io/
比較DEMO
参考
• WP REST APIを利用したNodeJSのWebアプリを死ぬ思いで作る

http://takahashifumiki.com/web/programing/3683/

(Calypsoについての勉強会発表日に公開されて私が死ぬ思いをした)
• WP REST API Part 1: Creating a Mobile App with WP-API and React
Native

https://deliciousbrains.com/creating-mobile-app-wp-api-react-native/
• Ionic and WordPress

http://blog.ionic.io/ionic-and-wordpress/
ご清聴ありがとうございました

More Related Content

More from kamiyam .

プラベワークのススメ
プラベワークのススメプラベワークのススメ
プラベワークのススメkamiyam .
 
HomeKitとNode.jsを使ってSiriでコントロールするなにか
HomeKitとNode.jsを使ってSiriでコントロールするなにかHomeKitとNode.jsを使ってSiriでコントロールするなにか
HomeKitとNode.jsを使ってSiriでコントロールするなにかkamiyam .
 
Kinectを使った インタラクティブコンテンツを作った話
Kinectを使った インタラクティブコンテンツを作った話Kinectを使った インタラクティブコンテンツを作った話
Kinectを使った インタラクティブコンテンツを作った話kamiyam .
 
Node.jsでKinectを触ろうとして色々しくじった話
Node.jsでKinectを触ろうとして色々しくじった話Node.jsでKinectを触ろうとして色々しくじった話
Node.jsでKinectを触ろうとして色々しくじった話kamiyam .
 
ヒカ☆ラボ@Osaka NodeBotsハンズオン
ヒカ☆ラボ@Osaka NodeBotsハンズオンヒカ☆ラボ@Osaka NodeBotsハンズオン
ヒカ☆ラボ@Osaka NodeBotsハンズオンkamiyam .
 
Node.js をさりげなく取り入れた 最近のフロントエンド事情について
Node.js をさりげなく取り入れた 最近のフロントエンド事情についてNode.js をさりげなく取り入れた 最近のフロントエンド事情について
Node.js をさりげなく取り入れた 最近のフロントエンド事情についてkamiyam .
 
JavaScript Performance 20160723
JavaScript Performance 20160723JavaScript Performance 20160723
JavaScript Performance 20160723kamiyam .
 
JavaScriptが魅せる新たな世界
JavaScriptが魅せる新たな世界JavaScriptが魅せる新たな世界
JavaScriptが魅せる新たな世界kamiyam .
 
Async Enhancement
Async EnhancementAsync Enhancement
Async Enhancementkamiyam .
 
Node.jsで始める Modern JavaScript Framework
Node.jsで始める Modern JavaScript FrameworkNode.jsで始める Modern JavaScript Framework
Node.jsで始める Modern JavaScript Frameworkkamiyam .
 
Scalable Node.js with Redis Store
Scalable Node.js with Redis StoreScalable Node.js with Redis Store
Scalable Node.js with Redis Storekamiyam .
 
Gruntの罪と罰
Gruntの罪と罰Gruntの罪と罰
Gruntの罪と罰kamiyam .
 
Node.js勉強会 Framework Koa
Node.js勉強会 Framework KoaNode.js勉強会 Framework Koa
Node.js勉強会 Framework Koakamiyam .
 
知っているつもりで実は知らない 拾う技術捨てる技術
知っているつもりで実は知らない 拾う技術捨てる技術知っているつもりで実は知らない 拾う技術捨てる技術
知っているつもりで実は知らない 拾う技術捨てる技術kamiyam .
 
PhpStormとGrunt.jsで作るCakePHP快適開発環境
PhpStormとGrunt.jsで作るCakePHP快適開発環境 PhpStormとGrunt.jsで作るCakePHP快適開発環境
PhpStormとGrunt.jsで作るCakePHP快適開発環境 kamiyam .
 
Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築kamiyam .
 
MVCフレームワーク Sails.jsについて機能紹介
MVCフレームワーク Sails.jsについて機能紹介MVCフレームワーク Sails.jsについて機能紹介
MVCフレームワーク Sails.jsについて機能紹介kamiyam .
 
WebStormでできること
WebStormでできることWebStormでできること
WebStormでできることkamiyam .
 
とあるWEBエンジニアが スーパーハッカソンで知り得たこと
とあるWEBエンジニアが スーパーハッカソンで知り得たこととあるWEBエンジニアが スーパーハッカソンで知り得たこと
とあるWEBエンジニアが スーパーハッカソンで知り得たことkamiyam .
 

More from kamiyam . (20)

プラベワークのススメ
プラベワークのススメプラベワークのススメ
プラベワークのススメ
 
kyoto.js13
kyoto.js13kyoto.js13
kyoto.js13
 
HomeKitとNode.jsを使ってSiriでコントロールするなにか
HomeKitとNode.jsを使ってSiriでコントロールするなにかHomeKitとNode.jsを使ってSiriでコントロールするなにか
HomeKitとNode.jsを使ってSiriでコントロールするなにか
 
Kinectを使った インタラクティブコンテンツを作った話
Kinectを使った インタラクティブコンテンツを作った話Kinectを使った インタラクティブコンテンツを作った話
Kinectを使った インタラクティブコンテンツを作った話
 
Node.jsでKinectを触ろうとして色々しくじった話
Node.jsでKinectを触ろうとして色々しくじった話Node.jsでKinectを触ろうとして色々しくじった話
Node.jsでKinectを触ろうとして色々しくじった話
 
ヒカ☆ラボ@Osaka NodeBotsハンズオン
ヒカ☆ラボ@Osaka NodeBotsハンズオンヒカ☆ラボ@Osaka NodeBotsハンズオン
ヒカ☆ラボ@Osaka NodeBotsハンズオン
 
Node.js をさりげなく取り入れた 最近のフロントエンド事情について
Node.js をさりげなく取り入れた 最近のフロントエンド事情についてNode.js をさりげなく取り入れた 最近のフロントエンド事情について
Node.js をさりげなく取り入れた 最近のフロントエンド事情について
 
JavaScript Performance 20160723
JavaScript Performance 20160723JavaScript Performance 20160723
JavaScript Performance 20160723
 
JavaScriptが魅せる新たな世界
JavaScriptが魅せる新たな世界JavaScriptが魅せる新たな世界
JavaScriptが魅せる新たな世界
 
Async Enhancement
Async EnhancementAsync Enhancement
Async Enhancement
 
Node.jsで始める Modern JavaScript Framework
Node.jsで始める Modern JavaScript FrameworkNode.jsで始める Modern JavaScript Framework
Node.jsで始める Modern JavaScript Framework
 
Scalable Node.js with Redis Store
Scalable Node.js with Redis StoreScalable Node.js with Redis Store
Scalable Node.js with Redis Store
 
Gruntの罪と罰
Gruntの罪と罰Gruntの罪と罰
Gruntの罪と罰
 
Node.js勉強会 Framework Koa
Node.js勉強会 Framework KoaNode.js勉強会 Framework Koa
Node.js勉強会 Framework Koa
 
知っているつもりで実は知らない 拾う技術捨てる技術
知っているつもりで実は知らない 拾う技術捨てる技術知っているつもりで実は知らない 拾う技術捨てる技術
知っているつもりで実は知らない 拾う技術捨てる技術
 
PhpStormとGrunt.jsで作るCakePHP快適開発環境
PhpStormとGrunt.jsで作るCakePHP快適開発環境 PhpStormとGrunt.jsで作るCakePHP快適開発環境
PhpStormとGrunt.jsで作るCakePHP快適開発環境
 
Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築
 
MVCフレームワーク Sails.jsについて機能紹介
MVCフレームワーク Sails.jsについて機能紹介MVCフレームワーク Sails.jsについて機能紹介
MVCフレームワーク Sails.jsについて機能紹介
 
WebStormでできること
WebStormでできることWebStormでできること
WebStormでできること
 
とあるWEBエンジニアが スーパーハッカソンで知り得たこと
とあるWEBエンジニアが スーパーハッカソンで知り得たこととあるWEBエンジニアが スーパーハッカソンで知り得たこと
とあるWEBエンジニアが スーパーハッカソンで知り得たこと
 

WordBench Osaka #48 About Calypso