Введение

Добро пожаловать в учебник по Svelte. Здесь вы узнаете, что создавать лёгкие и быстрые Web-приложения совершенно не сложно.

Вы также можете обращаться к документации API и к примерам, или - если вам не терпится начать прямо сейчас — Быстрый старт за 60 секунд.

Что такое Svelte?

Svelte — это инструмент для создания быстрых web приложений.

Он похож на такие Javascript фреймворки, как React и Vue, которые преследуют общую цель — облегчить создание удобных интерактивных пользовательских интерфейсов.

Но есть существенное отличие: Svelte преобразует ваше приложение в идеальный JavaScript во время сборки, а не интерпретирует код приложения в своей среде выполнения. Это означает, что вы не платите производительностью за абстракции фреймворка и меньше ждёте при первой загрузке приложения.

С помощью Svelte можно собрать приложение целиком или постепенно добавить его в существующий проект. Также можно создавать компоненты в виде автономных пакетов, которые могут работать где угодно, не требуя лишних зависимостей, в отличие от обычных фреймворков.

Как пользоваться учебником

Вам нужно иметь базовые знания HTML, CSS и JavaScript, чтобы понять Svelte.

По мере прохождения учебника вам будут показаны мини-упражнения, призванные проиллюстрировать новые функции. Более поздние главы основаны на знаниях, полученных ранее, поэтому рекомендуется изучать Svelte по порядку глав. При необходимости, можно перейти в любой раздел учебника, кликнув по заголовку('Введение / Основы').

В каждой главе учебника будет кнопка 'Покажи Мне', которую можно нажать, если при выполнении задания у вас возникли трудности. Постарайтесь использовать ее как можно реже. Вы будете учиться быстрее, если поймете, куда должен быть вставлен тот или иной блок кода и собственноручно напечатаете его в редакторе.

Понимание компонентов

В Svelte приложение состоит из одного или нескольких компонентов. Компонент — это многократно используемый автономный блок кода, который изолирует разметку, стили и поведение, которые связаны друг с другом и записаны в единый файл .svelte. Посмотрите на пример 'Привет, мир' в редакторе кода — так выглядит простейший компонент.



			
loading editor...
loading Svelte compiler...


			
loading editor...

Compiler options

result = svelte.compile(source, {
generate:
});


			
loading editor...