Ликбез по веб-технологиям

473 views

Published on

Лекция для основного курса ИКРы.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
473
On SlideShare
0
From Embeds
0
Number of Embeds
15
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Ликбез по веб-технологиям

  1. 1. Ликбез по технологи м Алексей Симоненко веб-евангелист в HTML Academy 2014
  2. 2. Как работает интернет Запрос Ответ
  3. 3. Что Скрывает йсберг
  4. 4. Операционные системы
  5. 5. Операционные системы Базы данных
  6. 6. Операционные системы Базы данных Языки программирования
  7. 7. Операционные системы Базы данных Языки программирования Фреймворки
  8. 8. Операционные системы Базы данных Языки программирования Фреймворки Системы управления сайтом
  9. 9. Операционные системы Базы данных Языки программирования Фреймворки Системы управления сайтом Сайт
  10. 10. Операционные системы Базы данных Языки программирования Фреймворки Системы управления сайтом Сайт ↓ Хостинг
  11. 11. Как работает интернет Запрос Ответ Client-side Server-side Фронтенд Бэкенд
  12. 12. Бэкенд
  13. 13. Операционные системы Базы данных Языки программирования Фреймворки Системы управления сайтом
  14. 14. LAMP A L M P Linux Apache MySQL PHP
  15. 15. LAMP A L M P Linux Apache MongoDB Python
  16. 16. Стек разработки L L P R Linux LightTPD PostgresSQL Ruby
  17. 17. Стек разработки N L M N Linux Nginx MongoDB Node.JS
  18. 18. Бэкенд это скучно
  19. 19. Фронтенд
  20. 20. Сайт
  21. 21. Google Chrome Mozilla FirefoxInternet Explorer Safari Opera Статистика 44.2% 14.3%10.9% 7.1% 13.5%
  22. 22. какие сайты? Статика Динамика
  23. 23. какие сайты? • Корпоративные сайты • Интернет-магазины • Лендинги • Мобильные сайты
  24. 24. HTML & CSS
  25. 25. htmlacademy.ru
  26. 26. Что вместо флеш • HTML5 Video
  27. 27. Что вместо флеш • HTML5 Video • HTML5 Canvas
  28. 28. gabrielecirulli.github.io/2048/
  29. 29. flappybird.io
  30. 30. Что вместо флеш • HTML5 Video • HTML5 Canvas • Web Audio API
  31. 31. noisli.com
  32. 32. effectgames.com/demos/canvascycle/
  33. 33. jamwithchrome.com
  34. 34. dashersw.github.io/pedalboard.js/demo/
  35. 35. Что вместо флеш • HTML5 Video • HTML5 Canvas • Web Audio API • WebRTC
  36. 36. Флеш можно заменить
  37. 37. 24hoursofhappy.com
  38. 38. html5 — buzzword
  39. 39. CSS3 • Веб-шрифты • Линейные и радиальные градиенты • Анимация • 2D и 3D трансформации
  40. 40. codepen.io/lbebber/full/BzoHi/
  41. 41. tympanus.net/Development/HoverEffectIdeas/
  42. 42. codepen.io/teolitto/full/cdxFm/
  43. 43. joecritchley.com/demos/time-machine/
  44. 44. codepen.io/kennethcachia/full/Fhvie/
  45. 45. clicktorelease.com/code/css3dclouds/
  46. 46. javascript
  47. 47. Javascript • Gamepad • Device Orientation • Ambient Light • Vibration • Geolocation • Battery Status
  48. 48. WEBGL
  49. 49. madebyevan.com/webgl-water/
  50. 50. webaudio-io2012.appspot.com/frames/pool.html
  51. 51. media.tojicode.com/q3bsp/
  52. 52. playmapscube.com
  53. 53. alteredqualia.com/three/examples/webgl_terrain_dynamic.html
  54. 54. Parallax
  55. 55. ihatetomatoes.net/demos/simple-parallax-scrolling-tutorial/
  56. 56. Команда Менеджер Дизайнер Программист Верстальщик
  57. 57. Команда Менеджер Дизайнер Верстальщик Программист
  58. 58. Команда Менеджер Дизайнер Технолог Программист
  59. 59. Команда Менеджер Дизайнер Технолог Программист Фронтенд Бэкенд
  60. 60. сайт в 2014 • Быстрый • Доступный • С качественной графикой • Адаптивный
  61. 61. kandilyan.ru
  62. 62. kandilyan.ru
  63. 63. kandilyan.ru
  64. 64. Как узнавать новое?
  65. 65. simonenko simonenko simonenko.su Спасибо.

×