Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/swifweb/webber
👨🍳 Web apps cook tool. It helps to debug and release your SwifWeb apps.
https://github.com/swifweb/webber
pwa spa swift web webapp
Last synced: about 2 months ago
JSON representation
👨🍳 Web apps cook tool. It helps to debug and release your SwifWeb apps.
- Host: GitHub
- URL: https://github.com/swifweb/webber
- Owner: swifweb
- License: mit
- Created: 2021-02-15T14:24:53.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-12-15T00:56:04.000Z (9 months ago)
- Last Synced: 2024-04-14T10:59:49.126Z (5 months ago)
- Topics: pwa, spa, swift, web, webapp
- Language: Swift
- Homepage: https://swifweb.com
- Size: 160 KB
- Stars: 30
- Watchers: 4
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Webber
Powerful console tool for cooking your swifweb apps
## Requirements
macOS 10.15 and Xcode 11.4 or later.
or
any ubuntu supported on [swift.org](https://swift.org/)
## Installation
#### macOS
On macOS `webber` can be installed with Homebrew. Make sure you have Homebrew installed and then run:
```bash
brew install swifweb/tap/webber
```
to update already installed version run
```bash
brew upgrade webber
```
#### Ubuntu
1. Install swift manually or via [swiftlang.xyz](https://www.swiftlang.xyz)
2. Install `binaryen`
```bash
apt-get install binaryen
```
3. Install `wasmer`
```bash
curl https://get.wasmer.io -sSfL | sh
```
4. Install `npm`
```bash
apt-get install npm
```
5. Install `webber`
```bash
cd /opt
git clone https://github.com/swifweb/webber
cd /opt/webber
swift build -c release
ln -s /opt/webber/.build/release/Webber /usr/bin/webber
exec bash
```
6. Start using it inside of your project folder
To update `webber` to latest version just do
```bash
cd /opt/webber && git pull && swift build -c release
```
## Usage
If you already have a project then just go to its folder in console
If you don't then manually `git clone` a template and then go to its directory
### New project
You can either simply execute `webber new` or clone one of templates manually
```bash
git clone https://github.com/swifweb/spa-template myspawebsite
cd myspawebsite
open Package.swift # to work with code
webber serve # to launch in browser
```
progressive web app
```bash
git clone https://github.com/swifweb/pwa-template mypwawebsite
cd mypwawebsite
open Package.swift # to work with code
webber serve -t pwa -s Service # to launch in browser
```
### Development
if your project is `single page application` then this command will be enough to start working
```bash
webber serve
```
This command do:
- compile your project into webassembly file
- cook needed html and js files, store them into `.webber` hidden folder inside project directory
- spinup local webserver
- open default browser to see your web app (it is on http/2 by default with self-signed cert, so add it into system)
- watch for changes in the project directory, rebuild project automatically and update page in browser
if you clone the `pwa` template then you should additionally provide the following arguments:
- `-t pwa` to say `webber` that your project should be cooked as PWA
- the name of your service worker target e.g. `-s Service`
so in the end `serve` command for `pwa` template could look like this
```bash
webber serve -t pwa -s Service -p 443 --browser chrome --browser-self-signed --browser-incognito
```
#### Additional parameters
`-v` or `--verbose` to show more info in console for debugging purposes
`-d` or `--debug-verbose` to show even more details about each step of webber execution
`-p 443` or `--port 443` to start webber server on `443` port instead of default `8888`
`--browser chrome/safari` to automatically open desired browser, by default it doesn't open any
`--browser-self-signed` needed to debug service workers locally, otherwise they doesn't work
`--browser-incognito` to open additional instance of browser in incognito mode, works only with chrome
`--toolchain` to set custom toolchain e.g. `webber serve --toolchain 5.9-SNAPSHOT-2023-08-06-a`
### Release
for SPA just run
```bash
webber release
```
for PWA execute it this way
```bash
webber release -t pwa -s Service
```
and then grub your files from `.webber/release/`
### How to serve release files with `nginx`
1. Install nginx by the [official instrucation](https://www.nginx.com/resources/wiki/start/topics/tutorials/install/)
2. Edit `/etc/nginx/mime.types` add `application/wasm wasm;` in order to serve `wasm` files correctly
3. Generate SSL certificate with letsencrypt (or anything else)
4. Declare your server like this
```ruby
server {
server_name yourdomain.com;
listen [::]:443 ssl;
listen 443 ssl;
ssl_certificate /etc/letsencrypt/live/yourdomain.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/yourdomain.com/privkey.pem;
include /etc/letsencrypt/options-ssl-nginx.conf;
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
ssl_session_cache shared:SSL:10m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
add_header Strict-Transport-Security "max-age=31536000; includeSubdomains;";
ssl_stapling on;
ssl_stapling_verify on;
root /app/yourdomain.com/.webber/release;
location / {
try_files $uri $uri/ /index.html;
}
location ~* \.(js|jpg|png|css|wasm)$ {
root /app/yourdomain.com/.webber/release;
expires 30d;
add_header Cache-Control "public, no-transform";
}
}
```
## Credits
Infinite thanks to the [swiftwasm](https://github.com/swiftwasm) organization for their
- awesome swift fork adopted for webassembly
- awesome [JavaScriptKit](https://github.com/swiftwasm/JavaScriptKit) which is used under the hood of the `web` package
- awesome [carton](https://github.com/swiftwasm/carton) tool which was an inspiration for creating `webber` to cover all the needs