Editing Code Versus Using the UI

Wappler General
#1

As I get to find my own way of working with Wappler, the question of whether to work more in the UI or the code is in my mind…

… and I have had several forum replies recently from @George and @Teodor which have strongly encouraged me to make more use of the UI…

… so I wanted to get some perspectives on the topic!

Here are my thoughts, and I’d love to hear yours…

Reasons to edit in the code editor

  1. Sometimes combinations of actions are not selectable in the UI. Multple .where() statements was a recent good example.

  2. I have a complex HTML template for all the inputs of my design and it is many many times faster and more accurate to copy and search/replace this than to click on the UI.

  3. I have to scroll up and down the UI to see what is happening on a element whereas I can see it all in one screen area in the code. A simple change is then much more easily made where I am already looking and familiar with what is happening.

  4. Changing the name of something (like a form id). It is much easier to find and replace f_edit_contact than to remember all the places I made reference to it and remember how to re-build those commands in the UI.

  5. I am beginning to get RSI (Repetitive Strain Injury) in my right hand, and so typing is more restful for me.

Reasons to edit in the UI

  1. The action is complex syntax and therefore faster to create.

  2. Learning what actions are available and their syntax.

  3. Being sure I have the right syntax when something doesn’t work.

Questions for @George and @Teodor

I am curious to know:

  1. Why you are recommending the UI so strongly? I have always seen the ability to mix UI and code input as by far the biggest benefit of Wappler!

  2. Is there something we could break in our design by editing code (assuming we have the right syntax)?

I’m looking forward to hear everyone’s perspectives!

Best wishes,
Antony.

#2

I don’t think there is a definitive answer to your question; I expect the best approach is to do what I imagine you are doing: a combination of using the UI and code view.

I would almost always use search/replace if there is likely to be more than one occurence of what I’m replacing, for the reasons you mention.

Obviously I don’t know what size your monitor is, but having a large/high resolution monitor can reduce the need to scroll considerably. Eg my App Connect and Properties panels are side by side rather than in a single column; my Server Actions and Action Steps panels are also side by side. I always use split screen too, so there are 6 columns displayed in total - so most of the time I can see everything I need to see. The monitor is 43 inch (3840x2160).

I expect reducing the need to scroll will help avoid Repetitive Strain Injury (which is something you certainly want to avoid). I would also recommend trying a vertical mouse. I was rather sceptical that such a different type of mouse would work as well as the standard type, but as it was recommended by one of my daughters, I decided to try it - I liked it almost immediately. (Ewent Ergonomic Mouse)

I expect George and Teodor recommend using the UI because it’s more likely to produce the correct code/syntax, produce code which is compatible with other App Connect components and require less support when things don’t work. However, there is no doubt that typing or copy/pasting can be quicker in some cases; it depends on the user’s preference and understanding of the code etc.

1 Like
#3

@Antony Much the same attitude as TomD, whatever works for you is probably the best but before reporting bugs, try to reproduce in the UI first, it can take a bit of getting used to to set up multiple conditions etc but it can be done

@TomD nice tip about mouse, having a few RSI issues myself so have ordered one

#4

All depends on how your more comfortable working. I mostly use the UI to build the initial schema and then jump in to the code. If you like using the code you will find yourself using more and more the code view and typing the dmx- actions instead of clicking.

Thank you!

#5

As for running multiple actions and flows, client side - we are working on a new component called task runner that will allow you to define a whole flow of actions and execute it client side. A bit like the server connect workflows but then for client side

8 Likes
#6

This sounds very exciting. Will we able to use conditions and loops (and be able to add comments)? Adding conditions cropped up in this thread - hopefully the new component will provide an easier UI solution for situations like this.

#7

yes exactly - conditions and loops, just like in server connect, hope to post more info in the next days

5 Likes