meta-preview

1.0.3 • Public • Published

Meta Preview - Demo

A simple ReactJS component to preview how a content will be rendered in Google based on Title, Description and URL.

Screenshot

Install

$ yarn add meta-preview

Usage

import React, { Component } from 'React';
import { MetaPreview } from 'meta-preview';
 
class MyComponent extends Component {
  constructor(props) {
    super(props);
      
    this.state = {
      title: "Post title",
      link: "https://medium.com/@hugooodias",
      description: "Post Description."
    };
 
    <!-- handle changes -->
  }
 
  render() {
    return (
      <MetaPreview
        {...this.state}
        onTitleChange={this.onTitleChange}
        onDescriptionChange={this.onDescriptionChange}
        onLinkChange={this.onLinkChange}
      />
    )
  }
}

Preview only

import { Preview } from 'meta-preview';
 
class MyComponent extends Component {
  constructor(props) {
    super(props);
      
    this.state = {
      title: "Post title",
      link: "https://medium.com/@hugooodias",
      description: "Post Description."
    };
  }
 
  render() {
    return (
      <Preview {...this.state} />
    )
  }
}  

/meta-preview/

    Package Sidebar

    Install

    npm i meta-preview

    Weekly Downloads

    13

    Version

    1.0.3

    License

    MIT

    Unpacked Size

    479 kB

    Total Files

    15

    Last publish

    Collaborators

    • hugooodias