Viscosity
logo-black
  • Data
    • Database Services
      • Performance Assessment
      • Proactive Healthcheck
      • Database Migration & Consolidation
      • Performance Tuning
    • Microsoft Services
      • Microsoft Azure Services
      • Microsoft SQL Server Services
      • Microsoft Gold Azure Partner
    • Oracle Services
      • Oracle Database 19c
      • RAC
      • GoldenGate
      • Data Guard
      • Oracle & SQL Database
    • Viscosity Remote Services
  • Apps
    • App Dev Services
    • Oracle APEX
    • Viscosity AMP
    • Viscosity-ai
    • Shane-ai
  • Cloud
    • Cloud Services
    • Hybrid Cloud
    • Viscosity Edge Cloud
    • Virtualization & Cloud Expertise
    • Microsoft Azure Services
  • Infrastructure
    • Infrastructure Services
    • Exadata
      • Exadata Resale & Services
    • Oracle Database Appliance
      • Oracle Database Appliance Resale & Services
      • ODA Health Checks
    • Zero Data Loss Recovery Appliance
    • VMware to KVM Migration
  • Events
    • Upcoming Events
    • Virtual Training
    • 2025 Past Events
    • 2024 Past Events
    • 2023 Past Events
    • 2022 Past Events
  • About
    • About Us
    • News
    • Blogs
    • Publications
    • Contact
Hit enter to search or ESC to close
ENGAGE WITH US

Application Development , APEX , JSON , API , Data

Creating an APEX App Using Data From an API – Step 3

By Alan Quigley
April 25, 2024

In our ongoing journey to transform a complex dataset from the Star Wars Unlimited card game into a fully functional APEX application, we've successfully parsed and organized our data in Part 2. Now, in this third installment, we're ready to put this data on display by creating a visual representation in the form of a card gallery. I am going to do all of this on https://apex.oracle.com/ so that it is easy to follow along.


Starting Simple

Let us start by creating an application. It just needs to be a simple app with no bells or whistles. We will create everything from the ground up.

 

 

Creating the Visual Layout

Let’s just get started on the home page. It should look like this:




We can create a new Region and call it "Cards."



 

Let’s set that Region to Type Cards and set the Table Name to SWU_CARD_LIST, the table we created in the previous part of this series in Step 2.




 

Setting Up Card Attributes

Now, we will set the attributes to show a card with an image for each of the rows in the table.


We will set the Card Primary Key Column 1 to CARD_NUMBER to uniquely identify each card.




And the Media section configuration to:

  • Source: Image URL
  • URL: Enter '&IMAGE_URL.'
  • Position: Body
  • Appearance: Auto
  • Sizing: Fit




Now we run the app, and we have images! But they are out of order.




To remedy the ordering, I am going to change the Source to a query and add an ORDER BY statement to ensure the cards are sorted by their number. Here’s the query used:

select CARD_NUMBER,

       CARD_SET,

       CARD_NAME,

       TRAITS,

       ARENAS,

       CARD_COST,

       CARD_POWER,

       CARD_HP,

       FRONT_TEXT,

       DOUBLE_SIDED,

       RARITY,

       IMAGE_URL,

       BACK_IMAGE,

       MARKET_PRICE,

       VARIANT

from SWU_CARD_LIST

ORDER BY card_number


 


Now they are all in order, and it is easier to find what we are looking for.




 

Looking Ahead

Like I said, easier, but there is more that we can do. In Part 4, we will introduce Faceted Search to our application. This feature will allow users to filter cards based on various criteria, such as stats or card type, simplifying the process of finding specific cards within the app. Stay tuned as we continue to develop our application into a robust platform for managing and displaying our Star Wars Unlimited card collection!

All posts
About Author
Alan Quigley

Alan Quigley is a Senior Software Architect at Viscosity, with almost four years of invaluable expertise to the role. He has over nine years of specialized experience in Oracle APEX and more than twelve years of honing his skills in crafting complex logical solutions. Alan has made a significant impact in diverse industries such as Accounting, Supply Chain, Logistics, Healthcare, and Utilities, thanks to his exceptional command of PL/SQL and Oracle APEX. He is an undisputed expert in these domains, consistently delivering innovative, efficient, and robust software solutions that redefine industry standards.

You might also like
Creating an APEX App Using Data From an API – Step 4
Creating an APEX App Using Data From an API – Step 4
April 25, 2024
Creating an APEX App Using Data from an API – Step 2
Creating an APEX App Using Data from an API – Step 2
April 25, 2024
SUBMIT YOUR COMMENT
logo for footer

Viscosity's core expertise includes:

Data Transformation, Emerging Technology, High Availability & Scalability Solutions, Cloud Migrations, Performance Tuning, Data Integrations, Machine Learning, APEX Development, and Custom Application Development.


Solutions

Resources

Partnerships

Careers

Clients

 

Contact
Email: sales@viscosityna.com

Telephone:
(469) 444-1380

Address:
3016 Communications Pkwy Suite 200, Plano, TX 75093

Copyright 2025. All Rights Reserved by Viscosity North America.