The best prettier config is no config at all, and I'm about to tell you why
Want typesafe APIs, but don't feel like writing them yourself? I have a trick up my sleeve I want to share.
React server components vinner popularitet og det er avgjørende for komponentbiblioteker å støtte det for å holde tritt. Hvordan støtter du det?
React server components is winning popularity, and it's crucial for component libraries to support it to stay relevant. How do you support it?
Storybook tilbyr en rå, interaktiv playground for å teste ulike props, men det kommer med en pris: med det følger en tvangstrøye av et design. Ved å kombinere React Live og litt strengkonkatenering kan du lage en løsning du har full kontroll over, samtidig som du gir brukerne dine en effektiv måte å få oversikt over en komponents muligheter.
Storybook offers an awesome, interactive playground to test different props, but at a price: with it comes a straitjacket of a design. By combining React Live and some string concatenation, you can create a solution that you have full control over, while giving your users an efficient way to get an overview of a component's capabilities.
Nettsider med animasjon får litt personlighet, og det skal lite til for å oppnå det. Her er en guide til bruk av CSS-transitions.
Do you need help with the Javascript SDK for Application Insights? Look no further! This guide will help you go from zero to hero in no time 📈
Do you need help with setting up a simple custom server in Next.js? This trick will get you a long way!
Hva er egentlig greia med Webpack? I samme åndedrag hører du gjerne “loaders”, “plugins” og annen babbel. Hvilket problem er det Webpack egentlig prøver å løse?
In this article I will show how you can infer the value of a property in any object with generic typescript. This articles assumes you are already familiar with generics in typescript.
Ever wished you chose a slightly different data structure for your structured content? Let's learn how to fix it!
TypeScript is fantastic, but without Json Decoders, your code (probably) isn't type safe.
Template literals (`My name is ${name}`) have existed in JavaScript for a while. There is a good chance that it is your preferred way to concatenate strings in JavaScript. A slightly lesser known sub-feature of this is the tagged template literal (myTag`My name is ${name}`). What is it and why should you care?
Style Dictionary is one of the very best tools I've ever encountered. It's powerful, fun, and great for managing your design tokens!
Have you ever written a form with multiple steps in JavaScript and thought "this isn't very elegant"? I have. Let's take a look at how we can make our forms better with type safety and TypeScript!
Learn how to easily build your own Tool Plugins to customize Sanity.
Everyone that works with development of web pages has to deal with universal design. Accessibility should be considered from the start and it is therefore smart to test with a screen reader during the development. It is often more costly to make an existing project accessible, rather than just doing it right the first time. This fall I have tried to learn how to use VoiceOver on Mac. I want to share with you the most essential parts I have learned and I hope this introduction will help you get started with VoiceOver.
Have you ever inspected an object in your browser's console and stumbled upon the field [[Prototype]] or __proto__. Or maybe you have seen someone use the mystical prototype field on classes, such as String.prototype. Ever wondered what kind of sorcery this prototype is? Great! ️This article will hopefully make things a bit clearer, and make you an advanced prototype wizard. 🧙♂️
From all of us behind javascript.christmas, to all of you: Merry Christmas! We really hope you've enjoyed our advent calendar. For our very last article in this advent calendar, we need your help saving christmas.
When I studied computer science for five years there was a lot of mathematics. Equality was probably the simplest part. After ten years of working, I’ve done a lot of JavaScript. Equality is not the simplest part… Why?
You probably came here to read about something cutting edge in JavaScript, but today we’re going to do a deep dive into one of the fundamental operators of JavaScript, new.
I work on the internal applications in Bekk, including a front page that shows key information about employees and the company. One of the sections shows upcoming birthdays, so you can congratulate your colleagues on their big day. But something was missing. You know, that little extra that tends to light up people’s faces. How about some confetti bursting out the top of your head? 🎉
Ever wanted to implement a search as-you-type? What about transforming something while the user is scrolling. Just add an event listener for this works, but it can really impact the browser performance. Fetching from the server on every keypress isn't just unnecessary, it may also be hard on your server. This can be solved by two functions, debounce and throttle. Let's have a look at the difference between the two and how they can be implemented
After years of disagreements about the long awaited next version of ECMAScript, on December 3, 2009, the 5th edition was finally released. A full 10 years after the previous version. With it came a lot of security improvements, one of which is known as "strict mode".
You’ve done your fair share of JavaScript. You’ve shipped production code for years. You’re definitely no noob, nor a true expert. What’s the next step? How to find a learning path towards JavaScript mastery that actually motivates you to reach the next level? This article presents six alternative routes forward.
Wintertime has always struck me as somewhat offset from the holiday season. The weather gets cold and dark, but snow seems to be in its primetime around January and February, at least here in Oslo. As a result, people around the world may have to resort to simply dreaming of a white Christmas. But regardless of where you live and the level of crystalline precipitation thereabouts, we have the technology to make it snow right now! In your browser at least.
Have you ever struggled with CSS? Have you found it hard to structure a large CSS codebase, even when using methodologies like BEM or OOCSS? Have you tried using CSS-in-JS solutions, but struggled with the setup or lack of typing? Or maybe you've used Tailwind, but find the initial bundle size intimidating, or the tooling to reduce it too complex? Stitches is a new CSS-in-JS library from Modulz and Christian Alfoni, creator of Cerebral and Overmind. It promises "Near-zero runtime, server-side rendering, multi-variant support, and best-in-class developer experience." We'll take a look at what this means, and how Stitches compares to existing CSS-in-JS solutions like Styled Components, Emotion and Material UI.
If you are well-versed in the JavasScript-universe, you probably know that functions are also objects in JavaScript. Everything you can do with regular objects and values, you can do with functions as well. You can pass them as parameters to other functions, declare them as variables or pass them around as you’d like. Since functions can be passed as parameters or returned as an output from another function, this has enabled higher-order functions to be built into the language. In this article I will demonstrate how higher-order functions have allowed me to write readable and more maintainable code with fewer bugs, and how it coincidentally completely removed the need to write for-loops in my code!
Have you ever wondered what the amazing Christmas dinner and the Event Loop in JavaScript have in common? Well, not much. But I will use the preparation of this delicious meal to make the event loop a bit more edible.
Provided I didn't miscount (I am not the Count von Count, so it's quite possible), there are 46 operators in JavaScript which are available in all modern web browsers. Many of them are inevitable (e.g. arithmetical and logical operators), while others are more uncommon. But the list doesn't end there and the family of operators is still growing. Let's have a brief look at the latest additions, and new operators which are just around the corner!
Have you ever wanted to add extra functionality to strings? With tagged template literals you can build useful templates, add logic, or write different languages inside strings. How can that be useful, and how does it even work? Dive into how tagged template literals let us build enhanced strings!
It is time to unleash the christmas spirit hiding behind that noisy fan in your computer. In this article, we will use shaders in WebGL to make animations no one could imagine in JavaScript before.
As a developer, you have surely wondered if the web can do full 3D beyond tweaking the z-index and fiddling with CSS 3D transforms. WebGL is the API for making such fully customizable visualizations in all dimensions. We can use this together with de facto standard framework three.js to unlock this mysterious domain.
Maybe you are burning inside with an idea of an NPM package that could revolutionize the world? Or maybe you just want to see what it's all about? This article will be a simple tutorial on how you can get started with creating NPM packages - which I, personally, found to be a quite useful skill to have!
The new version of ECMAScript, ES2021 is expected to be released in June 2021. What new features can we expect from the new release? This article covers some of the features in the upcoming release, and how we can put them to use.
Even today, many people shy away from JavaScript because it is seen as unreliable or unpredictable. Without strong typing and compiling, unexpected problems can arise at runtime that nobody will see until it gets uncovered as an error in a production environment.
If you have been following our JavaScript Christmas calendar, chances are you have some interest, and perhaps even proficiency, in the JavaScript programming language. For this blog entry in particular, I hope you also have at least some interest in data science and machine learning. I will demonstrate how you can use your JavaScript skills to develop entry-level data science and machine learning applications, argue why you may want to do so, and provide you with lots of external resources to further expand your knowledge of this subject.
Although I've been a professional developer for over seven years, there are still many programming terms I've yet to fully understand. I've heard the term "closures" many times, but I never really bothered to dive into the meaning of it. Maybe this is because I had a decent idea of what it was about, and I knew pretty well how to use it? It's about time I take the leap to figure this out, and finally get some closure.
Back in 2009, Ryan Dahl entered the stage on JSConf and presented his newest project, Node.js. And since then, Node has grown into an enormous ecosystem with over 1.5 million packages on NPM. 9 years later, during JSConf 2018, he enters the stage again. This time, he apologizes to the JavaScript community and discusses the 10 things he regrets about Node. Towards the end, he reveals his new project, an alternative framework for JavaScript development. The new project is called Deno. And this year, Deno finally left the alpha stage, offering a stable CLI and solid documentation. Which means it's the perfect time to have a closer look!
I'm part of a group that holds introductory courses on web development for students and new employees in Bekk. In the course we say that there are three ways to retrieve data in JavaScript, but we only explain one of the methods. Now, let's see how each of them works: callbacks, promises and async / await.
JavaScript:Do you know addition? Me:Of course! I learned mathematics when I was seven, addition is fairly easy! JavaScript:Do you really know addition? Please solve this equation Me:Eh? JavaScript:Welcome to JavaScript addition!
The JavaScript Advent Calendar is coming to an end. For each day in December, we've written an article on a subject that matters to us. If you want to keep learning about the language and the web itself, here's four exciting web proposals you might want to play with during the holidays!
The world of front end frameworks is always evolving. For years it was dominated by jQuery and Backbone, but these days we hear most talk about React and Vue. However, there is another framework that hasn't been talked about so much, namely Svelte. Although this framework is actually three years old, it had a rebirth in April this year with the release of its third major version.
Maybe you’ve heard of Fetch? The promise-based Web API for making network requests in the browser, and a favourite amongst developers. If you paste fetch(‘https://www.google.com’) into the Chrome DevTools console and run it you can take a closer look at how it works. Sadly, you can’t do the same in Internet Explorer. It won’t work. That is because Internet Explorer has not implemented support for Fetch. Or Promise for that matter.
Years ago, the JavaScript language was gifted with the Symbol primitive. Unlike many other language features in ES6, it was not simply a shorter syntax for doing something otherwise previously possible. It is not obvious what the point of these symbols are, and they are not commonly used. If you try to read up on them, you will find that many articles focus on details that are not important to the purpose of symbols. This article will explain what they are, what the point is, and give some real life use cases.
The people behind JavaScript is a series of interviews with the members of TC39. The committee consists of JavaScript enthusiasts and language experts who get together to define how new versions of JavaScript should work.
I like TypeScript. I also like Magic the Gathering. What if we combine them; can the magical domain of planeswalkers and spells help us understand the awesome but advanced type system of TypeScript?
You've probably seen someone on the internet write funny-looking but runnable JavaScript code using only six different characters. But how does that actually work?
If you are new to JavaScript, chances are that you might find it a bit confusing at times. This is with good reason as JavaScript is a language of many quirks packed with odd behaviors and inconsistency. Let's make JavaScript a bit less confusing by tackling one of the more overlooked quirk of JavaScript known as Hoisting.
I used to think that feature switches were clunky if-statements in my code that would require re-compilation or at least restart of my app. Launch Darkly proved me totally wrong, swinging me from cynical scepticism to deep love!
Modern frameworks are easy to learn. From zero web experience, they help you get productive in a matter of weeks. But for me, the web remained a mystery until I taught myself the very basics.
In this article, I will present to you some resources which can be useful to know about if you want to learn JavaScript, or in general, want to learn more about the language.
Let us look at what it takes to create our own SPA
The people behind JavaScript is a series of interviews with the members of TC39. The committee consists of JavaScript enthusiasts and language experts who get together to define how new versions of JavaScript should work.
Every team has to make various decisions before, and during, the development of a digital product. One of these usually involves yarn, npm or another tool to build and package javascript code. Some developers have a burning desire to go in a certain direction, and sometimes they end up spending a considerable amount of time trying to make decisions that in fact will have little impact in their everyday life.
This year the 10th version of the ECMAScript Language Specification was released, often referred to simply as ES2019. Let’s take a closer look at what new features we got and how we can put them to use.
The people behind JavaScript is a series of interviews with the members of TC39. The committee consists of JavaScript enthusiasts and language experts who get together to define how new versions of JavaScript should work.
I recently became a frontend developer. Again. The last time I was, was back in 2014. And it's pretty much like riding a bike: if you haven't done it in 5 years, you're going to feel pretty damn wobbly. Especially if the bikes started using create-react-app and Sagas in the meantime. So, with all the wisdom of a child who just fell of his bike, I'm going to try to share a few insights on the state of ~biking~ frontend in 2019!
Do you wake up at night fearing your app's dependencies might have scary vulnerabilities?
Knowing more than one way to solve a given problem can help you write more readable code. Let's look at three different ways to remove duplicates elements from an array.
The ... operator that arrived to javascript with ES6 is really handy, and can be used in quite a lot of situations. Technically it is two different things; a Rest parameter and a spread operator. Let's take a look at how they work.
Did you know that JavaScript is the world's NO. 1 most popular language? At least according to Github and Stack Overflow it is. As a developer, that is a huge reason to get to know it better, wouldn't you say?
From all of us behind javascript.christmas, to all of you: Merry Christmas!
All I want for Christmas is the great JavaScript sword 🎅
Quick tips on all you can do with Promises. Because my tips don't lie!
Yeah. I know! Me too. I was also shocked when hearing this for the first time.
D3 (Data Driven Documents) is a JavaScript library that's well suited to create data visualizations on the web. It brings data to life using HTML, SVGs and CSS. You can make everything from static graphs to interactive articles.
JavaScript is a fast-paced language in regards to adaption and growth. By the end of 2017 there was an estimated 9.7 million JavaScript developers, which suggest that we might have passed 10 million in 2018.
Imagine pulling up a search on Google for something web tech related. Let's say you look up how the text-align property works in CSS. The two first hits are from w3schools.com. A little further down we find Mozilla Developer Network's (or MDN) article on the subject. MDN is obviously run by the altruistic, open-web freedom fighters at Mozilla, but what's the deal with w3schools, and why does some people dislike it so much?
There are books with entire chapters dedicated to this topic, but this article will give you the crash course you might actually remember.
Why is Console.log everybody's favourite?
You've probably seen someone on the internet write funny-looking but runnable JavaScript code using only six different characters. But how does that actually work?
Meet the beautiful first class citizen of JavaScript. The function. And all it's declarations.
Yet another new feature proposal for JavaScript that we'll live perfectly fine without (but would at the same time also be very handy).
Destructuring your structures
How we bundle our code for development and production
All work and no play makes Jack a dull boy
Let your tools do the dirty work
Have you ever wondered what the real difference is between == and === ?
A few of the newest things in JavaScript
What is the truth?
How to rock and roll with Optional Chaining
Did you know that you can reload the current webpage in over 500 different ways?
Let's clear it up, once and for all.