Intro to APIs & the API Connector | Bubble Crash-Course

Показать описание

APIs are a superpower that you can harness for your own Bubble apps using the API Connector plugin! In the beginning of this crash-course, you'll learn what APIs are and why you may want to use them. And after, you'll follow along step by step as we build a Bubble app from scratch with content from multiple APIs.

0:00 - Chapter 0: "Course Overview"
2:51 - Chapter 1: "The 5 Core HTTP Requests"
5:59 - Chapter 2: "Intro to Authentication"
7:45 - Chapter 3: "The API Connector"
10:32 - Chapter 4: "Build an App with APIs"
12:39 - Chapter 4.1: "GET All Movies"
19:20 - Chapter 4.2: "GET Movie by ID"
28:29 - Chapter 4.3: "Authentication"
31:46 - Chapter 4.4: "POST Create a New Movie"
38:38 - Chapter 4.5: "PUT & PATCH Modify an Existing Movie"
48:33 - Chapter 4.6: "DELETE a Movie"
53:14 - Chapter 5: "The GIPHY API"
1:04:09 - Chapter 6: "Additional Exercises & Conclusion"

DEMO MOVIE API DOCUMENTATION

GIPHY API DOCUMENTATION

DESIGN TEMPLATE

Bubble is a visual programming language that lets you build web applications without code. Using Bubble's visual editor, you can build a fully-functional web application quickly and affordably.

Learn more about Bubble, the leading no-code web app development platform:

Bubble

Рекомендации по теме

Комментарии

Great idea from the bubble team to put out an hour long video on APIs 💯

tobigbemisola

This does not work with the template at all. I fought with this for hours and could never get the nested groups to pick up the data. totally frustrating. this is typical of the types of issues I continue to have with developing with bubble. if I can't reverse engineer the nested rg in this template, how am I supposed to make anything work with bubble? even if you try to follow by just making a new blank page, at 24:00 suddenly they magically have a movie card, like the template, but never show how to set it up. update: after many many hours of hammering on the nested groups, I finally got that working, but the popups for the delete and edit, I have tried everything. I can't get the workflow to display data - data to display. I have about 80 hours spent watching bubble tutorials from other YouTube creators, and this is the WORST tutorial I ever wasted my time on.

DesertGardenPrepper

how to get initial data in popup (patch)? I tried hard but not succeed
can you help?

patelurvish

The best educating bubble video i ever watched. please create more crash courses like this.

aliroshdy

Super Course. But one question, how do I pass data from the delete icon to the pop up ? The icon data type is GET ALL MOVIE RESPONSE and the pop up data type is GET MOVIE BY ID. Did I miss something ?

nymeanoman

I used the "Intro to APIs template" template mentioned in the video. But it has a lot of nested groups and I could not manage to connect the APIs to the groups and have the correct data be passed from group to child-group. Please provide detailed explanation how this is done.

But still I learned a lot from this video. I was able to use this video tutorial to create new pages for all-movies and movie-detail and could conntect all API calls: Get all movies, Get movie by ID, Create Movie, PUT Movie by ID, Patch Movie by ID, Delete Movie by ID.

nilsfaltin

Speaking of sending data to child group in Repeating Group in Template, I also struggled for a couple of hours. Then I found how to set it up. You have to set up ALL nested Groups of Movie Card.

Movie Card's properties:
"Type of content" is "GET all movies response result"
"Data source" is "Current cell's GET all movies response result"

Nested Groups'(GroupCoreContent, and Group Title/Tag) properties:
"Type of content" is "GET all movies response result"
"Data source" is "Parent's group's GET all movies response result"

It's complicated, so I recommend to use the Elements Tree of UI Builder tab. I didn't make the template myself, so it feels complicated, but if I use the Elements Tree, I can easily understand the nested structure of the groups.

ilmubtu

Great job team. Amazing course, Covering every small thing. will definitely help the new bubblers like me. I have two questions for the team, I want to perform the post request with nested json. Can you share any document link or video for the same? Also I have tried 2-3 ways to perform google auth. I want the idtoken which google returns in response. Can i get it using API connector ? Please share the steps for both. Thank you

pratimadudhewar

FYI...Finding Nemo's id has been changed since the video was published. ITs now or just used another ID from the raw json in the initial call...

GoIdenhigh

Wow! Bubble API is like Alibaba’s “Open Sesame” call to open the secret door to the infinite treasures. And I was just floored by the tutorial! Beautifully designed and executed. Bravo and thank you so much Bubble Team. Way to go..

mohammedansari

Great video !
Could you just enable "Everyone can view" on the doc editor please? To learn more about how to open your Bubble API to external applications. Thanks in advance

amendavid

Would be cool to see more examples of what people have done leveraging multiple APIs, seems like endless possibilities.

Iaintsayinnothin..

Also say an API didn't have an API Explorer could you use a platform like Postman to test the API first?

Iaintsayinnothin..

great tutorial, well done to all involved! can tell a lot of work went into it

CranfordTech

Error when getting movie by ID

Raw response for the API
Status code 404
{"statusCode":404, "body":{"status":"MISSING_DATA", "message":"Missing object of type movie: object with id does not exist"}}

ikelloydyana