Kodular Beginner's Guide (Basics)

This topic is only for the guide.
:warning: Please don’t reply to the topic.
You can reply about the guide in this topic. :point_down:
Discuss: Kodular Beginner's Guide


About Kodular
Kodular Community
Sign Up

Creator’s Home Page

• Create Project
• Import Project
• Sort Project
• Save AIA
• Delete Project

Understanding App Programming In Kodular

• Screen
• Designer
• Blocks
• Assets
• Extensions


• Palette
• Viewer
• Components
• Component Properties


• Built-In Blocks
• Types of components blocks

  1. Events
  2. Methods
  3. Properties

• Usage
• More

  1. Warnings and errors
  2. BackPack
  3. Delete Blocks
  4. Zoom

Sample App


• Switch screens
• Add Screen
• Copy Screens
• Remove Screen

Blocks for switching screens

• Usage

App Properties


About Kodular

Kodular is a drag and drop app builder based on the MIT App Inventor.
You don’t need to learn coding to build apps with Kodular.
Kodular has great features, you can customize apps as you like.

Kodular Community

You can share your doubts, projects, or suggestions related to Kodular.
The Community is very active, so you can get quick responses to your doubts.

Sign Up

Sign Up / Sign In to
You have 4 sign-up methods
• Account with email and password
(You will receive a confirmation email)
• Google
• Github
• Twitter

This means you are creating a Kodular account with these sign-up methods.
You can use the same account to login to the Kodular Community.

1 Like

Creator’s Home Page

You can see all your projects on the Home Page.
Click on a project to open.

Create Project

  1. Click on create project.

  2. Give your new project a name.
    • Project names must start with a letter and can contain only letters, numbers, and underscores.
    Click on “Next”.

  3. Configure your project.
    This configuration is optional. You can change these settings later.
    Click on “Finish”.

Import Project
You can import a project file from your computer to the Creator.
The project file format is the AIA file. (.aia)

Sort Projects
You can sort projects for convenience.

Save AIA
You can save the project file to your computer (AIA file)
Click on save icon
Save Delete

Delete Project
Click on the delete icon and enter the project name for confirmation and click on delete.

1 Like

Understanding App Programming In Kodular

Apps will have screens, so you can switch to different screens.
Screen1 is the base screen that opens when the app is opened.
You can create screens.
For example, Sign Up screen and Home screen, etc.

Screens have Designer part and Blocks Part.

Here you design the User Interface (UI)
Drag and Drop components you need like Button and Label to the screen.
And you can edit component properties. For example, setting Button color to blue.

Drag and drop blocks and join them.
When something happens, do something
For example:
When Button1 Click
Set Label Text “Hello, this is my first app

You can say design is the body and the blocks-part is the brain.

You can upload and use files in the app like images.

You can import extensions.
For example, a Flashlight extension to turn the flashlight on/off.




Drag and Drop components from the Palette.
You can use the search feature to find components quickly.
Components are categorized.

You can also import extensions from your computer.
Go to the last category “Extensions” to import extensions.
You can find extensions here (Free/Paid)
Extensions Directory, (By @Taifun)


Drag and Drop components to the screen

You can preview how it looks for other screen resolutions.

Here you can manage components (including extensions)
Edit their names.
Delete components.

Component Properties
Here you can edit component properties.
App properties are included in Screen1 properties like App Name etc.



Drag blocks to the blocks editor

Built-In Blocks
Documentation for built-in blocks.

Documentation for all components.

Types of component blocks
There are mainly 3 types of component blocks. (also for extensions)
They are Events, Methods, and Properties.
You can make something happens when an event occurs.
component_event (1)

Some events return properties, for example, the location changed event returns latitude and longitude, etc.
component_event (2)

There are 2 types of Functions, Do Function and Get Function.

  • Do Function
    component_method (7)
  • Do Function (With Parameters)
    component_method (8)
  • Get Function
    component_method (5)
  • Get Function (With Parameters)
    component_method (9)

There are 2 types of Property blocks.

  • Set Property
    component_set_get (1)
  • Get Property
    component_set_get (2)


blocks (49)


Warnings and Errors
Here you can see the number of warnings and errors in your blocks.
You can navigate to blocks with warnings or errors by clicking on the arrows.

You can add blocks to Backpack.
Right-click on a block and select the “Add to Backpack” option.
You can access blocks added to BackPack even in other projects.

Delete Block(s)
Drag blocks to delete icon to delete blocks.
Click Backspace/Delete key to delete blocks.

Click on plus/minus to zoom-in/zoom-out.


Sample App

You can download this project file (AIA) and import it to the Kodular Creator.
Speech2Text.aia (1.7 KB)

You can download this APK file and install the app on your mobile.
Speech2Text.apk (5.2 MB)

blocks (51)



You can add, copy and remove screens

Switch screens in the project.

Add Screen
Click on “Add Screen” and enter the name for the new screen.
Click on Create.

Copy Screen
You can copy the current screen.
Duplicating the current screen.
Give a name for the screen.
Click on “Copy”

Remove Screen
Click on Remove screen.
Enter the name of the screen for confirmation.

Blocks for switching screens

blocks (52)

blocks (53)

App Properties

App properties are included in Screen1 properties
Like: App Name, App Icon, etc.


Guys, I’m not advertising you anything; I just want to share what I’ve learned about building apps using Kodular. So, in order for you to continue learning more, I created a video for absolute beginners to understand the basics (components) of kodular.
If you want to learn Kodular, you can watch this video: Kodular tutorial for beginners in English | Full tutorial by Ajmal - YouTube

This video is currently not available in youtube.com