Twitter Gallery

Twitter Gallery (based on Vue.js) is using Twitter Official API to fetch media (photos and videos) from a Twitter Profile and then display it in a masonry gallery layout.

Demo Preview (Images)

You will need to create an app in Twitter Developer Portal and get Bearer Token.


  • Search Photos
  • Search Videos
  • Preview Large Image or Video in Lightbox
  • Play Video in ArtPlayer or Native HTML5 Player
  • Open Image in New Tab for Full View, Save Image, Zoom-in, Zoom-out, Rotate


Node.js for development & build

Project setup

  • Create an App in Twitter Developer Portal
  • Generate Bearer Token
  • Clone the Repository
  • Add Bearer Token in .env file. e.g. VUE_APP_TWITTER_TOKEN=AAAAAAToken.....
  • Run npm install or yarn add in Terminal to add all dependencies
  • Run npm run serve or yarn serve for Compiles and hot-reload for development
  • Run npm run build or yarn build for Compiles and minifies for production

Customize configuration

See Configuration Reference & Vue.js documentation.


View Github