CSS Secrets was a series of talks that were loved by audiences all around the globe and led to Lea’s bestselling book “CSS Secrets”.
The premise is simple: Ten surprising yet practical things you didn’t know you could do in CSS, live-coded in Lea’s trademark interactive presentation style. This third installment of the series will include new juicy secrets related to CSS Variables, grid layout, variable fonts, blending modes, SVG, and many other things.
Prepare to be inspired again as Lea debuts ten all-new feats of advanced CSS wizardry, which will help you understand CSS at a much deeper level.
Traditionally, GraphQL clients were focused on client-server communication and caching, with GraphQL query executor on the server. However, it's also possible to run full GraphQL executor on the client side.
The talk will explore the concept of schema stitching (connecting multiple GraphQL schemas together) from a client-side point of view. Using this approach, developer can merge multiple remote schemas together with a frontend schema. The combined schema is responsible for routing requests to a server and a client-side storage/cache.
The talk will explore both schema stitching implementation and the possible applications. Applications of this approach include prototyping application's GraphQL schema without a server. After prototype stage, the schema can be moved to the server. Another use-case is building frontend-only applications that use multiple public GraphQL APIs.
This talk traces the parallel history of western and eastern typography from handwriting to the internet age, setting the context for how the web is a brand new medium for typesetting. CSS allows us to implement advanced typographic features and multi-directional layouts, that not only benefits internationalization, but opens up a myriad of options for creative and interesting layouts in general as well.
When you need to make a complex and beautiful UI, then you have to find new approaches. In practice, it turns out that complex things are very simple but sometimes not immediately obvious.
I would like to share working methods from my practice. And you will understand how everything can be simple!
Kotlin is much more than a hot new language for Android apps or your server's backend, it is also a fun and efficient way to develop the frontend part of your web-based app. I will demonstrate how to develop a React app (with styled-components, of course!) without ever leaving Kotlin.
React Native is currently a very popular library for writing native applications. It’s super easy to get started with it if you already know React — you can think that you’ve become a mobile developer in less than 15 minutes!
However, while React Native may make it easy for front-end developers to get started with mobile development, it’s severely lacking in comparison to more established and comprehensive languages like Swift or Kotlin. Compared to Swift or Kotlin, React Native seems like it’s from the Stone Ages!
So the question is, should you use React Native in production ? In my talk, I will tell you about the pros and cons of React Native.
When I first heard about the Web Bluetooth API I was so curious, that I could not wait to try it out. So I asked myself: Which Bluetooth device should I buy? Especially if I do not want to through it away after I was finished experimenting with the API.
So obviously a Bluetooth enabled vibrator was a perfect fit. And it came with a serious use case, too: The slogan of the vibrator was "Let him control you", which I found very limiting, so I used the Web Bluetooth API to connect it to the browser, and the Web Audio API, to establish my own slogan: "Let a video control you".
In my lightning talk, you will learn how to use the Web Bluetooth API to connect a Bluetooth enabled device to the browser. Also, you will see what is possible with the Web Audio API, especially when it comes to analyzing spoken words.
With the rise of web-to-native cross-platform solutions like React Native and Electron, we got to witness not only their potential, but also their shortcomings. Thanks to WebAssembly we now have an alternative that uses a different approach, but promises the same results.
In my talk, I’ll share the lessons the join.me team learned over the last few years while creating and maintaining a cross-platform (web included!) C++ codebase, with special attention to management and team-dynamic aspects. You’ll also see how WebAssembly changes the game and, through a bit of live-coding, how easy it is to get started with it.
A year ago an unnamed investor asked me for a consultancy on topic: "If this is possible to mine crypto in browser using GPU?". The talk shares some insights/outcome found during the research and gives an idea of what to expect when mining cryptocurrencies using a pool of browser-based miners.
Organizing a conference means you require a certain amount of technical infrastructure. We developed a custom website and application for React Finland. In this talk, you'll learn how we did it and how to achieve a modern frontend architecture using technologies such as Webpack, React, and GraphQL. You will also gain insight on the non-technical aspects including marketing and sales and see how they align with technology.
Since the mid 90s, developers have struggled to build web applications that can be executed both on the client and the server. And still today, even with Node.js and virtual DOM libraries like React, this can be quite challenging.
In this talk, we'll look at common obstacles and problems that developers face when building this type of web application, including typical performance and security issues. You'll leave the presentation knowing how to build a fast and secure web application that can be rendered on the client and the server.
Writing 3D applications for the browser is possible since some years due to the WebGL API. But since Virtual Reality and Augmented Reality are getting more popular, web developers and designers now have a serious reason to get to know the 3D web, its APIs and design patterns.
In this talk you will learn how to create 3D applications in the browser, using the WebGL and the WebVR API, and popular libraries, like A-Frame and ReactVR. You will also see what is necessary to create a Virtual Reality app that runs on common VR devices, and how to create Augmented Reality applications for Android and iOS phones.
Since 3D user interfaces and interactions in the browser are relatively new for designers and users, there are no established UX design patterns yet, but you will get to know best-practices and see some tips for improving the usability of your 3d application.
The talk ends with my advice on how to create responsible applications, that won’t harm your users – neither physically nor psychologically.
Most of us don't have to think too much about module bundlers in our day jobs. However, module bundlers are all around us, and if you’re a web developer you are probably using module bundlers on a daily basis.
Having a good understanding of how popular tools like Webpack or Browserify work can be extremely helpful. In this talk, I will help you understand how most module bundlers work and show you that they’re not as scary as you might think.
My talk is going to be about Probot — GitHub's framework for creating bots. A bot built with Probot is a NodeJS application that handles GitHub's events. Probot allows us to automate and improve GitHub workflow, extend it with tools that we love as far as we wish.
In my talk, I will show what Probot can do right now and how you can create your own bot.
Parcel is a new web application bundler which doesn’t require a config file whereas in webpack 3, even for a very basic project, we need to configure a `webpack.config` file. So webpack team recently released a new version of webpack (webpack 4) which implements zero config.
I might help in deciding whether one should head over to Webpack 4 or look towards Parcel and what advantages both have.
"Should designers code?" or "Should coders design?" — these 2 eternal questions are being asked for years with no particular answer given.
In order to answer those questions designers and developers have to speak the same language. But what language should it be. UI components and pattern libraries can provide this intermediate abstraction and be a common language for both designers and developers.
During this talk, I'll guide you through some frustrations I've experienced as a designer and as a developer when working on different projects. I'll show how the common UI patterns library can solve some of these problems and improve the overall productivity of the team.
The beast is alive! How do you feel about ASCII-alike CSS Grid layout with polyfluid sizing and ch unit? Do you feel itchy when it comes to building responsive HTML email layouts? What about the brave new world of dynamic static site generators and JAM stack? Have you ever tried to work around nested CSS Custom Properties, untamed 3rd-party scripts, shady service workers, multi-dimensional variable fonts and painfully outdated pattern libraries? Well, let’s bring it on!
If you attended or watched the first season, you better tighten up your seatbelts: it's an entirely different session, with a slightly different cast and a dash of dirty little front-end tricks. Beware: you will not be able to unlearn what you’ll learn in the session! Ah, one more thing, take the techniques with a grain of salt — we do not take responsibility for sleepless nights and nightmares caused by the content of this session.