serp preview

serp-미리보기

귀하의 웹사이트가 검색 엔진 결과에 어떻게 나타날지 보여주는 React 구성요소

하이라이트

• 여러 검색 엔진
• 스타일 구성 요소 사용
• 깨끗하고 테스트를 거쳤습니다.

설치

npm 사용:

$ npm i serp-preview

용법

 import { GooglePreview , BingPreview , YahooPreview , GoogleMobilePreview } from "serp-preview" ;

const Example = ( ) => (
  < div >

    < GooglePreview
      title = "?React – A JavaScript library for building user interfaces"
      description = "React makes it painless to create interactive UIs."
      url = "https://reactjs.org"
      link = "https://reactjs.org" / >

    < BingPreview
      title = "A declarative, efficient, and flexible ... - Wikipedia"
      description = ""
      url = "en.wikipedia.org › wiki › React"
      link = "https://en.wikipedia.org/wiki/React" / >

    < YahooPreview
      title = "React Native · A framework for building native apps using React"
      description = "A framework for building native apps using React."
      url = "https://reactnative.dev"
      link = "https://reactnative.dev" / >

    < GoogleMobilePreview
      title = "?React – A JavaScript library for building user interfaces"
      description = "React makes it painless to create interactive UIs."
      url = "https://reactjs.org"
      link = "https://reactjs.org" / >

  < / div >
) 

API

재산	소품 유형	필수의	기본	설명
제목	끈	예	-	제목
설명	문자열 / 노드 / [노드]	-	null	메타설명
URL	끈	예	-	URL
링크	끈	-	#	링크