Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/unyt-org/uix-template-hello-uix

UIX Base Project Template
https://github.com/unyt-org/uix-template-hello-uix

base uix uix-example unyt

Last synced: about 2 months ago
JSON representation

UIX Base Project Template

Host: GitHub
URL: https://github.com/unyt-org/uix-template-hello-uix
Owner: unyt-org
Created: 2023-04-13T15:46:37.000Z (over 1 year ago)
Default Branch: main
Last Pushed: 2024-10-16T08:11:47.000Z (3 months ago)
Last Synced: 2024-10-17T20:53:25.231Z (3 months ago)
Topics: base, uix, uix-example, unyt
Language: TypeScript
Homepage: https://uix.unyt.org/templates
Size: 293 KB
Stars: 3
Watchers: 0
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# UIX Template: Hello UIX

This repository offers a simple setup for running your first [UIX](https://github.com/unyt-org/uix) application that integrates both frontend and backend rendered content. Indeed - it is our equivalent to the famous *Hello, World!* program.

For more information, make sure to check out our [UIX Documentation](https://docs.unyt.org/manual/uix/getting-started).

## Getting Started
Make sure to install [UIX](https://docs.unyt.org/manual/uix/getting-started) and [git](https://git-scm.com/downloads) in order for the app to run.

```sh
curl -fsSL https://unyt.land/install.sh | bash
```

```powershell
irm https://unyt.land/install.ps1 | iex
```

```sh
curl -fsSL https://unyt.land/install.sh | bash
```

## Running the App
Let’s launch your first app — our very own *Hello, UIX* moment:

```bash
uix --init MyFirstApp
```
When running the `uix --init` command, UIX will automatically clone this repository and launch the demo application.

*Looks too easy? But really - that is all it takes!*

## Project Structure

### Directories
The source code is split into three directories:

* The `backend` directory contains the backend logic that runs on [Deno](https://deno.com/).
* The `frontend` directory contains the code for the frontend clients (running in the web browser).
* The `common` directory contains common modules that can be initialized both in the browser and in the deno backend - they can be imported from modules in the `backend` and `frontend` directory.

The default export of the `backend/entrypoint.ts` and `frontend/entrypoint.ts` determine what content
gets displayed when visiting your app in the browser.

The directory names (`backend`, `frontend`, `common`) are important to tell UIX which code runs in which context. These names can also be changed in the [`app.dx` config file](https://docs.unyt.org/manual/uix/configuration#the-appdx-file).

### Configuration

The `app.dx` configuration file is required for a UIX app to run. It needs to contain at least the app name.
The `app.dx` has to be placed next to the app directories (`frontend`, `backend` and `common`).

### Cross realm imports

Frontend and common modules can import exported values from backend modules.
In the background, special interface module files are generated, making sure that the backend source code is never exposed to the frontend endpoints.

Access to these exports can be limited by setting DATEX permission filters.

## Development

Compiling or bundling your TypeScript or JSX files is not required. The project can be deployed as is.
There is a devcontainer setup, running the latest Deno version.

With the `--live` option, frontend browser tabs are automatically reloaded when a file has changed, which is useful for development, but should not be used in production.

This command starts the backend endpoint and also exposes a web server on port 80 or another available port.

---