O projekcie
sitelo nie zaczęło się jako framework. Zaczęło się od swędzenia, żeby pisać znaczniki w sposób, który w JavaScripcie wydaje się naturalny — i rosło, aż objęło całą drogę od pliku strony do opublikowanej witryny.
javascript-to-html
Najpierw powstało javascript-to-html (znane też jako ht.js): prosty i intuicyjny sposób generowania HTML-a w JavaScripcie, bez skomplikowanych silników szablonów i bez frameworków.
Skoro frameworki z pełnym wyposażeniem, jak React, stały się wszechobecne, znalezienie prostego rozwiązania do szablonów, które nie ciągnie za sobą całego świata, okazało się zaskakująco trudne. Skupiając się wyłącznie na przekształcaniu JavaScriptu w HTML — w gruncie rzeczy na funkcjach zwracających ciągi znaków — ht.js pozostaje lekkie, łatwe w użyciu, elastyczne i rozszerzalne.
Ta niewielka powierzchnia sprawia, że pasuje w wielu miejscach: bezpośrednio na froncie (w stylu SPA), w buildzie do tworzenia stron statycznych (SSG), a nawet do renderowania po stronie serwera (SSR).
Nauczyć Vite wypuszczania HTML-a
To rozwiązywało pisanie. Kolejnym problemem był build: Vite traktuje .js i .ts jak skrypty, nie jak strony. Potrzebna była konwencja, w której pewne moduły są przeznaczone do stania się HTML-em.
Pomysł był prosty: pliki nazwane *.ht.js, *.html.js, *.ht.ts i podobnie powinny być przetwarzane na HTML, zamiast trafiać do paczki jako JavaScript dla przeglądarki. Ta konwencja stała się vite-plugin-html-pages — routing oparty na plikach, wczytywanie danych, zasoby i generowanie statyczne na bazie Vite.
sitelo
sitelo zamyka Vite i tę wtyczkę w jednej instalacji i jednym CLI. Dostajesz całościowe, pierwszorzędne doświadczenie programisty: sitelo dla serwera na żywo, sitelo build dla produkcji, rozsądne ustawienia domyślne i model stron z wtyczki — bez składania łańcucha narzędzi samodzielnie.
Ta sama myśl aż do samego dołu: strony to moduły zwracające HTML. sitelo jest warstwą, która sprawia, że ta myśl wydaje się dokończona.
Jak wypada na tle innych
Dobrych narzędzi do publikowania stron statycznych jest już sporo. Nisza sitelo jest wąska z premedytacją: funkcje JavaScriptu (albo TypeScriptu) zwracające HTML, z doświadczeniem pracy Vite i z możliwie najmniejszą ilością frameworka.
| Narzędzie | Model | Sięgnij po nie, gdy |
|---|---|---|
| sitelo | Funkcje JS/TS → HTML na Vite | Chcesz HTML-a z JavaScriptu przy prawdziwym przepływie pracy Vite — bez frameworka komponentowego |
| Astro | Komponenty + wyspy, własny kompilator | Strony treściowe, które chcą wysp komponentowych i większego ekosystemu |
| Next.js | Pełna aplikacja React (SSR / SSG / ISR) | Budujesz aplikację w ekosystemie Reacta |
| Hugo | Szablony Go, bardzo szybkie buildy | Ogromne serwisy treściowe, a Ty dobrze czujesz się w narzędziach Go |
| Eleventy | Języki szablonów → HTML | Chcesz elastycznych szablonów (Nunjucks, Liquid, …) bez frameworka SPA |
Jeśli chcesz komponentów, hydratacji i frameworka — użyj frameworka. Jeśli chcesz plików HTML z funkcji JavaScriptu przy doświadczeniu Vite, sitelo jest najmniejszym narzędziem, które robi całą robotę.