Презентация к докладу «Разработка WPF приложений в стиле ViewModel First» с одиннадцатой конференции dotnetconf (Челябинск, 31 октября 2015)
http://dotnetconf.ru/materialy/viewmodelfirst
Moxy. Как правильно пользоваться? / Юрий Шмаков (Arello Mobile)Ontico
РИТ++ 2017, AppsConf
Зал Касабланка, 6 июня, 16:00
Тезисы:
http://appsconf.ru/2017/abstracts/2704.html
В последнее время паттерн MVP будоражит Android-комьюнити. Уже есть несколько довольно приличных библиотек, которые помогают использовать этот подход. Но с ними вам придётся писать много boilerplate-кода. Поэтому я хочу познакомить вас с Moxy. Покажу, как использовать её компоненты для решения задач, которые будут вставать перед вами, когда вы решите использовать паттерн MVP. И расскажу, как устроены эти компоненты, и почему именно так, чтобы вы не боялись использовать Moxy из-за потенциальных подводных камней.
Moxy. Как правильно пользоваться? / Юрий Шмаков (Arello Mobile)Ontico
РИТ++ 2017, AppsConf
Зал Касабланка, 6 июня, 16:00
Тезисы:
http://appsconf.ru/2017/abstracts/2704.html
В последнее время паттерн MVP будоражит Android-комьюнити. Уже есть несколько довольно приличных библиотек, которые помогают использовать этот подход. Но с ними вам придётся писать много boilerplate-кода. Поэтому я хочу познакомить вас с Moxy. Покажу, как использовать её компоненты для решения задач, которые будут вставать перед вами, когда вы решите использовать паттерн MVP. И расскажу, как устроены эти компоненты, и почему именно так, чтобы вы не боялись использовать Moxy из-за потенциальных подводных камней.
«Как я научился не волноваться и полюбил Android-MVP», Никита Бартишок, ABBYYMail.ru Group
Доклад о подходе к разработке Android-приложений с использованием MVP и Clean Architecture. Никита рассмотрит преимущества этого подхода перед традиционным, уделит отдельное внимание вопросам сохранения состояния в Android-MVP, а также особенностям взаимодействия между V и P.
Vue.js и его брат-близнец Vue-server.js / Андрей Солодовников (НГС)Ontico
Современный Веб всё больше стремится к динамичным, похожим на приложения, сайтам.
Оперативно строить быстрый и динамичный интерфейс на проекте N1.RU нам помогает Vue.js.
Однако, как и многие современные библиотеки и фреймворки, Vue.js не умеет рендериться на сервере.
При этом иметь такую возможность бывает полезно по нескольким причинам: начиная от вопросов SEO и заканчивая красотой загрузки страницы.
Чтобы реализовать такую возможность для Vue.js мы создали его дополнение — Vue-server.js.
Я расскажу о том, что умеет Vue.js, что у нашего дополнения "под капотом", почему мы выбрали такой путь и как, вообще, всё это работает. А ещё попробую дать критическую оценку проделанной работе.
55+1 прием для улучшения Javascript-кода / Татьяна Бабич (Simbirsoft)Ontico
В докладе будут рассмотрены приемы, практики и «фишки», которые полезно использовать для создания любого Frontend-приложения.
Мы поговорим об организации модульности и компонентов на примере приложений с Angular, React и Polymer. Обсудим, как использовать особенности JavaScript, и рассмотрим особые случаи, когда фреймворки действительно приходят на помощь.
Доклад о подходе к отслеживанию потоков данных, формирующих окружение, в котором пользователь решает свои задачи.
На примере реализации для конкретного фреймворка будет озвучена идея, как сделать инструмент для отслеживания изменений данных на странице приложения для вашего технологического стека.
Целевая аудитория
Разработчики крупных web-приложений, регулярно сталкивающиеся с проблемой, как уследить за изменением большого количества данных, формирующих интерфейс пользователя, решающих задачу эффективно разобраться с потоками данных для устранения неполадок приложения.
Человеческий организм устроен сложно. Если с ним что-то не так, то для диагностики используют магнитно-резонансный томограф.
Большие одностраничные приложения тоже устроены сложно. Чтобы их починить или обвесить новым функционалом, требуется вникнуть в их устройство. Для этого нередко приходится засучивать рукава и с головой погружаться в самую глубь проекта. И немалая часть проблем связана именно с бизнес логикой и потоками данных. Но что если у нас будет возможность проникнуть в структуру данных, способ увидеть связи между ними и отслеживать то, как они влияют друг на друга? Такой способ, чтобы не требовалось вскрытия скальпелем - все как с МРТ.
В докладе речь пойдет о собственных разработках в этой области.
Радости и гадости регрессионного тестирования вёрстки / Алексей Малейков (HTM...Ontico
Совместно с университетом ИТМО мы запустили курс, посвященный основам HTML и CSS. Уже на момент регистрации на этот курс записалось более 12 тысяч студентов. Перед нами стояла задача разработать систему, которая будет автоматически проверять итоговые проекты на соответствие заранее подготовленному макету. В качестве основной техники для проверки было выбрано регрессионное тестирование.
В каждом проекте мы проверяли разметку, сетку и стилевое оформление не только страницы целиком, но и отдельных блоков. Одной из главных проблем был поиск этих самых блоков, так как о том, какой будет верстка студентов, мы не знали ничего — ни какие теги они использовали, ни какие классы и идентификаторы были задействованы. Имели только общее представление о структуре.
В докладе я расскажу, от чего мы отталкивались при построении этой системы, как мы разбирали и анализировали проекты. Какие инструменты и технологии мы для этого использовали и почему. Какие подводные камни вылезали, и какие возникали проблемы.
Разработка Windows 8 приложений глазами WPF/Silverlight программистаDenis Tsvettsih
Презентация к докладу «Разработка Windows 8 приложений глазами WPF/Silverlight программиста» с десятой конференции dotnetconf (Челябинск, 19 апреля 2015)
http://dotnetconf.ru/materialy/windows8
«Как я научился не волноваться и полюбил Android-MVP», Никита Бартишок, ABBYYMail.ru Group
Доклад о подходе к разработке Android-приложений с использованием MVP и Clean Architecture. Никита рассмотрит преимущества этого подхода перед традиционным, уделит отдельное внимание вопросам сохранения состояния в Android-MVP, а также особенностям взаимодействия между V и P.
Vue.js и его брат-близнец Vue-server.js / Андрей Солодовников (НГС)Ontico
Современный Веб всё больше стремится к динамичным, похожим на приложения, сайтам.
Оперативно строить быстрый и динамичный интерфейс на проекте N1.RU нам помогает Vue.js.
Однако, как и многие современные библиотеки и фреймворки, Vue.js не умеет рендериться на сервере.
При этом иметь такую возможность бывает полезно по нескольким причинам: начиная от вопросов SEO и заканчивая красотой загрузки страницы.
Чтобы реализовать такую возможность для Vue.js мы создали его дополнение — Vue-server.js.
Я расскажу о том, что умеет Vue.js, что у нашего дополнения "под капотом", почему мы выбрали такой путь и как, вообще, всё это работает. А ещё попробую дать критическую оценку проделанной работе.
55+1 прием для улучшения Javascript-кода / Татьяна Бабич (Simbirsoft)Ontico
В докладе будут рассмотрены приемы, практики и «фишки», которые полезно использовать для создания любого Frontend-приложения.
Мы поговорим об организации модульности и компонентов на примере приложений с Angular, React и Polymer. Обсудим, как использовать особенности JavaScript, и рассмотрим особые случаи, когда фреймворки действительно приходят на помощь.
Доклад о подходе к отслеживанию потоков данных, формирующих окружение, в котором пользователь решает свои задачи.
На примере реализации для конкретного фреймворка будет озвучена идея, как сделать инструмент для отслеживания изменений данных на странице приложения для вашего технологического стека.
Целевая аудитория
Разработчики крупных web-приложений, регулярно сталкивающиеся с проблемой, как уследить за изменением большого количества данных, формирующих интерфейс пользователя, решающих задачу эффективно разобраться с потоками данных для устранения неполадок приложения.
Человеческий организм устроен сложно. Если с ним что-то не так, то для диагностики используют магнитно-резонансный томограф.
Большие одностраничные приложения тоже устроены сложно. Чтобы их починить или обвесить новым функционалом, требуется вникнуть в их устройство. Для этого нередко приходится засучивать рукава и с головой погружаться в самую глубь проекта. И немалая часть проблем связана именно с бизнес логикой и потоками данных. Но что если у нас будет возможность проникнуть в структуру данных, способ увидеть связи между ними и отслеживать то, как они влияют друг на друга? Такой способ, чтобы не требовалось вскрытия скальпелем - все как с МРТ.
В докладе речь пойдет о собственных разработках в этой области.
Радости и гадости регрессионного тестирования вёрстки / Алексей Малейков (HTM...Ontico
Совместно с университетом ИТМО мы запустили курс, посвященный основам HTML и CSS. Уже на момент регистрации на этот курс записалось более 12 тысяч студентов. Перед нами стояла задача разработать систему, которая будет автоматически проверять итоговые проекты на соответствие заранее подготовленному макету. В качестве основной техники для проверки было выбрано регрессионное тестирование.
В каждом проекте мы проверяли разметку, сетку и стилевое оформление не только страницы целиком, но и отдельных блоков. Одной из главных проблем был поиск этих самых блоков, так как о том, какой будет верстка студентов, мы не знали ничего — ни какие теги они использовали, ни какие классы и идентификаторы были задействованы. Имели только общее представление о структуре.
В докладе я расскажу, от чего мы отталкивались при построении этой системы, как мы разбирали и анализировали проекты. Какие инструменты и технологии мы для этого использовали и почему. Какие подводные камни вылезали, и какие возникали проблемы.
Разработка Windows 8 приложений глазами WPF/Silverlight программистаDenis Tsvettsih
Презентация к докладу «Разработка Windows 8 приложений глазами WPF/Silverlight программиста» с десятой конференции dotnetconf (Челябинск, 19 апреля 2015)
http://dotnetconf.ru/materialy/windows8
Roslyn API: SyntaxTree vs CodeDom, SemanticModel vs ReflectionDenis Tsvettsih
Презентация к докладу «Roslyn API: SyntaxTree vs CodeDom, SemanticModel vs Reflection» с конференции .NEXT SPb 2015 (Санкт-Петербург, 5 июня 2015)
http://spb2015.dotnext.ru/#cvetkih_talk
Lee J.C., Gutell R.R., and Russell R. (2006).
The UAA/GAN internal loop motif: a new RNA structural element that forms a cross-strand AAA stack and long-range tertiary interactions.
Journal of Molecular Biology, 360(5):978-988.
GOLIN / DIGITAL & SOCIAL MEDIA EXCELLENCE / HONG KONGZaheer Nooruddin
Digital and Social Media Strategy Excellence at Golin Hong Kong - an integrated communications and marketing agency with a worldwide network. Contact: Zaheer Nooruddin, Head of Digital Innovation, Asia at znooruddin@golin.com
HREFLANG for International SEO: Lessons from 3,000 ImplementationsErudite
In 2012 we pioneered the use of hreflang sitemaps within the SEO industry, and in being first found there was a lack of tools and process... so we made our own! Now our hreflang sitemap generator has contributed to our supporting or working directly on over 3,000 unique implementations globally. Here's a few tips on what we learned along the way.
MVVM в WinForms – DevExpress Way (теория и практика)GoSharp
Из доклада вы узнаете о применении популярного паттерна MVVM для упрощения и ускорения процесса разработки desktop-приложений.
Будут рассмотрены общие проблемы этого паттерна и решения которые мы предлагаем в нашем кроссплатформенном MVVM фреймворке. Упор будет сделан на практические аспекты и техники в условиях использования платформы WinForms и контролов от DevExpress.
Вопросы, возникающие при использовании MVC, и их решение при помощи VIPER.
1. Проблемы, решаемые VIPER-ом. История появления.
2. Структура VIPER-модуля
3. Сервисы
4. Data flow
5. Навигация
6. Вложенные модули
7. Data flow между модулями
8. Кодогенерация. Vipergen
'The best practices' by KONSTANTIN KULAKSYZ at OdessaJS'2020OdessaJS Conf
How to develop web applications using Vue.js and implement best practices from the first day of development. Consider practical recommendations for using Vue.js, based on personal experience, thoughtful reading of documentation and analysis of best practices suggested by other developers. During the talk, you will learn what you can implement today in your development practice to make your web applications on Vue.js more productive and the development process more efficient.
Сегодня многие фреймворки, такие как Prism или Autofac, позволяют разработчику организовать модульную структуру приложения. При этом часто бывает непонятно, для чего ещё нужны модули, кроме как для пресловутой "красоты архитектуры".
В рамках доклада я расскажу о том, какие существуют подходы к организации модульной структуры, в каких фреймворках они реализованы и для решения каких задач дает преимущество каждый подход.
Мир мобильных телефонов очень сильно изменил нашу жизнь. В наше время невозможно представить современного человека, без этого чудо устройства. На рынке появляется все больше устройств и приложений. И чтобы удобнее пользоваться этими приложениями пользователи выбирают “умные” телефоны, или как их еще принято называть смартфоны. В своем докладе я хочу поделиться своим опытом автоматизации приложений под Android и iOS. Я расскажу о том, какие инструменты автоматизации я использовал. Поговорим о недостатках этих инструментов и какие из них стоит использовать у себя на проекте.
"Погружение в Robolectric" Дмитрий Костырев (Avito)
Разработка WPF приложений в стиле ViewModel First
1. Разработка WPF приложений
в стиле ViewModel First
Денис Цветцих
АстроСофт
http://www.astrosoft.ru/
11-я конференция .NET разработчиков
31 октября 2015
dotnetconf.ru
2. 2
Почему это актуально
• WPF все ещё жив
• MVVM – тема множества докладов и статей
• Множество разных реализаций
• от MVVM.Light
• до Prism с мануалом на 250 страниц
3. 3
В чем проблема?
Много разных реализаций MVVM
• Непонятно, чем они отличаются
• Непонятно, какую из них использовать и
в каких случаях
4. 4
Почему я здесь
• Накоплен интересный опыт участия в WPF
проектах
• Есть опыт, связанный с фреймворками:
• Использование сторонних
• Доработка сторонних
• Изобретение своего MVVM фреймворка
5. 5
Опрос
• Кто собирается написать WPF приложение?
• Кто при этом использовал какие-нибудь
MVVM библиотеки/фреймворки?
• Кто их вас изобрел свой собственный
MVVM велосипед фреймворк?
6. 6
О чем мы поговорим?
• Что такое MVVM?
• Какими бывают подходы к его реализации?
• Как отличаются организация CompositeUI и
дочерних окон в разных подходах?
• Какой подход лучше использовать?
• Где найти реализацию этого подхода?
• Рекомендации на основе нашего опыта
8. 8
Что со всем этим делать?
Как решать типовые задачи?
• CompositeUI (MasterDetail форма)
• Навигация (дочерние окна)
9. 9
Нам нужен MVVM фреймворк!
Бывает 2 типов:
• ViewFirst
• ViewModelFirst
Это не разные реализации паттерна MVVM
Это разные подходы к решению типовых задач с
использованием MVVM
16. 16
UserListViewModel
public class UserListViewModel : ViewModel
{
private User _selectedUser;
public IEnumerable<User> Users { get; } // инициализация
public User SelectedUser
{
get { return _selectedUser; }
set
{
_selectedUser = value;
OnPropertyChanged();
}
}
}
18. 18
Вопрос
Как сделать так, чтобы
UserListViewModel.SelectedUser
синхронизировалось с
UserDetailsViewModel.User?
Ответ в стиле ViewFirst – MessageBus
20. 20
MessageBus
public class MessageBus
{
public static MessageBus Instance = new MessageBus();
public event EventHandler<UserChangedEventArgs> SelectedUserChanged;
public void OnSelectedUserChanged(User user)
{
SelectedUserChanged?.Invoke(this, new UserChangedEventArgs(user));
}
}
public class UserChangedEventArgs : EventArgs
{
public UserChangedEventArgs(User user)
{
User = user;
}
public User User { get; }
}
21. 21
UserListViewModel
public class UserListViewModel : ViewModel
{
public User SelectedUser
{
get { return _selectedUser; }
set
{
_selectedUser = value;
OnPropertyChanged();
MessageBus.Instance.OnSelectedUserChanged(value);
}
}
}
26. 26
Убираем MessageBus
public class UserListViewModel : ViewModel
{
public User SelectedUser
{
get { return _selectedUser; }
set
{
_selectedUser = value;
OnPropertyChanged();
MessageBus.Instance.OnSelectedUserChanged(value);
}
}
}
27. 27
Убираем MessageBus
public class UserDetailsViewModel : ViewModel
{
public UserDetailsViewModel()
{
MessageBus.Instance.SelectedUserChanged +=
(s, e) => User = e.User;
}
}
28. 28
Вопрос
Как сделать так, чтобы
UserListViewModel.SelectedUser
синхронизировалось с
UserDetailsViewModel.User?
Ответ в стиле ViewModelFirst – нам нужна
родительская ViewModel
29. 29
MainWindowViewModel
public class MainWindowViewModel : ViewModel
{
public UserDetailsViewModel UserDetailsViewModel { get; private set; }
public UserListViewModel UserListViewModel { get; private set; }
public void Initialize()
{
UserListViewModel.PropertyChanged += (s, e) =>
{
if (e.PropertyName == "SelectedUser")
UserDetailsViewModel.User = UserListViewModel.SelectedUser;
};
}
}
33. 33
ViewFirst: показать новый элемент
Дочернее окно, новый таб:
Navigation.Show<ViewModel>(Value);
или
Navigation.Show("View", Value);
Аналогично вебу: http://address.ru/?arg=value
ViewFirst предлагает в WPF организовать навигацию
аналогично веб-приложению
34. 34
ViewModelFirst: показать новый элемент
var vm = Navigation.Get<ViewModel>();
vm.Arg = Value;
vm.Show();
Аналогично окну WPF:
var wnd = new Window();
wnd.Arg1 = Value1;
wnd.Show();
35. 35
ViewFirst vs ViewModelFirst
ViewFirst ViewModelFirst
Создать View Создать ViewModel
Создать ViewModel Инициализировать ViewModel
Инициализировать ViewModel Создать View
View.DataContext = ViewModel View.DataContext = ViewModel
38. 38
ChildViewModel
public abstract class ChildViewModel : ViewModel, IChildViewModel
{
[Dependency]
public IChildViewModelManager ChildViewModelManager { private get; set; }
public bool IsClosed { get; private set; } // уже закрыли или нет?
protected void Close()
{
if (IsClosed) throw new InvalidOperationException(“closed");
IsClosed = true;
ChildViewModelManager.Close(this);
}
public void Show()
{
ChildViewModelManager.Show(this);
}
}
39. 39
ChildViewModelManager
public class ChildViewModelManager : IChildViewModelManager
{
// открытые окна
private readonly Dictionary<Type, Window> _openedWindows
= new Dictionary<Type, Window>();
// по типу ViewModel возвращает View
[Dependency]
public IViewTypeResolver ViewTypeResolver
{ private get; set; }
}
40. 40
ChildViewModelManager: Show
private void Show(IChildViewModel viewModel)
{
// получить тип окна, которое будем открывать
var windowType = ViewTypeResolver.
ResolveViewType(viewModel.GetType());
// создать экземпляр окна
var window =
(Window)Activator.CreateInstance(windowType);
// запомнить, какое окно открываем
_openedWindows.Add(viewModel.GetType(), window);
window.DataContext = viewModel;
// показать окно
window.Show();
}
41. 41
ChildViewModelManager: Close
public void Close(IChildViewModel viewModel)
{
// какое окно закрываем
var window = _openedWindows[viewModel.GetType()];
// убираем из списка открытых
_openedWindows.Remove(viewModel.GetType());
// закрываем
Application.Current.Dispatcher.BeginInvoke(
new Action(() => window.Close()), null);
}
42. 42
ChildWindow
public abstract class ChildWindow : Window
{
protected override void OnClosing(CancelEventArgs e)
{
base.OnClosing(e);
var viewModel = (ChildViewModel)DataContext;
// если ViewModel на находится в состоянии «Закрыто»
if (!viewModel.IsClosed)
{
e.Cancel = true; // не закрываем окно
// запрашиваем изменение состояния ViewModel
viewModel.Close();
}
}
}
43. 43
Особенности ViewModelFirst
Достоинства
• Позволяет реализовать CompositeUI
• Не требует реализации MessageBus
• Взаимодействие ViewModel более очевидное
• Нет MessageBus – нет его использования не
по назначению
• Позволяет удобно реализовать
поддержку дочерних окон
Недостатки
• Не имеет вендорской поддержки
44. 44
Наш рецепт
• ViewModelFirst
• Свой велосипед
• Mugen MVVM Toolkit
• IoC контейнер
• ReactiveUI (ограничено)
• ReactiveCommand
• ObservableForProperty
• Отдельная сборка для ViewModel
45. 45
Материалы по ViewModelFirst
Материалы доклада на GitHub:
https://github.com/denis-tsv/ViewFirst-vs-ViewModelFirst
Курс «Методология синхронной разработки
приложений в Microsoft Visual Studio 2010»
www.intuit.ru/studies/courses/2322/622/info
Mugen MVVM Toolkit
http://habrahabr.ru/post/236745/
Рассказать что было много WPF проектов, было набито много шишек, использованы чужие MVVM. Доработаны чужие, изобретены свои.
Есть опыт, которым хочется поделиться.
История про красноярский и новгородский офис