Enviar pesquisa
Carregar
프런트엔드개발, 지금과 다음
•
25 gostaram
•
6,388 visualizações
우영 주
Seguir
웹 최신 트렌드 2018 발표 자료. 프런트엔드 개발에 있어 커뮤니티 동향과 PWA그리고 SSR의 필요성에 대해 발표함.
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 54
Baixar agora
Baixar para ler offline
Recomendados
Make Your SEO Campaigns Successful With SEO Calgary
Make Your SEO Campaigns Successful With SEO Calgary
johnalbert672
Make Your Kitchen Beautiful With Granite Countertops
Make Your Kitchen Beautiful With Granite Countertops
johnbenny024
Exposicion diplomadoi ucv 2 curso
Exposicion diplomadoi ucv 2 curso
MAORELLANO
Physical Therapy Can Treat Causes of Dizziness
Physical Therapy Can Treat Causes of Dizziness
patboone
Find Various Physiotherapy Cure Techniques
Find Various Physiotherapy Cure Techniques
patboone
Adtoapp autopilot for app monetization
Adtoapp autopilot for app monetization
Appintop
Vaadin codemotion2014rome
Vaadin codemotion2014rome
mtzukanov
Introduction to Web application development with Vaadin 7.1 - Tzukanov
Introduction to Web application development with Vaadin 7.1 - Tzukanov
Codemotion
Mais conteúdo relacionado
Semelhante a 프런트엔드개발, 지금과 다음
Fronted development trends - past, present and the future
Fronted development trends - past, present and the future
Harijs Deksnis
Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?
Christian Heilmann
Web Technologies & CMS Market Share Trends
Web Technologies & CMS Market Share Trends
InTriggerApp
Adtoapp — Autopilot for App Monetization
Adtoapp — Autopilot for App Monetization
Appintop
Building Web Apps & APIs With Node JS
Building Web Apps & APIs With Node JS
Lohith Goudagere Nagaraj
Introduction to Vaadin, GWT.create 2015
Introduction to Vaadin, GWT.create 2015
hezamu
Advancing JavaScript without breaking the web - MunichJS
Advancing JavaScript without breaking the web - MunichJS
Christian Heilmann
20110910 WebSig1日学校2011_フロントエンジアクラス算数_春日井先生
20110910 WebSig1日学校2011_フロントエンジアクラス算数_春日井先生
WebSig24/7
Html5とはなにか?
Html5とはなにか?
Microsoft
Google mobile sites exam questions & answers 2017
Google mobile sites exam questions & answers 2017
Satish A
Hands on performance testing and analysis with web pagetest
Hands on performance testing and analysis with web pagetest
Patrick Meenan
Augmented reality in your web proxy
Augmented reality in your web proxy
Roberto Suggi Liverani
Progressing JavaScript and Apps the Web way…
Progressing JavaScript and Apps the Web way…
Christian Heilmann
The Case for React.js and ClojureScript
The Case for React.js and ClojureScript
Murilo Pereira
Knockout js with mvc
Knockout js with mvc
Joel Cochran
Web Anywhere: Mobile Optimisation With HTML5, CSS3, JavaScript
Web Anywhere: Mobile Optimisation With HTML5, CSS3, JavaScript
brucelawson
Html5 Overview
Html5 Overview
Daniel Arndt Alves
CWIN17 Toulouse / Safe 4.5 and agile devops-ca technologies-r.bajul
CWIN17 Toulouse / Safe 4.5 and agile devops-ca technologies-r.bajul
Capgemini
Gym Technology powered by pb&j TV
Gym Technology powered by pb&j TV
PB&J TV Childcare Webcasting
Writing Tools using WebKit
Writing Tools using WebKit
Ariya Hidayat
Semelhante a 프런트엔드개발, 지금과 다음
(20)
Fronted development trends - past, present and the future
Fronted development trends - past, present and the future
Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?
Web Technologies & CMS Market Share Trends
Web Technologies & CMS Market Share Trends
Adtoapp — Autopilot for App Monetization
Adtoapp — Autopilot for App Monetization
Building Web Apps & APIs With Node JS
Building Web Apps & APIs With Node JS
Introduction to Vaadin, GWT.create 2015
Introduction to Vaadin, GWT.create 2015
Advancing JavaScript without breaking the web - MunichJS
Advancing JavaScript without breaking the web - MunichJS
20110910 WebSig1日学校2011_フロントエンジアクラス算数_春日井先生
20110910 WebSig1日学校2011_フロントエンジアクラス算数_春日井先生
Html5とはなにか?
Html5とはなにか?
Google mobile sites exam questions & answers 2017
Google mobile sites exam questions & answers 2017
Hands on performance testing and analysis with web pagetest
Hands on performance testing and analysis with web pagetest
Augmented reality in your web proxy
Augmented reality in your web proxy
Progressing JavaScript and Apps the Web way…
Progressing JavaScript and Apps the Web way…
The Case for React.js and ClojureScript
The Case for React.js and ClojureScript
Knockout js with mvc
Knockout js with mvc
Web Anywhere: Mobile Optimisation With HTML5, CSS3, JavaScript
Web Anywhere: Mobile Optimisation With HTML5, CSS3, JavaScript
Html5 Overview
Html5 Overview
CWIN17 Toulouse / Safe 4.5 and agile devops-ca technologies-r.bajul
CWIN17 Toulouse / Safe 4.5 and agile devops-ca technologies-r.bajul
Gym Technology powered by pb&j TV
Gym Technology powered by pb&j TV
Writing Tools using WebKit
Writing Tools using WebKit
Mais de 우영 주
스트리밍과 디지털 권리 관리
스트리밍과 디지털 권리 관리
우영 주
스트리밍과 플레이어
스트리밍과 플레이어
우영 주
컴포넌트 관점에서 개발하기
컴포넌트 관점에서 개발하기
우영 주
아재가 젊은이에게 사랑받는 마크업을 하는 방법
아재가 젊은이에게 사랑받는 마크업을 하는 방법
우영 주
Introduce Guetzli
Introduce Guetzli
우영 주
스코프와 실행문맥
스코프와 실행문맥
우영 주
좋은 기능을 만드는 방법
좋은 기능을 만드는 방법
우영 주
서비스를 성공적으로 만드는 방법
서비스를 성공적으로 만드는 방법
우영 주
다함께, FluxUtils 한바퀴!
다함께, FluxUtils 한바퀴!
우영 주
BEM을 깨우치다.
BEM을 깨우치다.
우영 주
JavaScript Promises
JavaScript Promises
우영 주
[토크아이티] 프런트엔드 개발 시작하기 저자 특강
[토크아이티] 프런트엔드 개발 시작하기 저자 특강
우영 주
명세부터 깨우치는 FILEAPI
명세부터 깨우치는 FILEAPI
우영 주
[Toolcon2014] WebStorm에서 자바스크립트 리팩토링하기
[Toolcon2014] WebStorm에서 자바스크립트 리팩토링하기
우영 주
진보한 개발 환경에서 품질 좋은 코드 생산 (WebStorm)
진보한 개발 환경에서 품질 좋은 코드 생산 (WebStorm)
우영 주
Javascript Test Double Sinon.js
Javascript Test Double Sinon.js
우영 주
LESS와 EMMET
LESS와 EMMET
우영 주
HTML5 BOILERPLATE를 소개합니다.
HTML5 BOILERPLATE를 소개합니다.
우영 주
이클립스로 GIT 사용하기
이클립스로 GIT 사용하기
우영 주
Mais de 우영 주
(19)
스트리밍과 디지털 권리 관리
스트리밍과 디지털 권리 관리
스트리밍과 플레이어
스트리밍과 플레이어
컴포넌트 관점에서 개발하기
컴포넌트 관점에서 개발하기
아재가 젊은이에게 사랑받는 마크업을 하는 방법
아재가 젊은이에게 사랑받는 마크업을 하는 방법
Introduce Guetzli
Introduce Guetzli
스코프와 실행문맥
스코프와 실행문맥
좋은 기능을 만드는 방법
좋은 기능을 만드는 방법
서비스를 성공적으로 만드는 방법
서비스를 성공적으로 만드는 방법
다함께, FluxUtils 한바퀴!
다함께, FluxUtils 한바퀴!
BEM을 깨우치다.
BEM을 깨우치다.
JavaScript Promises
JavaScript Promises
[토크아이티] 프런트엔드 개발 시작하기 저자 특강
[토크아이티] 프런트엔드 개발 시작하기 저자 특강
명세부터 깨우치는 FILEAPI
명세부터 깨우치는 FILEAPI
[Toolcon2014] WebStorm에서 자바스크립트 리팩토링하기
[Toolcon2014] WebStorm에서 자바스크립트 리팩토링하기
진보한 개발 환경에서 품질 좋은 코드 생산 (WebStorm)
진보한 개발 환경에서 품질 좋은 코드 생산 (WebStorm)
Javascript Test Double Sinon.js
Javascript Test Double Sinon.js
LESS와 EMMET
LESS와 EMMET
HTML5 BOILERPLATE를 소개합니다.
HTML5 BOILERPLATE를 소개합니다.
이클립스로 GIT 사용하기
이클립스로 GIT 사용하기
Último
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
UiPathCommunity
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Safe Software
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
DianaGray10
Nanopower In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
Pedro Manuel
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
ThousandEyes
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
Matsuo Lab
RAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AI
Udaiappa Ramachandran
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
DianaGray10
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
DianaGray10
Spring24-Release Overview - Wellingtion User Group-1.pdf
Spring24-Release Overview - Wellingtion User Group-1.pdf
Anna Loughnan Colquhoun
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
Adam Moalla
Designing A Time bound resource download URL
Designing A Time bound resource download URL
Runcy Oommen
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Commit University
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
IES VE
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
Renan Moreira de Oliveira
Babel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptx
YounusS2
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
Bachir Benyammi
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Aijun Zhang
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
DianaGray10
GenAI and AI GCC State of AI_Object Automation Inc
GenAI and AI GCC State of AI_Object Automation Inc
Object Automation
Último
(20)
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Cloud Revolution: Exploring the New Wave of Serverless Spatial Data
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Nanopower In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
How to Effectively Monitor SD-WAN and SASE Environments with ThousandEyes
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
RAG Patterns and Vector Search in Generative AI
RAG Patterns and Vector Search in Generative AI
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
Spring24-Release Overview - Wellingtion User Group-1.pdf
Spring24-Release Overview - Wellingtion User Group-1.pdf
9 Steps For Building Winning Founding Team
9 Steps For Building Winning Founding Team
Designing A Time bound resource download URL
Designing A Time bound resource download URL
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Crea il tuo assistente AI con lo Stregatto (open source python framework)
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
Using IESVE for Loads, Sizing and Heat Pump Modeling to Achieve Decarbonization
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
PicPay - GenAI Finance Assistant - ChatGPT for Customer Service
Babel Compiler - Transforming JavaScript for All Browsers.pptx
Babel Compiler - Transforming JavaScript for All Browsers.pptx
NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
GenAI and AI GCC State of AI_Object Automation Inc
GenAI and AI GCC State of AI_Object Automation Inc
프런트엔드개발, 지금과 다음
1.
프런트엔드 개발, 지금과 다음
2.
ECMAScript
3.
>> >>
4.
96%97% 98% 98%
99%
9.
세대 전환의 시점 하지만
우린 언제나 구 버전 브라우저와의 전쟁을...
10.
JavaScript Flavors
11.
The State Of
JavaScript 2016
12.
The State Of
JavaScript 2018
13.
Used it before,
would use again ECMAScript6 Plain JavaScript TypeScript Elm ClojureScript Flow Reason CoffeScript 2016 2017 74% 87% 79% 53% 21% 34% 3% 5% 2% 2% unknown 10% unknown 0.5% unknown6% (+13%) (+13%) 18% 62% Growth Rate
15.
Type hinting Refactor Efficient collaboration Better
structural presentation
16.
DEMO
24.
DEMO
25.
https://youtu.be/M3BM9TB-8yA?t=19m44s
26.
Progressive Web App
27.
웹 경험을 탈피한
앱 스러운 웹 웹의 장점과 앱의 장점을 결합한 환경
28.
13% Mobile web 87% Apps https://www.youtube.com/watch?v=z2JgN6Ae-Bo
29.
Top 3 apps
Other apps https://www.youtube.com/watch?v=z2JgN6Ae-Bo 78% 22%
30.
https://www.comscore.com/Insights/Presentations-and-Whitepapers/2017/The-2017-US-Mobile-App-Report
31.
https://www.comscore.com/Insights/Presentations-and-Whitepapers/2017/The-2017-US-Mobile-App-Report
32.
https://www.youtube.com/watch?v=z2JgN6Ae-Bo 평균적으로 사용자가 한달에 설치하는 앱의 갯수
33.
https://www.youtube.com/watch?v=z2JgN6Ae-Bo 평균적으로 사용자가 한달에 설치하는 앱의 갯수 0
34.
https://www.comscore.com/Insights/Presentations-and-Whitepapers/2017/The-2017-US-Mobile-App-Report
35.
Integrated Experiences Manifest,
Service worker, Autofill, Payment API, … Reliable Experiences Service Worker Engaging Experiences Material UI(Ripple), Push API, Notification Secure Experiences HTTPS
36.
Flipkart https://www.flipkart.com/
37.
TwitterLight https://mobile.twitter.com/
38.
Llumino https://pwa.llumino.app/
39.
https://www.windowscentral.com/first-batch-windows-10-progressive-web-apps-here
40.
https://www.windowscentral.com/first-batch-windows-10-progressive-web-apps-here
41.
https://www.monterail.com/blog/pwa-for-apple-ios
42.
웹과 앱의 경계는 갈수록 얇아지고
43.
앱의 장점을 품은 웹은 매력적
44.
Single Page Application
45.
반응성. PWA를 더
PWA 답게 Engaging Experiences
46.
VS
47.
&
48.
Perfect?
49.
Only client side
rendering of Toss Service CPU 4x slowdown
50.
Only client side
rendering of Toss Service CPU 4x slowdown
51.
CSR SSR
53.
PWA, SPA +
SSR
54.
Thank you.
Baixar agora