Slide 1

Slide 1 text

From Bird to Elephant: Starting a New Journey on Mastodon Guillaume Laforge Developer Advocate Google Cloud @[email protected]

Slide 2

Slide 2 text

Part 1 Mastodon & Twitter

Slide 3

Slide 3 text

What is Mastodon?

Slide 4

Slide 4 text

joinmastodon.org

Slide 5

Slide 5 text

Welcome to the Fediverse! fediverse.party

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

What is Mastodon? How different is it from Twitter? A network of federated servers

Slide 8

Slide 8 text

What is Mastodon? How different is it from Twitter? A network of federated servers Open source and open protocols

Slide 9

Slide 9 text

What is Mastodon? How different is it from Twitter? A network of federated servers Open source and open protocols Not owned by a single company

Slide 10

Slide 10 text

What’s the experience like? Mooaarrr characters! You can edit your posts!

Slide 11

Slide 11 text

What’s the experience like? Mooaarrr characters! You can edit your posts! Chronological order No algorithm for your timeline

Slide 12

Slide 12 text

What’s the experience like? Mooaarrr characters! You can edit your posts! Chronological order No algorithm for your timeline No search! (just #hashtags) No ads!

Slide 13

Slide 13 text

What’s the experience like? Mooaarrr characters! You can edit your posts! Chronological order No algorithm for your timeline No search! (just #hashtags) No ads! Privacy: fine grained controls Content warnings

Slide 14

Slide 14 text

Getting started

Slide 15

Slide 15 text

Choose a server that resembles you! Pick up a region, a topic, a language. Change your mind? You can migrate to a new server and not lose your followers & following. JoinMastodon.org

Slide 16

Slide 16 text

Use the web frontend of your server on your computer. On mobile: ● Tusky on Android ● Metatext on iOS Pick up a client

Slide 17

Slide 17 text

Tips & tricks

Slide 18

Slide 18 text

Increase your chances to be followed back, by completing your profile to make it more meaningful, more you! Would you follow this one? Create your profile before following anyone

Slide 19

Slide 19 text

Your first “toot” should be your introduction. Tell everyone who you are, and use the #introduction hashtag. Be sure to pin that introduction toot to the top of your timeline. Introduce yourself!

Slide 20

Slide 20 text

Extra step for discoverability, check the box to suggest your account to others, via “trends” and other features. Suggest your account to others

Slide 21

Slide 21 text

Double check that the “opt-out of search engine indexing” checkbox is unchecked, which would make your account not findable easily. Don’t opt out of search engine indexing

Slide 22

Slide 22 text

No need to pay a subscription to be officially verified. Add a tag in the pages mentioned in your profile metadata links. Verify yourself

Slide 23

Slide 23 text

The elephant bird in the room

Slide 24

Slide 24 text

You’re not alone migrating to Mastodon. Check if the people you followed on Twitter are also on Mastodon. Find your Twitter friends on Mastodon ● twitodon.com ● movetodon.org ● fedifinder.glitch.me

Slide 25

Slide 25 text

Put your Mastodon link in your Twitter bio. Your Twitter handle might be taken by someone else impersonating you 30 days after you’ve relinquished your account. If you really quit, request your Twitter archive, for posterity. Don’t delete your Twitter account (yet?)

Slide 26

Slide 26 text

Moa.party is a tool you can use to cross-post on Twitter and Mastodon. Cross-posting is frowned upon though. Avoid automated cross-posting

Slide 27

Slide 27 text

Keep accessibility in mind

Slide 28

Slide 28 text

Use #CamelCase for your #HashTags. Screen readers will appreciate! Use hashtags liberally, to participate in the conversations on that topic. CamelCase HashTags

Slide 29

Slide 29 text

When sharing pictures in your toots, be sure to specify an “alt” tag, so that screen readers can read the description. Use “Alt” tags for your images

Slide 30

Slide 30 text

Be mindful and hide content that may affect others behind “content warnings” (politics, adult, violence, mental health, food…) A label is visible, click on “show more” to read the rest. Same for pictures, click on “sensitive content” to make it appear. Content Warning

Slide 31

Slide 31 text

Going further

Slide 32

Slide 32 text

A treasure trove of tips about Mastodon & the Fediverse Follow @[email protected] Fedi.Tips

Slide 33

Slide 33 text

Running an instance isn’t free. If you can, help sustain your instance administrators by funding it. You can also support the Mastodon developers via Patreon. Help sustain your instance

Slide 34

Slide 34 text

Part 2 The APIs & standards

Slide 35

Slide 35 text

● ActivityPub — W3C protocol based on ActivityStream, and JSON-LD ● WebFinger — RFC to resolve links to resources ● MicroFormats — open CSS based format to embed metadata in HTML ● Security — HTTP signatures and OAuth 2 The importance of standards

Slide 36

Slide 36 text

How to implement a basic ActivityPub server? blog.joinmastodon.org/2018/06/ how-to-implement-a-basic-activitypub-server/ { "@context": [ "https://www.w3.org/ns/activitystreams", "https://w3id.org/security/v1" ], "id": "https://my-example.com/actor", "type": "Person", "preferredUsername": "alice", "inbox": "https://my-example.com/inbox", "publicKey": { "id": "https://my-example.com/actor#main-key", "owner": "https://my-example.com/actor", "publicKeyPem": "-----BEGIN PUBLIC KEY-----..." } } JSON-LD syntax ActivityStream vocabulary A “person” actor An “inbox” to receive messages Asymmetric key cryptography, to sign your messages The “Actor”

Slide 37

Slide 37 text

How to implement a basic ActivityPub server? blog.joinmastodon.org/2018/06/ how-to-implement-a-basic-activitypub-server/ { "subject": "acct:[email protected]", "links": [ { "rel": "self", "type": "application/activity+json", "href": "https://my-example.com/actor" } ] } /.well-known/webfinger?resource=acct:[email protected] Alice’s account ActivityStream vocabulary URL to our actor definition WebFinger to link an account resource to the actor’s URL

Slide 38

Slide 38 text

How to implement a basic ActivityPub server? blog.joinmastodon.org/2018/06/ how-to-implement-a-basic-activitypub-server/ { "@context": "https://www.w3.org/ns/activitystreams", "id": "https://my-example.com/hello-world", "type": "Create", "actor": "https://my-example.com/actor", "object": { "id": "https://my-example.com/hello-world", "type": "Note", "published": "2023-04-12T10:08:46Z", "attributedTo": "https://my-example.com/actor", "inReplyTo": "https://my-example/@bob/100254678717223630", "content": "

Hello world

", "to": "https://www.w3.org/ns/activitystreams#Public" } } The message: a “note” creation activity JSON-LD syntax & ActivityStream vocabulary Actor’s URL Note creation Can reply to another message Lightweight HTML with Microformat classes

Slide 39

Slide 39 text

How to implement a basic ActivityPub server? blog.joinmastodon.org/2018/06/ how-to-implement-a-basic-activitypub-server/ POST /users/bob/inbox HTTP/1.1 HOST: my-example.com Date: 12 Apr 2023 10:08:46 GMT Digest: e37e179c75071a291f90a5fd4f848da87b491f1282f7bb8509ef2115b81ee0f4 Signature: keyId="https://my-example.com/actor#main-key",headers="(request-target) host date digest",signature="Y2FiYW...IxNGRiZDk4ZA==" Content-Type: application/ld+json; profile="http://www.w3.org/ns/activitystreams" Cryptographically signed the message payload RSA-SHA256 digest hash of the message body (request-target): get /users/bob/outbox host: my-example.com date: 12 Apr 2023 10:08:46 GMT digest: e37e179c75071a291f90a5fd4f848da87b491f… RSA-SHA256 digest hash of those headers Same set of headers

Slide 40

Slide 40 text

Part 3 Time for demos!

Slide 41

Slide 41 text

Unlike Twitter, no way to know how many views your “toots” got. Let’s calculate your maximum potential reach, with the following formula: No analytics! potential_reach = me.followers + ∑ boosters i .followers n i=1

Slide 42

Slide 42 text

Get Your Reach! stootistics.web.app

Slide 43

Slide 43 text

There’s even a bot! @[email protected]

Slide 44

Slide 44 text

Vue.js for the frontend with Shoelace web components Java & Micronaut for the server backend Hosted on Google Cloud Run Firebase hosting for the nice URL Cloud Scheduler for scheduling Vue.js + Micronaut

Slide 45

Slide 45 text

Vue.js for the frontend with Shoelace web components Java & Micronaut for the server backend Hosted on Google Cloud Run Firebase hosting for the nice URL Cloud Scheduler for scheduling Vue.js + Micronaut

Slide 46

Slide 46 text

Vue.js for the frontend with Shoelace web components Java & Micronaut for the server backend Hosted on Google Cloud Run Firebase hosting for the nice URL Cloud Scheduler for scheduling Vue.js + Micronaut

Slide 47

Slide 47 text

Vue.js for the frontend with Shoelace web components Java & Micronaut for the server backend Hosted on Google Cloud Run Firebase hosting for the nice URL Cloud Scheduler for scheduling Vue.js + Micronaut

Slide 48

Slide 48 text

ΔEMO Guillaume Laforge Developer Advocate Google Cloud @[email protected]

Slide 49

Slide 49 text

Links! Slides speakerdeck.com/glaforge Code on Github github.com/glaforge/stootistics Article glaforge.dev Mastodon Bot tooters.org/@getmyreach

Slide 50

Slide 50 text

ευχαριστώ Guillaume Laforge Developer Advocate Google Cloud @[email protected]