Community Code: The SenchaCon App

•

0 likes•959 views

Jay Garcia will discuss how Modus Create constructed the SenchaCon mobile application using Sencha Touch 2. Through this presentation, take you through deep dives into the SenchaCon app codebase, as well as discuss many of the decisions they made along the way. Many technical details about Sencha Touch itself will be peppered through this walkthrough.

Technology Business

The SenchaCon app team

Development Design

Wednesday, November 2, 11

The SenchaCon app supporters

Web API Sencha Engineers

Wednesday, November 2, 11

The SenchaCon app

• Uses Sencha Touch 2

• 35 classes

• Takes advantage of Ext Loader (debug)

• Implements MVC (extensively!)

Wednesday, November 2, 11

The SenchaCon app

• Leverages Local Storage

• Uses app cache (ofﬂine storage)

• Implements ComponentQuery

• Not a single component with a static id!

Wednesday, November 2, 11

The SenchaCon app

Wednesday, November 2, 11

The SenchaCon app
• Highly optimized custom
components

• Reusability kept in mind
throughout code base

• Code developed with
miniﬁcation in mind

• Miniﬁed with Sencha SDK Tools
2.0

Wednesday, November 2, 11

Breaking the ice
• Develop individual views & models in their own
sandbox

• Views should work independently

• One HTML ﬁle per view for testing

• Test ﬁred events via Webkit console

• Allowed for us to divide and conquer

Wednesday, November 2, 11

Pass #1
• Initial development done in Sencha touch 1.0

• Used MVC

• Router

• History

• Best practices for extending components

• Paved the way for the Sencha Touch 2.0 migration

Wednesday, November 2, 11

Enter Sencha Touch 2!

Wednesday, November 2, 11

Migrate to the new class system

Wednesday, November 2, 11

Sencha Touch 2.0 migration

• Change the namespace to match the new MVC pattern

• Views

• Models

• Controllers

• Utilities

Wednesday, November 2, 11

Quick MVC thoughts

• Controller is at the center
Controller
• Controller subscribes to events
from the view

• Controller updates the model
View Model
• Model drives the view

Wednesday, November 2, 11

Quick MVC thoughts
App
Controller
• Application extends Controller!

• Controllers can talk to the
application via events or direct Controller
methods calls

View Model

Wednesday, November 2, 11

Multi-controller application
App
Controller

Controller Controller

View Model View Model

Wednesday, November 2, 11

The class architecture

Data
Util
Manager App

Schedule Sessions Session Speakers Speaker
Viewport NavBar
Panel List Detail List Detail

Schedule Sessions Session Speakers Speaker
Viewport NavBar Session Speaker
Panel List Detail List Detail

Wednesday, November 2, 11

Building the Viewport
App

Viewport

Viewport History
store

Wednesday, November 2, 11

Building navigation

App

Viewport NavBar

Viewport History NavBar
store

Wednesday, November 2, 11

Adding the schedule panel
App

Schedule
Viewport NavBar
Panel

History Schedule
Viewport NavBar
store Panel

Wednesday, November 2, 11

Adding the sessions list
App

Schedule Sessions
Viewport NavBar
Panel List

Schedule Sessions
Viewport NavBar Session
Panel List

Wednesday, November 2, 11

Adding the schedule panel

App

Schedule Sessions Session
Viewport NavBar
Panel List Detail

Schedule Sessions Session
Viewport NavBar Session
Panel List Detail

Wednesday, November 2, 11

A highly optimized view!

Wednesday, November 2, 11

Adding session speaker details

App

Schedule Sessions Session Speaker
Viewport NavBar
Panel List Detail Detail

Schedule Sessions Session Speaker
Viewport NavBar Session Speaker
Panel List Detail Detail

Wednesday, November 2, 11

Adding session speaker details

Wednesday, November 2, 11

Adding session speaker details

App

Schedule Sessions Session Speakers Speaker
Viewport NavBar
Panel List Detail List Detail

Schedule Sessions Session Speakers Speaker
Viewport NavBar Session Speaker
Panel List Detail List Detail

Wednesday, November 2, 11

Questions?
• Contact info:

• twitter:

• @moduscreate
Thank you!
• @_jdg

• jay@moduscreate.com

Wednesday, November 2, 11

The document discusses the TouchForums app, which was originally created by Sencha to be a forum browser and support portal tool for Sencha forums that could be used on phones and tablets. It describes how the app was built using Sencha Touch with an MVC architecture and outlines some challenges in development like working with the vBulletin mobile API and unit testing. Future plans include migrating to Sencha Touch 2.0 and rewriting the API using Node.JS.

BlackBerry WebWorks APIs

Sencha

The document discusses the BlackBerry web platform and tools for developing web applications for BlackBerry devices. It provides an overview of BlackBerry's support for web standards and frameworks for building web apps with native app features. It also describes tools for testing apps in the browser using Ripple and on actual devices using WebInspector, and the process for building, signing and submitting apps to BlackBerry AppWorld.

Documenting with JSDuck

Sencha

Documentation is an important part of any project, especially when there is an API to be exposed to other developers. JSDuck is an open source ExtJS 4 project developed at Sencha to help Javascript developers generate beautiful documentation viewable in a web browser. Based loosely on JavaDoc, JSDuck parses documentation embedded in the source files of your project enabling you to keep your docs close to your code. In this session we will cover the many features of JSDuck and by the end you will know how to create API documentation, guides, videos and examples for your own project or application.

Community Code: SCircles

Sencha

Custom Components, Theming, Drag-and-drop - Building a Social Network Engine with Ext JS 4 This showcase will demonstrate that Ext JS is not only suitable for internal corporate applications, but can be used for powerful consumer servies as well. ‘SCircles’ is an application that looks so different to normal Ext JS apps that it is hard to recognize it uses Sencha technology at all - and will serve as a demonstration of custom theming, custom components, and the use of the framework’s drag-and-drop capabilities. Tobias Uhlig works with the Sencha Frameworks on a fulltime basis since he joined the Sencha Community at the very beginning in May 2007. As a passionate User Interface Engineer for over a decade, besides building amazing Rich Internet Applications, he has specialized in creating Custom Components and Extensions on top of the Sencha Frameworks as well as Theming and Performance Improvements. After working on one of the worlds largest Ext JS Applications at Refined Labs for 1.5 years, he is now joining Sencha to bring in his experience and knowledge. Tobias founded the Sencha Usergroup in Munich, Germany

PHP Server-side Breakout

Sencha

Understand the approaches and best practices for integrating client side applications - both desktop and mobile - with various server-side technologies. Grgur Grisogono, Modus Create, is a JavaScript lover focused on Ext JS and Sencha Touch. Exploiting the passion as a Sr JavaScript developer at Modus Create. Grgur has architected and developed market leading national, regional, and local development web apps used by 6 governments, 600+ municipalities, and government departments in several European countries. This year, he has organized Sourc{, a hugely successful developer oriented mobile and desktop web app conference, sponsored by Sencha.

Introducing Sencha Touch 2

Sencha

This document introduces Sencha Touch 2, which focuses on improving performance. It summarizes that Sencha Touch 2 startup speeds and layout performance are significantly faster than previous versions and competitors' mobile browsers. It also provides a smoother user experience through improvements like flicker-free animations and scrolling fluidity. Sencha Touch 2 aims to iterate and innovate key features, refine and refactor code, and ensure consistency and quality through code reviews and other processes.

Ext JS 4: Advanced Expert Techniques

Sencha

This document summarizes a presentation titled "Ext JS 4: Advanced Expert Techniques" given by Rich Waters at SenchaCon on October 25th, 2011. The presentation covered the component lifecycle in Ext JS 4, including initialization, rendering, and destruction. It also provided code examples for optimizing custom components using techniques like event delegation, render templates, and utility functions.

In this session, you’ll learn about the top 10 security risks in web applications, and, with demos, how REST backends and rich JavaScript applications map to these risks. Current and upcoming countermeasures include new HTTP headers, double submit cookies, and escaping input client-side to avoid DOM-based XSS. We’ll look at each of these, discuss the techniques you’ll want to add to your developer toolbox, and how to build reasonable security processes into an agile team environment.

Java Server-side Breakout

Sencha

Understand the approaches and best practices for integrating client side applications - both desktop and mobile - with various server-side technologies. Fabian Urban (27) is an IT Consultant at FORTIS IT-Services GmbH in Hamburg, Germany. He is a web development expert for both - client and server side technologies. During his professional career he designed and implemented interfaces and automated services to share data between affiliate partners and CRM and billing solutions at the telecommunications industry. As a passionate rich internet application developer he has not only implemented web technology solutions, but has always tried to validate and optimize available frameworks to the limit of possibilities. Besides organizing and holding sessions at the Ext JS User Group Hamburg, he will talk about modern RIAs at the SenchaCon 2011.

Community Code: Xero

Sencha

Craig Walker is Chief Technology Officer and co-founder of small business accounting software provider Xero. Xero has over 50,000 customers in over 100 countries and Craig has recently relocated to San Francisco to start the US based office. Craig currently leads Xero’s software development technology strategy. He has a morbid obsession with JavaScript and not having to use any other language for development (much to the amusement of his colleagues). Craig and Xero have been keen evangelists of Sencha products having utilized Sencha JavaScript libraries across Xero’s entire product line. Craig’s most recent fun project was building Xero Touch, a Sencha Touch-based mobile version of Xero released for the web and into the Apple App Store (and soon to be launched for Android).

Introducing Designer 2

Sencha

Sencha and Spring (Spring 2GX 2013)

Sencha

Introducing Ext GWT 3.0

Sencha

Migrating from Ext GWT 2.x to 3.0

Sencha

WebGL Fundamentals

Sencha

3D Graphics have come to the browser and this represents a new world of possibilities. WebGL has a reputation for a high entry barrier, but fortunately there are already some frameworks out there making things simpler. We’ll cover some of the WebGL basics and show you what to look for in a framework for 3D graphics in the browser. You’ll also meet PhiloGL, a WebGL framework focused on data visualization, creative coding and game development from Sencha Labs. Prepare to watch cool 3D demos!

Hacking Webkit & Its JavaScript Engines

Sencha

WebKit, along with its JavaScript engines, is not a magical black box. We will show you the internal of various WebKit building blocks (10,000-foot overview) and how they work together. In particular, learn also the simple steps on how to experiment with WebKit with your own and leverage WebKit functionalities to find the performance problems, track the network issues, automate effective smoke tests, and implement per-pixel correctness tests. In addition, armed with a little extra knowledge about JavaScript engines, you will be ready to improve both the quality and performance of your JavaScript code.

Community Code: Pega Mobile

Sencha

SenchaCon 2016: Building Enterprise Ext JS Apps with Mavenized Sencha Cmd - F...

Sencha

SenchaCon 2016: Building a Faceted Catalog of Video Game Assets Using Ext JS ...

Sencha

At Ubisoft Technology Group, we've created a platform for video game production to share game assets, in-game footage, and animations across the entire company. Ease of search and good UX were incredibly important for an audience of artists and creative types. This is where the Web and a powerful JavaScript framework came in; we chose Ext JS for its robustness and scalability. In this session, we'll showcase two different applications and dive into the technical aspects of designing the UI for a faceted search based on Elasticsearch.

SenchaCon 2016: Oracle Forms Modernisation - Owen Pagan

Sencha

4Morphis is a tool that can automatically convert legacy Oracle Forms applications into modern web and mobile applications using ExtJS. It works by parsing the Oracle Forms XML files, constructing equivalent UI components in ExtJS, and generating code to link the UI events to backend database logic. The conversion moves the application to a three-tier architecture with the ExtJS UI, a Java persistence layer, and the existing Oracle database. 4Morphis handles the entire conversion process to output a developer-ready Sencha application that maintains the core functionality of the original Forms application.

SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...

Sencha

Demand for accessible applications is on the rise, and many enterprise software developers are faced with the need to meet accessibility requirements in their products. To address this daunting problem, University of Washington and Innotas collaborated with Sencha to make the Ext JS framework more accessible and share the benefits with all Sencha customers. In this session, we'll detail the steps we took, the pain we experienced, the roadblocks we overcame, and the spectacular results we achieved.

SenchaCon 2016: Developing and Delivering Quality Code, Frequently - Neil Manvar

Sencha

This document discusses developing and delivering quality code through continuous integration, continuous delivery, and automated testing. It recommends: - Implementing continuous integration by having developers commit code changes frequently and merging them into a shared codebase, with CI tools running automated tests on each change. - Practicing continuous delivery by making code deployable at any time using techniques like feature toggles and deploying to staging. - Leveraging pull request builds that run automated tests against a branch before code is merged to main to catch issues early and provide developer feedback. - Having QA focus on enabling scaling of testing through improved test coverage and automation, rather than "acting and reacting" to fix broken builds. This allows for

SenchaCon 2016: Creating a Flexible and Usable Industry Specific Solution - D...

Sencha

Come hear how we used agile development and Sencha tools to meet our design requirements, to create a system that is highly configurable, flexible, and exceeds the expectations of our customers. Learn how to use an adaptive/responsive design to be able to support two very different types of users, with a single application, and using the same set of libraries. Most importantly, learn how to create a system that even your most important and demanding users will find value and actually want to use. By assembling some of the best programmers and DBA developers in the world, we have been able to create a best-in-class, fully functional, scalable and highly configurable system, while maintaining an amazingly easy-to-use interface.

SenchaCon 2016: Handling Undo-Redo in Sencha Applications - Nickolay Platonov

Sencha

MVC In Depth, part 1

Sencha

A two-part journey through the recommended patterns for building complex, Model-View-Controller-centric applications with both Ext JS 4 and Sencha Touch. Ed Spencer leads the development of Ext JS and supporting projects. An expert with Ext JS and JavaScript in general and with several years experience with traditional server side frameworks, he has broad experience in API design and delivery. His passion is in crafting beautiful code that supports the world-class Sencha product line.

Performance Optimization for Ext GWT 3.0

Sencha

Extreme Testing with Selenium - @hugs at Jenkins User Conference 2011

hugs

Viewers also liked

SenchaCon Closing Session by Michael Mullany

Sencha

Community Code: Macadamian

Sencha

Application Security for RIAs

Sencha

Java Server-side Breakout

Sencha

Community Code: Xero

Sencha

Introducing Designer 2

Sencha

Sencha and Spring (Spring 2GX 2013)

Sencha

Introducing Ext GWT 3.0

Sencha

Migrating from Ext GWT 2.x to 3.0

Sencha

WebGL Fundamentals

Sencha

Hacking Webkit & Its JavaScript Engines

Sencha

Community Code: Pega Mobile

Sencha

SenchaCon 2016: Building Enterprise Ext JS Apps with Mavenized Sencha Cmd - F...

Sencha

SenchaCon 2016: Building a Faceted Catalog of Video Game Assets Using Ext JS ...

Sencha

SenchaCon 2016: Oracle Forms Modernisation - Owen Pagan

Sencha

SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...

Sencha

SenchaCon 2016: Developing and Delivering Quality Code, Frequently - Neil Manvar

Sencha

SenchaCon 2016: Creating a Flexible and Usable Industry Specific Solution - D...

Sencha

SenchaCon 2016: Handling Undo-Redo in Sencha Applications - Nickolay Platonov

Sencha

Viewers also liked (19)

SenchaCon Closing Session by Michael Mullany

Community Code: Macadamian

Application Security for RIAs

Java Server-side Breakout

Community Code: Xero

Introducing Designer 2

Sencha and Spring (Spring 2GX 2013)

Introducing Ext GWT 3.0

Migrating from Ext GWT 2.x to 3.0

WebGL Fundamentals

Hacking Webkit & Its JavaScript Engines

Community Code: Pega Mobile

SenchaCon 2016: Building Enterprise Ext JS Apps with Mavenized Sencha Cmd - F...

SenchaCon 2016: Building a Faceted Catalog of Video Game Assets Using Ext JS ...

SenchaCon 2016: Oracle Forms Modernisation - Owen Pagan

SenchaCon 2016: Accessibility, Teamwork & Ext JS: A Customer Success Story - ...

SenchaCon 2016: Developing and Delivering Quality Code, Frequently - Neil Manvar

SenchaCon 2016: Creating a Flexible and Usable Industry Specific Solution - D...

SenchaCon 2016: Handling Undo-Redo in Sencha Applications - Nickolay Platonov

Similar to Community Code: The SenchaCon App

MVC In Depth, part 1

Sencha

Performance Optimization for Ext GWT 3.0

Sencha

Extreme Testing with Selenium - @hugs at Jenkins User Conference 2011

hugs

Lwuit developer guide

mahassine_med_amine

This document provides an overview and guide to using the Lightweight UI Toolkit (LWUIT) library. LWUIT is a Java GUI toolkit that aims to provide a portable, lightweight framework for building user interfaces across devices. The document covers key aspects of using LWUIT including common widgets, layout managers, themes, resources, transitions and animations, logging, authoring custom components, and portability/performance considerations. It is intended to help developers learn how to utilize LWUIT's features and APIs to build cross-platform Java applications with graphical user interfaces.

Caridy patino - node-js

StarTech Conference

The document discusses Node.js and how it can be used to build server-side applications using JavaScript. Some key points include: - Node.js allows for non-blocking, asynchronous programming which improves performance compared to traditional blocking I/O. - It uses a single thread with event loops to handle multiple connections concurrently without blocking. - JavaScript is a good choice as it is the language of the web and supports features like closures that are useful for asynchronous programming. - Node.js has gained popularity due to its ability to build high performance web servers using a non-blocking approach that is accessible to programmers without expertise in asynchronous programming.

Conquistando el Servidor con Node.JS

Caridy Patino

The document discusses Node.js and how it can be used to build server-side applications using JavaScript. Some key points include: - Node.js allows for non-blocking asynchronous programming which improves performance over traditional blocking servers. - It uses a single thread event loop model that handles all I/O asynchronously, avoiding context switching. - JavaScript is the language of the web and Node.js allows using JavaScript on the server side for building real-time applications. - Node.js has an active community and growing ecosystem of packages on npm that can be easily installed and used in applications.

Recipes to develop a reactive and cloud-ready application using Scala and Akka

Codemotion

by Roberto Bentivoglio - Non-functional requirements have become increasingly challenging during the last years. Nowadays we expect at least that every application provide fast response time and almost 100% uptime. Reactive Applications is a set of principles and architectural patterns allowing to build event-driven, scalable, resilient and responsive systems. One of the most interesting technologies to create Reactive Applications is the Typesafe stack and, in particular, the Akka toolkit. During this talk I will introduce it, showing how develop a reactive and cloud-ready Scala web application.

Jenkins User Conference - Twitter4J, Jenkins and regression

Yusuke Yamamoto

This document summarizes a presentation given by Yusuke Yamamoto at the 2011 Jenkins User Conference in San Francisco. Yamamoto discussed how he developed the open-source Twitter4J library using test-driven development and encountered a regression when the library's tests were not properly maintained. He emphasized the importance of having enough test coverage, carefully refactoring tests, and addressing failed tests to prevent regressions.

Backbone.js

OpenFest team

Hardware Acceleration on Mobile, Ariya Hidayat & Jarred Nicholls

Sencha

GPU acceleration on mobile browsers, if it is leveraged correctly, can lead to a smooth and fluid applications, thus improving the user experience. There has been a lot of mentions and best practices of hardware acceleration these days, although so far it has been pretty general and hasn’t provided much technical direction apart from simple magical advice such as “use translate3d”. This talk sheds some more light on browser interactions with the GPU and explain what happens behind the scenes, covering the topic of acceleration of primitive drawing, the use of tiled backing store, and composited layer. Knowing the actual machinery behind hardware acceleration, you will be in the position to plan your strategy to improve the performance of your web application.

Similar to Community Code: The SenchaCon App (10)

MVC In Depth, part 1

Performance Optimization for Ext GWT 3.0

Extreme Testing with Selenium - @hugs at Jenkins User Conference 2011

Lwuit developer guide

Caridy patino - node-js

Conquistando el Servidor con Node.JS

Recipes to develop a reactive and cloud-ready application using Scala and Akka

Jenkins User Conference - Twitter4J, Jenkins and regression

Backbone.js

Hardware Acceleration on Mobile, Ariya Hidayat & Jarred Nicholls

More from Sencha

Breathe New Life into Your Existing JavaScript Applications with Web Components

Sencha

You probably have an existing JavaScript application using components that you love, maybe a grid, some graphs, etc. Perhaps today you use Angular and your company is thinking about moving to React, or Vue, and with new frameworks appearing every week, who knows what is next. How do you bring along those great components you have been using? That is where Web Components fits in! In this session we will look at some popular enterprise components and their usage in Angular and React. Then we will look at the Web Components spec to use those existing components you know and love in any framework - including no framework at all!

Ext JS 6.6 Highlights

Sencha

Our latest release, Sencha Ext JS 6.6, includes several major enhancements as well as support for npm packaging and open tooling for exceptionally easy workflows that every JavaScript developer is familiar with. With open tooling, Ext JS developers now have powerful tooling to rapidly generate, build and update Ext JS applications. Read the blog post to learn more: https://www.sencha.com/blog/announcing-sencha-ext-js-6-6-with-open-tooling-ga/

Sencha Roadshow 2017: BufferedStore Internals featuring eyeworkers interactiv...

Sencha

Die Sicht auf große Datenmengen läßt sich in ExtJS auf zwei Wege darstellen – entweder durch Paging oder durch scrollen. Während beide Konzepte das selbe Ziel verfolgen, bringt die Implementierung eines Buffered Stores in ExtJS einige Hürden mit sich, die UI-Konzepte wie dynamisches Löschen oder Hinzufügen von Datensätzen verhindern. Diese Session gibt einen Einblick in den Aufbau eines BufferedStores und zeigt Ansätze, wie man mehr Dynamik in Grids bringen kann, die diesen Store verwenden.

Sencha Roadshow 2017: Build Progressive Web Apps with Ext JS and Cmd

Sencha

Learn how to use Ext JS and Cmd to deliver Progressive Web Applications to deliver the best of both web and mobile app experiences. Web apps can be found easily on the internet and every user is guaranteed access to the same and latest version of the application. Plus, mobile app capabilities, such as offline support and optimizing access to the underlying network using service workers, take the user experience to a whole new level.

Sencha Roadshow 2017: Best Practices for Implementing Continuous Web App Testing

Sencha

Sencha Roadshow 2017: What's New in Sencha Test

Sencha

Sencha Roadshow 2017: Sencha Upgrades - The Good. The Bad. The Ugly - Eva Luc...

Sencha

Sencha Roadshow 2017: Modernizing the Ext JS Class System and Tooling

Sencha

JavaScript is advancing and ES2015 (formerly ES6) is the foundation of its future. Sencha is committed to delivering cutting-edge technology for your applications, and supporting the evolution of JavaScript is a central part of that commitment. The expansive feature set of ES2015 formally enables coding paradigms: modules to better organize your code, classes to cleanly declare reusable units of functionality, and so much more. In this session, you'll see how Ext JS is embracing these new language and toolset features, and how they will expand your development horizons.

Sencha Roadshow 2017: Sencha Best Practices: Coworkee App

Sencha

Sencha Roadshow 2017: Mobile First or Desktop First

Sencha

Sencha Roadshow 2017: Innovations in Ext JS 6.5 and Beyond

Sencha

Leveraging React and GraphQL to Create a Performant, Scalable Data Grid

Sencha

User interfaces often utilize components such as grids and tables to help users browse and understand data. Today’s large data sets require sophisticated capabilities to ensure users can effectively comprehend data while remaining flexible and responsive. Building this functionality is time consuming, has integration and maintenance risks, and worst of all, distracts developers from the task at hand -- actually building the app. View the slides from our latest webinar to learn how the web’s most powerful data grid and GraphQL can help you deliver advanced functionality with minimal effort. View the recording here: https://www.brighttalk.com/webcast/11505/276417

Learn Key Insights from The State of Web Application Testing Research Report

Sencha

In a recent study by Dimensional Research of 1,011 development and QA professionals, almost every survey respondent cited that application quality is important, with 84% believing it is very or critically important. Despite this, findings revealed that 94% of teams still face challenges when it comes to conducting adequate QA. View the presentation to learn why organizations must prioritize automated testing and QA practices to deliver high-quality applications and increase customer satisfaction.

Introducing ExtReact: Adding Powerful Sencha Components to React Apps

Sencha

Learn about Sencha’s newest release, ExtReact: the most comprehensive set of components for React apps. Now you can quickly and easily add any of our 115+ professionally tested and supported components including grid, tree grid, pivot grid, charts, D3 visualizations, trees, calendar, buttons, menus and more to your React applications. With ExtReact, all of the components are designed to work together seamlessly which eliminates time-consuming integration work and reduces ongoing maintenance burdens. View this presentation to learn how to: - Build data-intensive, cross-platform web apps leveraging Sencha components and React. - Build immersive user engagement using layouts and adaptive design features. - Leverage material design and other themes to save time and effort. Modify or extend themes without writing a single line of code.

SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato

Sencha

SenchaCon 2016: Add Magic to Your Ext JS Apps with D3 Visualizations - Vitaly...

Sencha

Ext JS provides easy-to-use charting components that satisfy common needs, but sometimes you want to deliver an exceptional, unique user experience. This presentation will discuss how Ext JS leverages the popular and extremely powerful D3 library to create sophisticated, data-driven visualizations. This functionality helps your users understand the story behind their data, so they can make informed decisions.

SenchaCon 2016: LinkRest - Modern RESTful API Framework for Ext JS Apps - Rou...

Sencha

LinkRest is an active project commissioned and open sourced by NHL under Apache 2.0 license. It was conceived specifically as the server-side counterpart to Ext JS, so it natively supports Ext JS rest proxy, including CRUD, grouping, sorting, filtering, and more. In this session, we'll review Ext JS protocol support. You'll also see extensions that allow the client to safely query the server for specific data and shape the response. We'll cover advanced features, including security, constraints, idempotent methods, and metadata service. We'll show demos and try to allow time for Q&A.

SenchaCon 2016: Expect the Unexpected - Dealing with Errors in Web Apps

Sencha

This document discusses handling errors in web applications. It begins by explaining what JavaScript errors are and how they are typically invisible to users. It then discusses how to catch errors using window.onerror or addEventListener and logging errors to help debug issues. Ideal error handling involves logging detailed error information to a database and notifying developers. The document wishes for more context around errors, like function arguments or AJAX requests. It introduces a new error logging and monitoring tool that provides detailed user environment data, function arguments, screenshots, and a timeline to help developers debug issues more easily.

Ext JS Architecture Best Practices - Mitchell Simeons

Sencha

SenchaCon 2016: Mobile First? Desktop First? Or Should you Think Universal Ap...

Sencha

Developers are building mobile first, and then making progressive enhancements so the app is available on desktop. Should you be taking either a mobile or desktop first approach, or thinking about Universal Apps to deliver the right user experiences. This approach maximizes the shareability of code across these experiences. In this presentation, we’ll explore case studies that show the benefits of each approach.

More from Sencha (20)

Breathe New Life into Your Existing JavaScript Applications with Web Components

Ext JS 6.6 Highlights

Sencha Roadshow 2017: BufferedStore Internals featuring eyeworkers interactiv...

Sencha Roadshow 2017: Build Progressive Web Apps with Ext JS and Cmd

Sencha Roadshow 2017: Best Practices for Implementing Continuous Web App Testing

Sencha Roadshow 2017: What's New in Sencha Test

Sencha Roadshow 2017: Sencha Upgrades - The Good. The Bad. The Ugly - Eva Luc...

Sencha Roadshow 2017: Modernizing the Ext JS Class System and Tooling

Sencha Roadshow 2017: Sencha Best Practices: Coworkee App

Sencha Roadshow 2017: Mobile First or Desktop First

Sencha Roadshow 2017: Innovations in Ext JS 6.5 and Beyond

Leveraging React and GraphQL to Create a Performant, Scalable Data Grid

Learn Key Insights from The State of Web Application Testing Research Report

Introducing ExtReact: Adding Powerful Sencha Components to React Apps

SenchaCon 2016: Keynote Presentation - Art Landro, Gautam Agrawal, Mark Brocato

SenchaCon 2016: Add Magic to Your Ext JS Apps with D3 Visualizations - Vitaly...

SenchaCon 2016: LinkRest - Modern RESTful API Framework for Ext JS Apps - Rou...

SenchaCon 2016: Expect the Unexpected - Dealing with Errors in Web Apps

Ext JS Architecture Best Practices - Mitchell Simeons

SenchaCon 2016: Mobile First? Desktop First? Or Should you Think Universal Ap...

Recently uploaded

Serial Arm Control in Real Time Presentation

tolgahangng

How to use Firebase Data Connect For Flutter

Daiki Mogmet Ito

Microsoft - Power Platform_G.Aspiotis.pdf

Uni Systems S.M.S.A.

Your One-Stop Shop for Python Success: Top 10 US Python Development Providers

akankshawande

TrustArc Webinar - 2024 Global Privacy Survey

TrustArc

How does your privacy program stack up against your peers? What challenges are privacy teams tackling and prioritizing in 2024? In the fifth annual Global Privacy Benchmarks Survey, we asked over 1,800 global privacy professionals and business executives to share their perspectives on the current state of privacy inside and outside of their organizations. This year’s report focused on emerging areas of importance for privacy and compliance professionals, including considerations and implications of Artificial Intelligence (AI) technologies, building brand trust, and different approaches for achieving higher privacy competence scores. See how organizational priorities and strategic approaches to data security and privacy are evolving around the globe. This webinar will review: - The top 10 privacy insights from the fifth annual Global Privacy Benchmarks Survey - The top challenges for privacy leaders, practitioners, and organizations in 2024 - Key themes to consider in developing and maintaining your privacy program

CAKE: Sharing Slices of Confidential Data on Blockchain

Claudio Di Ciccio

Presented at the CAiSE 2024 Forum, Intelligent Information Systems, June 6th, Limassol, Cyprus. Synopsis: Cooperative information systems typically involve various entities in a collaborative process within a distributed environment. Blockchain technology offers a mechanism for automating such processes, even when only partial trust exists among participants. The data stored on the blockchain is replicated across all nodes in the network, ensuring accessibility to all participants. While this aspect facilitates traceability, integrity, and persistence, it poses challenges for adopting public blockchains in enterprise settings due to confidentiality issues. In this paper, we present a software tool named Control Access via Key Encryption (CAKE), designed to ensure data confidentiality in scenarios involving public blockchains. After outlining its core components and functionalities, we showcase the application of CAKE in the context of a real-world cyber-security project within the logistics domain. Paper: https://doi.org/10.1007/978-3-031-61000-4_16

Best 20 SEO Techniques To Improve Website Visibility In SERP

Pixlogix Infotech

AI-Powered Food Delivery Transforming App Development in Saudi Arabia.pdf

Techgropse Pvt.Ltd.

In this blog post, we'll delve into the intersection of AI and app development in Saudi Arabia, focusing on the food delivery sector. We'll explore how AI is revolutionizing the way Saudi consumers order food, how restaurants manage their operations, and how delivery partners navigate the bustling streets of cities like Riyadh, Jeddah, and Dammam. Through real-world case studies, we'll showcase how leading Saudi food delivery apps are leveraging AI to redefine convenience, personalization, and efficiency.

Generating privacy-protected synthetic data using Secludy and Milvus

Zilliz

During this demo, the founders of Secludy will demonstrate how their system utilizes Milvus to store and manipulate embeddings for generating privacy-protected synthetic data. Their approach not only maintains the confidentiality of the original data but also enhances the utility and scalability of LLMs under privacy constraints. Attendees, including machine learning engineers, data scientists, and data managers, will witness first-hand how Secludy's integration with Milvus empowers organizations to harness the power of LLMs securely and efficiently.

Taking AI to the Next Level in Manufacturing.pdf

ssuserfac0301

Read Taking AI to the Next Level in Manufacturing to gain insights on AI adoption in the manufacturing industry, such as: 1. How quickly AI is being implemented in manufacturing. 2. Which barriers stand in the way of AI adoption. 3. How data quality and governance form the backbone of AI. 4. Organizational processes and structures that may inhibit effective AI adoption. 6. Ideas and approaches to help build your organization's AI strategy.

Programming Foundation Models with DSPy - Meetup Slides

Zilliz

Artificial Intelligence for XMLDevelopment

Octavian Nadolu

In the rapidly evolving landscape of technologies, XML continues to play a vital role in structuring, storing, and transporting data across diverse systems. The recent advancements in artificial intelligence (AI) present new methodologies for enhancing XML development workflows, introducing efficiency, automation, and intelligent capabilities. This presentation will outline the scope and perspective of utilizing AI in XML development. The potential benefits and the possible pitfalls will be highlighted, providing a balanced view of the subject. We will explore the capabilities of AI in understanding XML markup languages and autonomously creating structured XML content. Additionally, we will examine the capacity of AI to enrich plain text with appropriate XML markup. Practical examples and methodological guidelines will be provided to elucidate how AI can be effectively prompted to interpret and generate accurate XML markup. Further emphasis will be placed on the role of AI in developing XSLT, or schemas such as XSD and Schematron. We will address the techniques and strategies adopted to create prompts for generating code, explaining code, or refactoring the code, and the results achieved. The discussion will extend to how AI can be used to transform XML content. In particular, the focus will be on the use of AI XPath extension functions in XSLT, Schematron, Schematron Quick Fixes, or for XML content refactoring. The presentation aims to deliver a comprehensive overview of AI usage in XML development, providing attendees with the necessary knowledge to make informed decisions. Whether you’re at the early stages of adopting AI or considering integrating it in advanced XML development, this presentation will cover all levels of expertise. By highlighting the potential advantages and challenges of integrating AI with XML development tools and languages, the presentation seeks to inspire thoughtful conversation around the future of XML development. We’ll not only delve into the technical aspects of AI-powered XML development but also discuss practical implications and possible future directions.

Choosing The Best AWS Service For Your Website + API.pptx

Brandon Minnick, MBA

Have you ever been confused by the myriad of choices offered by AWS for hosting a website or an API? Lambda, Elastic Beanstalk, Lightsail, Amplify, S3 (and more!) can each host websites + APIs. But which one should we choose? Which one is cheapest? Which one is fastest? Which one will scale to meet our needs? Join me in this session as we dive into each AWS hosting service to determine which one is best for your scenario and explain why!

みなさんこんにちはこれ何文字まで入るの？40文字以下不可とか本当に意味わからないけどこれ限界文字数書いてないからマジでやばい文字数いけるんじゃないの？えこ...

名前です男

June Patch Tuesday

Ivanti

Ivanti’s Patch Tuesday breakdown goes beyond patching your applications and brings you the intelligence and guidance needed to prioritize where to focus your attention first. Catch early analysis on our Ivanti blog, then join industry expert Chris Goettl for the Patch Tuesday Webinar Event. There we’ll do a deep dive into each of the bulletins and give guidance on the risks associated with the newly-identified vulnerabilities.

HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU

panagenda

Webinar Recording: https://www.panagenda.com/webinars/hcl-notes-und-domino-lizenzkostenreduzierung-in-der-welt-von-dlau/ DLAU und die Lizenzen nach dem CCB- und CCX-Modell sind für viele in der HCL-Community seit letztem Jahr ein heißes Thema. Als Notes- oder Domino-Kunde haben Sie vielleicht mit unerwartet hohen Benutzerzahlen und Lizenzgebühren zu kämpfen. Sie fragen sich vielleicht, wie diese neue Art der Lizenzierung funktioniert und welchen Nutzen sie Ihnen bringt. Vor allem wollen Sie sicherlich Ihr Budget einhalten und Kosten sparen, wo immer möglich. Das verstehen wir und wir möchten Ihnen dabei helfen! Wir erklären Ihnen, wie Sie häufige Konfigurationsprobleme lösen können, die dazu führen können, dass mehr Benutzer gezählt werden als nötig, und wie Sie überflüssige oder ungenutzte Konten identifizieren und entfernen können, um Geld zu sparen. Es gibt auch einige Ansätze, die zu unnötigen Ausgaben führen können, z. B. wenn ein Personendokument anstelle eines Mail-Ins für geteilte Mailboxen verwendet wird. Wir zeigen Ihnen solche Fälle und deren Lösungen. Und natürlich erklären wir Ihnen das neue Lizenzmodell. Nehmen Sie an diesem Webinar teil, bei dem HCL-Ambassador Marc Thomas und Gastredner Franz Walder Ihnen diese neue Welt näherbringen. Es vermittelt Ihnen die Tools und das Know-how, um den Überblick zu bewahren. Sie werden in der Lage sein, Ihre Kosten durch eine optimierte Domino-Konfiguration zu reduzieren und auch in Zukunft gering zu halten. Diese Themen werden behandelt - Reduzierung der Lizenzkosten durch Auffinden und Beheben von Fehlkonfigurationen und überflüssigen Konten - Wie funktionieren CCB- und CCX-Lizenzen wirklich? - Verstehen des DLAU-Tools und wie man es am besten nutzt - Tipps für häufige Problembereiche, wie z. B. Team-Postfächer, Funktions-/Testbenutzer usw. - Praxisbeispiele und Best Practices zum sofortigen Umsetzen

HCL Notes and Domino License Cost Reduction in the World of DLAU

panagenda

Webinar Recording: https://www.panagenda.com/webinars/hcl-notes-and-domino-license-cost-reduction-in-the-world-of-dlau/ The introduction of DLAU and the CCB & CCX licensing model caused quite a stir in the HCL community. As a Notes and Domino customer, you may have faced challenges with unexpected user counts and license costs. You probably have questions on how this new licensing approach works and how to benefit from it. Most importantly, you likely have budget constraints and want to save money where possible. Don’t worry, we can help with all of this! We’ll show you how to fix common misconfigurations that cause higher-than-expected user counts, and how to identify accounts which you can deactivate to save money. There are also frequent patterns that can cause unnecessary cost, like using a person document instead of a mail-in for shared mailboxes. We’ll provide examples and solutions for those as well. And naturally we’ll explain the new licensing model. Join HCL Ambassador Marc Thomas in this webinar with a special guest appearance from Franz Walder. It will give you the tools and know-how to stay on top of what is going on with Domino licensing. You will be able lower your cost through an optimized configuration and keep it low going forward. These topics will be covered - Reducing license cost by finding and fixing misconfigurations and superfluous accounts - How do CCB and CCX licenses really work? - Understanding the DLAU tool and how to best utilize it - Tips for common problem areas, like team mailboxes, functional/test users, etc - Practical examples and best practices to implement right away

“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...

Edge AI and Vision Alliance

For the full video of this presentation, please visit: https://www.edge-ai-vision.com/2024/06/building-and-scaling-ai-applications-with-the-nx-ai-manager-a-presentation-from-network-optix/ Robin van Emden, Senior Director of Data Science at Network Optix, presents the “Building and Scaling AI Applications with the Nx AI Manager,” tutorial at the May 2024 Embedded Vision Summit. In this presentation, van Emden covers the basics of scaling edge AI solutions using the Nx tool kit. He emphasizes the process of developing AI models and deploying them globally. He also showcases the conversion of AI models and the creation of effective edge AI pipelines, with a focus on pre-processing, model conversion, selecting the appropriate inference engine for the target hardware and post-processing. van Emden shows how Nx can simplify the developer’s life and facilitate a rapid transition from concept to production-ready applications.He provides valuable insights into developing scalable and efficient edge AI solutions, with a strong focus on practical implementation.

Building Production Ready Search Pipelines with Spark and Milvus

Zilliz

20240607 QFM018 Elixir Reading List May 2024

Matthew Sinclair

Recently uploaded (20)

Serial Arm Control in Real Time Presentation

How to use Firebase Data Connect For Flutter

Microsoft - Power Platform_G.Aspiotis.pdf

Your One-Stop Shop for Python Success: Top 10 US Python Development Providers

TrustArc Webinar - 2024 Global Privacy Survey

CAKE: Sharing Slices of Confidential Data on Blockchain

Best 20 SEO Techniques To Improve Website Visibility In SERP

AI-Powered Food Delivery Transforming App Development in Saudi Arabia.pdf

Generating privacy-protected synthetic data using Secludy and Milvus

Taking AI to the Next Level in Manufacturing.pdf

Programming Foundation Models with DSPy - Meetup Slides

Artificial Intelligence for XMLDevelopment

Choosing The Best AWS Service For Your Website + API.pptx

June Patch Tuesday

HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU

HCL Notes and Domino License Cost Reduction in the World of DLAU

“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...

Building Production Ready Search Pipelines with Spark and Milvus

20240607 QFM018 Elixir Reading List May 2024

Community Code: The SenchaCon App

1. Wednesday, November 2, 11

2. About us Wednesday, November 2, 11

3. The SenchaCon app team Development Design Wednesday, November 2, 11

4. The SenchaCon app supporters Web API Sencha Engineers Wednesday, November 2, 11

5. The SenchaCon app • Uses Sencha Touch 2 • 35 classes • Takes advantage of Ext Loader (debug) • Implements MVC (extensively!) Wednesday, November 2, 11

6. The SenchaCon app • Leverages Local Storage • Uses app cache (ofﬂine storage) • Implements ComponentQuery • Not a single component with a static id! Wednesday, November 2, 11

7. The SenchaCon app Wednesday, November 2, 11

8. The SenchaCon app • Highly optimized custom components • Reusability kept in mind throughout code base • Code developed with miniﬁcation in mind • Miniﬁed with Sencha SDK Tools 2.0 Wednesday, November 2, 11

9. Breaking the ice • Develop individual views & models in their own sandbox • Views should work independently • One HTML ﬁle per view for testing • Test ﬁred events via Webkit console • Allowed for us to divide and conquer Wednesday, November 2, 11

10. Pass #1 • Initial development done in Sencha touch 1.0 • Used MVC • Router • History • Best practices for extending components • Paved the way for the Sencha Touch 2.0 migration Wednesday, November 2, 11

11. Wednesday, November 2, 11

12. Enter Sencha Touch 2! Wednesday, November 2, 11

13. Migrate to the new class system Wednesday, November 2, 11

14. Sencha Touch 2.0 migration • Change the namespace to match the new MVC pattern • Views • Models • Controllers • Utilities Wednesday, November 2, 11

15. Quick MVC thoughts • Controller is at the center Controller • Controller subscribes to events from the view • Controller updates the model View Model • Model drives the view Wednesday, November 2, 11

16. Quick MVC thoughts App Controller • Application extends Controller! • Controllers can talk to the application via events or direct Controller methods calls View Model Wednesday, November 2, 11

17. Multi-controller application App Controller Controller Controller View Model View Model Wednesday, November 2, 11

18. The class architecture Data Util Manager App Schedule Sessions Session Speakers Speaker Viewport NavBar Panel List Detail List Detail Schedule Sessions Session Speakers Speaker Viewport NavBar Session Speaker Panel List Detail List Detail Wednesday, November 2, 11

19. Wednesday, November 2, 11

20. Wednesday, November 2, 11

21. Wednesday, November 2, 11

22. Building the Viewport App Viewport Viewport History store Wednesday, November 2, 11

23. Wednesday, November 2, 11

24. Wednesday, November 2, 11

25. Wednesday, November 2, 11

26. Wednesday, November 2, 11

27. Building navigation App Viewport NavBar Viewport History NavBar store Wednesday, November 2, 11

28. Wednesday, November 2, 11

29. Wednesday, November 2, 11

30. Adding the schedule panel App Schedule Viewport NavBar Panel History Schedule Viewport NavBar store Panel Wednesday, November 2, 11

31. Wednesday, November 2, 11

32. Wednesday, November 2, 11

33. Wednesday, November 2, 11

34. Adding the sessions list App Schedule Sessions Viewport NavBar Panel List Schedule Sessions Viewport NavBar Session Panel List Wednesday, November 2, 11

35. Wednesday, November 2, 11

36. Wednesday, November 2, 11

37. Wednesday, November 2, 11

38. Adding the schedule panel App Schedule Sessions Session Viewport NavBar Panel List Detail Schedule Sessions Session Viewport NavBar Session Panel List Detail Wednesday, November 2, 11

39. A highly optimized view! Wednesday, November 2, 11

40. Wednesday, November 2, 11

41. Wednesday, November 2, 11

42. Wednesday, November 2, 11

43. Wednesday, November 2, 11

44. Adding session speaker details App Schedule Sessions Session Speaker Viewport NavBar Panel List Detail Detail Schedule Sessions Session Speaker Viewport NavBar Session Speaker Panel List Detail Detail Wednesday, November 2, 11

45. Adding session speaker details Wednesday, November 2, 11

46. Wednesday, November 2, 11

47. Wednesday, November 2, 11

48. Adding session speaker details App Schedule Sessions Session Speakers Speaker Viewport NavBar Panel List Detail List Detail Schedule Sessions Session Speakers Speaker Viewport NavBar Session Speaker Panel List Detail List Detail Wednesday, November 2, 11

49. Questions? • Contact info: • twitter: • @moduscreate Thank you! • @_jdg • jay@moduscreate.com Wednesday, November 2, 11

Community Code: The SenchaCon App

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (19)

Similar to Community Code: The SenchaCon App

Similar to Community Code: The SenchaCon App (10)

More from Sencha

More from Sencha (20)

Recently uploaded

Recently uploaded (20)

Community Code: The SenchaCon App