Suche
Beiträge, die mit dev getaggt sind
HTML is all you need to make a website
🌐 whitep4nth3r.com/blog/html-is-…
#html #html5 #website #webdev #web #dev #smolweb #SmallWeb
HTML is all you need to make a website
HTML-only websites are a controversial and divisive topic. But why?Salma Alam-Naylor (whitep4nth3r.com)
![const BasicLayoutTemplate = async ({ title, SLOT }) => {
const posts = (await (await fetch('https://streamiverse.small-web.org/public/')).json()).splice(0, 3)
return kitten.html`
<main>
<page css>
<h1>${title}</h1>
${SLOT}
<h2>Fediverse posts</h2>
<ul>
${posts.map(post => kitten.html`
<li><img src='${post.account.avatar}'> ${[post.content]}</li>
`)}
</ul>
<style>
li { display: flex; gap: 1em; margin-bottom: 1em; }
img { width: 5em; height: auto; }
</style>
</main>
`
}
export default async () => await kitten.html`
<${BasicLayoutTemplate} title='Async components are fun!'>
<markdown>
Oh, isn’t this __nice?__
</markdown>
</>
`](https://inne.city/photo/preview/640/225173 "const BasicLayoutTemplate = async ({ title, SLOT }) => {
const posts = (await (await fetch('https://streamiverse.small-web.org/public/')).json()).splice(0, 3)
return kitten.html`
<main>
<page css>
<h1>${title}</h1>
${SLOT}
<h2>Fediverse posts</h2>
<ul>
${posts.map(post => kitten.html`
<li><img src='${post.account.avatar}'> ${[post.content]}</li>
`)}
</ul>
<style>
li { display: flex; gap: 1em; margin-bottom: 1em; }
img { width: 5em; height: auto; }
</style>
</main>
`
}
export default async () => await kitten.html`
<${BasicLayoutTemplate} title='Async components are fun!'>
<markdown>
Oh, isn’t this __nice?__
</markdown>
</>
`")
![class BasicLayoutTemplate extends kitten.Component {
async html ({title, SLOT}) {
return kitten.html`
<main id='page' morph>
<page css>
<h1>${title}</h1>
${SLOT}
<${FediversePosts.connectedTo(this)} />
</main>
`
}
}
class FediversePosts extends kitten.Component {
async html () {
const posts = (await (await fetch('https://streamiverse.small-web.org/public/')).json()).splice(Math.floor(Math.random()*6), 3)
return kitten.html`
<div id='posts' morph>
<h2>Fediverse posts</h2>
<ul>
${posts.map(post => kitten.html`
<li><img src='${post.account.avatar}'> ${[post.content]}</li>
`)}
</ul>
<button name='refresh' connect>Refresh</button>
<style>
li { display: flex; gap: 1em; margin-bottom: 1em; }
img { width: 5em; height: auto; }
</style>
</div>
`
}
onRefresh () { this.update() }
}
export default class MyPage extends kitten.Page {
async html () {
return kitten.html`
<${BasicLayoutTemplate.connectedTo(this)} title='Async components are fun!'>
<markdown>
Oh, isn’t this __nice?__
</markdown>
</>
`
}
}](https://inne.city/photo/preview/640/225175 "class BasicLayoutTemplate extends kitten.Component {
async html ({title, SLOT}) {
return kitten.html`
<main id='page' morph>
<page css>
<h1>${title}</h1>
${SLOT}
<${FediversePosts.connectedTo(this)} />
</main>
`
}
}
class FediversePosts extends kitten.Component {
async html () {
const posts = (await (await fetch('https://streamiverse.small-web.org/public/')).json()).splice(Math.floor(Math.random()*6), 3)
return kitten.html`
<div id='posts' morph>
<h2>Fediverse posts</h2>
<ul>
${posts.map(post => kitten.html`
<li><img src='${post.account.avatar}'> ${[post.content]}</li>
`)}
</ul>
<button name='refresh' connect>Refresh</button>
<style>
li { display: flex; gap: 1em; margin-bottom: 1em; }
img { width: 5em; height: auto; }
</style>
</div>
`
}
onRefresh () { this.update() }
}
export default class MyPage extends kitten.Page {
async html () {
return kitten.html`
<${BasicLayoutTemplate.connectedTo(this)} title='Async components are fun!'>
<markdown>
Oh, isn’t this __nice?__
</markdown>
</>
`
}
}")
GitLab CFO, Brian Robins, says they are “aligned with the goals of DOGE, because the company’s software tools aim to help people do more with less. What the Department of Government Efficiency is trying to do is what GitLab does.”
You either support fascism or you don’t. It’s binary. There’s no gray area or “aligning.”
Considering GitLab? Don’t. Use @Codeberg.
(Hat tip @aphyr)
The PHP Way of Life
The PHP Way of Life Manifesto: what is the essence of PHP, how is it different from other development languages.The PHP Way of Life
Do you know any public git repository with excellent commit messages?
Can anybody convince me to use Gitmoji?
Or explain to me why using emojis for categorisation in git commit messages is not worth the effort?
While you're waiting for GitHub to stop being broken, you might want to check out a self-hosting alternative called @forgejo at:
➡️ forgejo.org
Alternatively, if you just want a Forgejo instance to sign up on, check out @Codeberg at:
➡️ codeberg.org
Forgejo is free open source software, and is a community-run hard fork of Gitea.
#GitHub #GitHubDown #CodeForges #Dev #SoftwareDevelopment #SelfHosting #CommunityHosting
Forgejo – Beyond coding. We forge.
Forgejo is a self-hosted lightweight software forge. Easy to install and low maintenance, it just does the job.forgejo.org