State of the Web on a pink ribbon in front of the globe
Frontend

State of the Web 2019: Start here

Lesezeit
4 ​​min

Notice:
This post is older than 5 years – the content might be outdated.

We’re developers working on projects with technology we love every day. We must keep an eye on the ever changing web eco system. New tools and libraries popping up every day. But what’s really important? There’s so much out there and you quickly feel lost in all those framework communities, blogs, social posts and more – So we need some time to get familiar with these new things. inovex spends us time by providing budget to work besides our daily projects to gather and collect new knowledge and try new things to make us and our customers happy. At inovex we love to learn and to share. Sharing is caring.

Today We Continue the Series

We chose some interesting new topics we wanted to dive into and created a compressed, easy-to-read summary with some practical code snippets. To top it off, we discussed the topics in a podcast where you can get additional information about the posts from the authors. We hope you enjoy!

Klicken Sie auf den unteren Button, um den Inhalt von w.soundcloud.com zu laden.

Inhalt laden

PHA+PGlmcmFtZSB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxNjYiIHNjcm9sbGluZz0ibm8iIGZyYW1lYm9yZGVyPSJubyIgYWxsb3c9ImF1dG9wbGF5IiBzcmM9Imh0dHBzOi8vdy5zb3VuZGNsb3VkLmNvbS9wbGF5ZXIvP3VybD1odHRwcyUzQS8vYXBpLnNvdW5kY2xvdWQuY29tL3RyYWNrcy81NjcxMTEyMDQmYW1wO2NvbG9yPSUyM2JmZjAyMCZhbXA7YXV0b19wbGF5PWZhbHNlJmFtcDtoaWRlX3JlbGF0ZWQ9dHJ1ZSZhbXA7c2hvd19jb21tZW50cz1mYWxzZSZhbXA7c2hvd191c2VyPXRydWUmYW1wO3Nob3dfcmVwb3N0cz1mYWxzZSZhbXA7c2hvd190ZWFzZXI9dHJ1ZSI+PC9pZnJhbWU+PC9wPg==

The State of the Web January 2019

In this second episode of State of the Web we have a look at CSS Scroll Snap, an upcoming new web standard to enhance user experience without interfering with the scrolling operation directly. It gives you simple CSS selectors to build a snappy user experience your users know from Netflix and other streaming platforms or landing pages. Daniel Eckelt shows us what you can build with it and how you use it.

The second article is all about security. With WebAuthn the Web will get a new standardized API for strong authentication on the web. These days leaks like Collection #1 show us how important it is to use different passwords for each online account or even better 2FA. But wouldn’t it be better to use a more universal way without string based passwords or any second device? Read more about in Sven Lindauer’s article about WebAuthn where he demonstrates how U2F works and which browsers already implement it.

Did you know that there’s an HTML-Dialog-Element? It’s built right into the browser and has all the features you need to build your custom design upon. You’ll never need a 3rd party library when it’s supported in all browses. Besides the element this features gives us focus, backdrop, key stroke handling (using ESC key) and some JavaScript functions to programatically open and close the dialog. Arne Meier shows us how we can use it.

Have you ever set up an environment for visual regression testing? It’s hard. There are so many things you need to wire. Wouldn’t it be better to use a fully-fledged tool that gives you all the things you need to get started? Well, Duc Mai introduces us to BackstopJS. It runs on top of Puppeteer, ChromyJS or CasperJS to screenshot your frontend or parts of your screens to test against every time you make changes to your code. It works best when integrated into your CI pipeline. You’ll instantly get feedback before your changes are reviewed and you can fix things right away when they’re broken. See the introduction Duc gives you and start testing today.

Your Feedback

As this is our second State of the Web we are looking forward to getting some feedback from you. Please feel free to leave your suggestions on how we can improve this series in the future in the comments below. If you like it, share this article on the social platforms you love!

More on Web Development

You might also wanna read up on our portfolio for web development. If you’re on the lookout, here’s a list of job openings.

Hat dir der Beitrag gefallen?

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert