How to build web applications with webstandards only (=no migrations). CI / CD, tooling and shipping included.
Plain web platform is perfectly suitable to build responsive and lean applications quickly without any dependencies. Component reusability and application structure are covered by WebComponents -- another standard.
This workshop is based on "SPA with web standards only" workshop and explains how to quickly build sustainable applications and websites.
Attendance at Web Essentials, Webstandards online training or adequate knowledge / experience.
We will build from scratch, without any external dependencies, a web application running in a browser (Single Page Application / Progressive Web Application) and cover:
- Future-proof design (no migrations)
- build setup and targeting legacy browsers
- choosing effectively WebStandards for application development
- CI / CD integration
- Structuring complex applications with Web Components
- Implementing token-based authentication, authorization and backend integration
- Brief WebComponents introduction (shadow DOM, ES 6 templates, ES 6 imports, lazy loading, polyfills)
- Building Reusable custom elements (web components)
- Complex state management, view coordination, complex data flows and MVC-like design
- Navigation and routing
- Component API and interaction with existing Angular, ReactJS, Vue (...) applications
- Using 3rd-party components, like grids / tables, charts or date pickers with SPAs
- When it gets complex: data binding, events and extensibility
- Asynchronous processing with
async, Promises and WebWorkers
- Implementing offline capabilities with Service Workers
- Mobile devices and building native-like applications
- Implementing native notifications and web push
- Styling with CSS 3.0
- From Progressive Web Apps to Desktop Applicatons
- Offline applications
- Service Workers
- Native installers
- Effective End To End testing (E2E)
- Authentication and authorization
- Performance optimizations, profiling, debugging and tooling
- Useful HTML 5 APIs, copy and paste, drag and drop, persistence, sharing, payments, geo location (...)
- Performance and debugging tools, hacks and workarounds
- With or without frameworks. ReactJS, Angular, EmberJS, Polymer, Vue.js vs. Vanilla ES6+
- Integration with Java EE backend, REST services, WebSockets and SSE events
In this workshop I would like to explain the most significant features with working code and prepared examples. As a reference, you will get a GIT repository with all snippets and solutions, as well as prepared sample applications.
Environment requirements / prerequisites.
I/we will spend 90% of the time in code.
Feel free to contact me / register via email: workshops[-AT-] adam-bien.com