Git Product home page Git Product logo

tumbless's Introduction

Tumbless

A Tumblr-like blogging platform living in Amazon S3 (and your browser).

Features

Tumbless leverages the capabilities of HTML5 and Amazon S3 to offer a blogging platform without a specialized backend.

  • You can create posts with photos and video
  • Fully responsive layout, great for mobile, tablets and desktop
  • Infinite scrolling
  • Automatic photoset layout: photos are arranged automatically according to aspect ratio and number
  • Full screen gallery
  • Password protected, mobile friendly admin area
  • optional Private, password protected blog
  • Save draft posts
  • Automatically set the post date based on the photo's EXIF data, if any

Follow the instructions below to setup your own Tumbless instance.

How it works

S3 offers pretty good static hosting and a full set of REST APIs to manage and upload content directly from the browser.
Your HTML5 capable browser takes care of:

  • photo scaling on upload
  • posts management from a JSON object (no need for a DB)
  • Video (mp4) upload and thumbnailing posts

Demo page

Here's a simple, read only demo page. Hover in the top right corner or jump here to access the admin interface with password qwerty123. No real S3 bucket is associated with this demo, so upload/edit will not work.

What doesn't work yet

  • Post media from url
  • Themes support
  • Disqus commenting

Migrate from Tumblr to your Tumbless instance

To migrate a tumblr blog to Tumbless you can use this export script.

How to setup your Tumbless instance

1. Create a bucket on Amazon S3

Enable Static Website hosting, and set the index document to index.html.

2. Set the CORS permissions as follows, to allow the authenticated admin user to store files:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
  <CORSRule>
      <AllowedOrigin>*</AllowedOrigin>
      <AllowedMethod>PUT</AllowedMethod>
      <AllowedMethod>POST</AllowedMethod>
      <ExposeHeader>ETag</ExposeHeader>
      <ExposeHeader>x-amz-meta-custom-header</ExposeHeader>
      <AllowedHeader>*</AllowedHeader>
  </CORSRule>
</CORSConfiguration>
3. Set the bucket policy to allow static hosting by default:
{
	"Version": "2008-10-17",
	"Statement": [
		{
			"Sid": "AllowPublicRead",
			"Effect": "Allow",
			"Principal": {
				"AWS": "*"
			},
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::my-bucket-name/*"
		}
	]
}
4. Create an S3 user with IAM

Save the bucket name and the credentials into the admin.json file.

5. Attach this custom policy to it
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "Stmt1455229604000",
            "Effect": "Allow",
            "Action": [
                "s3:PutObject"
            ],
            "Resource": [
                "arn:aws:s3:::my-bucket-name/*"
            ]
        }
    ]
}
5. Configure your blog

Set your blog's title and description in the config.json file. Set the admin password by renaming the admin.json file to admin-mysecureadminpassword.json.

6. [Optional] Make your blog private

Rename the public folder to private-mypassword.

7. Test your blog

Upload the files to your bucket with S3's web interface (s3cmd does not properly recognize MIME types). You can now reach the blog at your bucket public endpoint, i.e., mytumblessblog.com.s3-website.eu-central-1.amazonaws.com. You can reach the admin page by appending ?admin to the URL. S3 also supports static hosting on custom domains, très cool.

If you've read so far, I'd like to hear your feedback. Pull reqs are welcome.

tumbless's People

Contributors

matteobrusa avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

tumbless's Issues

Automated Setup

It would be nice if there was an automated way of setting up the bucket/CORS/Policy/etc. and doing the upload to S3. You might want to take a look at Stout for example.

S3 can't connect

Hi Matt,

I know this an old project, but wondering if I can get your thoughts because I am trying to run this now. I have it all setup. Endpoint is saving it, etc.

Main issue is that I get a popup saying "can't connect to S3" any time I try to add a post. I feel like my permissions set is incorrect, or maybe that S3 Bucket terms have changed in the intervening years.

Any thoughts? I think this is a brilliant idea, would love to implement totally.

Thank you.

--Eric

Demo site

So that functionality can be tested without doing a full install

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.