The IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web

Jamie Tanna (https://www.jvt.me)

The IndieWeb Movement: Owning Your Data and Being the Change You Want to See in the Web

Jamie Tanna (https://www.jvt.me)

/usr/bin/whoami

Front page of www.jvt.me

🚨 Audience Participation 🚨

  • βœ‹ if you post content on Twitter/Medium/Dev.to/etc
  • βœ‹ if you have a personal website
  • βœ‹ if you post content on your personal website
  • βœ‹ if you’ve heard about the IndieWeb before / know what it’s about

Why are you here?

We strive for Free and Open Source software in the world, on mobile, desktop and server. But what about the Web? The IndieWeb is all about taking control, owning your data, and scratching your itches through Open Source and Standards. We're working to take back the Web, and you can, too.

What is the IndieWeb?

Ownership

  • Own your identity
  • Own your data
  • On your site first
  • On your own infrastructure?

Break free from silos

  • “Open”
  • ownership of data

Via https://bradfrost.com/blog/post/write-on-your-own-website/:

Writing on your own website associates your thoughts and ideas with you as a person. Having a distinct website design helps strengthen that association. Writing for another publication you get a little circular avatar at the beginning of the post and a brief bio at the end of the post, and that’s about it. People will remember the publication, but probably not your name.

Shouldn’t you get a choice of what to do with your content?

πŸ’° πŸ‘€

Be Your Own Platform

  • guidelines
  • revolve it around you!
  • make the changes you want/need
  • support from the community
  • don’t just accept the state of play

A Political Statement

Principles

Own Your Data

πŸ“†

https://www.jvt.me/kind/rsvps/ - currently 121 in total!

https://www.jvt.me/rsvps/index.ics

  • Step count
  • Photos
  • Diet

Use & Publish Visible Data

  1. human readable
  2. machine readable

Microformats

Make What You Need / Scratch Your Itch

Solve your problems, not someone else’s

Scratch Your Itch!

Homebrew Website Club Nottingham - “when is it again”?

πŸ“†

https://www.jvt.me/events/homebrew-website-club-nottingham/index.ics

Selfdogfood

Document Stuff

\

  • Let others know you’ve done it
  • Help/motivate someone else
  • Learn by documenting/teaching
  • πŸ¦†

Share under Free/Open Source Licenses

UX/Design is better than technical specifications

Modularity

“platform agnostic platform”

“small pieces loosely joined”

Longevity

Plurality

Fun

Don’t force others to move

Publish (on your) Own Site, Syndicate Elsewhere (POSSE)

Brid.gy

Building Blocks

Identity

Posts

Citability

Syndication

Mentions

Login

Web Actions

Reply Context

Indie Ecosystem

Microformats2

<div class="h-entry">
  <span class="p-author h-card">
    <a class="u-url" href="https://www.jvt.me">
      <img class="u-photo"
        src="https://www.jvt.me/profile.png" alt=""/>
      Jamie Tanna
    </a>
  </span>:
  RSVP <span class="p-rsvp">yes</span>
  to <a href="https://indiewebcamp.nl/"
    class="u-in-reply-to">IndieWebCamp Amsterdam</a>
</div>

Jamie Tanna : RSVP yes to IndieWebCamp Amsterdam

Micropub

Microsub

πŸ‘΄

Server

Client

Won’t it just go the way of RSS?

Webmention

POST /webmention-endpoint HTTP/1.1
Host: aaronpk.example
Content-Type: application/x-www-form-urlencoded

source=https://waterpigs.example/post-by-barnaby&
target=https://aaronpk.example/post-by-aaron

Brid.gy

  • backfeed
  • syndicate

Web Sign In / IndieAuth

Text box requesting URL of user signing in

Authorization server requesting OAuth2 consent for new sign-in

HTTP/2 200
server: nginx/1.14.0
content-type: text/html; charset=UTF-8
cache-control: no-cache
link: <https://aaronparecki.com/auth>;
  rel="authorization_endpoint"
link: <https://aaronparecki.com/micropub>;
  rel="micropub"
link: <https://aaronparecki.com/auth/token>;
  rel="token_endpoint"
link: <https://aaronparecki.com/>; rel="self"
...
date: Wed, 04 Sep 2019 17:44:15 GMT
strict-transport-security: max-age=2592000
x-no-cache: 1
x-cache: BYPASS

<link rel="authorization_endpoint"
  href="https://indieauth.com/auth" />
<link rel="token_endpoint"
  href="https://tokens.indieauth.com/token" />

Rel-Me Auth

<a rel="me" href="https://gitlab.com/jamietanna">
  <i class="fa fa-gitlab" title="GitLab.com Profile"></i>
  &nbsp;@jamietanna
</a>

Getting Started