Skip to content

Commit

Permalink
Update browser app instructions
Browse files Browse the repository at this point in the history
  • Loading branch information
kateinoigakukun committed Mar 9, 2024
1 parent 54d735e commit 3baaabe
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 31 deletions.
77 changes: 47 additions & 30 deletions src/getting-started/browser-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,56 +13,73 @@ already automated with `carton`.

### System Requirements

- macOS 10.15 and Xcode 11.4 or later.
- [Swift 5.2 or later](https://swift.org/download/) and Ubuntu 18.04 for Linux users.
- [Swift 5.9.2 or later](https://swift.org/download/)

### Installation

On macOS `carton` can be installed with [Homebrew](https://brew.sh/). Make sure you have Homebrew
installed and then run:
1. Create a directory for your project and make it current:

```sh
brew install swiftwasm/tap/carton
```

You'll have to build `carton` from sources on Linux. Clone the repository and run
`swift build -c release`, the `carton` binary will be located in the `.build/release`
directory after that.
Assuming you already have Homebrew installed, you can create a new Tokamak
app by following these steps:

1. Install `carton`:

```
brew install swiftwasm/tap/carton
mkdir MyApp && cd MyApp
```

If you had `carton` installed before this, make sure you have version 0.6.1 or greater:
2. Initialize the project:

```
carton --version
swift package init --type executable
```

2. Create a directory for your project and make it current:

```
mkdir TokamakApp && cd TokamakApp
3. Add Tokamak and carton as dependencies to your `Package.swift`:

```swift
// swift-tools-version:5.8
import PackageDescription
let package = Package(
name: "MyApp",
platforms: [.macOS(.v11), .iOS(.v13)],
dependencies: [
.package(url: "https://github.com/TokamakUI/Tokamak", from: "0.11.0"),
.package(url: "https://github.com/swiftwasm/carton", from: "1.0.0"),
],
targets: [
.executableTarget(
name: "MyApp",
dependencies: [
.product(name: "TokamakShim", package: "Tokamak")
]),
]
)
```

3. Initialize the project from a template with `carton`:

```
carton init --template tokamak
4. Add your first view to `Sources/main.swift`:

```swift
import TokamakDOM

@main
struct TokamakApp: App {
var body: some Scene {
WindowGroup("Tokamak App") {
ContentView()
}
}
}

struct ContentView: View {
var body: some View {
Text("Hello, world!")
}
}
```

4. Build the project and start the development server, `carton dev` can be kept running
5. Build the project and start the development server, `swift run carton dev` can be kept running
during development:

```
carton dev
swift run carton dev
```

5. Open [http://127.0.0.1:8080/](http://127.0.0.1:8080/) in your browser to see the app
6. Open [http://127.0.0.1:8080/](http://127.0.0.1:8080/) in your browser to see the app
running. You can edit the app source code in your favorite editor and save it, `carton`
will immediately rebuild the app and reload all browser tabs that have the app open.

Expand Down
2 changes: 1 addition & 1 deletion src/getting-started/testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -81,5 +81,5 @@ subdirectory when you build in release mode.
## Building and running the test suite with `carton`

If you use [`carton`](https://carton.dev) to develop and build your app, as described in [our guide
for browser apps](./browser-app.md), just run `carton test` in the
for browser apps](./browser-app.md), just run `swift run carton test` in the
root directory of your package. This will automatically build the test suite and run it with a WASI runtime for you.

0 comments on commit 3baaabe

Please sign in to comment.