Machine Learning - Angular can Learn, too!

A year ago, the much-awaited TensorflowJs hit the web. In this presentation, it hits Angular as well. Tensorflow is a “an open source machine learning framework” by Google, and it is finally available to run in our browsers, too.
In this presentation we will go through the core concepts of machine learning, and see how these are put into practice with TensorflowJs. We will briefly discuss use-cases and see how machine learning (and now you and your browser) can help solve everyday problems (such as image recognition, computer vision etc). There will be a live demo, of course, of Angular and TensorflowJs implementation, where we will see how these two work together, and what we can make of this union.
At the end of this presentation, the participants will want to rush home and get their hands dirty with the future of web, that is the magic of JavaScript enabled machine learning.

Exploring the Lighthouse

In this session will explore the awesome Lighthouse tool and its cool features. We will start from bootstrapping a simple web application, and we will see how we can reach better scores in each of the five audits of Lighthouse, “PWA”, “Performance”, “Accessibility”, “Best Practices” and “SEO” in our web applications.
We’ll finetune our web app, picking and adding code here and there to improve these numbers. We’ll talk about the concepts of the manifest, the serviceworker, the app responsiveness, no javascript environments, and how these are evaluated by the Lighthouse tool.
The purpose of the talk will be to showcase how the Lighthouse tool can help us build better apps for the web, and the mobile web. And the accessible web. And the web where connectivity is poor and you end up playing T-Rex runner.

Web Maps - Putting the M in Angular web apps!

More and more web applications using Angular today need a kind of map, either to just display their location, or visualize their data. These data can be from points/locations of services/places/etc, or a user input, to more complex visuals like heatmaps or paths. These visualizations can easily be achieved with OpenLayers open source library, or even the Google Maps JS API. However, the integration with Angular and the use of its tools is not always straightforward. In this presentation I will show examples of how to integrate OpenLayers and Google Maps easily into your Angular application without the use of any external libraries. Part of the presentation will also show some techniques for visualising spatial data on these maps.

March 1st 2018, 30 mins, ngVikings 2018

From Buildings to Software - Paving the Way to Construction

As an architectural engineer by training, and working as a web dev for the past couple of years, Katerina will explain how architecture has defined the way she designs web apps and pages and how Angular has supported her in organising content.

"A web page for me is like the facade of a house. From day one into web development, I looked at apps as if setting down plans for a new building. The process, like the process of building from the ground an establishment. I want to talk about scaffolding. I want to extend on designing the building blocks, the bricks made out of components. And as the construction is evolving, how materials fill in the empty spaces, making them consistent."

November 7th 2017, 20mins, Angular Connect 2017

Websockets turning physical motion into virtual motion!

You know how you sometimes have to develop something that is not solving an everyday problem, still it is fun to make, and even more fun to use? Well, this talk is just around such an occasion!
Long story short, we will be using physical motion applied into virtual motion, in order to move and manipulate an object (or graphics) in our browser!
The “how” is exciting! We will see how to develop a simple application using WebSockets, Angular and a plain WebSocket client/server node.js server. The magic of this application will be that, once connected from our phone, we will be sending device data from our phone to the browser (using the brand new device event APIs capturing device acceleration, orientation, motion).
Tools that are going to be used will be the WebSockets API, Angular, RxJS and a little Node.js server. RxJS and its observable sequences will help us subscribe and listen to our incoming messages, firing events in the process.
We will have live coding, of course. We will also have interactivity (users connected to the same network will be able to move graphics with their phone, too). And we will have some fun!

Joining the Angular Comminity

Tips, experience, advice on joining the Angular Community

To be presented at Angular Athens

Angular Real Time Interactions with WebSockets

Using Angular and WebSockets we will be turning physical motion into virtual motion, in order to perform actions in our browser (navigation, event firing, etc). We will see the integration process step-by-step, resulting in a simple web application using WebSockets, Angular and a plain WebSocket client/server node.js server.
Once we launch this application on our phone, it will start sending device motion data from our phone to the browser, using the brand new device event APIs to capture our device’s acceleration, orientation and motion, and our node.js server to perform the transmission. The browser will receive the motion data, and it will translate it into events and actions on the big screen!
Tools that are going to be used are the WebSockets API, Angular, RxJS and a little Node.js server. Observable sequences will help us subscribe and listen to incoming messages, firing events in the process. The presentation will be interactive (users connected to the same network will be able to send data with their phone, too).

Interactive

Physical motion to Virtual motion with WebSockets

Using Angular and WebSockets we will be turning physical motion into virtual motion, in order to perform actions in our browser (navigation, event firing, etc). We will see the integration process step-by-step, resulting in a simple web application using WebSockets, Angular and a plain WebSocket client/server node.js server.
Once we launch this application on our phone, it will start sending device motion data from our phone to the browser, using the brand new device event APIs to capture our device’s acceleration, orientation and motion, and our node.js server to perform the transmission. The browser will receive the motion data, and it will translate it into events and actions on the big screen!
Tools that are going to be used are the WebSockets API, Angular, RxJS and a little Node.js server. Observable sequences will help us subscribe and listen to incoming messages, firing events in the process. The presentation will be interactive (users connected to the same network will be able to send data with their phone, too).

Interactive

Angular - Maps - Users of Apps

Maps, today, are an essential of the internet. Think of any app, and you will realize that it uses a map either to just display a location, or visualize data. Most of these apps, however, also use that map as a user interface, where the user can enter their location and receive corresponding, location based services or suggestions. Take for example car services apps (Uber, Beat), dating apps (Tinder), search-and-discovery apps (Foursquare), or any social app (Facebook, Twitter). In this presentation we will see how to create an Angular app that uses the Google Maps JS API and Firebase to match users together according to their chosen location! We will learn about Angular integration with Google Maps, user input on Google Maps and Angular and data display on Google Maps (the user generated data). The presentation will be interactive and engaging, since participants will be prompted to input their location and see the results live on the big screen. We will see code and examples and discuss implementation techniques.

Angular real time interactions with WebSockets

Using Angular and WebSockets we will be turning physical motion into virtual motion, in order to perform actions in our browser (navigation, event firing, etc). We will see the integration process step-by-step, resulting in a simple web application using WebSockets, Angular and a plain WebSocket client/server node.js server.
Once we launch this application on our phone, it will start sending device motion data from our phone to the browser, using the brand new device event APIs to capture our device’s acceleration, orientation and motion, and our node.js server to perform the transmission. The browser will receive the motion data, and it will translate it into events and actions on the big screen!
Tools that are going to be used are the WebSockets API, Angular, RxJS and a little Node.js server. Observable sequences will help us subscribe and listen to incoming messages, firing events in the process. The presentation will be interactive (users connected to the same network will be able to send data with their phone, too).

Interactive