FREE React Server Components Course + More 💖

Hey friend,

First, thank you so much to those who helped me test the React Server Components course. I appreciate you, the testing squad caught a bunch of bugs which helped speed up my launch. This allows me to create more free resources for this community.

I wouldn't have done this without you, so thank you! 💜

React Server Components FREE Course 💖

If you missed it, you could speed up learning React Server Components in-depth by taking this FREE course I've created for you. And Guess What? It's ready!! 🥳

Click this magical button, and I'll add you to the List. 🦄

Our Weekly Snack: React Server Components 🌮

React Server Components in Next.js 13 are a hot topic right now 🔥.

Today, let's check out a snippet to learn about them more in-depth.

What's a Server Component? 👇

A server component is a component that is fetched and rendered on the server. They are similar to standard React components but executed on the server rather than the client.

Try to think of Server components as your backend 📦

What's a Client Component? 💻

A client component is a component that is fetched and rendered on the client, typically in a web browser. They are responsible for handling user interactions and updating the user interface.

Instead of asking Client Components, we can ask React Server Components to give us the result of that build.

Here is a quick weekly snack 🍿,

Above is a simple Card component with title, description, date and a button.

Notice that using the 'use client' directive makes Card a client component. If you don't specify, then Card would be a Server component.

The above Card component also has handlers, making it a Client component as Server will not have access to browser click handlers.

Upcoming Course: Developer → Engineering Manager 💖

I have been working so hard on my upcoming course program on helping developers transition into Engineering Managers. You will love the landing page - built with Tailwind and Next.js, and many asked me if I could sell them the landing page template, which was quite cool.

👉 If you want to become a leader or you are a newer engineering leader but want to become more confident, you can add yourself to the waitlist by clicking this link.​

Pick Next week’s Newsletter Topic 🚀

Now you have complete control over deciding what topic I should cover in next week’s newsletter.

Click on one of the topics below.

​React - Performance​
​TailwindCSS Comparisons to CSS​
​Svelte vs Next.js Snacks​
​More Next.js 13 Snippets​

Please reply to this email to tell me what snippets you would like to see if the above list doesn't fit what you are looking for.

Weekly Youtube Videos to help you Level up 💖

I've recorded this series Becoming an Engineering Manager Series A series to help you figure out whether to go for Leadership or IC (Individual Contributor) track.

Check it out and subscribe to my channel for more content to help you Level up in your Career! 💪

The Frontend Developers Toolbox 🧰

• ​FontJoy: Generate font combinations for your apps - a fun little app that gives you font combinations that go well together.
• ​Developer Roadmaps: These help guide the developers in picking up the path and guide their learnings.
• ​Dall-e-2: an AI system that can create realistic images and art from your description.

I hope you have a great day!