Кто такой фронтендер

2,599 views

Published on

Денис Чистяков на Я.Студенте в УрФУ 28 апреля

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,599
On SlideShare
0
From Embeds
0
Number of Embeds
220
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Кто такой фронтендер

  1. 1. Руководитель группы разработки интерфейсов Кто такой фронтендер? Чистяков Денис
  2. 2. Разрушители мифов или три «НЕ» • Дизайнер • Проектировщик • Верстальщик / технолог 3
  3. 3. 1993 — Тим Бернерс-Ли пишет HTML
  4. 4. 1994 — он же организует W3C * 6 * World Wide Web Consortium — Консорциум Всемирной паутины
  5. 5. 1994 — он же организует W3C * • Разработка стандартов для Интернета 6 * World Wide Web Consortium — Консорциум Всемирной паутины
  6. 6. 1994 — он же организует W3C * • Разработка стандартов для Интернета • Помощь программам во взаимодействии в Сети 6 * World Wide Web Consortium — Консорциум Всемирной паутины
  7. 7. 1994 — он же организует W3C * • Разработка стандартов для Интернета • Помощь программам во взаимодействии в Сети • Обеспечение интернационализации Сети 6 * World Wide Web Consortium — Консорциум Всемирной паутины
  8. 8. 1994 — он же организует W3C * • Разработка стандартов для Интернета • Помощь программам во взаимодействии в Сети • Обеспечение интернационализации Сети • Доступность для людей с ограниченными возможностями 6 * World Wide Web Consortium — Консорциум Всемирной паутины
  9. 9. <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 1.0//EN">! <HTML>! <HEAD>! <TITLE>This is a title</TITLE>! </HEAD>! <BODY>! <H1>This is a heading</H1>! Here is some text! <H2>Second level heading</H2>! Here is some more text.! <A HREF="Go"><IMG SRC="Button"> Press to start</A>! </BODY>! </HTML> HTML 7
  10. 10. v1.0 Яндекса
  11. 11. 1994 — Хокон Виум Ли пишет CSS
  12. 12. p span! {! font-size: 35pt;! color: white;! background: #000! } CSS 11 <p> <span>не черный</span> </p> CSS: HTML: Не черныйПример:
  13. 13. v8.5 Яндекса с CSS
  14. 14. 1995 — Брендан Айк пишет JavaScript
  15. 15. v11 Яндекса с JS
  16. 16. 2006 +
  17. 17. Асинхронные и динамические страницы Браузер Событие DOM XHR Web-сервер PHP Python Ruby Perl C# … HTTP XML БД
  18. 18. v12 Яндекса с AJAX
  19. 19. 2008 — Google пишет V8
  20. 20. 2009 — Райан Дал пишет Node.js
  21. 21. Разделение на Фронтенд и Бэкенд Браузер Событие DOM XHR Фронтэнд Node.js HTTP JSON Бэкенд PHP Python Ruby Perl C# … БД HTTP XML JSON …
  22. 22. Наши дни — iPhone + Android
  23. 23. Инструменты • JS-анализаторы: JSHint, JSLint, JSCS, … • CSS-препроцессоры: SASS, LESS, Stylus, … • BASH, Grunt, Gulp, Makefile, … • Веб-инспекторы в браузерах всё мощнее 23
  24. 24. HTML → HTML + CSS + JS + Node.js + … 24
  25. 25. Проекты Яндекса в Екб
  26. 26. Этому не учат в ВУЗах
  27. 27. 35 Фронтендеры всегда стоят на острие интернета
  28. 28. 35 Фронтендеры всегда стоят на острие интернета HTML CSS
  29. 29. 35 Фронтендеры всегда стоят на острие интернета HTML CSS JS
  30. 30. 35 Фронтендеры всегда стоят на острие интернета HTML CSS JS Node.js
  31. 31. Руководитель группы разработки интерфейсов dench@yandex-team.ru @denchistyakov Спасибо! Вопросы? Чистяков Денис

×