Facebook sharing debugger and Twitter Card Validator are use to test and see how our URL will be previewed on Facebook and Twitter. Facebook and Twitter gives developer a control to define the og tags which are used rendering the preview of your URL.
If you are using React JS, how to add these og tags as part of your react components are explained here
Facebook Debugger with Web Hosted URL
If you are using React JS, how to add these og tags as part of your react components are explained here
Facebook Debugger with Web Hosted URL
But during development if you want to test the link preview then you can not use directly as shown above with localhost URL
Solution to use these debugger with localhost URL is use local-tunneling, where Facebook crawlers can read localhost URL to read og tags defined in your HTML page.
Use npm module localtunnel to achieve this, steps are shown below
1. Install NPM module - npm install -g localtunnel
2. If your app is running at localhost:3000 then you have to generate proxy URL for this so from command line
Solution to use these debugger with localhost URL is use local-tunneling, where Facebook crawlers can read localhost URL to read og tags defined in your HTML page.
Use npm module localtunnel to achieve this, steps are shown below
1. Install NPM module - npm install -g localtunnel
2. If your app is running at localhost:3000 then you have to generate proxy URL for this so from command line
3. Use above generated proxy url for Facebook Sharing Debugger or Twitter Card Validator