The Complete Guide To Bubble From Beginner To Advanced

Learn how to build sophisticated web applications like AirBnB Yelp Twitter with no code using Bubble Visual Programming

Last updated 2022-01-10 | 4.7

- 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

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

* Requirements

* No Bubble or web development experienced is required

Description

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 ecosystem


Learn 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 months

  • Total freedom: Bubble allows you total 100% freedom with your website - modify, add, delete, and change anything and everything about your web application

  • Sophisticated / 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 individuals

  • Community 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 feature


Course and Module Overview

  1. Introduction 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 overview

  2. BB - Environment Setup: In this section, you will set up your Bubble environment, which means creating a free Bubble account and entering the Bubble environment

  3. BB - Editor: In this section, you will learn about the Bubble editor

  4. BB - Pages and Elements: In this section, you will learn how to set up your Bubble pages and how to add Bubble elements to your pages

  5. BB - Responsive Design: In this section, you will learn about the responsive design features that are available with Bubble

  6. BB - Data: In this section, you will learn how Bubble manages its data environment

  7. BB - Workflows: In this section, you will learn about Bubble workflows and how they can be used to enhance your Bubble application

  8. BB - Design with Data: In this section, you will learn how to make web pages by mixing design principles with data and workflows, including repeating groups

  9. BB - Users: In this section, you will learn about Bubble's default and powerful user management system

  10. BB - Settings and Publishing: In this section, you will change your Bubble settings, and how to publish your web application

  11. BB - Advanced Features and Plugins: In this section, you will learn about some of the advanced features with Bubble like plugins

  12. App - ProjectIO: In this section, we will build a project and task management application from scratch

  13. App - BubbleBnB: In this section, we will build a very thin version of AirBnB, complete with Google Maps integration, messaging, and more, and all from scratch

  14. Conclusion: In this section, we'll wrap everything up and talk about next steps


We'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

Who this course is for:

  • 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 content

15 sections • 161 lectures

Introduction to Bubble and its features Preview 03:55

Successful Bubble applications Preview 02:52

Bubble vs. other platforms Preview 03:04

What Bubble can and cannot do Preview 03:12

Course overview Preview 02:09

A few notes before we begin Preview 01:42

Create a Bubble account Preview 03:24

Opening the environment Preview 02:49

Navigation through the environment screen Preview 08:47

Navigating through the environment sections Preview 08:51

Manual and reference documentation Preview 03:22

Text element and the appearance property tab Preview 11:47

Conditional properties Preview 05:03

Transition properties Preview 02:51

Properties extras Preview 02:37

All visual elements (buttons, icons, etc.) Preview 11:51

Input form elements Preview 08:56

Dynamic data introduction Preview 03:39

Dynamic data example 1 Preview 03:43

Dynamic data example 2 Preview 02:37

Groups introduction Preview 06:38

Grouping elements together Preview 06:01

Floating groups Preview 03:22

Styles Preview 07:05

Page design Preview 06:32

Responsive design introduction Preview 01:37

Responsive design - a bad example Preview 06:39

Alignment and distribution Preview 04:50

Dynamic vs. fixed width Preview 06:49

Responsive design - a good example Preview 10:30

Groups within a group and verticality Preview 09:36

Alignment extras Preview 02:25

Responsive design with text Preview 04:30

Resources for responsive design Preview 03:44

Data introduction Preview 04:25

Creating a data type Preview 03:44

Adding new thing rows Preview 02:50

Viewing the data Preview 05:12

Lists of data and linking data together Preview 10:43

Benefits of data linkage Preview 02:43

Workflow introduction Preview 01:52

Simple workflow examples Preview 04:09

Creating conditions on workflows Preview 06:55

Different events in workflows Preview 07:33

Other workflow events (page is loaded) Preview 04:44

Animate actions Preview 04:33

Workflows to set states Preview 08:48

Workflows to create things Preview 10:21

Workflows for custom events Preview 11:19

Debugging workflows Preview 03:28

Workflows for navigation Preview 03:10

Design with data introduction Preview 00:32

Repeating groups introduction Preview 05:20

Populating data in a repeating group Preview 05:12

Viewing data 1 Preview 05:34

Viewing data 2 Preview 07:25

Modifying data Preview 04:59

Deleting records Preview 02:15

Filtering data Preview 07:25

Sorting data Preview 03:37

Better way to delete records Preview 05:36

Adding data search Preview 01:51

Using data selectors like count and first Preview 04:45

Using the append selector Preview 03:05

Using popups Preview 08:17

User introduction Preview 01:56

Creating an account Preview 06:35

Logging in and logging out Preview 05:37

Making user profile changes Preview 07:48

Current user is logged in expression Preview 07:15

Logging in with Facebook OAuth 1 Preview 04:49

Logging in with Facebook OAuth 2 Preview 02:16

Reusable elements Preview 08:26

Transmitting data across pages Preview 08:29

Data privacy 1 Preview 09:42

Data privacy 2 Preview 07:36

Templates Preview 07:03

Option sets Preview 09:20

Autobinding Preview 10:57

ProjectIO introduction Preview 03:20

Setting the header Preview 05:58

Setting the page Preview 05:22

Modifying the header Preview 04:44

Applying the layout Preview 07:46

Adding in elements on the left Preview 09:37

Adding elements on the middle 1 Preview 14:23

Adding elements on the middle 2 Preview 09:45

Adding the elements on the right Preview 09:39

Project data types Preview 02:50

Adding project data Preview 07:09

Making the data pretty Preview 05:12

Adding project headings Preview 00:43

Creating a new project Preview 10:20

Adding users 1 Preview 11:20

Adding users 2 Preview 05:26

Adding users 3 Preview 03:41

Project detail and modifying projects Preview 09:00

Adding members to projects 1 Preview 03:25

Adding members to projects 2 Preview 07:10

Adding members to projects 3 Preview 05:02

Adding members to projects 4 Preview 03:09

Modifying members in a project 1 Preview 07:41

Modifying members in a project 2 Preview 05:53

Modifying members in a project 3 Preview 09:13

Adding dashboard numbers Preview 03:18

Using dashboard filters Preview 05:27

Using search filters Preview 03:04

Menu items Preview 02:59

Task page introduction Preview 02:48

Appearance of tasks Preview 03:44

Transferring data between projects and tasks Preview 04:47

Resolving a prior bug in members Preview 03:03

Switching projects 1 Preview 08:27

Switching projects 2 Preview 03:40

Adding the task data type Preview 02:17

Adding new tasks Preview 10:09

Task appearance in a repeating group Preview 05:08

Adding task dashboard functionality Preview 09:08

Modifying tasks 1 Preview 04:24

Modifying tasks 2 Preview 04:03

Overview of the app Preview 04:27

Fixing number of tasks on main page Preview 01:09

BubbleBnB introduction Preview 03:09

Environment setup Preview 03:14

Creating the first page Preview 02:28

Setting the groups Preview 04:33

Adding elements on the filters Preview 05:45

Adding sliders and toggles Preview 06:41

Adding elements to the middle groups Preview 04:08

Adding elements to the right groups 1 Preview 06:38

Adding elements to the right groups 2 Preview 10:39

Adding elements to the right groups 3 Preview 03:40

Setting up the data Preview 08:36

Creating the cottage data Preview 02:45

Integrating data with Google maps and list Preview 08:16

Making the image showcase slider Preview 12:00

Functionality between map and list while choosing a page Preview 04:34

Changing Google map marker based on selection Preview 01:35

Updating the right side based on data Preview 06:41

Adding filtering (small) Preview 04:49

Adding booking functionality Preview 05:39

Adding Stripe into booking Preview 09:20

Appearance of page 2 Preview 04:47

Conversation tab Preview 03:23

Appearance on the right side Preview 16:04

Messaging 1 Preview 13:39

Messaging 2 Preview 11:48

Messaging 3 Preview 03:50

Modifying chosen place based on selected conversation Preview 07:32

Data transfer between the two pages Preview 06:54

Modifying views based on group selection Preview 09:24

Bookings tab Preview 09:01

Adding a place Preview 14:46

Adding user functionality Preview 10:29

Review Preview 02:23

Next steps Preview 04:14

Congratulations and next steps Preview 02:50