The Complete Guide to Bubble Visual Programming

Learn how to build sophisticated web applications like AirBnB Yelp Twitter with no code using Bubble Visual Programming
The Complete Guide to Bubble Visual Programming
File Size :
8.16 GB
Total length :
15h 48m



Henry Habib


Last update




The Complete Guide to Bubble Visual Programming

What you’ll learn

Bubble Visual Programming ecosystem to create websites and web applications using a No-Code platform
Build functional and professional grade web applications, websites, and apps
All elements of Bubble, including responsive design, databases, workflows, users, and much more
Build a fully functional project and task management web application with a complete walkthrough
Build a thin version of AirBnB, complete with Google Maps integration and user-to-user messaging
Responsive web design that adapts to the user’s screen and looks beautiful
Database management system that easily stores, organizes, and shows all your data
Workflow management system that allows complex interaction between the front-end and back-end, similar to what many other web applications like Twitter and Yelp do
How to go from having an idea to building a fully functional MVP, with many examples in between
Interacting with the Bubble community to continue learning and building your skillset

The Complete Guide to Bubble Visual Programming


No Bubble or web development experienced is required


Build amazing professional web applications like Twitter, Asana, Todoist, AirBnB, Trip Advisor, Yelp and launch your startup, SaaS, or any web product in days instead of months with no code using the Bubble ecosystemLearn from over 16 hours worth of relevant instructional video content on Bubble to become an expert and start building today! No coding required!Are you an entrepreneur who wants to build the next big thing without a full-time developer? Do you want to quickly create an MVP for your startup idea, or quickly build your side hustle? Then harness the power of No-Code web application development using Bubble.Bubble is rated as the #1 No-Code Tool of 2020. Apps built on Bubble have raised more than $1B dollars (see: Plato, Dividend Finance, Plato, all of which were made using Bubble). With Bubble, you can create everything from sophisticated marketplaces like AirBnb, to SaaS like Trello, to simple landing pages. This is No-Code development at its finest!People use Bubble to quickly create professional web applications. In fact, one student used Bubble to launched their application in only 3 days, and then subsequently sold it to USA Today (see: GiveLocal).This course is the only comprehensive guide you’ll ever need to Bubble. It covers everything from Beginner topics like pages, inputs, and elements to more advanced topics like plugin implementation, messaging, and data manipulation. The course also takes you step-by-step and assumes you have no experience at all with building web applications or with Bubble.The course is designed so you become an expert at Bubble. We first learn all the building blocks required, and then create our own functional Bubble applications from complete scratch. We also continuously update the course!If you’re looking for something that will teach you how to create professional grade web applications using no-code from beginner to advanced, then this is the course for you!What is Bubble?Bubble is a no-code platform that allows you to build sophisticated and professional-grade web applications. It’s the best way to develop your application in days, not months. It contains responsive web design, element manipulation, database functionality, workflow management, and a whole host of community-built plugins and third-party APIs that can enhance your application like Stripe, Plaid, and more! Bubble has been rated as the #1 No-Code platform of 2020.What are the main features of Bubble? / Why should I learn Bubble?No-Code platform: Bubble uses a drag-and-drop and logic gates system instead of complicated code, but is still powerful and comprehensive to run AirBnB or even Facebook; it’s the next evolution of web development.Build it quickly: Since Bubble is a No-Code platform, you can make your application in days and not monthsTotal freedom: Bubble allows you total 100% freedom with your website – modify, add, delete, and change anything and everything about your web applicationSophisticated / comprehensive: Bubble comes with a robust scalable database management system, and workflow integration that allows you to create virtually any application – it also contains Responsive Design and so is lightning fast!Collaboration: Bubble comes with its own version control system, that lets you manage changes and lets you collaborate with up to 40 other individualsCommunity of plugins: Plugins that are developed by the Bubble community extend your application by allowing third-party elements, like payment, SEO, analytics, and more! You can even integrate with your own REST API.Why take this course?Comprehensive guide: This is the only 100% start to finish, zero to hero, basic to advanced guide on Bubble. This course assumes you have zero experience with Bubble and develops you to a Bubble power user!Instructional with examples: The course is structured in a way to maximize your learning. We first go through learning “Building Blocks” where we develop our Bubble toolkit. We then apply the toolkit to future modules through app development from complete scratch.Great resources: There are hours of content and resources in this course. There is more than 16 hours of video content available. You also have lifetime access to not only the videos, but to me as well through the Q&A featureCourse and Module OverviewIntroduction to Bubble: In this section, you will learn everything about Bubble! What it is, when to use it, what it can and cannot do, and we will go through the course overviewBB – Environment Setup: In this section, you will set up your Bubble environment, which means creating a free Bubble account and entering the Bubble environmentBB – Editor: In this section, you will learn about the Bubble editorBB – Pages and Elements: In this section, you will learn how to set up your Bubble pages and how to add Bubble elements to your pagesBB – Responsive Design: In this section, you will learn about the responsive design features that are available with BubbleBB – Data: In this section, you will learn how Bubble manages its data environmentBB – Workflows: In this section, you will learn about Bubble workflows and how they can be used to enhance your Bubble applicationBB – Design with Data: In this section, you will learn how to make web pages by mixing design principles with data and workflows, including repeating groupsBB – Users: In this section, you will learn about Bubble’s default and powerful user management systemBB – Settings and Publishing: In this section, you will change your Bubble settings, and how to publish your web applicationBB – Advanced Features and Plugins: In this section, you will learn about some of the advanced features with Bubble like pluginsApp – ProjectIO: In this section, we will build a project and task management application from scratchApp – BubbleBnB: In this section, we will build a very thin version of AirBnB, complete with Google Maps integration, messaging, and more, and all from scratchConclusion: In this section, we’ll wrap everything up and talk about next stepsWe’re looking forward to having you in the course and hope you earn the certificate. Please let me to know if you have any questions!Music: bensound


Section 1: Introduction to Bubble

Lecture 1 Introduction to Bubble and its features

Lecture 2 Successful Bubble applications

Lecture 3 Bubble vs. other platforms

Lecture 4 What Bubble can and cannot do

Lecture 5 Course overview

Lecture 6 A few notes before we begin

Lecture 7 Ways to reach out

Lecture 8 Watch in 1080p

Section 2: BB – Environment Setup

Lecture 9 Create a Bubble account

Lecture 10 Opening the environment

Section 3: BB – Editor

Lecture 11 Navigation through the environment screen

Lecture 12 Navigating through the environment sections

Lecture 13 Manual and reference documentation

Section 4: BB – Pages and Elements

Lecture 14 Text element and the appearance property tab

Lecture 15 Conditional properties

Lecture 16 Transition properties

Lecture 17 Properties extras

Lecture 18 All visual elements (buttons, icons, etc.)

Lecture 19 Input form elements

Lecture 20 Dynamic data introduction

Lecture 21 Dynamic data example 1

Lecture 22 Dynamic data example 2

Lecture 23 Groups introduction

Lecture 24 Grouping elements together

Lecture 25 Floating groups

Lecture 26 Styles

Lecture 27 Page design

Section 5: BB – Responsive Design

Lecture 28 Responsive design introduction

Lecture 29 Responsive design – a bad example

Lecture 30 Alignment and distribution

Lecture 31 Dynamic vs. fixed width

Lecture 32 Responsive design – a good example

Lecture 33 Groups within a group and verticality

Lecture 34 Alignment extras

Lecture 35 Responsive design with text

Lecture 36 Resources for responsive design

Section 6: BB – Data

Lecture 37 Data introduction

Lecture 38 Creating a data type

Lecture 39 Adding new thing rows

Lecture 40 Viewing the data

Lecture 41 Lists of data and linking data together

Lecture 42 Benefits of data linkage

Section 7: BB – Workflows

Lecture 43 Workflow introduction

Lecture 44 Simple workflow examples

Lecture 45 Creating conditions on workflows

Lecture 46 Different events in workflows

Lecture 47 Other workflow events (page is loaded)

Lecture 48 Animate actions

Lecture 49 Workflows to set states

Lecture 50 Workflows to create things

Lecture 51 Workflows for custom events

Lecture 52 Debugging workflows

Lecture 53 Workflows for navigation

Section 8: BB – Design with Data

Lecture 54 Design with data introduction

Lecture 55 Repeating groups introduction

Lecture 56 Populating data in a repeating group

Lecture 57 Viewing data 1

Lecture 58 Viewing data 2

Lecture 59 Modifying data

Lecture 60 Deleting records

Lecture 61 Filtering data

Lecture 62 Sorting data

Lecture 63 Better way to delete records

Lecture 64 Adding data search

Lecture 65 Using data selectors like count and first

Lecture 66 Using the append selector

Lecture 67 Using popups

Section 9: BB – Users

Lecture 68 User introduction

Lecture 69 Creating an account

Lecture 70 Logging in and logging out

Lecture 71 Making user profile changes

Lecture 72 Current user is logged in expression

Lecture 73 Logging in with Facebook OAuth 1

Lecture 74 Logging in with Facebook OAuth 2

Section 10: BB – Settings and Publishing

Lecture 75 Settings

Lecture 76 Issue tracker

Lecture 77 Publish your application

Section 11: BB – Advanced Features and Plugins

Lecture 78 Reusable elements

Lecture 79 Transmitting data across pages

Lecture 80 Data privacy 1

Lecture 81 Data privacy 2

Lecture 82 Templates

Lecture 83 Option sets

Lecture 84 Autobinding

Section 12: App – ProjectIO

Lecture 85 ProjectIO introduction

Lecture 86 Setting the header

Lecture 87 Setting the page

Lecture 88 Modifying the header

Lecture 89 Applying the layout

Lecture 90 Adding in elements on the left

Lecture 91 Adding elements on the middle 1

Lecture 92 Adding elements on the middle 2

Lecture 93 Adding the elements on the right

Lecture 94 Project data types

Lecture 95 Adding project data

Lecture 96 Making the data pretty

Lecture 97 Adding project headings

Lecture 98 Creating a new project

Lecture 99 Adding users 1

Lecture 100 Adding users 2

Lecture 101 Adding users 3

Lecture 102 Project detail and modifying projects

Lecture 103 Adding members to projects 1

Lecture 104 Adding members to projects 2

Lecture 105 Adding members to projects 3

Lecture 106 Adding members to projects 4

Lecture 107 Modifying members in a project 1

Lecture 108 Modifying members in a project 2

Lecture 109 Modifying members in a project 3

Lecture 110 Adding dashboard numbers

Lecture 111 Using dashboard filters

Lecture 112 Using search filters

Lecture 113 Menu items

Lecture 114 Task page introduction

Lecture 115 Appearance of tasks

Lecture 116 Transferring data between projects and tasks

Lecture 117 Resolving a prior bug in members

Lecture 118 Switching projects 1

Lecture 119 Switching projects 2

Lecture 120 Adding the task data type

Lecture 121 Adding new tasks

Lecture 122 Task appearance in a repeating group

Lecture 123 Adding task dashboard functionality

Lecture 124 Modifying tasks 1

Lecture 125 Modifying tasks 2

Lecture 126 Overview of the app

Lecture 127 Fixing number of tasks on main page

Section 13: App – BubbleBnB

Lecture 128 BubbleBnB introduction

Lecture 129 Environment setup

Lecture 130 Creating the first page

Lecture 131 Setting the groups

Lecture 132 Adding elements on the filters

Lecture 133 Adding sliders and toggles

Lecture 134 Adding elements to the middle groups

Lecture 135 Adding elements to the right groups 1

Lecture 136 Adding elements to the right groups 2

Lecture 137 Adding elements to the right groups 3

Lecture 138 Setting up the data

Lecture 139 Creating the cottage data

Lecture 140 Integrating data with Google maps and list

Lecture 141 Making the image showcase slider

Lecture 142 Functionality between map and list while choosing a page

Lecture 143 Changing Google map marker based on selection

Lecture 144 Updating the right side based on data

Lecture 145 Adding filtering (small)

Lecture 146 Adding booking functionality

Lecture 147 Adding Stripe into booking

Lecture 148 Appearance of page 2

Lecture 149 Conversation tab

Lecture 150 Appearance on the right side

Lecture 151 Messaging 1

Lecture 152 Messaging 2

Lecture 153 Messaging 3

Lecture 154 Modifying chosen place based on selected conversation

Lecture 155 Data transfer between the two pages

Lecture 156 Modifying views based on group selection

Lecture 157 Bookings tab

Lecture 158 Adding a place

Lecture 159 Adding user functionality

Lecture 160 Review

Lecture 161 Next steps

Section 14: Conclusion

Lecture 162 Congratulations and next steps

Section 15: Bonus – Special Access

Lecture 163 Bonus – Special Access

Entrepreneurs who want to build sophisticated web applications and websites quickly and without code,Students who want to learn a revolutionary new way to create web applications,Individuals who want to create and launch an MVP,Individuals who do not know how to code and want to focus on function over form,People who want to create any SaaS product,Entrepreneurs who want to create an online MVP to secure funding,Anybody who wants to turn a startup idea into reality,Beginner, intermediate, and advanced users of Bubble

Course Information:

Udemy | English | 15h 48m | 8.16 GB
Created by: Henry Habib

You Can See More Courses in the Developer >> Greetings from

New Courses

Scroll to Top