Swiftpack.co - Package - Swift-Squirrel/NutView

CircleCI platform SPM swift

NutView

Amazing template language for web development used n Swift Squirrel web framework (see: Swift Squirrel)

Installing

Add NutView as dependency in your Package.swift

// swift-tools-version:4.0

import PackageDescription

let package = Package(
    name: "Your app",
    products: [
        // Your products
    ],
    dependencies: [
        .package(url: "https://github.com/Swift-Squirrel/NutView.git", from: "1.0.2"),
        // Other dependencies
    ],
    targets: [
        .target(
            name: "Your Target",
            dependencies: [..., "NutView"]),
    ]
)

And in source add import line

import NutView

Usage

NutView uses special swift-like syntax in .nut.html files which provide great readability for swift developers.

Directory structure

NutView use two important directories.

  • First (default name: "Nuts") contains another three subdirectories with .nut.html files (Views, Layouts, Subviews). In theese three directories you can add another directories or add and edit .nut.html files.
  • Second (defualt name: "Fruits") contains generated files from your .nut.html files. (Don't change content of this directory)

You can change this directories with

NutConfig.nuts = "SomeDir/SomeAnotherDir1/NutsDir"
NutConfig.fruits = "SomeDir/SomeAnotherDir2/FruitDir"

Nuts/Views

Contains page specific content. For example if we have blog and we want to have page with certain post our view will contain only post information and not layout, header, footer etc...

Nuts/Subview

Contains reusable parts of page. For example header or footer.

Nuts/Layout

This is actualy our web layout. You can refer to layout from Views which pin View content to Layout at the place where is \View()

Commands

Commands starts with \ symbol. You can escape \ symbol with \\

|Name|Syntax|Semantic| |:--|:--|:--| |Expression|\(<expression>)| Evaluates expression in parentheses and escapes html characters| |Raw expression| \RawValue(<expression>)| Evalutes expression| |Block end|\}|Indicates block end in if, for statements| |If
Else if
Else|\if <expression> {
\} else if <expression> {
\} else { | If expression is true run commands in given block otherwise run else if else block if exists| |If let
Else if let|\if let <variableName> = <expression> {
\} else if let <variableName> = <expression> { | If expression is not nil store result in variableName and run commands in given block otherwise run else if else block if exists| |Subview|\Subview(<expression>)|Add content of given subview at position of this command. Note: name is using dot notation so instead of MySubviewSubdirectory/Mysubview.nut.html write MySubviewSubdirectory.Mysubview.| |For|\for <variable> in <Array>
\for (<key>, <value>) in <Dictionary>| Iterates over array([Any]) or dictionary([String: Any])| |Date| \Date(<expression>)
\Date(<expression>, fromat: <expression>) | Evaluates expression and print date in given format. If format is not set, NutView use default date format specified in NutConfig.dateDefaultFormat: String { set get }| |Layout|\Layout(<expression>)| Reffer View to Layout. name is using dot notation so instead of MyLayoutSubdirectory/MyLayout.nut.html write MyLayoutSubdirectory.MyLayout.| |Title| \Title(<expression>) | Set <title><\title> header of html document |Head|\Head(<expression>)|Add expression result inside html head tag| |Body|\Body(<expression>)|Add expression result at the end of html body tag| |View|\View()| Indicates where to place View|

Note: For evaluating expressions we use Evaluation

Implicit variables

Some variables are implicit so you don't have to send them as data.

  • view - This variable contains View name

Examples

Sources/main.swift

import NutView

let indexView = View(name: "Index") // We don't have to write .nut.html 
let indexContent = try indexView.getContent()
print(indexContent) // prints generated content of index

struct PostData {
    let title: String,
    let body: String,
    let isNew: Bool
}
let postData = PostData(title: "Squirrels", body: "Squirrels are best!", isNew: false)
let postView = try View(name: "Posts.Post", with: postData) // note we write . instead of /
let postContent = try postView.getContent()
print(postContent) // prints generated content of page with given data

let postContentData = try postView.present() // Data representation of view

For more examples check Examples or Squirrel docs -> Views

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

Authors

  • Filip Klembara - Creator - github

See also CONTRIBUTORS to list of contributors who participated in this project.

License

This project is licensed under the Apache License Version 2.0 - see the LICENSE file for details