Top 3 in Tech: Data fetching in React, VueUse, A beautiful blog

Big news from the React ecosystem: data fetching is about to get a whooole lot easier πŸ”₯ Β β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€ŒΒ β€Œ

Hey there!

Mads here again with a new issue of the Top 3 in Tech newsletter. This time we'll be getting a bit more technical - so please respond to this email if you enjoy this type of detailed content or if you prefer the usual newsletter style πŸ™Œ

Anyways, let's get into it:

​

1. Data fetching in React

There's no denying the amazing popularity of ReactJS and what is has done for the front-end ecosystem. Although technically "just" a library, the ability to use React as a framework to create websites and apps has been a gamechanger for front-end developers. And in the last several years (and probably the next several years too), React has been the undisputed most popular JS framework.

And for good reason! React simplifies a lot of daunting tasks and helped pioneer the "UI as a function of state" paradigm. Meaning that it shouldn't be the job of developers to imperatively keep our UI's in sync with our data when React can do it for us. React also offers a lot of freedom in the tools we choose to use around it - like routing, state management and animations.

And this last point is actually what I wanted to talk about today. Because React dropped a huge RFC ("Request for Comments") proposal this week with some new features for getting data into your components.

While the freedom of React is generally a good thing, it also means there's many different ways to do the same thing - including many wrong or suboptimal ways.

Data fetching is one of those things.

Most frameworks on top of React like NextJS or Remix have their own ways to fetch data like "getServerSideProps" for NextJS or "Loaders" for Remix. Besides that, there's libraries like React-Query or general state-management tools. And then of course, there's good ol' useEffect which​ most React devs have struggled with at one point or another.

Each of these approaches have their own advantages and disadvantages. But in the end, it's confusing for us developers to have to learn so many different approaches for data fetching depending on the project we're working on.

Luckily, that's about to change.

In the earlier mentioned RFC, the React team presents using async / await with Server Components - including an awesome new "use" hook that can be called conditionally (unlike the current React Hooks!) for data fetching.

It's a super interesting proposal and I think exactly what the ecosystem needs to move forward. If you're interested in the details, check out the full RFC here or check out this 12 minute video explaining the changes:

It's gonna be some time before these changes make it into React, but it's an awesome step in the right direction. And I'm super excited to see how it plays out!

​

2. VueUse

And while we're on the topic of cool JavaScript tools, I've been working a lot more with Vue 3 recently. And with Vue 3 comes the Composition API (inspired by React Hooks) - including helper libraries with lots of awesome utilities baked in.

One of these is VueUse. It's a collection of Vue composition functions to do all kinds of cool stuff. Some of the ones I've already enjoyed:

  1. ​"useLocalStorage" to easily sync state with Local Storage.
  2. ​"useStepper" to create and manage multi-step forms.
  3. ​"useDraggable" to make elements draggable while keeping track of their position

​It's an awesome library, and definitely worth checking out if you're working with Vue 3!

​Check out the full list of composition functions in the docs​

​

3. A beautiful blog

Let's round out today's issue with an amazing personal blog.

This website is honestly one of the best I've seen in a while.

It's beautiful, has great content, and is generally just a joy to browse. Just what the Internet was made for! Example:

​All credits to the author of course - so check it out for yourself πŸ”₯​

​

That's it for now! See you soon

​

Did you enjoy today's newsletter?

β€‹πŸ‘ Yes, it was amazing!​

β€‹πŸ˜ Eh, I guess it was ok​

β€‹πŸ‘Ž Not really at all​

​


​

I would really appreciate if you would share the newsletter with your friends on Twitter, LinkedIn, Facebook, by email or copy/paste the link mads.fyi/top3 on other platforms. It really helps to keep me motivated and let the newsletter grow. See you in 2 weeks ✌

β€” Mads Brodt

Older messages

Top 3 in Tech: Learning to code in 5 minutes, Dynamic social images, the CIA website

Wednesday, October 12, 2022

Is it possible to learn coding in just 5 minutes? Let's find out! ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌

Top 3 in Tech: Dwelling on mistakes, Adobe acquiring Figma, Powerful new CSS selector

Wednesday, September 28, 2022

Hey hey, In this issue of the Top 3 in Tech newsletter we'll reflect on making mistakes as a developer (and how to learn from them). We'll also look at how Adobe acquired Figma for 20 billion

Top 3 in Tech: Landing your first junior development job, How NOT to learn web development, Whats.new shortcuts

Thursday, September 15, 2022

There's never been a more difficult time to land a junior development job - but there are some things you can do to greatly improve your chances. ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌

Top 3 in Tech: Debugging code, The Lion framework, Animating React with Framer Motion

Wednesday, August 31, 2022

It's easy to get frustrated when stuck on a coding problem. But how can you reframe your thinking and work through the problem logically? ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌

Top 3 in Tech: No-code tools, Framer, Powerful CSS one-liners

Wednesday, August 17, 2022

What are "no-code" tools and will they end up making developers obsolete? ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌

You Might Also Like

Import AI 399: 1,000 samples to make a reasoning model; DeepSeek proliferation; Apple's self-driving car simulator

Friday, February 14, 2025

What came before the golem? ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Defining Your Paranoia Level: Navigating Change Without the Overkill

Friday, February 14, 2025

We've all been there: trying to learn something new, only to find our old habits holding us back. We discussed today how our gut feelings about solving problems can sometimes be our own worst enemy

5 ways AI can help with taxes 🪄

Friday, February 14, 2025

Remotely control an iPhone; 💸 50+ early Presidents' Day deals -- ZDNET ZDNET Tech Today - US February 10, 2025 5 ways AI can help you with your taxes (and what not to use it for) 5 ways AI can help

Recurring Automations + Secret Updates

Friday, February 14, 2025

Smarter automations, better templates, and hidden updates to explore 👀 ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

The First Provable AI-Proof Game: Introducing Butterfly Wings 4

Friday, February 14, 2025

Top Tech Content sent at Noon! Boost Your Article on HackerNoon for $159.99! Read this email in your browser How are you, @newsletterest1? undefined The Market Today #01 Instagram (Meta) 714.52 -0.32%

GCP Newsletter #437

Friday, February 14, 2025

Welcome to issue #437 February 10th, 2025 News BigQuery Cloud Marketplace Official Blog Partners BigQuery datasets now available on Google Cloud Marketplace - Google Cloud Marketplace now offers

Charted | The 1%'s Share of U.S. Wealth Over Time (1989-2024) 💰

Friday, February 14, 2025

Discover how the share of US wealth held by the top 1% has evolved from 1989 to 2024 in this infographic. View Online | Subscribe | Download Our App Download our app to see thousands of new charts from

The Great Social Media Diaspora & Tapestry is here

Friday, February 14, 2025

Apple introduces new app called 'Apple Invites', The Iconfactory launches Tapestry, beyond the traditional portfolio, and more in this week's issue of Creativerly. Creativerly The Great

Daily Coding Problem: Problem #1689 [Medium]

Friday, February 14, 2025

Daily Coding Problem Good morning! Here's your coding interview problem for today. This problem was asked by Google. Given a linked list, sort it in O(n log n) time and constant space. For example,

📧 Stop Conflating CQRS and MediatR

Friday, February 14, 2025

​ Stop Conflating CQRS and MediatR Read on: m​y website / Read time: 4 minutes The .NET Weekly is brought to you by: Step right up to the Generative AI Use Cases Repository! See how MongoDB powers your