Innhold om React
Totalt 148 innlegg
Side 5 av 10
A Hot Chocolate Map with React Leaflet and TypeScript
For the last decade I've called Oslo my home. And aside from the usual goals of getting an education, landing a job and living my life, I've had a side quest: Finding the best places for hot chocolate in town.
For the last decade I've called Oslo my home. And aside from the usual goals of getting an education, landing a job and living my life, I've had a side quest: Finding the best places for hot chocolate in town.
Creating a Chrome Extension with React and TypeScript
Did you know most Chrome extensions are written in good ol' JavaScript? Turns out, creating one with React is pretty straight forward, too! Let's look at how you can use your existing JavaScript skills to spread some holiday cheer!
Did you know most Chrome extensions are written in good ol' JavaScript? Turns out, creating one with React is pretty straight forward, too! Let's look at how you can use your existing JavaScript skills to spread some holiday cheer!
Creating a Chrome Extension with React and TypeScript
Did you know most Chrome extensions are written in good ol' JavaScript? Turns out, creating one with React is pretty straight forward, too! Let's look at how you can use your existing JavaScript skills to spread some holiday cheer!
Did you know most Chrome extensions are written in good ol' JavaScript? Turns out, creating one with React is pretty straight forward, too! Let's look at how you can use your existing JavaScript skills to spread some holiday cheer!
Back to basics - Setting up a minimal React project from scratch
It's so easy nowadays to get a web application up and running in just a couple of minutes. We've got tools like Create-react-app, React boilerplate, Slingshot etc., which let developers set up and prototype anything blazing fast. These tools come with Webpack, Babel and more already configured for you, so you don't have to know anything about them or what they are used for. This is obviously very valuable and cost-effective, but we also have to remember to keep in touch with our roots and get some sense of what is going on under the hood. So for today's topic we will be going back to the basics and see how we can set up most of what we need from scratch!
It's so easy nowadays to get a web application up and running in just a couple of minutes. We've got tools like Create-react-app, React boilerplate, Slingshot etc., which let developers set up and prototype anything blazing fast. These tools come with Webpack, Babel and more already configured for you, so you don't have to know anything about them or what they are used for. This is obviously very valuable and cost-effective, but we also have to remember to keep in touch with our roots and get some sense of what is going on under the hood. So for today's topic we will be going back to the basics and see how we can set up most of what we need from scratch!
Recoil.js - State management for React 🔥
Validate Your Parking
He couldn't believe it. This certainly couldn't be true. Someone else must have made a mistake here. He read the email a second time. Maybe he missed something and the whole thing was just a big misunderstanding? But he didn't, of course. He is the kind of person who always pays attention to typos, therefore reading it again was quite pointless. Anger started spreading through him. How dare they? It felt so incredibly stupid and unfair. Especially considering he was such a law-abiding citizen. He despised those who didn't follow rules. They couldn't possibly mean that he was one of them? Yet this is exactly what the email was saying: "We can inform you that you unfortunately have used the wrong licence plate in the app, which is why you have been given a fine. In this case the fine is issued on AB12345, while parking was activated for AB1234 in the app.". Filled with rage, he locked his phone and shoved it back into his pocket. He missed one bloody number!
He couldn't believe it. This certainly couldn't be true. Someone else must have made a mistake here. He read the email a second time. Maybe he missed something and the whole thing was just a big misunderstanding? But he didn't, of course. He is the kind of person who always pays attention to typos, therefore reading it again was quite pointless. Anger started spreading through him. How dare they? It felt so incredibly stupid and unfair. Especially considering he was such a law-abiding citizen. He despised those who didn't follow rules. They couldn't possibly mean that he was one of them? Yet this is exactly what the email was saying: "We can inform you that you unfortunately have used the wrong licence plate in the app, which is why you have been given a fine. In this case the fine is issued on AB12345, while parking was activated for AB1234 in the app.". Filled with rage, he locked his phone and shoved it back into his pocket. He missed one bloody number!
10,000 Commits Later - Switching to React Native in 2017
Back in 2017, my team were working on a feature-packed, widely used mobile app with a legacy codebase. The app had way too much logic, logic of the complex sort, with loads of very old code calling old APIs. Build times were terrible. Noone had a complete understanding of the code.
Back in 2017, my team were working on a feature-packed, widely used mobile app with a legacy codebase. The app had way too much logic, logic of the complex sort, with loads of very old code calling old APIs. Build times were terrible. Noone had a complete understanding of the code.
What and why and how are worklets in Reanimated 2?
A brief introduction to Reanimated 2's worklet directive and how it can help us animate our apps.
A brief introduction to Reanimated 2's worklet directive and how it can help us animate our apps.
React Testing Library
Do you feel compelled to manually test your React frontend after each deploy, because it’s not tested as well as your backend? Or perhaps you already have frontend tests, but you feel that they only serve as a hindrance, slowing down your development speed? Perhaps it’s time to give frontend testing another go, with the React Testing Library!
Do you feel compelled to manually test your React frontend after each deploy, because it’s not tested as well as your backend? Or perhaps you already have frontend tests, but you feel that they only serve as a hindrance, slowing down your development speed? Perhaps it’s time to give frontend testing another go, with the React Testing Library!
Module Federation: Micro-frontends with webpack 5
In this article, we will look at one of webpack's exciting new features, Module Federation. This feature will allow dynamic code reloading from another project at runtime. Using module federation will enable sharing code from other projects with only a little tweaking in your webpack config. It can make a website consisting of multiple frontend applications appear as one seamless SPA. Neat, huh?
In this article, we will look at one of webpack's exciting new features, Module Federation. This feature will allow dynamic code reloading from another project at runtime. Using module federation will enable sharing code from other projects with only a little tweaking in your webpack config. It can make a website consisting of multiple frontend applications appear as one seamless SPA. Neat, huh?
Intelligent fetching and caching with SWR
Every now and then, a library surfaces that change the way you're used to thinking. In this case, it is rethinking the data flow in your React app. SWR provides a complex data store with a simple interface, helping you write simple patterns with less code.
Every now and then, a library surfaces that change the way you're used to thinking. In this case, it is rethinking the data flow in your React app. SWR provides a complex data store with a simple interface, helping you write simple patterns with less code.
Intelligent fetching and caching with SWR
Every now and then, a library surfaces that change the way you're used to thinking. In this case, it is rethinking the data flow in your React app. SWR provides a complex data store with a simple interface, helping you write simple patterns with less code.
Every now and then, a library surfaces that change the way you're used to thinking. In this case, it is rethinking the data flow in your React app. SWR provides a complex data store with a simple interface, helping you write simple patterns with less code.
🎶On the third day of christmas a developer sent to me.. 3 React security tips!
As frontend developers, our focus is on the users experience in our application. How fast and efficient the application is and how smooth the functionality can be. We all might say security on our minds, but we often rely on somebody else to handle this. Luckily, modern web frameworks, like React, come with built-in security against one of the dangers of the web – Cross Site Scripting (XSS) attacks. But what does React actually defend us from and more importantly what does it not?
As frontend developers, our focus is on the users experience in our application. How fast and efficient the application is and how smooth the functionality can be. We all might say security on our minds, but we often rely on somebody else to handle this. Luckily, modern web frameworks, like React, come with built-in security against one of the dangers of the web – Cross Site Scripting (XSS) attacks. But what does React actually defend us from and more importantly what does it not?
War stories: The move from Flow to TypeScript
8 developers, 1240 files, 102 665 lines of code. This is the story of how we translated our entire codebase from Flow to TypeScript and lived to tell the tale.
8 developers, 1240 files, 102 665 lines of code. This is the story of how we translated our entire codebase from Flow to TypeScript and lived to tell the tale.
Seven Interesting Things About React Native
React Native is a React framework developed by Facebook to write code for mobile applications. In this article I will share some things I found interesting over the years working with this technology.
React Native is a React framework developed by Facebook to write code for mobile applications. In this article I will share some things I found interesting over the years working with this technology.