R. Mark Volkmann – författare

For front-end web developers familiar with the basics of HTML, CSS, and JavaScript.

 

Svelte and Sapper in Action is a comprehensive guide to building web apps with Svelte and Sapper. You’ll dive straight into coding a complete travel packing app as you learn to write, compile, and organize Svelte components for your app’s UI. From there, you’ll master Svelte’s awesome state management model and learn to use Sapper for simplified page routing, creating static sites, and providing offline support with Service Workers. By the time you’re done, you’ll be able to build web applications that are easier to understand, offer great UX, and don’t compromise on SEO.

 

Creating Svelte applications and components Communicating between Svelte components Routing between pages in both Svelte and Sapper Adding animation to components Debugging, testing, and deploying applications Implementing and invoking REST services in a Sapper app Exporting a Sapper app as a static site

Imagine web apps with fast browser load times that also offer amazing developer productivity and require less code to create. That’s what Svelte and Sapper deliver! Svelte pushes a lot of the work a frontend framework would handle to the compile step, so your app components come out as tight, well-organized JavaScript modules. Sapper is a lightweight web framework that minimizes application size through server-rendering front pages and only loading the JavaScript you need. The end result is more efficient apps with great UX and simplified state management.

 

Rather than loading a framework like Angular, Vue, or React into the browser, Svelte compiles your components into tiny, well-organized JavaScript modules. That means your app loads lightning fast and runs even faster, in part because there’s no need to load “just-in-case” framework code. Svelte also streamlines your UI development with a host of powerful features such as reactive statements, two-way data binding, stores, and context. The Sapper framework pairs perfectly with Svelte for efficient server-side rendering, code splitting, and API development.

htmx is a library that adds logic and server interaction to HTML; you get the effect of using a front-end SPA framework without writing front-end code. Use any server-side programming language and framework to build server applications with endpoints that simply return snippets of HTML. Dynamically update portions of the current web page from HTTP responses. Add interactivity with JavaScript and libraries such Alpine and _hyperscript. Make your apps more secure by escaping user-supplied content and specifying a Content Security Policy. Go beyond basic HTTP requests with WebSockets and server-sent events.

The htmx JavaScript library gives you a new way to craft web applications. The htmx approach differs significantly from that of the currently popular single-page application (SPA) frameworks; rather than write a bunch of JavaScript, you simply annotate HTML elements before you send them to the browser. The resulting code is easier to understand and modify, and because it downloads less to the browser and doesn't need JSON creation and parsing, you'll find it performs better, too.

Rethink web application design; write code in any language that simply responds to requests with htmx snippets.Dynamically update portions of the current web page directly from the server.Implement common patterns such as lazy loading, input validation, CSS transitions, active search, optimistic updates, pagination, infinite scroll, polling, and click-to-edit.Add interactivity with JavaScript and libraries such as Alpine and _hyperscript.Use the htmx JavaScript API to simplify DOM operations.Make your web apps more secure: escape user-supplied content, use Subresource Integrity hashes, and enforce a Content Security Policy.Go beyond the basic HTTP request/response pattern with WebSockets and server-sent events.

Discover a simpler way to implement web applications that emphasizes web fundamentals.

What You Need:

A modern web browser and the ability to build and run a local HTTP server using the server-side language and framework of your choice.The code examples are fully compatible with htmx 2.0.

htmx is a library that adds logic and server interaction to HTML; you get the effect of using a front-end SPA framework without writing front-end code. Use any server-side programming language and framework to build server applications with endpoints that simply return snippets of HTML. Dynamically update portions of the current web page from HTTP responses. Add interactivity with JavaScript and libraries such Alpine and _hyperscript. Make your apps more secure by escaping user-supplied content and specifying a Content Security Policy. Go beyond basic HTTP requests with WebSockets and server-sent events.

The htmx JavaScript library gives you a new way to craft web applications. The htmx approach differs significantly from that of the currently popular single-page application (SPA) frameworks; rather than write a bunch of JavaScript, you simply annotate HTML elements before you send them to the browser. The resulting code is easier to understand and modify, and because it downloads less to the browser and doesn''t need JSON creation and parsing, you''ll find it performs better, too.

Rethink web application design; write code in any language that simply responds to requests with htmx snippets.Dynamically update portions of the current web page directly from the server.Implement common patterns such as lazy loading, input validation, CSS transitions, active search, optimistic updates, pagination, infinite scroll, polling, and click-to-edit.Add interactivity with JavaScript and libraries such as Alpine and _hyperscript.Use the htmx JavaScript API to simplify DOM operations.Make your web apps more secure: escape user-supplied content, use Subresource Integrity hashes, and enforce a Content Security Policy.Go beyond the basic HTTP request/response pattern with WebSockets and server-sent events.

Discover a simpler way to implement web applications that emphasizes web fundamentals.

What You Need:

A modern web browser and the ability to build and run a local HTTP server using the server-side language and framework of your choice.The code examples are fully compatible with htmx 2.0.