Using Bubble-made Plugin APIs 2
In previous articles, we discussed how you could integrate APIs and plugins into your app. These plugins vastly improve your app’s capabilities and allow your app to become part of a greater ecosystem of applications and services all at the cost of a fraction of the design and coding cost.
Plugins allow your app to connect with outside services like social media platforms, and payment utilities, or give your app pre-built functionality like rating stars or connections with other app APIs. Plugins for Bubble apps can be made by any number of third parties including fellow Bubble app developers, the developers of the outside services, or even Bubble itself.
In this article, we’ll give you Bubble app API assistance by exploring another set of APIs that Bubble provides to improve your app.
Just as a refresher, take note that all of these plugins can be found and installed via Bubble’s Plugins tab at the left of your developer interface.
The iTunes plugin allows you to search for and display results for songs from the iTunes music library. The iTunes plugin handles the API calls to the iTunes database and it also gives you dynamic test elements that will allow you to display the information you requested. All you need to do is design your page to tell iTunes what information to display where.
Once you’ve installed the iTunes plugin from the tab, you can use repeating group elements to display a list of song results. When configuring a new repeating group, set the content type to ‘iTunes song’ and set ‘get data from external API’ as your data source, with ‘Get iTunes songs’ as your choice of data provider.
Setting ‘Get iTunes songs’ as your data source will then open a dialog box which will allow you to search for a song from the database. Just put static or dynamic text in the ‘Term to search’ dialog box. For example, by adding a text input element and linking its value to the ‘Term to search’ dialog using dynamic text you can effectively make a search box for your user to input songs into.
From there, you should set the elements of the repeating group to display the dynamic text elements provided by the iTunes plugin. Just add text and image elements to the repeating group and set them to display dynamic content like the Current cell’s iTunes song’s track title, artist, and album art.
Bubble’s star rating plugin is as simple as it sounds – it allows you to create a star rating component that lets users add star ratings to a thing like with Yelp and other rating apps. This plugin doesn’t allow you to access an external third-party service, but instead gives you a prebuilt component to add to your app.
Upon setting it up, you can link it to a workflow that detects when it gets changed. That workflow can then save the rating to your database, and even associate it with the appropriate record in your database.
Take note that the rating component effectively functions like a slider. The stars are simply a covering to show how far the slider is to the left or right. The plugin allows you to customize the component by setting a minimum value, a maximum value, and how many steps are incremented when the stars are modified. You can set the initial value which is shown to the user before they modify it. This initial value can be set to a dynamic thing of type number, allowing you to for example show the average of previous ratings by making a reference from your database.
You can also set the star’s size by selecting from Xs, Sm, Md, Lg, and Xl. You can also set the color for the stars filled in, such as the four stars for a rating of 4/5 stars, along with the color for the unrated stars, such as the one remaining star in the rating of 4/5.
Rich Text Editor
This plugin allows you to add a Rich Text Editor component to your app, such as for when you want your users to be able to make long text posts, replies, or messages. This plugin doesn’t allow you to access an external third-party service, but instead gives you a prebuilt component to add to your app.
Once you’ve installed the plugin, the Rich Text Editor can be added to your app from under the Input Forms category of your UI Builder in the Design Tab. From there you can customize its appearance and its functionality.
For the appearance you can select its background style or color, the appearance of the editor’s borders, the appearance of shadows appearing within your app, and visual design transitions for your element.
Functionality-wise, your rich text editor has some very interesting options. For one thing, you can customize the initial content or placeholder of your editor. The initial content is actual text that is pre-set, meaning if the user submits the form without editing anything, this will get submitted. The placeholder is a faint prompt that appears in the editor when it is blank.
You could also customize whether the editor functions as a tooltip or as a regular editor. In tooltip mode, the formatting settings for the entered text appears as a tooltip above the text editing cursor. In regular mode, the formatting settings appear as a toolbar over the text input.
These tools are all extremely interesting and powerful, they still require a capable and creative developer to make full use of them. You as a developer will need to make your app more than just an API Integration Bubble App.
When combined with each other, with Bubble’s functionality, and with an innovative and critical development team, these plugins can make an app turn into something so much more than just the sum of its parts.
If you want to create apps that are capable of synergistically using data and design elements to give your users a worthwhile and value-adding experience, consider contacting Bubblehelpers for development tips, design assistance, or even just to answer some Bubble FAQs.