HyperSwift - a HTML and CSS Generator

About

HyperSwift (name pending) is a DSL written purely in Swift aimed to generate HTML styled with CSS.

Main Features

• Vertical and Horizontal stack wrappers
• Native HTML Elements
• CSS Stylesheet generation

Code Snippits

505 Page from garrepi.dev:

import HyperSwift

VStack(justify: .center, align: .center) {
  HStack(justify: .spaceEvenly, align: .center) {
    Image(url: "/images/error_bomb.png")
      .width(100)
      .height(100)
    Header(.header3) { "HTTP 500" }
      .font(weight: "bold", size: 40, family: "SF Mono")
  }          
  Paragraph(fiveOfiveMessage)
}
.backgroundColor(GColors.lightRed)
.textAlign(.center)
.margin(5, .percent)
.display(.flex)
.shadow(x: 20, y: 30, color: GColors.cardShadow)
.border(width: 1, color: .black)

CSS

To add CSS to the stylesheet, you have to call one of the functions defined in CSSExtensions.swift.
If an element has a class name, the styles will automatically be added to CSSStyleSheet.swift's stylesheet.
Calling .generateStyleSheet() on CSSStyleSheet.swift will return a string containing the stylesheet.

Examples

HyperSwift is being used on garrepi.dev as we speak! Checkout the source code here.

Usage

in your Package.swift:

. . .
.package(url: "https://github.com/johngarrett/HyperSwift", .branch("main")),
. . .

Contributing

I would love help with this -- there's a lot that needs to get done.

I have little free time and an even little-er ability to focus on one project. Feel free to send in a PR with ideas, suggestions, or actual code!

reach out to me on twitter if you have questions I can answer