Webbens glömda dröm: Sidor som ändrar sig själva i realtid
Webs dröm som försvann: Sidor som redigerar sig själva i realtid
Tänk tillbaka på när en hemsida bara var en fil. En vanlig index.html på en servermapp. Du kände direkt kopplingen mellan filen och det som dök upp i webbläsaren. Det var enkelt och ärligt.
Sedan kom ramverk som PHP, WordPress och Node.js. Sidorna blev abstrakta. De genereras varje gång av databaser och API:er. Din sajt förvandlades till ett system istället för en grej.
Tänk om vi kunde återuppliva den gamla magin?
Read-write-webbens comeback
Webben skulle från början vara tvåvägs. Inte bara läsning, utan redigering och samarbete. Det glömdes bort för länge sen.
Nu vaknar idéerna till liv igen:
- TabFS från Omar Rizwan visar hur filbaserat tänkande öppnar nya dörrar
- Statiska generators som 11ty bevisar att enkelhet räcker för snygga sajter
- mmm.page och Beaker Browser testar decentraliserade, redigerbara ytor
Gemensamt: längtan efter sajter som känns som riktiga dokument.
Experiment: HTML-fil som ändrar sig själv
Idén är galen men möjlig. En enda index.html som redigerar sin egen kod. Via en inbyggd yta i webbläsaren. Ändra text, se det live, spara direkt i filen.
HTML är normalt statisk. Men med browser-API:er funkar det.
Så här gör du:
- Fånga ändringar med JS och DOM-lysning
- Spara DOM som HTML-kod
- Skriv till fil via File API
- Lägg till panel för struktur, stil och meta
Resultatet: en levande sida. Klicka, redigera, spara. Filen är din sajt igen.
Hantera mer än text: Meta och CSS
Svårigheten ligger i det osynliga. Titel, meta-taggar, CSS och scripts i <head>.
Bygg en kontrollpanel som fixar:
- Dokumentmeta (titel, beskrivning)
- CSS-regler inline
- Script-inställningar
- JSON-data för sidan
- Förhandsgranskning
Som en visuell editor för sidans grundkod. Inte bara innehåll – hela strukturen.
Varför det här förändrar webben
Det är inte bara nostalgi. Det har praktiska fördelar:
Enkel hosting: Funkar på statiska plattformar som NameOcean cloud hosting, GitHub Pages eller Netlify. Inga databaser.
Versionering: Filen är sanningen. Git hanterar allt naturligt.
Snabbhet: Ren HTML laddar blixtsnabbt. Inga queries eller rendering.
Maktspridning: Vem som helst fixar sin sajt utan kodkunskaper. Din kompis portfolio blir enkel.
Frihet: Inga lås till plattformar. HTML överlever allt.
Verklighetskoll: Begränsningar
Inte perfekt:
- File API-block: Kan inte skriva fritt i filsystemet. Behöver backend eller download.
- Skala: Toppar för personliga sajter, inte stora appar.
- Samarbete: Flera användare kräver konflikthantering.
- Avancerat: Autentisering och realtid behöver mer infrastruktur.
Bygg din egen
Testa så här i JS:
// Lyssna på ändringar
document.addEventListener('input', (e) => {
if (e.target.contentEditable === 'true') {
// Uppdatera DOM
updateContent(e.target);
// Skapa HTML-sträng
const fullHTML = document.documentElement.outerHTML;
// Spara via backend eller fil
saveFile(fullHTML);
}
});
Koppla till serverless som Netlify Functions. Nu har du en fungerande self-editing-sajt.
Tänkesättet som sticker ut
Det här tvingar dig se sajten annorlunda. Inte som separat system. Editor och innehåll smälter samman.
Det är webcraft: små, självständiga grejer du förstår helt. Lätt att tweak och deploya.
Inte för alla projekt. Stora appar behöver arkitektur. Men portfolios, bloggar, landningssidor? Perfekt.
Vad kommer sen?
Webbens read-write-dröm lever. Den sover bara. Verktyg som det här väcker den.
Frågan är: vad bygger du om du redigerar sajten som en vanlig fil?
Hostar du en self-editing-sajt? NameOcean's molnhosting och domäntjänster gör det smidigt att köra statisk HTML överallt. Lägg till serverless – och du har en stark webbnärvaro utan krångel.