In my application, users have their own profile page in which there is their profile picture (I'm using react router to deal with routes on client side).
What I want to do is: when a user sends link to his profile on messenger/slack/twitter then the thumbnail of the link should be his profile photo.
I know that I need to do this by sending correct meta tag, i.e.
<meta property="og:image" content="url-image.jpg">
But I am not sure how to implement this, what should I know about it? I found a thing called prerender, but I am not sure if it's for React
After a little research, I think the only why to do this is by server side rendering. It looks like Facebook doesn't care about loading JavaScript and won't detect a change in the <head> section. I checked this by building a simple React application that sets the OG data in the componentWillMount() section. The Facebook debugger could not find the headers.
So the answer on your question depends really on the kind of back-end you are using. You need to set the meta data before you send the response to the client.