ayo, (edited )
@ayo@ayco.io avatar

Recording videos on building a small project /threads page on my site, where I want to display some featured posts that I write from here. I'll keep videos unlisted until I complete the series then will decide if I like the video format or just convert them into... text 😄

ayo,
@ayo@ayco.io avatar

So... this is the thread for recording videos on building /threads on my personal site 🙃

Look, thumbnail templates! 😄

hlegius,
@hlegius@fosstodon.org avatar

@ayo oh! So this is where most of the YouTubers learn from. I hate so much this kind of thumbnail 🤣

ayo,
@ayo@ayco.io avatar

@hlegius haha maybe 😄

ayo,
@ayo@ayco.io avatar

(I'm kidding, I'm not gonna do the thumbnails)

ayo, (edited )
@ayo@ayco.io avatar

ok, exclusive first video 😄 https://youtu.be/ZQCYYOoc5LM

ayo, (edited )
@ayo@ayco.io avatar

A future problem I *want to solve is providing an .rss feed that collects the whole thread into a single article. Because currently the mastodon provided .rss puts out each post as a separate article.

ayo,
@ayo@ayco.io avatar

out of all the things I *want to work on, why am I doing this first? 😄 been fighting burnout for a while, and it just adds extra motivation that I can display my process on my personal site...

maybe it's also that the sun is showing up more recently

ayo,
@ayo@ayco.io avatar

Made some progress on my /threads project! Now getting a cleaned up JSON of threads + their descendants based on a list of status IDs. :)

I wasn't able to screen-record the process because OBS recording on my Ubuntu was having a moment... maybe next time! :mastodondance:

Open source: https://git.sr.ht/~ayoayco/threads

flask server code on a vim with "shades of purple" theme

ayo,
@ayo@ayco.io avatar

happy with this refactor 🤗 https://git.sr.ht/~ayoayco/threads/commit/67bea0768ba1e20c032cbf33b02c69eaae26c4f8

ayo,
@ayo@ayco.io avatar

We have a hackathon today, and I'm working on my /threads project -- which means I can't screen record myself 🤦‍♂️

But here's progress! HTML rendering

animation of /threads showing to threads and a "see more" clickable UI to show descendants

ayo,
@ayo@ayco.io avatar

Some styling and more props to show (media, meta info)

personal /threads project, some styling and more info

ayo, (edited )
@ayo@ayco.io avatar

🎉 /threads page now live: https://ayco.io/threads#

ayo, (edited )
@ayo@ayco.io avatar

🤔 Still have lots to improve. But a good start. https://ayco.io/threads#

ayo,
@ayo@ayco.io avatar

test :mastodondance:

ayo,
@ayo@ayco.io avatar

test
bold
code

ayo, (edited )
@ayo@ayco.io avatar

Markdown now supported on my /threads page:
👉 https://ayco.io/threads/112258065967208438#112338772593135832

Amazing how few lines of code it took because of python-markdown + md-in-html.

:mastodon_oops: See commit: https://git.sr.ht/~ayoayco/threads/commit/fa7f820171614c2a106531e7a753c7820217f5d0

ayo,
@ayo@ayco.io avatar

Need to write JS to fetch next batch of descendants when user scrolls to end of thread 🧵

ayo,
@ayo@ayco.io avatar

Now showing better "time ago" and some anchor to share permalinks that goes directly to a reply card.

https://ayo.ayco.io/threads

ayo,
@ayo@ayco.io avatar

Now I just have to set up my git-send-email to review this patch adding our dockerfile 🤗

ayo,
@ayo@ayco.io avatar

Also considered just using mastodon "pinned" posts for selecting which statuses to feature, but I don't want to end up having lots of pinned posts 🤔

ayo,
@ayo@ayco.io avatar

I also wanna be able to mention and link a /thread post from a blog... I think they work to complement each other

ayo, (edited )
@ayo@ayco.io avatar

oooh an idea: adding an /embed at the end of the url should give an embeddable HTML-only card

  • changed my mind: this should be a separate tiny app "masto-embed"
ayo,
@ayo@ayco.io avatar

I hate the name "/threads" already... what should we call it? "Posts"? 😄 but blogs are also posts...

so these are streams of thought you decide to float to your personal site for being a bit more-effort than other small posts, but still yet to be refined as a blog

ayo,
@ayo@ayco.io avatar

I added a simple "back to top" link on https://ayo.ayco.io/threads

<a id="top"></a>  
<!--- all the content --->  
<a href="#top">Top</a>

saschadiercks,
@saschadiercks@vivaldi.net avatar

@ayo ah… scroll-behavior: smooth might be something you want then :)

ayo,
@ayo@ayco.io avatar

@saschadiercks Thanks! I do want that! Will add it. 😄

ayo,
@ayo@ayco.io avatar

This is so satisfying! Thanks @saschadiercks for suggesting :)

👉 try it out: https://ayo.ayco.io/threads/112258065967208438#112338772593135832

html {  
 scroll-behavior: smooth;  
}

schizanon,
@schizanon@mastodon.social avatar

@ayo starting a YouTube competitor called "channels"

ayo,
@ayo@ayco.io avatar

@schizanon hahaha yeah started out with similar humor like that. Wanted to be at a dinner with family/friends and be able to say “I built my own threads” 😄

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • random
  • everett
  • Youngstown
  • InstantRegret
  • ethstaker
  • slotface
  • PowerRangers
  • Durango
  • vwfavf
  • kavyap
  • tsrsr
  • ngwrru68w68
  • DreamBathrooms
  • mdbf
  • magazineikmin
  • anitta
  • rosin
  • tacticalgear
  • thenastyranch
  • osvaldo12
  • GTA5RPClips
  • khanakhh
  • cisconetworking
  • modclub
  • cubers
  • tester
  • normalnudes
  • Leos
  • provamag3
  • All magazines
    •