This is great! A few thoughts:

• I think we need a second, larger set of icons for the "bigger" opencollective sponsors. Any way to work that in?

• Could we switch the svg group hover thing to be on the left vs the right? That'll hopefully balance out the page.

• I'll fix this if need be after merge, but maybe having the actual commands vs commented out in the example would be good?

  # download the installation script
  wget https://dokku.com/installer/latest/bootstrap.sh
  # run the installer
  sudo DOKKU_TAG=v0.27.4 bash bootstrap.sh
  # Configure your server domain
  dokku domains:set-global dokku.me
  # and your ssh key to the dokku user
  echo "your-public-key-contents-here" | dokku ssh-keys:add admin
  # create your first app and you're off to the races!
  dokku apps:create test-app

SVG hover group is now to the left

Quickstart instructions have been updated

Still thinking on your first point. Need to figure out how best to present them.

@josegonzalez I went through the OpenCollective API and I couldn't find a way to get the list of biggest financial contributors. This is the page I am referring to. The issue is that Dokku doesn't have different financial tiers with significant difference.

If I go with the "Sponsors" tier, it only returns one org. API url. My personal recommendation is to keep it the way it is for now and if we can figure out a nice way to bridge this gap, we can implement it later.

Thoughts?

Other than this do you see anything as a blocker for this PR?

Also @josegonzalez thoughts on using "An open source PAAS alternative to Heroku." instead of "The smallest PAAS implementation you have ever seen." and maybe replacing the sub-heading with "Dokku is a single-host PAAS that helps you build and manage the lifecycle of applications." on the homepage?

This makes the purpose of Dokku clear and also lists the biggest difference (single-host) in the main heading.

It's not actually single-host, you can use it against Kubernetes or Nomad (the plugins are official). The biggest difference is that you self-host vs having someone else manage it for you.

I was under the impression that it is single host after looking at some articles + a Twitter thread. Don't have the links handy but well, in that case, we can make the sub-heading "Dokku helps you build and manage the lifecycle of applications from building to scaling"?

Yeah thats probably better :)

Made the copy change.

I feel like the homepage is missing the context that some asciinema can add. This is also something you recommended in the issue #5175 I am already developing the UI. It is 95% done. @josegonzalez do you think you can record three asciinemas for me? The sooner I get them, the quicker I can turn around and finish it off. I am creating three tabs of "Create", "Deploy" and "Scale". Let me know if you have different naming suggestions :)

I can do that, most likely wednesday.

Added Asciinema tabs on homepage that will showcase the create, deploy, and ship steps. Latest screenshot attached below.

I went about a slightly round-about way of implementing asciinema because if I embedded the script directly as suggested by asciinema, the player has the height of 0 for the embeds in hidden tabs and so doesn't work when we toggle the hidden tabs.

I observed this behavior only on Chrome. Safari and Firefox worked perfectly fine. But quite a few people use Chrome so need to cater to that as well.

Before we merge this in, we will need to update the asciinema link based on the recordings you provide me.

@josegonzalez did you get a chance to put something together? :)

@josegonzalez really hoping to get this finalized and merged this month if possible. Let me know if I can help other than recording the asciinema :)

App creation: https://asciinema.org/a/497945
App deployment: https://asciinema.org/a/497946
App scaling: https://asciinema.org/a/497948

These can be turned into gifs like so: https://github.com/asciinema/asciicast2gif

I wonder if we should do that and have a light/dark version of each gif?

We can also just embed the asciicasts (would be easier to update them long-term that way).

I just linked the casts. I think the default asciinema color scheme goes well with dark + light mode so there is no need to explicitly create separate color versions. And also, like you said, this way future updates will be easier.

@josegonzalez Just fixed the merge conflicts. The branch is ready for review and merge. 👍 You only need to change the stylesheet link before/after merge but that should be the only change required.

@josegonzalez just checking in. Is there anything I can do to help test this and get it merged? :)

Ah sorry. Last week was a bit hectic and I've been recovering. I'll have some time to look at this Wednesday and get it merged :)

Hey @josegonzalez any updates on this? :)

Hi @josegonzalez just checking in. Let me know if I can help in any way to get this done ✅

Needs a rebase which I was gonna try to do this weekend and ship it for Monday. If you wanna do that, we'll be good :)

Done :)

It seems like you need to do some release procedure for the website to work correctly. The stylesheet is not the one that I included in this PR and some assets are not loading (e.g the svg logo). This is what I see on my end:

Yeah I'm doing that now. I triggered a patch release as soon as I clicked the merge button.

Sounds good. You might want to tweak the asset paths a bit because the logo and the social nav bar icons (on the documentation pages) are not loading due to a path issue.

@yasoob mind going through and doing some qa on the site?