# Χρήση ή εκτέλεση του επεξεργαστή UI Builder και δικές σας συνιστώσες

> Ανοίξτε τον επεξεργαστή στο cloud ή εκτελέστε τον μόνοι σας με Node.js, τι περιέχει το έργο και πώς φορτώνετε τη δική σας λίστα συνιστωσών με την παράμετρο components.

Framework: uibuilder
Product: UI Builder (uibuilder@1)
Language: el
Content-SHA256: 2f2dbba73ed525e9efab14af1187bd3a6a32f7dcf930a0b7d18bbcefec948569
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

## Ο επεξεργαστής στο cloud

Ο γρηγορότερος τρόπος είναι η έκδοση cloud του επεξεργαστή, [uibuilder.totaljs.com](https://uibuilder.totaljs.com).

## Εκτέλεση μόνοι σας

Ο επεξεργαστής είναι μια μικρή εφαρμογή Total.js 5 που σερβίρει στατικά αρχεία. Το README δίνει τρία βήματα:

```bash
npm install
node index.js
```

Κατεβάστε πρώτα τον πηγαίο κώδικα από το [github.com/totaljs/uibuilder](https://github.com/totaljs/uibuilder). Η εφαρμογή έχει μία διαδρομή που σερβίρει τα αρχεία της (`ROUTE('GET /*')`) και το αρχείο `config` ορίζει το όνομα και το CDN της διεπαφής (`cdn : //cdn.componentator.com`). Ο επεξεργαστής δεν χρειάζεται βάση δεδομένων.

Τι περιέχει το αποθετήριο:

| Φάκελος ή αρχείο | Τι περιέχει |
|---|---|
| `public/` | ο επεξεργαστής: `ui.js` και `func.js`, οι φόρμες του επεξεργαστή (`forms/*.html`: ρυθμίσεις, συνιστώσες, σχήμα, εισαγωγή, κώδικας, διαδρομές...) και οι εικόνες των προτύπων |
| `public/templates/` | οι αρχικοί σχεδιασμοί: `app.json`, `dashboard.json`, `flowboard.json`, `part.json` και `db.json` |
| `public/templates.json` | η λίστα των προτύπων που προσφέρει ο επεξεργαστής (υπάρχουν μια εφαρμογή κινητού και ένα πάνελ HMI αλλά είναι απενεργοποιημένα) |
| `public/template.txt` | ο σκελετός μιας νέας συνιστώσας ([δημιουργία μιας συνιστώσας](/en/uibuilder/build-a-component/)) |
| `public/render.txt` | μια σελίδα που αποδίδει έναν σχεδιασμό με jComponent 20 |
| `cdn/uibuilder.min@1.js` | το runtime που αποδίδει έναν σχεδιασμό (το αντικείμενο `UIBuilder` της σελίδας) |

## Χρήση της δικής σας λίστας συνιστωσών

Ο επεξεργαστής διαβάζει τις συνιστώσες του από μια λίστα. Μπορείτε να τον κατευθύνετε στη δική σας λίστα προσθέτοντας στη διεύθυνση την παράμετρο `components`, με τη διεύθυνση ενός αρχείου JSON ως τιμή:

```text
https://uibuilder.totaljs.com?components=URL_TO_YOUR_JSON_DB
```

Έτσι μια εταιρεία διανέμει τη δική της βιβλιοθήκη συνιστωσών χωρίς να αγγίξει τον επεξεργαστή.

## Από πού προέρχονται τα κομμάτια

Ο σχεδιασμός που αποθηκεύει ο επεξεργαστής φέρει, στο πεδίο `components`, τη διεύθυνση της βιβλιοθήκης που περιέχει κάθε συνιστώσα, ώστε ένας σχεδιασμός να μπορεί να αποδοθεί αργότερα από οποιονδήποτε φτάνει σε αυτή τη διεύθυνση ([η μορφή JSON](/en/uibuilder/the-ui-json-format/)).