mastodon / joinmastodon Goto Github PK

The official Mastodon project homepage

JavaScript 6.09% SCSS 0.99% TypeScript 92.23% Dockerfile 0.68%

joinmastodon's Introduction

Mastodon is a free, open-source social network server based on ActivityPub where users can follow friends and discover new ones. On Mastodon, users can publish anything they want: links, pictures, text, and video. All Mastodon servers are interoperable as a federated network (users on one server can seamlessly communicate with users from another one, including non-Mastodon software that implements ActivityPub!)

Click below to learn more in a video:

Navigation

Features

No vendor lock-in: Fully interoperable with any conforming platform

It doesn't have to be Mastodon; whatever implements ActivityPub is part of the social network! Learn more

Real-time, chronological timeline updates

Updates of people you're following appear in real-time in the UI via WebSockets. There's a firehose view as well!

Media attachments like images and short videos

Upload and view images and WebM/MP4 videos attached to the updates. Videos with no audio track are treated like GIFs; normal videos loop continuously!

Safety and moderation tools

Mastodon includes private posts, locked accounts, phrase filtering, muting, blocking, and all sorts of other features, along with a reporting and moderation system. Learn more

OAuth2 and a straightforward REST API

Mastodon acts as an OAuth2 provider, so 3rd party apps can use the REST and Streaming APIs. This results in a rich app ecosystem with a lot of choices!

Deployment

Tech stack

Ruby on Rails powers the REST API and other web pages
React.js and Redux are used for the dynamic parts of the interface
Node.js powers the streaming API

Requirements

PostgreSQL 12+
Redis 4+
Ruby 3.1+
Node.js 18+

The repository includes deployment configurations for Docker and docker-compose as well as specific platforms like Heroku, Scalingo, and Nanobox. For Helm charts, reference the mastodon/chart repository. The standalone installation guide is available in the documentation.

Development

Vagrant

A Vagrant configuration is included for development purposes. To use it, complete the following steps:

Install Vagrant and Virtualbox
Install the vagrant-hostsupdater plugin: vagrant plugin install vagrant-hostsupdater
Run vagrant up
Run vagrant ssh -c "cd /vagrant && bin/dev"
Open http://mastodon.local in your browser

MacOS

To set up MacOS for native development, complete the following steps:

Use a Ruby version manager to install the specified version from .ruby-version
Run bundle to install required gems
Run brew install postgresql@14 redis imagemagick libidn to install required dependencies
Navigate to Mastodon's root directory and run brew install nvm then nvm use to use the version from .nvmrc
Run yarn to install required packages
Run corepack enable && corepack prepare
Run RAILS_ENV=development bundle exec rails db:setup
Finally, run bin/dev which will launch the local services via overmind (if installed) or foreman

Docker

For development with Docker, complete the following steps:

Install Docker Desktop
Run docker compose -f .devcontainer/docker-compose.yml up -d
Run docker compose -f .devcontainer/docker-compose.yml exec app .devcontainer/post-create.sh
Finally, run docker compose -f .devcontainer/docker-compose.yml exec app bin/dev

If you are using an IDE with support for the Development Container specification, it will run the above docker compose commands automatically. For Visual Studio Code this requires the Dev Container extension.

GitHub Codespaces

To get you coding in just a few minutes, GitHub Codespaces provides a web-based version of Visual Studio Code and a cloud-hosted development environment fully configured with the software needed for this project..

Click this button to create a new codespace:
Wait for the environment to build. This will take a few minutes.
When the editor is ready, run bin/dev in the terminal.
After a few seconds, a popup will appear with a button labeled Open in Browser. This will open Mastodon.
On the Ports tab, right click on the “stream” row and select Port visibility → Public.

Contributing

Mastodon is free, open-source software licensed under AGPLv3.

You can open issues for bugs you've found or features you think are missing. You can also submit pull requests to this repository or submit translations using Crowdin. To get started, take a look at CONTRIBUTING.md. If your contributions are accepted into Mastodon, you can request to be paid through our OpenCollective.

IRC channel: #mastodon on irc.libera.chat

License

This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License along with this program. If not, see https://www.gnu.org/licenses/.

joinmastodon's People

Contributors

Stargazers

Watchers

Forkers

latrani hyperobject enterstudio progval nolanlawson mightypork ndarville janisz tomfhowe thekinrar fermuch neet unarist bogolt lindwurm jeangauthier jdrew1303 joe-achim ragingscholar aral joachimesque ashfurrow unasuke olistik eriatolc jmontane gjorando kagucho halcy enterprisey maciej-trebacz nightpool harmon758 wooodhead tropeas connyduck artoria2e5 toxel yookoala ifurther websiteinspiration eurinaiz stjordanis geopjr-forks unextro zusorio oakstudios thatonecalculator gunchleoc extrasaucestudio jfitzsimmons dhuschde sfermigier cybertailor rarous veselcraft hubyrod shrinks99 jordmondson koyuawsmbrtn sqwu anjolovic askagirl starfall-system thaodan ashkyd chuckn408 productinfo eloquence ajunlonglive wbnns stevoisiak renchap roydigerhund backbayrider garridinsi advaith1 dimillian cutls jennschiffer userquin hgwt738 chatquick ay8s philippemiguet tapbots cassidyjames jsoref jorgesumle textoo tosunkaya nvella nclm 00mjk souserge dylanalezra noppefoxwolf takke mttvll h3poteto

joinmastodon's Issues

Add "Getting started" button to "How it works" section

Supposed I want to learn more before joining.
This section...

...would send me to this section...

Now that I know about how Mastodon works, my desire to actually join is there - but there is no button to let me go on.

My suggestion:

Add a "Get started" - button:

to the "How it works" section.

enhancement: "Notable users" info

As a way to show Mastodon's reach, possibly as part of the feature list (#4), there could be a list of orgs using Mastodon, e.g. Pixiv, Numerama, etc.

The lang attribute doesn't change with the selected language

https://joinmastodon.org/ has a lang attribute in its<html> tag, which is a good thing when it comes to accessibility.
However, when changing the language of the page using the language picker in the top right part of the screen, the value of the attribute doesn't change. Whatever the selected language is, the attribute value will always be en.

Weblate

Title is self-explanatory, joinmastodon.org should be translatable on Weblate.

CSS: sponsors aren't appropriately sized at <800px widths

Open source the "What is Mastodon" video

Pinging @Gargron

While not a joinmastodon issue per se, I couldn't find another way to request this, so: please release the What is Mastodon video under YouTube's CC BY license, so that it can be reuploaded into Wikipedia or the Internet Archive.

https://www.youtube.com/watch?v=IPSbNdBmWKE

Instance not listed

Since some days I've reopened registrations on my instance mastodonten.de. The instance is listed on instances.org but doesn't appear on joinmastodon. Since some days there are always the same instances shown (but there are so much more on instances.social?)

I would like to have listed mastodonten.de on joinmastodon.org.

Create a link that opens in given locale

It would be nice to have a link that already opens with a given locale. Something in the query string would already be enough, a subdomain would be perfect :)

Make the <title> translatable

As of now, the <title> is static. Since there's a catch phrase there, it might be a good idea to translate it to different languages.

Poor indication of awesome huge instance list

The only indication of mastodon runnign on many servers is hidden in the few pixels of the custom styled scroll bar in the top right:

My suggestion would be to either make a prominent statement about the actual number of servers running, – or – have a more prominent scroll bar style. Key is to not be shy about the length of that list.

Update press articles

New York Times: https://www.nytimes.com/2018/03/28/technology/social-media-privacy.html

TechCrunch Japan: https://jp.techcrunch.com/2017/04/20/mastodon/

PCmag: http://uk.pcmag.com/social-networking/88927/opinion/avoid-the-nutballs-and-conflict-on-mastodon

NPR: https://www.npr.org/sections/thetwo-way/2018/05/01/607361849/as-facebook-shows-its-flaws-what-might-a-better-social-network-look-like

The wizard component doesn't get re-rendered when the locale is being changed

Small GIF of what's happening

License?

I can't find any info how is joinmastodon licensed…

Add a "Mobile application" section

It would be great for new user to easily know that there is already several mobile application existing and avoiding them the trouble of looking for one or missing one that might suit their need better.

Top contributors

As there is list of sponsors, there should also be list of top contributors of Mastodon source code, and list of translators for each language. I think that because they are making Mastodon better directly (not through donations), they deserve place for them even more.

Anchor links only work on second click

On Firefox clicking on buttons that are linking to #anchors seem to only work on a second click. Maybe there is some javascript thing going on?!

Color scheme on landing page adding extra visual weight

What is the reason to have this information on the main page?
Seems to me like putting this somewhere less prominent would reduce the weight of the page.
It isn't relevant for that many people that want to join mastodon.

How can a "instance picker" support a healty federated grouth

Idea.

Choses an (informed) arbitrary number for a healthy base of users for an instances. Say 20-200 users then base the ordering on user GROWTH in this range.

Then new instances are responsible to push there install into view and they should then organically grow with referrals based on visibility before dropping back to self grouth after they reach a sustainable size.

Healthy "federated" grouth rather than a few huge instances.

Just one idea.

Instance picker section blocked by uBlock Origin

uBlock Origin (v.1.13.4) in Firefox 54 is blocking the list in the Instance picker section.

Replace the press kit by an Identihub page

Identihub is a new FLOSS project to create a simple assets-downloads/visual-guidelines page for a project, with logos, colours and images ready to download. The page can be hosted on https://identihub.co or self-hosted (https://github.com/uracreative/identihub).

Could Mastodon benefit from it? So that journalists, instance admins, users and other projects can find the image they need. The ZIP file that is currently the press kit becoming a web page.

It would have:
– All the logo variations,
– The four colours,
– All the elephant illustrations,
– And something that is afaik missing, nice screenshots of the Mastodon UI.

The 'lang' parameter does not work correctly

When navigating to https://joinmastodon.org/ and selecting "Nederlands (nl)" from the list, the page is nicely translated (awesome! 👍 )

When navigating to https://joinmastodon.org/?lang=nl-NL the menu bar is translated, but the rest of the page remains in English. This appears to be a bug?

“Download press kit” link does not work

It just points to the top of page (“#”).

Instance listing window isn't correctly framed

On my computer, when I scroll to the bottom of the instance list frame, the scroll (grey thing on the right) go below the frame bottom border and the last instance doesn't appear correctly in the frame but is mostly out of it.

Here's a screenshot of the result, you can see that the last instance insn't shown in the frame :
https://framapic.org/dHV1WZds5NfG/z4cRAvXeRVnM.png

With Firefox 60.0.1 (64bits) on a debian.

Remove national flags in the language selector

I suppose that the national flags in the language selector should be removed, because

The national flag of the United Kingdom is representing for English language.
The national flag of United Arab Emirates is representing for Arabic language.

But many other countries speaks these languages.

enhancement: Main-page feature overview

Per Gargron in Discord:

"It kinda needs something between https://discordapp.com/features and https://www.discourse.org/ below the fold"

Sign up wizard categories are redundant

For the part where you choose "I am a ...", some of the choices return exactly the same results. For example, "a developer" and "a sysadmin" is exactly the same set of instances.

Perhaps either collapse this into a more generalistic "techie" category, or rethink the usage of categories? Invariably, there will be some overlap between use-cases and some niches might be much closer than others.

Sponsor on Liberapay

9 months ago Mastodon joined Liberapay to accept donations. This is a open source and non-profit donation platform for libre creators and project like Mastodon. Could the link to Liberapay also be added beside the Patreon option?

"Become a sponsor" on the homepage and the sponsor page now links only to Patreon. This could be changed to "Sponsor on Patreon" and second button "Sponsor on Liberapay".

Mastodon's profile on Liberapay.

Some widgets are invisible at mobile phones

The language selector and search box in the Get started: Choose an instance section are invisible at mobile phones.

Not working

joinmastodon.org is not offering a list of instances, says "no results. . . for now"
Seems that instances.social is down. Have left a report there as well. Seems like a bad time for this to go down, since many people are looking for alternatives to Facebook...

enhancement: Instance suggestion page

A page that asks a few questions from users and suggests an instance pulled from an opt-in database.

Mockup is available here:

https://latrani.github.io/joinmastodon/

This will need a backend and a way for instance admins to add themselves (providing the language info, description blurb, etc)

Some design doc stuff is here: https://public.etherpad-mozilla.org/p/Z3rHK08QsZ

key part of the website can't be translated?

It seems the main part of the website is not in the translation strings?

As you can see the top bar is translated (to Polish in this case), but the page 'body' is in English, and not in strings in the repo.

Performance - Reflow issues

I noticed some performance issues lately on joinmastodon.org, appearing a few seconds after what looks like the initial load.

A quick profiling seems to point to the react-custom-scrollbars triggering a massive reflow for a couple of seconds, but I'll investigate more in-depth.

Screenshot of the profiling + JSON profile are attached

joinmastodon-reflow-profile.json.zip

Favicon is React logo

The favicon is the react logo! 🙂

Elephant go on top of navbar

Hi 👋
A very small graphic issue.
When I choose Deutsch the elephant on top of the website go on top of the navbar.
Screenshot below.

'Help me choose' button looks bad on mobile devices

On Moto X Play, 1080x1920, latest Chrome Beta

How to register on source.joinmastodon.org

It's good to see mastodon on https://source.joinmastodon.org/mastodon/joinmastodon eventually may able to move https://github.com/tootsuite/mastodon to it. @Gargron
May i know how to register on https://source.joinmastodon.org/users/sign_in ? and mastodon.online credentials doesn't work for it

Finding sites by Tag/catogory

It's not a good step to take the hierarchy root (category) rather than the horizontal root (tags) and folksonamy/ tag cloud.

The step to use top defined category is a judgment. Me feels a misstep can understand it easer to have a fixed list but doing it right is not usually the easiest thing to do.

Can we look at this agen.

Add social metatags

Add metatags to support enhanced links in social media and communicators.
https://dev.twitter.com/cards/types/summary-large-image
http://ogp.me

How to get our instance listed here?

thanks!

Chinese/Japanese font-family are not able to be "font-weight: 500"

Thanks for merge Japanese translation 👍

Btw its SCSS seems to specified font-weight as 500 for <strong> elements. I think it's nice design,
But sadly Chinese/Japanese characters usually doesn't have deference between font-weight: 400 and 500.

Screenshot:

Because we're using over 2000 characters and some are not supported such as 500, 700 etc. (If a designer designed 2000 letters in nine ways from 100 to 900, they must die.)

Anyway, could you change the strong element's style for font-weight: 600 / or apply a language-specific class such as .ja to parent elements such as body and apply styles appropriate for each languages?

JSON context URL http://joinmastodon.org/ns wrongly outputs HTML homepage

Causes friendica/friendica#10740

The URL http://joinmastodon.org/ns is used as a JSON @context URL with an expected JSON output . This output is used for JSON-LD compacting and expanding.

However today it outputs the HTML homepage of the website, even with the HTTP header Accept: application/ld+json. This makes any JSON-LD compacting or expanding operation on a JSON-LD document including http://joinmastodon.org/ns in their @context list fail with no possible recovery.

Please restore the former JSON content of the https://joinmastodon.org/ns URL which is used by several ActivityPub projects including https://github.com/superseriousbusiness/gotosocial and Friendica.

Add support for browsers without Javascript

Hi,

When using a browser without Javascript enabled, joinmastodon.org only shows a black page.
Given that this is a static page, would it be possible to send browsers the static HTML page directly?

Client 'Fedi' missing in the apps section

https://www.fediapp.com/

Compress Images?

Hey there! What are your thoughts on compressing images to save bandwidth and improve page speed? Here's a summary of results I got from non-lossy compression:

And here's what it looks like with lossy compression:

Personally I think the lossiness look identical enough for the savings, and we could review the before/after in a PR. Just let me know which one you want and I'll send a PR.

Cloudflare email protection

Hi,

When Javascript is not enabled, the “How it works” contains:

Each user account has a globally unique name (e.g. @[email protected])”.

This is probably caused by Cloudflare's email obfuscation.
As it does not seem to be needed on joinmastodon, could you disable it?

enhancement: "Get Involved" page

There are lots of ways for folks to contribute to Mastodon as a project aside from forking it on Github; a 'get involved' link referencing community outreach, adminning, translation, etc etc, would be great to have alongside or possibly replacing the fork link.

See https://docs.google.com/document/d/1u-VoYemLXplvzEqnKOzMGikyIwTj9hLLYCO4fH44T9I/edit

Enhancement: make sure people know they can pick any server and join with "get started" button

A compliant I have seen about joinmastodon.org is that clicking "get started" simply sends you to the "sign up" section without even explaining stuff like "joining any of these servers puts you in the Fedverse". A one-line summary for "how it works" should be added to the "get started" anchor so people know what they are doing with the "here is where I can sign up:" thing.

There is some "how it works" info on the join home page, it's just people are not guaranteed to read it. A video is nice, but not everyone has the time to watch it; the text description is at the bottom, so people may as well get confused and close the page without looking at it.

Translations

Since this is becoming Mastodon’s official website, it should be multilingual! It’s currently not really possible to send the link to anyone not reading English since they won’t get anything, ever though Mastodon itself is well localised and the community covers a wide range of languages.

Use standard fork link

Maybe we can use the standard icons to feature the GitHub repository? Would be more recognizable

Bug: Instance finder looks very weird on mobile

"I speak all languages" is cut off on the right, icons are squeezed, ...

Chrome 65 on Android