Bubble(No code Tool)

Bubble
Presented By
ARYA TS Livares Technologies Pvt Ltd
Tech&Socio-Cultural Group

PRESENTATION
TITLE
Livares Technologies Pvt Ltd
CONTENTS
● Introduction
● Application Editor
● Multi Page Apps
● Reusable Elements
● Workflow
● API
● Debugger
● Advantages
● Disadvantages
● Conclusion
● References

Tech&Socio-Cultural Group Livares Technologies Pvt Ltd
What is Bubble tool
● It is a visual programming language that lets you build web applications
without code.
● Using Bubble, you can build a fully-functional web application, such as a
marketplace, a social network, a CRM tool, both for internal and customer-
facing situations.
● The application editor is accessed in the browser. There is nothing to
download, and you can access your app from any device.
● Once an application is built on Bubble, there is no need to deploy the
application to a cloud solution.
● As soon as an app is built on Bubble, it is hosted on Bubble's cloud
infrastructure.

PRESENTATION
TITLE
Application Editor
● You design, build, maintain, and scale your app using the Application Editor.
● The editor in Bubble is divided into seven main tabs, and it includes various
tools and features that you will need while creating your project.

PRESENTATION
TITLE
Design tab:-This is where you design the visual appearance of the app. Draw
elements on the page, drag and resize them, and adjust their properties and
appearance.
Continue

PRESENTATION
TITLE
Workflow tab:-The Workflow Tab is where you define the workflows that
program your page. The different workflows are displayed as boxes, which
represent the event.
Continue

PRESENTATION
TITLE
Data tab:-The Data Tab is where you can view your data structure and modify it. You can
see the different data types that are used in your application, as well as the fields for each
of them.The 'App Data' section shows you actual data
Continue

Style Tab:-The Styles Tab is where you define the different styles that elements can have in
your interface.
A Style is a shared set of properties (e.g. background colors, font size, etc.) that can be
applied to elements of a similar type (e.g. Text elements).

PRESENTATION
TITLE
Plugins Tab:-Plugins are a way to extend Bubble's core functionality.
Setting Tab:-This tab lets you control your application subscription and paid add-ons.
Log Tab:-This tab is useful once your app is live, or when you are testing it in run-mode.

PRESENTATION
TITLE
Element hierarchy
A Bubble page is composed of three types of components:Page,Containers/Groups,Elements

Property Editor
Property Editor is used to design each element of a page and customize events and
actions.

Issue Checker
Bubble is very open-ended, you can make some mistakes as you design. A mistake can be
a missing field or an issue with inconsistent type

Multi-page apps
● You can create new pages in the Application Menu.
● A page can start blank or be the clone of another page.
● When a page is cloned, the entire page, including workflows will be copied
and used as the basis for the new page.

Reusable Elements
● A reusable element is a way to build elements that you can replicate in more than one
page without having to recreate them.
● If you want a footer and header shared across pages, you should only build them once
as reusable elements.

Workflows
In Bubble, workflows are sets of instructions that respond to user actions like
clicking a button, and perform a series of actions like modifying the database
or making API calls.
A workflow is the combination of an event that triggers one or more actions

❖ Event:-All workflows are a collection of one or more actions that are triggered by an event. In
other words, the event is the starting point that initiates the running of one or more actions in a
workflow.
❖ Actions:-In the Bubble workflow editor, actions are visible as soon as you create or open a
workflow by clicking on an event.

PRESENTATION
TITLE
Bubble API
Bubble's API features allow to set up incoming and outgoing requests to communicate with other
applications and services

Bubble API
The Bubble API is used whenever you want to accept incoming API requests-calls that are made from
an external application to your Bubble app.

Bubble API
Incoming requests happen when an external system, such as another application, initiates a
connection with your Bubble application. In that case, your app needs to be ready to accept that
request and know what to do with it.
Incoming requests to Bubble can do one of two things:
● Search for, Read, create, modify or delete data in your database: this is handled by the Data API.
● Run a workflow in your app: this is handled by the Workflow API.

Debugger
When you access an app from the editor by clicking PREVIEW, the debugger will be automatically
activated.
When the Debugger is activated, you'll see it at the bottom of the page, with sections for the Workflow
Debugger and the Element Inspector.

PRESENTATION
TITLE
Advantages of bubble
➢ Economical: You can build it yourself even if you don’t know how to code. Bubble
makes your road to software development cheaper and quicker.
➢ Agile: Using buble.io, you can complete your applications faster compared to when
you have to code everything from start.
➢ Create a versatile product:It is easy to change or update an application that’s built
with Bubble.io.
➢ Enhanced productivity:With Bubble.io, apps can be built faster
➢ Make powerful apps without tech skills

PRESENTATION
TITLE
Disadvantages of bubble
➢ Bubble isn’t built for everything
➢ There’s a learning curve: If you want to enjoy the full power of Bubble.io,
you need to spend some time learning how to use it.
➢ Limited customisation

PRESENTATION
TITLE
Conclusion
❏ Bubble.io is a no-code web development platform that offers a range of features
and tools to help users create custom web applications quickly and easily.
❏ Bubble.io also offers responsive design capabilities, built-in user authentication
and permission management, and analytics and tracking tools to help users create
robust applications that meet specific needs.
❏ Overall, Bubble.io is a powerful and versatile platform that can be used by
individuals, small businesses, and enterprise-level organizations to create custom
web applications without requiring technical skills or coding knowledge.
❏ If you're looking for a way to build a custom web application quickly and efficiently,
Bubble.io is definitely worth checking out.

PRESENTATION
TITLE
References
● https://manual.bubble.io/
● https://www.nocode.tech/lessons/bubble-overview

OUR
CONTACT DETAILS
5th Floor, Yamuna Building
Technopark Phase III Campus
Trivandrum, Kerala, India-695581
Our helpline is always open to receive any inquiry
or feedback.Please feel free to contact us
www.livares.com
contact@livares.com
@livaresofficial
www.facebook.com/livaresofficial
+91-471-2710003 | +91-471-
2710004
THANK
YOU

Bubble(No code Tool)

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Bubble(No code Tool)

Similar to Bubble(No code Tool) (20)

More from Livares Technologies Pvt Ltd

More from Livares Technologies Pvt Ltd (20)

Recently uploaded

Recently uploaded (20)

Bubble(No code Tool)