Ruben Rudov
Posted on March 11, 2021
In this post, we'll look at how we use Twitter post and Twitter time-line embedding via ReactJS.
First of all, create a react project and then, run it on the localhost:
npx create-react-app my-app
cd my_app
npm start
Then, type in the "my_app" folder's terminal:
npm install --save react-twitter-embed
Import the next at the top of App.js:
import { TwitterTweetEmbed, TwitterTimelineEmbed } from 'react-twitter-embed'
Now, for displaying the user's profile time-line we'll add the next to our code:
<TwitterTimelineEmbed
sourceType="profile"
// The preferred screen name goes next:
screenName="WHO"
// Style options goes here:
options={{ height: 600 }}
/>
Now, If we prefer to embed only 1 specific tweet, we'll do the next steps:
1) Go to the tweet and tap the "more options" button.
2) Tap on the "embed tweet button" and copy the tweet ID (the last section of the link it gives you on this website).
3) write the next in your code and change the tweet ID with your tweet ID:
<TwitterTweetEmbed
// Here goes your copied ID.
tweetId={"1365778691414974470"}
// Style options goes here:
optins={{width: "900px"}}
/>
Thanks for reading, for viewing the results you can click on the link: https://corona-web-ruby.firebaseapp.com/
For other open-source React and Android native development, you can go to my GitHub: https://github.com/rubenrudov
Posted on March 11, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.