Skip to content

Latest commit

 

History

History
133 lines (102 loc) · 2.7 KB

README.md

File metadata and controls

133 lines (102 loc) · 2.7 KB

Examples

Go to the examples directory and run yarn run start, this will build the types and the example and then run it. You can also use the configurations of the examples as a template.

Now open some code with an editor that understands TypeScript and see what happens, for example Visual Studio Code.

code examples/gjs/browser

Gtk-3.0 Browser

gtk-3-browser

This example uses ESM when building the types and executing GJS.

Source: GJS Bundler: Webpack
Module: ESM

Build and run:

cd /examples/gjs/gtk-3-browser
yarn run start

Gtk-3.0 Builder

gtk-3-builder

Source: GJS Bundler: Webpack
Module: CommonJS

Build and run:

cd /examples/gjs/gtk-3-builder
yarn run start

Gtk-3.0 Editor

gtk-3-editor

Source: GJS Bundler: Webpack
Module: CommonJS

Build and run:

cd /examples/gjs/gtk-3-editor
yarn run start

Gtk-3.0 Hello Gtk

gtk-3-hello

Source: GJS Bundler: Webpack
Module: CommonJS

Build and run:

cd /examples/gjs/gtk-3-hello
yarn run start

Gtk-4.0 ListStore

gtk-4-list-store

GJS example showing how to build Gtk4 applications using Gtk.TreeView and Gtk.ListStore

Source: GJS
Bundler: ESBuild
Module: ESM

Build and run:

cd /examples/gjs/gtk-4-list-store
yarn run start

HTTP Server + Client

> gjs -m dist/http-server.js
Visit http://localhost:1080
> gjs -m dist/http-client.js
Gjs-Message: 21:13:22.007: JS LOG: status: 200 - OK
Gjs-Message: 21:13:22.007: JS LOG: Date: Wed, 06 Apr 2022 19:13:22 GMT
Gjs-Message: 21:13:22.007: JS LOG: Content-Type: text/html; charset=utf-8
Gjs-Message: 21:13:22.007: JS LOG: Content-Length: 135
Gjs-Message: 21:13:22.008: JS LOG: body:

        <html>
        <body>
            Hello, gjs! ☺<br>
            <a href="/">Go back</a>
        </body>
        </html>

GJS example showing how to build a http server/client using Soap 3.
This example contains a client and a server example, for the client example the server must be running.

Source: GJS Bundler: ESBuild
Module: ESM

Build and run:

cd /examples/gjs/soup-3-http
yarn run build
yarn run start:server
yarn run start:client

Gtk4 Custom Widget

gtk-4-custom-widget

This example shows the usage of custom widgets and virtual functions in GJS.

Source: GJS Bundler: ESBuild
Module: ESM

Build and run:

cd /examples/gjs/gtk-4-custom-widget
yarn run start