<!DOCTYPE html>

<h1>Displaying a field from Bubble.io Database to a Webpage</h1>
<p>Data Type: postman, Field: postname (text)</p>

  <p>Current value of first created (oldest) item (object):</p><p id="one" class="item"></p>
  <h2>All information associated with first created (oldest) item (object)</h2>
  <p id="two" class='item'></p>
  <p>Things I learned. JSON Stringify is needed to convert data to display it properly. The Replace method was needed to get rid of the quotes. I used version-test (Bubble.io) so that my public data wouldn't accidentally be modified. </p>

.item {
color: blue;
  font-weight: bold;

.then(data => {
return data.json();
.then(postman => {
  let result = JSON.stringify(postman.response.results[0].postname);
  final_result = result.replace(/['"]+/g, '');
  document.getElementById("one").innerHTML = final_result


.then(data => {
return data.json();
.then(postman => {
  let result = JSON.stringify(postman.response.results[0]);
  document.getElementById("two").innerHTML = result
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.