Litmus Example – Tweets in CSS

.env

TWITTER_CONSUMER_KEY=""
TWITTER_CONSUMER_SECRET=""
TWITTER_SEARCH_STRING="#tedc15 -rt"

app.rb

require 'sinatra'
require 'twitter'
 
helpers do
  def twitter
    @twitter ||= Twitter::REST::Client.new do |config|
      config.consumer_key    = ENV.fetch("TWITTER_CONSUMER_KEY")
      config.consumer_secret = ENV.fetch("TWITTER_CONSUMER_SECRET")
    end
  end
end
 
get "/tweets.css" do
  content_type "text/css"
  tweets = twitter.search(ENV.fetch("TWITTER_SEARCH_STRING"))
  tweets.take(15).map.with_index do |tweet, i|
    <<-CSS
      #tweet-#{i + 1} .copy {
        content: "#{tweet.text}";
      }
    CSS
  end
end

Gemfile

source 'https://rubygems.org'
 
gem 'sinatra'
gem 'twitter'
gem 'puma'
 
group 'development' do
  gem 'foreman'
end

Procfile

web: bundle exec ruby app.rb -p $PORT

View the full example in the litmus/example-css-tweets repo,
or deploy a version to heroku to test your own search terms.

I truely love it. Great job! Seen your result in the Litmus example. Might use it someday. ;-)

Cheers.

Any way you can update this to include pulling down avatar photo, name, handle, and timestamp? 😄

Awesome stuff! Where do you add the Cache-Control? Is it a part of the repo?