Разработка веб приложения с нуля. Часть 3.

В промежутках между работой, погрузился в изучение движка Svelte. Роутинг сделан реально удобно:

  • URLом становится путь к файлу +page.svelte начиная от папки routes.
  • страница собирается из файлов +layout.svelte и файла +page.svelte.
  • содержимое файлов layout вкладывается друг в друга начиная с верхнего уровня и в то что получилось кладется содержимое page.

Система похожа на ранний пхп. Когда в хтмл пихали скрипты в клювиках и сервер их обрабатывал перед выдачей клиенту. Тут так же работает.

Файлы page состоят из кода в теге script и хтмл кода. В хтмл можно вставлять js код или переменные. Все переменные реактивны. Разумеется есть всякие биндинги, шаблоны для отрисовки объектов в цикле (for each), или не отрисовки (if). Все как в любом современном движке.

Файлы svelte это компоненты. Можно импортировать их в другие компоненты и потом вставлять в ХТМЛ. Для того чтобы не путаться теги компонентов пишут с большой буквы. Общие компоненты рекомендуют класть в папку lib.

В папке static лежат статические файлы.

По итогу, чтобы не париться с формой и думать о содержимом я скопировал готовые странички отсюда https://www.shadcn-svelte.com/blocks. Как хорошо что все веб приложения одинаковы.

Разработка веб приложения с нуля. Часть 3. | Сетка — социальная сеть от hh.ru