Fully responsive website built with NextJS, React and Fluent UI, with the aim of providing services and access to all groups of didactic courses and general purposes to students of the University of Milan.
Social media share buttons for your next React apps.
🎁 Features
No dependencies
Compatible with both JavaScript and TypeScript
Share buttons for your next React app
Facebook
Line
Pinterest
Reddit
Telegram
Tumblr
Twitter
Viber
Weibo
Whatsapp
Linkedin
VKShare
Livejournal
Workplace
Pocket
Instapaper
Hatena
FacebookMessenger
Email
Gab
Share counts
FacebookShareCount
HatenaShareCount
OKShareCount
PinterestShareCount
TumblrShareCount
VKShareCount
🔧 Install
next-share is available on npm. It can be installed with the following command:
npm install next-share --save
next-share is available on yarn as well. It can be installed with the following command:
yarn add next-share --save
💡 Usage of ShareButton
🎀 Facebook
👨💻 Code
import{FacebookShareButton,FacebookIcon,}from'next-share';<FacebookShareButtonurl={'https://github.com/next-share'}quote={'next-share is a social share buttons for your next React apps.'}hashtag={'#nextshare'}><FacebookIconsize={32}round/></FacebookShareButton>
import{LineShareButton,LineIcon,}from'next-share';<LineShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><LineIcon/></LineShareButton>
import{PinterestShareButton,PinterestIcon,}from'next-share'<PinterestShareButtonurl={'https://github.com/next-share'}media={'next-share is a social share buttons for your next React apps.'}><PinterestIconsize={32}round/></PinterestShareButton>
import{RedditShareButton,RedditIcon,}from'next-share'<RedditShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><RedditIconsize={32}round/></RedditShareButton>
import{TelegramShareButton,TelegramIcon,}from'next-share'<TelegramShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><TelegramIconsize={32}round/></TelegramShareButton>
import{TumblrShareButton,TumblrIcon,}from'next-share'<TumblrShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><TumblrIconsize={32}round/></TumblrShareButton>
import{TwitterShareButton,TwitterIcon,}from'next-share'<TwitterShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><TwitterIconsize={32}round/></TwitterShareButton>
import{ViberShareButton,ViberIcon,}from'next-share'<ViberShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}><ViberIconsize={32}round/></ViberShareButton>
import{WeiboShareButton,WeiboIcon,}from'next-share'<WeiboShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}image={`${String(window.location)}/${example-image}`}><WeiboIconsize={32}round/></WeiboShareButton>
import{WhatsappShareButton,WhatsappIcon,}from'next-share'<WhatsappShareButtonurl={'https://github.com/next-share'}title={'next-share is a social share buttons for your next React apps.'}separator=":: "><WhatsappIconsize={32}round/></WhatsappShareButton>
Title of the shared page. Note that if Pocket detects a title tag on the page being saved, this parameter will be ignored and the title tag of the saved page will be used instead.
Details changes for each release are documented in the CHANGELOG.md.
💖 Wrap Up
If you think any of the next-share can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to watch/star this repository to revisit.
🌟 Contribution
We'd love to have your helping hand on contributions to next-share by forking and sending a pull request!
Your contributions are heartily ♡ welcome, recognized and appreciated. (✿◠‿◠)
React Patterns – React patterns & techniques to use in development for React Developer.
React Papaparse – The fastest in-browser CSV (or delimited text) parser for React.
Next QRCode – React hooks for generating QR code for your next React apps.
Next Time Ago – A lightweight tiny time-ago component for your next React apps.
⚖️ License
The MIT License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].