SlideShare une entreprise Scribd logo
1  sur  33
Télécharger pour lire hors ligne
CA流
フロントエンドエンジニアの働きかた

株式会社サイバーエージェント
アメーバ事業本部
原 一成@京都
Front Engineer
フロントエンドエンジニア
肌触りを決める仕事
Idea
Design
Front
Server
Infra
Idea
Design
Idea

Idea
Front
Data Front Server
Data
Designer

Front
Engineer

Server
Engineer
Designer
Server Engineer
Designer

Front
Engineer

Server
Engineer
Designer

Front
Engineer

Server
Engineer
デザイン

真ん中

技術
原 一成

Hara Kazunari

Web Developer
CyberAgent, Inc.
2008年
原 一成

Hara Kazunari

Web Developer
CyberAgent, Inc.
Ameba スマートフォン PV数 (億PV)
150

133
120
99

100

85

138

120

109
104103

91

76
61
45 47

50

11 13
9 9
5 7
2 3 3
0

67

10.10

12

2

4

6

21
17 20

8

28 30

10

35

12

2

4

6

8

10

12

13.2
Amebaアプリ
Engineer
Engineer
Engineer Engineer
Engineer
Front
Idea

Engineer
デザイン

真ん中

技術
HTML
CSS
JavaScript
プレゼント!
HTML
CSS
JavaScript
Pigg Controller
Pigg Controller
http://goo.gl/YllEMM
Live Cording!

Contenu connexe

Tendances

Behind-the-Scenes and Goals of LINE Summer Internship Program
Behind-the-Scenes and Goals of LINE Summer Internship ProgramBehind-the-Scenes and Goals of LINE Summer Internship Program
Behind-the-Scenes and Goals of LINE Summer Internship ProgramLINE Corporation
 
Apiドキュメンテーションツールを使いこなす【api blueprint編】
Apiドキュメンテーションツールを使いこなす【api blueprint編】Apiドキュメンテーションツールを使いこなす【api blueprint編】
Apiドキュメンテーションツールを使いこなす【api blueprint編】dcubeio
 
PHP Application E2E with Capybara
PHP Application E2E with CapybaraPHP Application E2E with Capybara
PHP Application E2E with CapybaraYoshiaki Yoshida
 
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポート
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポートJAWS-UGアーキテクチャ専門支部 ServerlessConfレポート
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポート真吾 吉田
 
AWSオンリーで実現するIoTクラウド基盤
AWSオンリーで実現するIoTクラウド基盤AWSオンリーで実現するIoTクラウド基盤
AWSオンリーで実現するIoTクラウド基盤Godai Nakamura
 
Jawsug chiba API Gateway
Jawsug chiba API GatewayJawsug chiba API Gateway
Jawsug chiba API GatewayTakuro Sasaki
 
2016/12/17 ASP.NET フロントエンドタスク入門
 2016/12/17 ASP.NET フロントエンドタスク入門 2016/12/17 ASP.NET フロントエンドタスク入門
2016/12/17 ASP.NET フロントエンドタスク入門miso- soup3
 
退屈なブラウザ作業をpuppeteerにやらせたいお話
退屈なブラウザ作業をpuppeteerにやらせたいお話退屈なブラウザ作業をpuppeteerにやらせたいお話
退屈なブラウザ作業をpuppeteerにやらせたいお話Tadashi Nemoto
 
アメブロの大規模システム刷新と それを支えるSpring
アメブロの大規模システム刷新と それを支えるSpringアメブロの大規模システム刷新と それを支えるSpring
アメブロの大規模システム刷新と それを支えるSpringTakuya Hattori
 
capybara で快適なテスト生活を
capybara で快適なテスト生活をcapybara で快適なテスト生活を
capybara で快適なテスト生活をRyunosuke SATO
 
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Serviceメルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes ServiceTadashi Nemoto
 
Lineにおけるspring frameworkの活用
Lineにおけるspring frameworkの活用Lineにおけるspring frameworkの活用
Lineにおけるspring frameworkの活用Tokuhiro Matsuno
 
2016/05/01 Visual Studio with Cordova
2016/05/01 Visual Studio with Cordova2016/05/01 Visual Studio with Cordova
2016/05/01 Visual Studio with Cordovamiso- soup3
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.jsTanUkkii
 
Tableau Developers Club - Web Data Connector handson
Tableau Developers Club - Web Data Connector handsonTableau Developers Club - Web Data Connector handson
Tableau Developers Club - Web Data Connector handsonKenji Noguchi
 
Mashup Awards は 新しい技術を試す 絶好の機会です
Mashup Awards は新しい技術を試す絶好の機会ですMashup Awards は新しい技術を試す絶好の機会です
Mashup Awards は 新しい技術を試す 絶好の機会ですNobuhiro Nakajima
 
SIROK技術勉強会 #1 「Reactってなんだ?」
SIROK技術勉強会 #1 「Reactってなんだ?」SIROK技術勉強会 #1 「Reactってなんだ?」
SIROK技術勉強会 #1 「Reactってなんだ?」Naoyuki Kataoka
 

Tendances (20)

Behind-the-Scenes and Goals of LINE Summer Internship Program
Behind-the-Scenes and Goals of LINE Summer Internship ProgramBehind-the-Scenes and Goals of LINE Summer Internship Program
Behind-the-Scenes and Goals of LINE Summer Internship Program
 
Apiドキュメンテーションツールを使いこなす【api blueprint編】
Apiドキュメンテーションツールを使いこなす【api blueprint編】Apiドキュメンテーションツールを使いこなす【api blueprint編】
Apiドキュメンテーションツールを使いこなす【api blueprint編】
 
PHP Application E2E with Capybara
PHP Application E2E with CapybaraPHP Application E2E with Capybara
PHP Application E2E with Capybara
 
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポート
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポートJAWS-UGアーキテクチャ専門支部 ServerlessConfレポート
JAWS-UGアーキテクチャ専門支部 ServerlessConfレポート
 
AWSオンリーで実現するIoTクラウド基盤
AWSオンリーで実現するIoTクラウド基盤AWSオンリーで実現するIoTクラウド基盤
AWSオンリーで実現するIoTクラウド基盤
 
HTML5最前線
HTML5最前線HTML5最前線
HTML5最前線
 
Jawsug chiba API Gateway
Jawsug chiba API GatewayJawsug chiba API Gateway
Jawsug chiba API Gateway
 
2016/12/17 ASP.NET フロントエンドタスク入門
 2016/12/17 ASP.NET フロントエンドタスク入門 2016/12/17 ASP.NET フロントエンドタスク入門
2016/12/17 ASP.NET フロントエンドタスク入門
 
退屈なブラウザ作業をpuppeteerにやらせたいお話
退屈なブラウザ作業をpuppeteerにやらせたいお話退屈なブラウザ作業をpuppeteerにやらせたいお話
退屈なブラウザ作業をpuppeteerにやらせたいお話
 
アメブロの大規模システム刷新と それを支えるSpring
アメブロの大規模システム刷新と それを支えるSpringアメブロの大規模システム刷新と それを支えるSpring
アメブロの大規模システム刷新と それを支えるSpring
 
Yapc fukuoka crust
Yapc fukuoka crustYapc fukuoka crust
Yapc fukuoka crust
 
capybara で快適なテスト生活を
capybara で快適なテスト生活をcapybara で快適なテスト生活を
capybara で快適なテスト生活を
 
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Serviceメルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
メルカリの開発スピードと品質を支える Selenium on Azure Kubernetes Service
 
Lineにおけるspring frameworkの活用
Lineにおけるspring frameworkの活用Lineにおけるspring frameworkの活用
Lineにおけるspring frameworkの活用
 
2016/05/01 Visual Studio with Cordova
2016/05/01 Visual Studio with Cordova2016/05/01 Visual Studio with Cordova
2016/05/01 Visual Studio with Cordova
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.js
 
Tableau Developers Club - Web Data Connector handson
Tableau Developers Club - Web Data Connector handsonTableau Developers Club - Web Data Connector handson
Tableau Developers Club - Web Data Connector handson
 
Mashup Awards は 新しい技術を試す 絶好の機会です
Mashup Awards は新しい技術を試す絶好の機会ですMashup Awards は新しい技術を試す絶好の機会です
Mashup Awards は 新しい技術を試す 絶好の機会です
 
SIROK技術勉強会 #1 「Reactってなんだ?」
SIROK技術勉強会 #1 「Reactってなんだ?」SIROK技術勉強会 #1 「Reactってなんだ?」
SIROK技術勉強会 #1 「Reactってなんだ?」
 
V8 Iginition Interpreter
V8 Iginition InterpreterV8 Iginition Interpreter
V8 Iginition Interpreter
 

Similaire à CA流 フロントエンドエンジニアの働きかた

EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session
EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer SessionEdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session
EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session慎太郎 木村
 
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏プログラム組んだら負け!実はHTML/CSSだけでできること2015夏
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏Yusuke Hirao
 
front_server20131218
front_server20131218front_server20131218
front_server20131218cyberagent
 
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜Hiroaki Honda
 
Abc2013 autumn fujiwara
Abc2013 autumn fujiwaraAbc2013 autumn fujiwara
Abc2013 autumn fujiwaracyberagent
 
イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱Fumio SAGAWA
 
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介Tsuyoshi Hirayama
 
エンジニアと"協同"してサービスをつくる
エンジニアと"協同"してサービスをつくるエンジニアと"協同"してサービスをつくる
エンジニアと"協同"してサービスをつくるIshikawa Yuya
 
モバイルゲームビルドパイプラインとChatOps
モバイルゲームビルドパイプラインとChatOpsモバイルゲームビルドパイプラインとChatOps
モバイルゲームビルドパイプラインとChatOpsKLab Inc. / Tech
 
AppPotモバイルアプリ開発『内製化』
AppPotモバイルアプリ開発『内製化』AppPotモバイルアプリ開発『内製化』
AppPotモバイルアプリ開発『内製化』Ryohei Sogo
 
GREE TechTalk グリーのクライアント技術戦略
GREE TechTalk グリーのクライアント技術戦略GREE TechTalk グリーのクライアント技術戦略
GREE TechTalk グリーのクライアント技術戦略Daniel-Hiroyuki Haga
 
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作Tsuyoshi Nakao
 
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonightAmazon Web Services Japan
 
スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法
スマートフォンサイト制作  よくあるトラブルと 解決方法・回避方法スマートフォンサイト制作  よくあるトラブルと 解決方法・回避方法
スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法Maboroshi.inc
 
Going Serverless, Building Applications with No Servers
Going Serverless, Building Applications with No ServersGoing Serverless, Building Applications with No Servers
Going Serverless, Building Applications with No ServersKeisuke Nishitani
 
2014-04-22 Ques #4 Automation Testing of Mobage Platform
2014-04-22 Ques #4 Automation Testing of Mobage Platform2014-04-22 Ques #4 Automation Testing of Mobage Platform
2014-04-22 Ques #4 Automation Testing of Mobage PlatformMasaki Nakagawa
 
Effective web performance tuning for smartphone
Effective web performance tuning for smartphoneEffective web performance tuning for smartphone
Effective web performance tuning for smartphonedena_study
 

Similaire à CA流 フロントエンドエンジニアの働きかた (20)

EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session
EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer SessionEdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session
EdgeWorkers の導入について - Akamai TechWeek 2021 Japan Customer Session
 
Googleアシスタントアプリ実際のところ
Googleアシスタントアプリ実際のところ Googleアシスタントアプリ実際のところ
Googleアシスタントアプリ実際のところ
 
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏プログラム組んだら負け!実はHTML/CSSだけでできること2015夏
プログラム組んだら負け!実はHTML/CSSだけでできること2015夏
 
front_server20131218
front_server20131218front_server20131218
front_server20131218
 
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜
プロジェクトTakumi 〜レコメンデーション設定への挑戦者たち〜
 
Abc2013 autumn fujiwara
Abc2013 autumn fujiwaraAbc2013 autumn fujiwara
Abc2013 autumn fujiwara
 
イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱イマドキのフロントエンドエンジニアの道具箱
イマドキのフロントエンドエンジニアの道具箱
 
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介
第79回 Machine Learning 15minutes ! 生成AIをエンタープライズで活用するWatsonx.aiの紹介
 
エンジニアと"協同"してサービスをつくる
エンジニアと"協同"してサービスをつくるエンジニアと"協同"してサービスをつくる
エンジニアと"協同"してサービスをつくる
 
楽天エンジニアライフ
楽天エンジニアライフ楽天エンジニアライフ
楽天エンジニアライフ
 
モバイルゲームビルドパイプラインとChatOps
モバイルゲームビルドパイプラインとChatOpsモバイルゲームビルドパイプラインとChatOps
モバイルゲームビルドパイプラインとChatOps
 
ファーストアカウンティング会社説明資料 for engineer 2022年7月版
ファーストアカウンティング会社説明資料 for engineer 2022年7月版ファーストアカウンティング会社説明資料 for engineer 2022年7月版
ファーストアカウンティング会社説明資料 for engineer 2022年7月版
 
AppPotモバイルアプリ開発『内製化』
AppPotモバイルアプリ開発『内製化』AppPotモバイルアプリ開発『内製化』
AppPotモバイルアプリ開発『内製化』
 
GREE TechTalk グリーのクライアント技術戦略
GREE TechTalk グリーのクライアント技術戦略GREE TechTalk グリーのクライアント技術戦略
GREE TechTalk グリーのクライアント技術戦略
 
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作
「コードを書かずにコードを産み出す?!」スマホ時代の最先端Web/アプリ制作
 
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
[CTO Night & Day 2019] グローバルのサービス展開に向けたマルチリージョンアーキテクチャ- #ctonight
 
スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法
スマートフォンサイト制作  よくあるトラブルと 解決方法・回避方法スマートフォンサイト制作  よくあるトラブルと 解決方法・回避方法
スマートフォンサイト制作 よくあるトラブルと 解決方法・回避方法
 
Going Serverless, Building Applications with No Servers
Going Serverless, Building Applications with No ServersGoing Serverless, Building Applications with No Servers
Going Serverless, Building Applications with No Servers
 
2014-04-22 Ques #4 Automation Testing of Mobage Platform
2014-04-22 Ques #4 Automation Testing of Mobage Platform2014-04-22 Ques #4 Automation Testing of Mobage Platform
2014-04-22 Ques #4 Automation Testing of Mobage Platform
 
Effective web performance tuning for smartphone
Effective web performance tuning for smartphoneEffective web performance tuning for smartphone
Effective web performance tuning for smartphone
 

Plus de Kazunari Hara

俺の、プレゼン構築法
俺の、プレゼン構築法俺の、プレゼン構築法
俺の、プレゼン構築法Kazunari Hara
 
スマートフォン時代のWeb制作術 Vol.2
スマートフォン時代のWeb制作術 Vol.2スマートフォン時代のWeb制作術 Vol.2
スマートフォン時代のWeb制作術 Vol.2Kazunari Hara
 
スマートフォン時代のWeb制作術 Vol.1
スマートフォン時代のWeb制作術 Vol.1スマートフォン時代のWeb制作術 Vol.1
スマートフォン時代のWeb制作術 Vol.1Kazunari Hara
 
速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-Kazunari Hara
 
Native x Webでいいとこどり開発 ~ピグトーク~
Native x Webでいいとこどり開発 ~ピグトーク~Native x Webでいいとこどり開発 ~ピグトーク~
Native x Webでいいとこどり開発 ~ピグトーク~Kazunari Hara
 
速くなければスマフォじゃない
速くなければスマフォじゃない速くなければスマフォじゃない
速くなければスマフォじゃないKazunari Hara
 
Hybrid appのすすめ
Hybrid appのすすめHybrid appのすすめ
Hybrid appのすすめKazunari Hara
 

Plus de Kazunari Hara (10)

俺はMETAだ!
俺はMETAだ!俺はMETAだ!
俺はMETAだ!
 
俺の、プレゼン構築法
俺の、プレゼン構築法俺の、プレゼン構築法
俺の、プレゼン構築法
 
Watch the Time
Watch the TimeWatch the Time
Watch the Time
 
CSS3 Design Recipe
CSS3 Design RecipeCSS3 Design Recipe
CSS3 Design Recipe
 
スマートフォン時代のWeb制作術 Vol.2
スマートフォン時代のWeb制作術 Vol.2スマートフォン時代のWeb制作術 Vol.2
スマートフォン時代のWeb制作術 Vol.2
 
スマートフォン時代のWeb制作術 Vol.1
スマートフォン時代のWeb制作術 Vol.1スマートフォン時代のWeb制作術 Vol.1
スマートフォン時代のWeb制作術 Vol.1
 
速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-
 
Native x Webでいいとこどり開発 ~ピグトーク~
Native x Webでいいとこどり開発 ~ピグトーク~Native x Webでいいとこどり開発 ~ピグトーク~
Native x Webでいいとこどり開発 ~ピグトーク~
 
速くなければスマフォじゃない
速くなければスマフォじゃない速くなければスマフォじゃない
速くなければスマフォじゃない
 
Hybrid appのすすめ
Hybrid appのすすめHybrid appのすすめ
Hybrid appのすすめ