DEV Community

Cover image for Embed your dev.to posts in React
Kartik Tyagi
Kartik Tyagi

Posted on

Embed your dev.to posts in React

#npm #react #javascript #hacktoberfest

Hey Reader,
You landed over here that indicates you also want to embed your posts on dev.to into your personal website or any other site in the simplest way possible.
Don't worry! I got you🤟.

Alt Text

I created this NPM package (react-devdotto) to embed your dev.to posts in React App in no time.

Now, let just dive into how it works.

  1. Install react-devdotto: 
npm install --save react-devdotto
Enter fullscreen mode Exit fullscreen mode
  1. Import DevDotTo in the file in which you want to embed posts: 
import DevDotTo from 'react-devdotto
Enter fullscreen mode Exit fullscreen mode
  1. Put below component and replace username with your dev.to username (you'll get it in the URL of your profile): 
<DevDotTo username="genialkartik" />
Enter fullscreen mode Exit fullscreen mode
  1. You can also pass a parameter coverimage={false} to remove cover images from blogs list. *Note: default value of coverimage is true.

Well Done! You did it🥳.

Visit NPM to learn more: NPM

Alt Text

Feeling too lazy to test?
Then just fork project below on CodeSandbox.io & try with the below code snippet:

Want to contribute?

Then just fork and clone this repository on Github.

Github react-devdotto

  • Navigate cd react-devdotto.
  • run npm install to install all required dependencies.
  • Make changes or fix bug.
  • Make sure to run build npm build before commiting all changes.
  • Open a pull request to master or v*** branch. Now lemme buy you a coffee ☕.

Happy Coding!✨

🌐 Get in touch: kartiktyagi.codes
👥 Connect: Linkedin | Twitter | Facebook | Instagram

Top comments (1)

Collapse
 
atulbhattsystem32 profile image
Atul Bhatt •

Nice article. My portfolio was kinda empty. It looks a little filled now.