NethServer 8 UI: From n00b to UX dev in 17 mins

Howto
1

Amazing talk by @andre8244 at Fosdem24

Key points

  • ns8 UI architecture
  • modules UI overview
  • carbon library
  • responsive design
  • core UI development

From n00b to UX dev in 17 mins :slight_smile:

5 Likes
2

I saw a new version of carbon UI seems to have reached maturity, and it looks nifty, might consider it for some projects, i think @kemboielvis22 has played around with it

i saw somewhere in the issue trackwer regarding upgrading to Vue3 due to some components not yet reached compatibility with Vue3

The beauty about NS8 ui implementation is that, it makes it easy to wrap own UI elements to dealing with configurations of certain Apps and really own it.

I am however curious about Editing a full config file within NS8, is this permissible, supported or would and can it be supported.

Say i have a complex YAML file of config file for a docke rimage that has been built as an NS8 app, instead of providing individual config text box, and toggle switches etc for every configurable option, just load the entire config file in an embeded text editor, modify what i need, and save the new changes.

Would be amazing to have this, or if its supported already, @andre8244 could i get some pointers.

1 Like
3

Haven’t seen the video so don’t know if you are referencing it in some way.

You are looking at it from the point of view of the developer or from the point of view of the final user?
IIUC, I think the single text box doesn’t suit the final user.

  • Common options with consensus (meaning most target users expect/agree on same config by default or sane defaults), done internally without exposing controls to users.
  • Commonly used/expected options tweakable by users: exposed with controls.
  • Less frequent options, but still expected by advanced users: exposed with controls under “Advanced”.
4

probable but hey, if i can shave 5 days by exposing the whole config yaml file, shouldn’t that be used in the interim, then slowly, when time allows, implement individual options with checks.

the system in question is equally administrative demanding, so not intended to non technical admins.

5

Hi folks!

@dnutan summarized the issue very well :clap:

@oneitonitram the pattern you are suggesting, i.e. exposing a configuration text file on the UI, is very rare and I would not recommend it. Anyway, if you are really sure it might work in your specific use case, I guess you can use a CvTextArea component with the file content inside. Here is the doc: Storybook

2 Likes