shakedown.social is one of the many independent Mastodon servers you can use to participate in the fediverse.
A community for live music fans with roots in the jam scene. Shakedown Social is run by a team of volunteers (led by @clifff and @sethadam1) and funded by donations.

Administered by:

Server stats:

267
active users

#webc

0 posts0 participants0 posts today
ShnizmuffiN<p><a href="https://toots.inbutts.lol/tags/introduction" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>introduction</span></a></p><p>I make websites. Sometimes I toot about it.<br><a href="https://toots.inbutts.lol/tags/eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>eleventy</span></a> <a href="https://toots.inbutts.lol/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a> <a href="https://toots.inbutts.lol/tags/php" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>php</span></a> <a href="https://toots.inbutts.lol/tags/statamic" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>statamic</span></a> <a href="https://toots.inbutts.lol/tags/laravel" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>laravel</span></a> <a href="https://toots.inbutts.lol/tags/tailwindcss" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>tailwindcss</span></a> <a href="https://toots.inbutts.lol/tags/alpinejs" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>alpinejs</span></a> uhhh whatever <a href="https://toots.inbutts.lol/tags/sql" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>sql</span></a> and I guess <a href="https://toots.inbutts.lol/tags/nginx" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>nginx</span></a> <a href="https://toots.inbutts.lol/tags/docker" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>docker</span></a> and all that crap all the way down. <a href="https://toots.inbutts.lol/tags/fullstack" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>fullstack</span></a></p><p>I play RPGs with friends. Sometimes I toot about it.<br><a href="https://toots.inbutts.lol/tags/ttrpg" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>ttrpg</span></a> <a href="https://toots.inbutts.lol/tags/dnd" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>dnd</span></a> <a href="https://toots.inbutts.lol/tags/pathfinder" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>pathfinder</span></a> <a href="https://toots.inbutts.lol/tags/5e" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>5e</span></a> <a href="https://toots.inbutts.lol/tags/pf2e" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>pf2e</span></a> </p><p>I am my group's sysadmin. Sometimes I toot about it.<br><a href="https://toots.inbutts.lol/tags/selfhosted" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>selfhosted</span></a> <a href="https://toots.inbutts.lol/tags/plex" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>plex</span></a> <a href="https://toots.inbutts.lol/tags/lemmy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>lemmy</span></a> <a href="https://toots.inbutts.lol/tags/mastodon" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>mastodon</span></a> <a href="https://toots.inbutts.lol/tags/pihole" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>pihole</span></a> and throw some darts at <a href="https://selfh.st" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">selfh.st</span><span class="invisible"></span></a> and you catch the rest.</p><p>Hot takes, bad jokes, etc.</p>
ShnizmuffiN<p>I just launched <a href="https://catalog.muralarts.org" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">catalog.muralarts.org</span><span class="invisible"></span></a> for Mural Arts Philadelphia. (Design by <a href="https://CooperGraphicDesign.com" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">CooperGraphicDesign.com</span><span class="invisible"></span></a>.)</p><p>Built with <span class="h-card" translate="no"><a href="https://fediverse.zachleat.com/@zachleat" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>zachleat</span></a></span>'s <a href="https://toots.inbutts.lol/tags/eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>eleventy</span></a>, <a href="https://toots.inbutts.lol/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a>, and a bastardized version of the `eleventy-image` plugin that makes optimized CSS background images. I call it back-breaker.</p><p>Rendering very many AVIF images suuuuuucked on my potato PC, but it was absolutely necessary for such an image heavy design.</p>
Ollie Boermans<p>Oh man, just figured out what I was doing wrong `:<span class="h-card" translate="no"><a href="https://mastodon.social/@text" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>text</span></a></span>="exif. Flash"` was _never_ going to work. I spent much too long looking at the data.</p><p>Fortunately `<span class="h-card" translate="no"><a href="https://mastodon.social/@text" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>text</span></a></span>="exif. Flash"` totally does! 🤦‍♂️</p><p><span class="h-card" translate="no"><a href="https://fediverse.zachleat.com/@zachleat" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>zachleat</span></a></span> I’m guessing `:<span class="h-card" translate="no"><a href="https://mastodon.social/@text" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>text</span></a></span>` doesn’t mean `<span class="h-card" translate="no"><a href="https://mastodon.social/@text" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>text</span></a></span>` so we can still `:<span class="h-card" translate="no"><a href="https://mastodon.social/@text" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>text</span></a></span>="'hello'"`?</p><p><a href="https://mastodon.social/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a></p>
Pelle Wessman<p><span class="h-card" translate="no"><a href="https://fediverse.zachleat.com/@zachleat" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>zachleat</span></a></span> What's the state of <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a> would you say? </p><p>It's a bit hard to say by looking at the repo alone, where no commits or release can be seen in the last 1.5 years: <a href="https://github.com/11ty/webc" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">github.com/11ty/webc</span><span class="invisible"></span></a></p><p>I see that the <a href="https://mastodon.social/tags/11ty" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>11ty</span></a> WebC base has seen updates recently and I noticed you mentioned it to <span class="h-card" translate="no"><a href="https://mastodon.social/@brad_frost" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>brad_frost</span></a></span> the other day <a href="https://fediverse.zachleat.com/@zachleat/113319126440275811" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">fediverse.zachleat.com/@zachle</span><span class="invisible">at/113319126440275811</span></a></p><p>Maybe do what <span class="h-card" translate="no"><a href="https://mastodon.social/@ada" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>ada</span></a></span> did to her web component helper and do a commit to update the README with current state? <a href="https://github.com/AdaRoseCannon/html-element-plus/commit/9e6d4e5ad0966f205302a804f096aaf14c15e15c" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/AdaRoseCannon/html-</span><span class="invisible">element-plus/commit/9e6d4e5ad0966f205302a804f096aaf14c15e15c</span></a></p>
Fynn Ellie Becker<p>I finally finished the blog post I started 3 months ago about rebuilding my website with WebC and going all minimal design.</p><p><a href="https://fynn.be/blog/website-rebuilt-webc/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">fynn.be/blog/website-rebuilt-w</span><span class="invisible">ebc/</span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Fynn Ellie Becker<p>Look at that, basic semantic highlighting for WebC component tags and keyword attributes inspired by Vue’s VS Code extension.</p><p><a href="https://github.com/mvsde/vscode-webc#semantic-highlighting" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/mvsde/vscode-webc#s</span><span class="invisible">emantic-highlighting</span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Fynn Ellie Becker<p>I was thinking wrong about this. The VS Code feature we want are not symbols but definitions. Fortunately, definitions are not too hard to implement.</p><p>So, the newest extension version comes with support for “Go to Definition” and “Peek Definition”.</p><p>The readme also got an upgrade with feature screenshots.</p><p>Next up on the to do list would be “Go to References” and “Peek References”. Another cool feature, somewhat related to definitions.</p><p><a href="https://github.com/mvsde/vscode-webc" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">github.com/mvsde/vscode-webc</span><span class="invisible"></span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Fynn Ellie Becker<p>It might not look amazing yet, but the prove of concept for Ctrl + clickable WebC component tags is here.</p><p>This currently uses VS Code’s document links, which are relatively straightforward to implement, but technically not the correct way to do symbol linking.</p><p>So, when I have more time, I’ll dig into the symbol API for extensions, which conveniently lacks any useful documentation / example implementations whatsoever.</p><p><a href="https://github.com/mvsde/vscode-webc/releases/tag/v0.2.0" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">github.com/mvsde/vscode-webc/r</span><span class="invisible">eleases/tag/v0.2.0</span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Fynn Ellie Becker<p>So… I got side-tracked while writing a blog post about the WebC migration of my <span class="h-card" translate="no"><a href="https://fosstodon.org/@eleventy" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>eleventy</span></a></span> powered website and long story short, I created a VS Code extension for WebC instead 😅</p><p>It’s super basic for now, providing just the `.webc` to HTML file association and suggestions for WebC-specific HTML attributes including links on hover to the documentation.</p><p>I have more plans though, for example linking tags to their respective files so you can Ctrl+Click.</p><p><a href="https://marketplace.visualstudio.com/items?itemName=fynn.vscode-webc" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">marketplace.visualstudio.com/i</span><span class="invisible">tems?itemName=fynn.vscode-webc</span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Fynn Ellie Becker<p>Finally merged and published the WebC rework and light redesign of my website.</p><p>I’m by no means a designer (anymore) so I kept things basic and pushed myself to hit that deploy button already after weeks and weeks of being uncertain about it 😅</p><p>The site now runs on <span class="h-card" translate="no"><a href="https://fosstodon.org/@eleventy" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>eleventy</span></a></span> v3 and is fully migrated to ESM, no CommonJS anymore.</p><p><a href="https://fynn.be" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="">fynn.be</span><span class="invisible"></span></a></p><p><a href="https://mastodon.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> <a href="https://mastodon.social/tags/11ty" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>11ty</span></a> <a href="https://mastodon.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a></p>
Lene Saile<p>I have just released version 3.0 of Eleventy Excellent, now fully on ESM and with many other changes, including my attempts to learn more about WebC and web components. Contributions very welcome! 💚 </p><p><a href="https://eleventy-excellent.netlify.app/blog/eleventy-excellent-30/" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">eleventy-excellent.netlify.app</span><span class="invisible">/blog/eleventy-excellent-30/</span></a></p><p><a href="https://front-end.social/tags/11ty" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>11ty</span></a> <a href="https://front-end.social/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a></p>
Lene Saile<p>I would like to share some thoughts about working with <a href="https://front-end.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a>. <br>For some time now I have been using it on a component basis in <a href="https://front-end.social/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> sites that otherwise depend primarily on Nunjucks or Liquid. The "non-traditional WebC usage" (<a href="https://www.11ty.dev/docs/languages/webc/#non-traditional-webc-usage" rel="nofollow noopener" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">11ty.dev/docs/languages/webc/#</span><span class="invisible">non-traditional-webc-usage</span></a>). </p><p>For components without major complexity, this is something that works well for me. However, I have also tried to rely entirely on WebC, which, as I understand it, is the intended approach.</p>
Chris Coleman<p>I've got a cool <a href="https://mastodon.social/tags/eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>eleventy</span></a> site in the works. Well, the actual end result will not be that interesting, but it's going to be a fun one to build.</p><p>I've got a hopelessly out-of-date Drupal site with broken deployments that I'd rather not fix, so I wrote some fairly simple scrapers to grab most of the content and directly generate new <a href="https://mastodon.social/tags/markdown" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>markdown</span></a> files.</p><p>It's all going to be built with <a href="https://mastodon.social/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a> and a few <a href="https://mastodon.social/tags/webcomponents" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webcomponents</span></a>.</p>
The Spicy Web<p>All right <a href="https://social.spicyweb.dev/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebDev</span></a> nerds, we got some 🌶️ spicy content on the blog for you today! 🤓</p><p>A writeup and code/demos all about server-rendering <a href="https://social.spicyweb.dev/tags/WebComponents" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebComponents</span></a> via <a href="https://social.spicyweb.dev/tags/Node" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Node</span></a> in three popular flavors: <a href="https://social.spicyweb.dev/tags/Enhance" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Enhance</span></a>, <a href="https://social.spicyweb.dev/tags/Lit" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Lit</span></a>, and <a href="https://social.spicyweb.dev/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a>!</p><p>Also a ton of thoughts about the future of these technologies and how to promote a portable view layer of web applications in an <a href="https://social.spicyweb.dev/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>HTML</span></a>-first world.</p><p>Take a peek and then hop in our Discord to chat more about all these groovy features!</p><p><a href="https://www.spicyweb.dev/web-components-ssr-node/" rel="nofollow noopener" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">spicyweb.dev/web-components-ss</span><span class="invisible">r-node/</span></a></p>
Kee Hinckley<p>I’ve been very quiet here because I’m pretty much 100% focused on getting my consulting/blog site up. Once that’s up and feeding posts into the Fediverse, I’ll reload it with all of my old posts (going back to 1997). And probably a few new ones about how I built the site from <a href="https://infosec.exchange/tags/Eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>Eleventy</span></a> and <a href="https://infosec.exchange/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a>, which has been a fun journey. And then I can finally focus on writing more about everything I’ve been talking about here.</p>
Luke in Windsor<p><a href="https://universeodon.com/tags/WEBC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WEBC</span></a> Trails grand opening today, tour, safety protocols, speeches and cupcakes 🧁 Met and talked to a few really great people there, great fun 🙂</p>
Ashur Cabrera<p><a href="https://front-end.social/tags/WebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>WebC</span></a> folks!</p><p>Is it possible to import a component using a dynamic value? 🤔 Something sort of like this:</p><p>```<br>---<br>component: my-component<br>---<br>&lt;any-tag-name<br> :webc:import="'./components/' + component + '.webc'"<br>&gt;&lt;/any-tag-name&gt;<br>```</p>
Mia (web luddite)<p>There are many examples of using webc:type="js" to loop over items in <a href="https://front-end.social/tags/eleventy" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>eleventy</span></a> <a href="https://front-end.social/tags/webc" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webc</span></a>, but none of the examples pass along more than simple strings in component properties.</p><p>Is it possible to loop over more complex components, and pass in entire objects or collections? I can't figure out how to do it. </p><p><span class="h-card"><a href="https://fosstodon.org/@eleventy" class="u-url mention" rel="nofollow noopener" target="_blank">@<span>eleventy</span></a></span></p>
Aral Balkan<p>Just saw the Eleventy announcement and looked up WebC and found a different WebC which is actually C embedded in HTML – basically, think PHP but with C instead — and all I can think is… why? *shudder*</p><p><a href="http://webcprecompiler.com/" rel="nofollow noopener" target="_blank"><span class="invisible">http://</span><span class="">webcprecompiler.com/</span><span class="invisible"></span></a></p><p>(I wrote my very first web app – for checking out books from my university’s library, which they didn’t understand or use – circa 1993 in C only because I had to. There was nothing else to use.)</p><p><a href="https://mastodon.ar.al/tags/webC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>webC</span></a> <a href="https://mastodon.ar.al/tags/notThatWebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>notThatWebC</span></a> <a href="https://mastodon.ar.al/tags/theOtherWebC" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>theOtherWebC</span></a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>web</span></a> <a href="https://mastodon.ar.al/tags/c" class="mention hashtag" rel="nofollow noopener" target="_blank">#<span>c</span></a></p>