Слайд 2
![Web-приложение. Что это? Веб-приложение — клиент-серверное приложение, в котором клиентом](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-1.jpg)
Web-приложение. Что это?
Веб-приложение — клиент-серверное приложение, в котором клиентом выступает браузер, а сервером — web-сервер. Логика веб-приложения распределена между сервером и клиентом,
хранение данных осуществляется, преимущественно, на сервере, обмен информацией происходит по сети. Одним из преимуществ такого подхода является тот факт, что клиенты не зависят от конкретной операционной системы пользователя, поэтому web-приложения являются межплатформенными сервисами.
Слайд 3
![Web-приложение. Клиентская часть Клиентская часть веб приложения - это графический](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-2.jpg)
Web-приложение. Клиентская часть
Клиентская часть веб приложения - это графический интерфейс. Это
то, что вы видите на странице. Графический интерфейс отображается в браузере. Пользователь взаимодействует с веб-приложением именно через браузер, кликая по ссылкам и кнопкам.
frontend
Слайд 4
![Web-приложение. Серверная часть Серверная часть веб-приложения - это программа или](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-3.jpg)
Web-приложение. Серверная часть
Серверная часть веб-приложения - это программа или скрипт на
сервере, обрабатывающая запросы пользователя (точнее, запросы браузера).
Чаще всего серверная часть веб-приложения программируется на PHP. При каждом переходе пользователя по ссылке браузер отправляет запрос к серверу.
Сервер обрабатывает этот запрос, вызывая некоторый PHP-скрипт, который формирует веб-страничку, описанную языком HTML, и отсылает клиенту по сети. Браузер тут же отображает полученный результат в виде очередной веб-страницы.
backend
Слайд 5
![Web-приложение. База данных База данных (БД, или система управления баазми](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-4.jpg)
Web-приложение. База данных
База данных (БД, или система управления баазми данных, СУБД)
- программное обеспечение на сервере, занимающееся хранением данных и их выдачей в нужный момент. В случае форума или блога, хранимые в БД данные - это посты, комментарии, новости, и так далее. База данных располагается на сервере. Серверная часть веб-приложения (то есть, PHP скрипт) обращается к базе данных, извлекая данные, которые необходимы для формирования страницы, запрошенной пользователем.
Слайд 6
![Web-приложение. Средства разработки Front-end HTML CSS JS Back-end Php, Perl Ruby Java Платформа .Net](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-5.jpg)
Web-приложение. Средства разработки
Front-end
HTML
CSS
JS
Back-end
Php, Perl
Ruby
Java
Платформа .Net
Слайд 7
![Классификация web-сайтов](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-6.jpg)
Слайд 8
![Разработка Web-приложения Задача Решение Сложная задача Сложное решение Сложное решение Процесс](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-7.jpg)
Разработка Web-приложения
Задача Решение
Сложная задача Сложное решение
Сложное решение Процесс
Слайд 9
![Процесс разработки Сайт-визитка: Промо-сайт: Сервис:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-8.jpg)
Процесс разработки
Сайт-визитка:
Промо-сайт: Сервис:
Слайд 10
![Цикл разработки:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-9.jpg)
Слайд 11
![Постановка задачи Кто ставит задачу: Руководство компании Руководитель сервиса Менеджер](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-10.jpg)
Постановка задачи
Кто ставит задачу:
Руководство компании
Руководитель сервиса
Менеджер
Что на выходе:
Продуктовые требования
Фич-листы
Тз
Разработчик:
В курсе
Подает
идеи
Слайд 12
![Дизайн Кто : дизайнеры менеджеры все подряд Что на выходе: макеты гайды Разработчик: Подает идеи Объясняет](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-11.jpg)
Дизайн
Кто :
дизайнеры
менеджеры
все подряд
Что на выходе:
макеты
гайды
Разработчик:
Подает идеи
Объясняет
Слайд 13
![Разработка Кто : Верстальщики Программисты Что на выходе: Верстка, шаблоны,](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-12.jpg)
Разработка
Кто :
Верстальщики
Программисты
Что на выходе:
Верстка, шаблоны, код, шаблоны, софт, логи…
Разработчик:
Разрабатывает
Первично тестирует
Слайд 14
![Progressive Enhancement Прогрессивное улучшение предполагает, что веб-интерфейсы должны создаваться поэтапно,](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-13.jpg)
Progressive Enhancement
Прогрессивное улучшение предполагает, что веб-интерфейсы должны создаваться поэтапно, циклически,
от простого к сложному. На каждом из этапов должен получаться законченный веб-интерфейс, который будет лучше, красивее и удобнее предыдущего. Всего этапов 4:
HTML этап
CSS этап
CSS3 этап
JavaScript этап
Слайд 15
![Graceful degradation возможность работы при отключенном JavaScript, аккуратное отображение интерфейса](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-14.jpg)
Graceful degradation
возможность работы при отключенном JavaScript,
аккуратное отображение интерфейса в браузере,
не поддерживающем новые свойства CSS3,
адекватное отображении сайта при отключенных изображениях.
В каждом из этих случаев работа пользователя с интерфейсом будет в принципе возможна,хотя и не так удобна.
Слайд 16
![Тестирование Кто : тестировщики Программисты администраторы Что : Автоматизированное Нагрузочное](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-15.jpg)
Тестирование
Кто :
тестировщики
Программисты
администраторы
Что :
Автоматизированное
Нагрузочное
Функциональное
Разработчик:
исправляет ошибки
помогает найти другие ошибки
Слайд 17
![Деплой Кто : Разработчики администраторы Что : Источник данных Обработка данных Шаблоны/статистика Разработчик: исправляет ошибки помогает](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-16.jpg)
Деплой
Кто :
Разработчики
администраторы
Что :
Источник данных
Обработка данных
Шаблоны/статистика
Разработчик:
исправляет ошибки
помогает
Слайд 18
![Маркетинг Кто : Копирайтеры Маркетологи Что : Группы в социальных](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-17.jpg)
Маркетинг
Кто :
Копирайтеры
Маркетологи
Что :
Группы в социальных сетях
Посты в блогах
Твиттер и тд…
Разработчик:
Следит
за корректностью текста
Слайд 19
![Поддержка Кто : Call-центр специалисты Что : Консультации Баг-репорты Разработчик: исправляет помогает](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-18.jpg)
Поддержка
Кто :
Call-центр
специалисты
Что :
Консультации
Баг-репорты
Разработчик:
исправляет
помогает
Слайд 20
![Что потом Новый цикл: Доработка Ошибки Исправление Эксперименты Новые функции](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-19.jpg)
Что потом
Новый цикл:
Доработка
Ошибки
Исправление
Эксперименты
Новые функции
Слайд 21
![Примеры циклов разработки](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-20.jpg)
Примеры циклов разработки
Слайд 22
![Способы разработки web-приложения 1) «руками» (конечно, с использованием библиотек) 2)](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-21.jpg)
Способы разработки web-приложения
1) «руками» (конечно, с использованием библиотек)
2) wix и другие
конструкторы сайтов
3) разработка с использованием CMS
Слайд 23
![Что такое CMS CMS «Content Management Software» («программное обеспечение для](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/603085/slide-22.jpg)
Что такое CMS
CMS «Content Management Software» («программное обеспечение для управления содержимым»).
В нашей стране принято последнюю букву «S» расшифровывать как «System», а по-русски это обычно звучит как «Система управления контентом». Иногда употребляется более простое название - "движок сайта"