Using KendoUI for SPA Applications Learning & Development Telerik School Academy

 Kendo MVVM  Views and ViewModels  Kendo Router  Defining routes  Routes with parameters  Creating SPA apps with KendoUI  Creating Views and ViewModels  Defining routes

Just a recap

 KendoUI has a powerful MVVM framework  Views – kendo.View  ViewModels – kendo.observable  Kendo Views Layout var layout = new kendo.Layout('…'), viewModel = kendo.observable({ viewModel = kendo.observable({ title: 'Welcome to the Online video player' title: 'Welcome to the Online video player' }), }), view = new kendo.View('…', { model: viewModel}); view = new kendo.View('…', { model: viewModel});layout.render('#root'); layout.showIn('#view', view);

Live Demo

The creation of fake pages

 Routing is the way to create different pages in SPA apps  The pages are not real pages, but look like real  Different pages have different hash (#) suffix  Instead of the url is  Why use routes?  Routes present better end-user experience  The copy&paste of an ULR works  The end-user has history  Etc…

 The router supports routing in KendoUI apps  Initialized with new kendo.Router()  Routes are added with.route(string, callback)  Each route has a function callback, that is executed when the route is reached  Executed with.start() var router = new kendo.Router(); router.route('/', showHome); router.route('/home', showHome); router.route('/about', showAbout); router.start();

Live Demo

форум програмиране, форум уеб дизайн курсове и уроци по програмиране, уеб дизайн – безплатно програмиране за деца – безплатни курсове и уроци безплатен SEO курс - оптимизация за търсачки уроци по уеб дизайн, HTML, CSS, JavaScript, Photoshop уроци по програмиране и уеб дизайн за ученици ASP.NET MVC курс – HTML, SQL, C#,.NET, ASP.NET MVC безплатен курс "Разработка на софтуер в cloud среда" BG Coder - онлайн състезателна система - online judge курсове и уроци по програмиране, книги – безплатно от Наков безплатен курс "Качествен програмен код" алго академия – състезателно програмиране, състезания ASP.NET курс - уеб програмиране, бази данни, C#,.NET, ASP.NET курсове и уроци по програмиране – Телерик академия курс мобилни приложения с iPhone, Android, WP7, PhoneGap free C# book, безплатна книга C#, книга Java, книга C# Николай Костов - блог за програмиране

1. Create a SPA application for chatting  Use a SaaS cloud provider  Both Telerik Backend Services or Parse will do  Users can register/login  The username is unique  All users chat in a single channel  All users see the all messages

1. (cont.) Create a SPA application for chatting  Implement it using KendoUI MVVM and Router  The application should have three different pages (routes)  Home page  Show information about the Web app  Login/register page  Login/register user  Chat page  Show messages from other users  Send new message