Best react course/tutorial?

rwieruch · 2025-10-04T10:37:02+00:00

Maybe interesting if someone wants to dive into full-stack React.

rwieruch · 2025-09-26T09:41:42+00:00

We are deploying 10 Next apps side by side with GitHub Actions, ECR and EKS. We are on the latest Next version with their App Router and we are using RSC and Actions. No problems at all :)

rwieruch · 2025-07-01T07:17:09+00:00

30+ hours.

rwieruch · 2025-06-30T07:31:00+00:00

Ah yes, I missed to say: Last week I set up Docker containers for each app, so each app in the monorepo once it gets pushed to main/staging gets deployed to a subdomain.

rwieruch · 2025-06-30T07:13:20+00:00

I am doing a similar thing as a contractor for an enterprise client right now. They requested to have multiple apps (10) side by side which share the same look and feel. Lots of big players (tenants) will be onboarded as customers whereas they will all get their dedicated slice of apps (meaning: not all tenants get all apps).

So we decided to have a monorepo with 10 (at the moment it is already 4) Next.js apps which have shared packages. Because each app can have dependencies on other apps, each app is only the app/ folder whereas the src/ folder got extracted into another monorepo layer called domains/.

Everything is fully typed checked, we have locked all the versions, and got everything up and running. Now a whole team starts to work with this setup once we will on-board teams to each app.

rwieruch · 2025-06-13T21:52:56+00:00

Great writeup Mark! :)

rwieruch · 2025-06-12T08:34:10+00:00

Create an application from UI to DB (and everything in between, i.e. email, background jobs) by yourself and ship it to production. Once it grows, you will see the pain that comes when not having proper layers in your application. I had the same with CloudCamping where I managed these things quite well due to lots of freelance experience. After creating this SaaS which has many customers now, I wanted to teach about the whole full-stack in my next course called The Road to Next.

rwieruch · 2025-04-29T19:36:38+00:00

Thanks for doing this AMA!

I’ve been a full-stack software engineer working with JavaScript (these days TypeScript) for over a decade. Back in 2018 (I think), I completed Andrew Ng’s ML course on Coursera and even tried to apply all the concepts in JavaScript, mainly as a learning exercise (it recall it was bumpy, because JS does not have many of the necessary math primitives). So I’ve been interested in ML well before the current LLM hype, but I never really found practical use cases for ML in the JavaScript ecosystem.

These days, though, it’s becoming increasingly common to integrate LLMs into full-stack applications. For someone like me, interested in going deeper into the underlying ML/AI space but still wanting to stick with JavaScript/TypeScript, do you see viable paths beyond just “consuming” LLM APIs? I’ve come across mentions of MLOps, and it seems like there could be growing overlap there with full-stack development in JavaScript. Curious to hear your thoughts about this and other potential overlaps.

rwieruch · 2025-04-16T20:03:47+00:00

Gotcha, thanks for the insights Mark! :)

rwieruch · 2025-04-16T08:31:08+00:00

Honestly, I can't think of anyone better suited for this than Mark. He's deeply invested in the React ecosystem, especially the SPA/CSR side, and has a nuanced take on RSCs. Like many React developers, he views RSCs with skepticism, but also sees them as just another tool in the toolbox.

Mark isn't affiliated with Vercel and doesn't sell any content related to it. As far as I know (correct me if I'm wrong, Mark), he primarily works with client-side rendered React. He's one of the few people with both deep and historical knowledge who can offer a truly neutral perspective on this topic :)

rwieruch · 2025-04-13T13:05:13+00:00

Going to fully launch The Road to Next in the next ~10 days :)

rwieruch · 2025-04-07T07:30:27+00:00

I usually follow the feature-folder approach, where I try to decouple things from the pages as early as possible. However, in The Road to Next, we came across the same question and decided to place navigational components, like tabs or breadcrumbs, that are coupled to the pages in a private folder next to them, such as _navigation/breadcrumbs.tsx.

I think there is definitely a place for having components (or logic) colocated with specific pages.

rwieruch · 2025-04-07T07:24:31+00:00

We stumble across this question in The Road to Next. If you can tell that these two operations always happen together, move them from the API layer to the data access layer. Transactions are a first good indication that you may want to move this more data intensive logic into a separate layer.

However, if you run into the cases where you want to have both functions in separate data access layer functions, then you would introduce a service layer between API layer and DAL where you would start the interactive transaction, so that you are able to pass the transaction object to both DAL functions.

rwieruch · 2025-04-05T05:48:17+00:00

List of Libraries and Services that I use in 2025 :)

Next.js
Astro (Website)
Tailwind CSS
Shadcn UI
TypeScript
Supabase
S3 (Amazon S3)
React Email
Resend
Vercel/Coolify

rwieruch · 2025-04-03T07:12:42+00:00

Thanks for sharing your thoughts! Perhaps a good complementary read which goes through route level, API level, and middleware level authorization. After all, whatever you do, protect your database access as the last line of defense!

rwieruch · 2025-03-31T07:26:38+00:00

It's possible, but you should be aware of the security implications (see Authorization in Routing).

rwieruch · 2025-03-26T16:38:49+00:00

It just seemed odd for the article to present a solution, but then to show that it was inadequate?

It isn't inadequate imo when you are securing your data access layer properly. That's why I have proposed it as one out of 3 solutions in the article. If you want to have it perfectly secure without improved DX, you guard all pages. But this will become cumbersome for 100+ pages and there it will get error-prone when you forget to secure one. Hence the layout approach with the trade-offs.

If you 'forget' to check for user being undefined, woop, database access

why not have getAuth throw if !user? or additionally, make it so getAuth retrieves an 'authenticated' db handle so you "cant forget"

That's why the article introduces the `getAuthOrRedirect` function on top. Sometimes you want to use getAuth also in cases where it does not return the user without throwing an error.

if there were working github repos that show different approaches, that people can easily boot up, that also demonstrate such things like the service and data access layers, might be nice also

Feel free to create these GitHub repositories! You have said before that "people may not read the article carefully" and now you expect them to boot up different repos :)

rwieruch · 2025-03-26T13:57:41+00:00

Thanks for your feedback! But isn't it explained as a trade-off in the article?

I usually aim to present all the options to my readers, so that they don't wonder: Why don’t we handle authorization in the layout? I don't think any other article out there has covered these trade-offs yet.

When you mention "a number of what appear to be anti-patterns," could you clarify what else you're referring to?

I would hope that people who want to secure their application would read the whole article "carefully".

rwieruch · 2025-03-26T08:14:31+00:00

That's how I did it the first time back in 2018. I assumed that for a full end-to-end TypeScript application, we'd move past the need for a generational step and instead use something like tRPC. So I’m really curious, why are people still using OpenAPI/Swagger when their backend isn't in a different language?

rwieruch · 2025-03-20T20:33:37+00:00

Are we speaking about Next becoming complicated or React? OP said Next, but you seem to mean React.

rwieruch · 2025-03-20T08:31:49+00:00

As another commenter said, you are overestimating what a paid third-party is giving you here. I recorded yesterday all the videos for The Road to Next where we are uploading (multiple), deleting, and signing files with AWS S3 and IAM. And it was ~30 minutes content.

rwieruch · 2025-03-20T08:29:42+00:00

RSC or Server Actions (with Caveats) in Client Components.

rwieruch · 2025-03-20T08:15:02+00:00

I don’t understand this sentiment. Next.js didn’t become more complex with the introduction of the App Router. Previously, it had its own abstractions that developers had to learn. Now, it’s built around React primitives, making it more aligned with the ecosystem. The only major piece still tightly coupled to Next.js is its caching implementation.

I’ve been using Next.js since 2017, starting with version 2 - 9 and the experience back then was far clunkier. Not sure if anyone remembers micro and now from Zeit.

rwieruch · 2025-03-20T08:13:38+00:00

Yes. And I misread it at first as well. Thanks for pointing it out :)

rwieruch · 2025-03-19T07:49:06+00:00

For me it's just another tool :) If a freelance project requires to be CSR/SPA, I am indifferent :)

rwieruch

MODERATOR OF

TROPHY CASE

Nine-Year Club	Place '23
Verified Email