Swiftpack.co - swifweb/web as Swift Package

Swiftpack.co is a collection of thousands of indexed Swift packages. Search packages.
See all packages published by swifweb.
swifweb/web 1.0.0-beta.2.1.0
🧱 Write your website in pure Swift with power of webassembly. DOM, CSS and all the WebAPIs are available out of the box.
⭐️ 67
🕓 1 week ago
.package(url: "https://github.com/swifweb/web.git", from: "1.0.0-beta.2.1.0")


MIT License Swift 5.7 Swift.Stream

This library provides DOM, CSS and all possible web APIs beautifully wrapped into Swift ❤️

With it you will easily build your awesome reactive web app in beloved Swift ❤️


Go to webber repository and install it.


Clone spa or pwa template

Go to the project folder and open Package.swift to explore the code.

Then execute webber serve or webber serve -t pwa -s Service for the pwa app to debug your project in the browser.

Then take a look at the hidden .webber folder, you will find the entrypoint/dev folder where webber just generated entry files, you could edit these files if swift is not enough, e.g. to make you custom loading bar.

To release the project just call webber release or webber release -t pwa -s Service for pwa, and then grab production files from .webber/release folder.

// TODO: to be continued soon


Stars: 68
Last commit: 1 week ago
jonrohan Something's broken? Yell at me @ptrpavlik. Praise and feedback (and money) is also welcome.

Release Notes

🚦 Nested routing, page controller lifecycle, and more
1 week ago


We may not want to replace the entire content on the page for the next route, but only certain blocks. This is where the new FragmentRouter comes in handy!

Let's consider that we have tabs on the /user page. Each tab is a subroute, and we want to react to changes in the subroute using the FragmentRouter without reloading use page even though url changes.

Declare the top-level route in the App class

Page("user") { UserPage() }

And declare FragmentRouter in the UserPage class

class UserPage: PageController {
    @DOM override var body: DOM.Content {
        // NavBar is from Materialize library :)
            .item("Profile") { self.changePath(to: "/user/profile") }
            .item("Friends") { self.changePath(to: "/user/friends") }
            .routes {
                Page("profile") { UserProfilePage() }
                Page("friends") { UserFriendsPage() }

In the example above FragmentRouter handles /user/profile and /user/friends subroutes and renders it under the Navbar, so page never reload the whole content but only specific fragments. There are also may be declared more than one fragment with the same or different subroutes and they all will just work together like a magic!

Btw FragmentRouter is a Div and you may configure it by calling

    .configure { div in
        // do anything you want with the div

Breaking changes

ViewController has been renamed into PageController , Xcode will propose to rename it automatically.


PageController now have lifecycle methods: willLoad, didLoad, willUnload, didUnload.

override func willLoad(with req: PageRequest) {
    super.willLoad(with: req)
override func didLoad(with req: PageRequest) {
    super.didLoad(with: req)
    // set page title and metaDescription
    // also parse query and hash
override func willUnload() {
override func didUnload() {

Also you can declare same methods without overriding, e.g. when you declare little page without subclassing

 PageController { page in
    H1("Hello world")
    P("Text under title")
    Button("Click me") {
        print("button clicked")
.onWillLoad { page in }
.onDidLoad { page in }
.onWillUnload { page in }
.onDidUnload { page in }

New convenience methods

alert(message: String) - direct JS alert method changePath(to: String) - switching URL path


Id and Class now can be initialized simply with string like this


Tiny little change but may be very useful.

App.current.window.document.querySelectorAll("your_query") now works!


🚨Please don't forget to update Webber CLI tool to version 1.6.1 or above!

Swiftpack is being maintained by Petr Pavlik | @ptrpavlik | @swiftpackco | API | Analytics