A quick Component naming Guide

Hey Thunkers! :wave:

Here’s a very quick guide on intelligently naming your Designer Components. Let’s begin.


1. Know some Abbreviations

Sometimes, a component has a veryyy long name. Ex. BottomTabNavigator, SpeechRecognizer, etc. Abbreviating it, will give us a short-name. Some of the possible abbreviations are listed below -

Screen - scr
Button - btn
Label - lbl
Text Input - txt
List Viewer - lstvw
Web Viewer - webv
Switch - swt
Slider - sld
Alert - alt
Loading Icon - load
Date Input - dti
Time Input - tmi
PDF Reader - pdfvw (PDF viewer)
Row - row
Column - col
Sound - snd
Speech Recognizer - spcr
Assistant - ast
Translator - trns
Image - img
Photo Library - gal (Gallery)
Camera - cam
Barcode Scanner - brscn
Animation - ani
Video - vid
Local Storage - locst
Local DB - locdb
Realtime DB - realdb
Spreadsheet - sheet
Web API - api
Media DB - med
Location Sensor - locsn
Accelerometer - acc
Gyroscope - gyro
Magnetometer - magm
Push Notification - psh
Sign In - auth

2. Name components wisely

After you know appropriate abbreviation for your component, it’s time to name it.
Since Thunkable X does not allows us to set a duplicate name (it’s nice btw), we can set one name for only one component.

A wise name for a component will consist of -

<component_function_name> + <abbreviation> + <underscore ('_')> + <screen_short_name>

Ex. -

image
image
image

Fin.


Thanks for having a look on my quick guide! Hope this helped you :smiley_cat:

Thanks! :blush:
Happy Thunking! :tada:

2 Likes