Darius Cosden 🧑🏻💻
@cosden.dev
Teaching React at @cosdensolutions · 170k subs · Building an AI learning platform
What's the best way to prefetch your data in Tanstack Start/Router?
The docs all show using "ensureQueryData" but that returns cached data even if it's been invalidated
I'm currently doing "fetchQuery" which accounts for invalidation but it doesn't feel right?
The docs all show using "ensureQueryData" but that returns cached data even if it's been invalidated
I'm currently doing "fetchQuery" which accounts for invalidation but it doesn't feel right?
December 11, 2025 at 11:02 AM
What's the best way to prefetch your data in Tanstack Start/Router?
The docs all show using "ensureQueryData" but that returns cached data even if it's been invalidated
I'm currently doing "fetchQuery" which accounts for invalidation but it doesn't feel right?
The docs all show using "ensureQueryData" but that returns cached data even if it's been invalidated
I'm currently doing "fetchQuery" which accounts for invalidation but it doesn't feel right?
My best performing video in a while
Apparently me moving away from Next.js was all it took
I guess I'll make more videos like this
Apparently me moving away from Next.js was all it took
I guess I'll make more videos like this
December 10, 2025 at 7:27 PM
My best performing video in a while
Apparently me moving away from Next.js was all it took
I guess I'll make more videos like this
Apparently me moving away from Next.js was all it took
I guess I'll make more videos like this
Vibe coding is creating a huge opportunity for those who know to code
Those who take this seriously right now will succeed
I built a complete roadmap on Cosden Code to teach you all the skills you need to be a successful full-stack React developer
Details below 👇
Those who take this seriously right now will succeed
I built a complete roadmap on Cosden Code to teach you all the skills you need to be a successful full-stack React developer
Details below 👇
December 10, 2025 at 11:03 AM
Vibe coding is creating a huge opportunity for those who know to code
Those who take this seriously right now will succeed
I built a complete roadmap on Cosden Code to teach you all the skills you need to be a successful full-stack React developer
Details below 👇
Those who take this seriously right now will succeed
I built a complete roadmap on Cosden Code to teach you all the skills you need to be a successful full-stack React developer
Details below 👇
My most viewed YT short (1.2m views) is me roasting my own code
Every day there are devs out there who see the horrendous code I wrote 8+ years ago
Every day there are devs out there who see the horrendous code I wrote 8+ years ago
December 9, 2025 at 11:04 AM
My most viewed YT short (1.2m views) is me roasting my own code
Every day there are devs out there who see the horrendous code I wrote 8+ years ago
Every day there are devs out there who see the horrendous code I wrote 8+ years ago
Currently not vibe coding in the north of Sweden 🧖🏻♂️
December 6, 2025 at 6:46 PM
Currently not vibe coding in the north of Sweden 🧖🏻♂️
I believe I may have had my first word of mouth sale
Someone purchased using a discount code only sent to a few users and their email is not on that list
So someone must've given it to them
Really cool if true
Someone purchased using a discount code only sent to a few users and their email is not on that list
So someone must've given it to them
Really cool if true
December 5, 2025 at 4:00 PM
I believe I may have had my first word of mouth sale
Someone purchased using a discount code only sent to a few users and their email is not on that list
So someone must've given it to them
Really cool if true
Someone purchased using a discount code only sent to a few users and their email is not on that list
So someone must've given it to them
Really cool if true
Latest YT video did alright
Most views are existing subscribers
Which is great, but I want to reach more new viewers too
Most views are existing subscribers
Which is great, but I want to reach more new viewers too
December 5, 2025 at 11:02 AM
Latest YT video did alright
Most views are existing subscribers
Which is great, but I want to reach more new viewers too
Most views are existing subscribers
Which is great, but I want to reach more new viewers too
YT channel views are also down in the last 90 days
This is mostly due to not uploading videos
I was too busy filming 129 videos for Cosden Code
Time to give YT some more attention
This is mostly due to not uploading videos
I was too busy filming 129 videos for Cosden Code
Time to give YT some more attention
December 4, 2025 at 4:04 PM
YT channel views are also down in the last 90 days
This is mostly due to not uploading videos
I was too busy filming 129 videos for Cosden Code
Time to give YT some more attention
This is mostly due to not uploading videos
I was too busy filming 129 videos for Cosden Code
Time to give YT some more attention
Ok so sales have definitely slowed down after Black Friday launch
That's expected and I'm not mad about it
I'm playing the long game
Time to make great YT videos again
That's expected and I'm not mad about it
I'm playing the long game
Time to make great YT videos again
December 4, 2025 at 11:04 AM
Ok so sales have definitely slowed down after Black Friday launch
That's expected and I'm not mad about it
I'm playing the long game
Time to make great YT videos again
That's expected and I'm not mad about it
I'm playing the long game
Time to make great YT videos again
MRR is slowly growing
I'm not looking for a fast spike. I'm playing the long game
I want Cosden code to still be relevant and successful in 5 years
I'm not looking for a fast spike. I'm playing the long game
I want Cosden code to still be relevant and successful in 5 years
December 3, 2025 at 11:00 AM
MRR is slowly growing
I'm not looking for a fast spike. I'm playing the long game
I want Cosden code to still be relevant and successful in 5 years
I'm not looking for a fast spike. I'm playing the long game
I want Cosden code to still be relevant and successful in 5 years
Recently crossed 100 users and 5k XP on Cosden Code!
That's 100+ devs taking their React success in their own hands
That's 100+ devs taking their React success in their own hands
December 2, 2025 at 2:12 PM
Recently crossed 100 users and 5k XP on Cosden Code!
That's 100+ devs taking their React success in their own hands
That's 100+ devs taking their React success in their own hands
Just added the first video lessons to my new platform Cosden Code (coming soon)
The videos are SO GOOD. Literally my best work
First course is on design patterns in React, and I promise you, you haven't seen most of these patterns
I'm beyond excited to launch this
The videos are SO GOOD. Literally my best work
First course is on design patterns in React, and I promise you, you haven't seen most of these patterns
I'm beyond excited to launch this
October 24, 2025 at 9:56 AM
Just added the first video lessons to my new platform Cosden Code (coming soon)
The videos are SO GOOD. Literally my best work
First course is on design patterns in React, and I promise you, you haven't seen most of these patterns
I'm beyond excited to launch this
The videos are SO GOOD. Literally my best work
First course is on design patterns in React, and I promise you, you haven't seen most of these patterns
I'm beyond excited to launch this
When you do that React is going to continue the body of the component until the return statement after which it will abandon the render
This means that the JSX is not going to get updated in that render
React is going to start again on a new render from the top
This means that the JSX is not going to get updated in that render
React is going to start again on a new render from the top
October 16, 2025 at 10:04 AM
When you do that React is going to continue the body of the component until the return statement after which it will abandon the render
This means that the JSX is not going to get updated in that render
React is going to start again on a new render from the top
This means that the JSX is not going to get updated in that render
React is going to start again on a new render from the top
One of the weirdest patterns in React is the abandon render pattern
This is when you call a state updater function directly in the body of the component as its rendering
React will abandon the render and start again with a new value
Here's an example
This is when you call a state updater function directly in the body of the component as its rendering
React will abandon the render and start again with a new value
Here's an example
October 16, 2025 at 10:04 AM
One of the weirdest patterns in React is the abandon render pattern
This is when you call a state updater function directly in the body of the component as its rendering
React will abandon the render and start again with a new value
Here's an example
This is when you call a state updater function directly in the body of the component as its rendering
React will abandon the render and start again with a new value
Here's an example
That's where the useEffectEvent hook comes into play
We can create an effect event called onVisit and call that in the body of useEffect instead
Effect events do not need to be provided in dependency arrays, but they still see the latest values
We can create an effect event called onVisit and call that in the body of useEffect instead
Effect events do not need to be provided in dependency arrays, but they still see the latest values
October 15, 2025 at 9:56 AM
That's where the useEffectEvent hook comes into play
We can create an effect event called onVisit and call that in the body of useEffect instead
Effect events do not need to be provided in dependency arrays, but they still see the latest values
We can create an effect event called onVisit and call that in the body of useEffect instead
Effect events do not need to be provided in dependency arrays, but they still see the latest values
The problem is, if we do that, then we're violating the rules of hooks
The rules of hooks say that everything used inside of the body of useEffect has to go in the dependency array
So if we can't do that, what's the solution?
The rules of hooks say that everything used inside of the body of useEffect has to go in the dependency array
So if we can't do that, what's the solution?
October 15, 2025 at 9:56 AM
The problem is, if we do that, then we're violating the rules of hooks
The rules of hooks say that everything used inside of the body of useEffect has to go in the dependency array
So if we can't do that, what's the solution?
The rules of hooks say that everything used inside of the body of useEffect has to go in the dependency array
So if we can't do that, what's the solution?
Here we're tracking a page view event based on the url and the numberOfItems
With this code, when the numberOfItems changes, the event will fire even if the URL hasn't changed
This is probably not what we want
To fix it, we need to remove numberOfItems from the deps array
With this code, when the numberOfItems changes, the event will fire even if the URL hasn't changed
This is probably not what we want
To fix it, we need to remove numberOfItems from the deps array
October 15, 2025 at 9:56 AM
Here we're tracking a page view event based on the url and the numberOfItems
With this code, when the numberOfItems changes, the event will fire even if the URL hasn't changed
This is probably not what we want
To fix it, we need to remove numberOfItems from the deps array
With this code, when the numberOfItems changes, the event will fire even if the URL hasn't changed
This is probably not what we want
To fix it, we need to remove numberOfItems from the deps array
You can use it in a server action too, and do something else there as well
The beauty of this pattern is flexibility. Your function is still reusable and shared, but you control the behavior everywhere you use it
With this, I've been able to do anything in my apps
The beauty of this pattern is flexibility. Your function is still reusable and shared, but you control the behavior everywhere you use it
With this, I've been able to do anything in my apps
October 1, 2025 at 10:04 AM
You can use it in a server action too, and do something else there as well
The beauty of this pattern is flexibility. Your function is still reusable and shared, but you control the behavior everywhere you use it
With this, I've been able to do anything in my apps
The beauty of this pattern is flexibility. Your function is still reusable and shared, but you control the behavior everywhere you use it
With this, I've been able to do anything in my apps
Finally, you combine everything in your component by wrapping the utility function with tryCatch
With this, you're free to now handle the result of the function in any way that you want
Want to return JSX on error? Sure. Want to send to sentry? Sure
It's completely flexible
With this, you're free to now handle the result of the function in any way that you want
Want to return JSX on error? Sure. Want to send to sentry? Sure
It's completely flexible
October 1, 2025 at 10:04 AM
Finally, you combine everything in your component by wrapping the utility function with tryCatch
With this, you're free to now handle the result of the function in any way that you want
Want to return JSX on error? Sure. Want to send to sentry? Sure
It's completely flexible
With this, you're free to now handle the result of the function in any way that you want
Want to return JSX on error? Sure. Want to send to sentry? Sure
It's completely flexible
Then, I'll use a handy tryCatch helper function to allow me to catch any errors without having to worry about block scopes
I have come to avoid using try catch in my code and heavily rely on this small utility function
I have come to avoid using try catch in my code and heavily rely on this small utility function
October 1, 2025 at 10:04 AM
Then, I'll use a handy tryCatch helper function to allow me to catch any errors without having to worry about block scopes
I have come to avoid using try catch in my code and heavily rely on this small utility function
I have come to avoid using try catch in my code and heavily rely on this small utility function
The first step is to create a reusable function.
It doesn't matter what it does, just that it has some reusable logic that you need
The key here however, is that the function does not handle any errors (if the db call fails, it will throw)
It doesn't matter what it does, just that it has some reusable logic that you need
The key here however, is that the function does not handle any errors (if the db call fails, it will throw)
October 1, 2025 at 10:04 AM
The first step is to create a reusable function.
It doesn't matter what it does, just that it has some reusable logic that you need
The key here however, is that the function does not handle any errors (if the db call fails, it will throw)
It doesn't matter what it does, just that it has some reusable logic that you need
The key here however, is that the function does not handle any errors (if the db call fails, it will throw)
If you're using functions in your React components, then this is the best pattern that you can use
It gives you all of the benefits of a reusable function, while keeping the flexibility of how you might use it
Here's the code:
It gives you all of the benefits of a reusable function, while keeping the flexibility of how you might use it
Here's the code:
October 1, 2025 at 10:04 AM
If you're using functions in your React components, then this is the best pattern that you can use
It gives you all of the benefits of a reusable function, while keeping the flexibility of how you might use it
Here's the code:
It gives you all of the benefits of a reusable function, while keeping the flexibility of how you might use it
Here's the code:
If you use a ref on the other hand, it will keep its value across renders
That's what refs do. They allow you to store values and keep them for the lifetime of the component
So in this case, the console log will log the incremented value when the component renders
That's what refs do. They allow you to store values and keep them for the lifetime of the component
So in this case, the console log will log the incremented value when the component renders
September 30, 2025 at 10:03 AM
If you use a ref on the other hand, it will keep its value across renders
That's what refs do. They allow you to store values and keep them for the lifetime of the component
So in this case, the console log will log the incremented value when the component renders
That's what refs do. They allow you to store values and keep them for the lifetime of the component
So in this case, the console log will log the incremented value when the component renders
Using a let variable like this will not work the way that you think
Normal JS variables don't hold their value across renders, so even if you increment it, on the next render, it will be reset to 0
This is because the variable is being created and initialized in the component
Normal JS variables don't hold their value across renders, so even if you increment it, on the next render, it will be reset to 0
This is because the variable is being created and initialized in the component
September 30, 2025 at 10:03 AM
Using a let variable like this will not work the way that you think
Normal JS variables don't hold their value across renders, so even if you increment it, on the next render, it will be reset to 0
This is because the variable is being created and initialized in the component
Normal JS variables don't hold their value across renders, so even if you increment it, on the next render, it will be reset to 0
This is because the variable is being created and initialized in the component
What's the difference between using let vs useRef in React?
A lot of developers don't know this fundamental difference
Here's what's different and why you want to use a ref most of the time
A lot of developers don't know this fundamental difference
Here's what's different and why you want to use a ref most of the time
September 30, 2025 at 10:03 AM
What's the difference between using let vs useRef in React?
A lot of developers don't know this fundamental difference
Here's what's different and why you want to use a ref most of the time
A lot of developers don't know this fundamental difference
Here's what's different and why you want to use a ref most of the time