In this video series, I work on my new personal website built using React.
Website: https://www.celikk.me
GitHub: https://github.com/celikkoseoglu/celikk-personal-website
Playlist: https://www.youtube.com/watch?v=DyrydvufT5A&list=PLNkfllcUq3AkdeD4Aqp_Z2AIGyyF00_d8
Twitch: https://www.twitch.tv/celikkoseoglu
You should watch the react-helmet video before this one: https://www.youtube.com/watch?v=R2WVKIJetyo
This is a continuation of my previous work using React Helmet. We've set the metadata for Google's web crawlers. Plus, users can see the correct titles when they browse our site. However, when they share the website using a slack message (or facebook, linkedin etc.), they will not get the correct tags.
This is where react-snap comes into play. It crawls through your website at build time and generates all html files with the correct headers so when you share your website online, you will get the correct metadata per page.
This is super useful because it eliminates the need for Server Side Rendering for my use case. Decreases complexity by a lot.