@ironeko/next-static-tweets
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.1 • Public • Published

    Next Static Tweets

    Next Static Tweets builds upon the work done by Lee Robinson and Maxime Heckel to abstract boilerplate code and introduces some helpful hooks to help render Tweets statically in Next.js MDX sites.

    Installation

      npm i @ironeko/next-static-tweets
    

    Usage

    In your getStaticProps:

    // pages/post.js
    
    import { getTweets } from '@ironeko/next-static-tweets';
    
    export const getStaticProps = async () => {
    
      // getTweets will automatically find any components named <Tweet>, but it also takes a `regex` config to
      // in case you want to customise it
      const tweets = await getTweets({ markdown: "<Tweet id="1475482722877546510" />" });
    
      return {
        props: {
          tweets,
        },
      };
    };

    Then wrap your Page export in withTweets:

    // pages/post.js
    
    import { withTweets } from '@ironeko/next-static-tweets';
    
    function Post() {
      // ...
    }
    
    export default withTweets(Post);

    Then wherever your MDX gets converted into components, for example:

    import { MDXProvider } from '@mdx-js/react';
    import { useTweet, Tweet as TweetPrimitive } from '@ironeko/next-static-tweets';
    
    function Tweet(id) {
      const { getById } = useTweet();
      return <TweetPrimitive {...getById(props.id)} />;
    }
    
    function RenderMyMDXArticle() {
      return <MDXProvider components={{ Tweet }}>{children}</MDXProvider>;
    }

    ⚠️ You shouldn't use the Tweet component in production, it's just for quick testing. Internally it doesn't use next/image so you should most likely re-implement it.

    🚨 Internally we use the Twitter V2 API, which unfortunately does not have any endpoints to fetch videos or GIFs. The Tweet component deals with this by displaying a warning on hover.

    Keywords

    none

    Install

    npm i @ironeko/next-static-tweets

    DownloadsWeekly Downloads

    0

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    350 kB

    Total Files

    20

    Last publish

    Collaborators

    • creativiii