NGRome Conf MMXXI Online 9th July 2021

Duration: 2h

Requirements

• JavaScript: basics
• EcmaScript2015: classes, arrow function
• TypeScript: types, interfaces, access modifiers, decorators
• Angular: basics

General Information performance

• user perception of loading time
  • Optimistic updates
  • correct loading indicators
  • application shell
• tools
• monitoring of router change state
• what can be faster?

Network performance

• hosting optimisation
• bundle size
• Tree-shaking
• Tree-shakeable providers
• router lazy loading and preloading strategies
• SSR: Universal & Scully
• Service Workers: offline mode, cache content, cache http calls

Runtime Optimizations

• Understanding Zonejs
  • runOutsideAngular
  • life without ngZone
  • Coalescing event change detections { ngZoneEventCoalescing: true }
• Change Detection: onPush, markForCheck, detach/reattach
• pure pipes and memorize
• big lists optimisation: Trackby and VirtualScroll
• WebWorkers for complex coputations
• Memory leaks: detection, RxJS, optimisation technics

In this workshop we will create a Fullstack GraphQL app starting from the Server and building our way up to the client! We will cover everything you need to successfully adopt GraphQL across your stack from client to backend including tooling and best practices. 

You will learn how to build and design a GraphQL Server starting by defining the GraphQL Schema using types and relations. Moving to the client side, we will create a simple client to demonstrate common usage. As we implement the different features we will introduce GraphQL query syntax including queries, mutations, alias, fragments and directives. At this point we will review how client and server communicate, what tooling is available to track usage and improve performance and how to add authorisation and authentication. Finally we will focus on designing real-time features and sharing best practices to improve performance and leverage scalability.

Duration: 2h

Topics we will cover:

• GraphQL Introduction
• Building a GraphQL Server
• Designing a GraphQL Schema
• Building a GraphQL Client using queries and mutations
• Common practices: error handling and pagination
• Adding authentication and authorisation
• Adding real-time with subscriptions

Requirements:

• Comfortable using Angular and JavaScript
• Basic knowldege of Node
• HTML and CSS

Who is the target audience?

Angular Developers looking to learn the basics of the GraphQL stack