Build a Dynamic Avatar Component with React & TypeScript Tutorial (14 exercises)

Transcript

Now, it's time to take everything we've learned and put your skills to the test. I have a challenge for you, a challenge for the brave. The challenge is to build a dismissible blurb component similar to the one on GitHub.

I've added a screenshot here so you can see what I have in mind. Basically, the dismissible blurb is what you see here, and here are the requirements. It should render children inside of it, and it should have an X in the top right, which you saw here. When that's clicked, it should remove itself from the DOM.

Here's an example of what the API will look like. Go forth, take on the challenge. After you do it, tweet at jsjoeio or retweet it. Good luck.

Lesson

Challenge: Build X Component

You are being challenged to build a new component using everything we learned in this tutorial. Your goal is to build a component called <DismissableBlurb /> as the one GitHub uses:

Resources

The following resources provide more information for this lesson:

Picture of dismissable blurb

Transcript

Here's an example of what the API will look like. Go forth, take on the challenge. After you do it, tweet at jsjoeio or retweet it. Good luck.