Rendering Web Components

Shopify Apps
,

Topic summary

A developer is migrating an Angular/BabylonJS application (currently a WooCommerce plugin) to Shopify and seeking guidance on architecture patterns.

Current Setup:

  • Angular app exported as web component
  • Uses Tailwind CSS for UI
  • Makes direct API calls to custom server
  • Loads data for BabylonJS rendering

Key Questions:

  • Whether loading the web component via external script tag in Shopify admin is an anti-pattern
  • If bundling the component within the Shopify app is the preferred approach
  • Whether using web components is considered bad practice for Shopify apps
  • If direct API calls from web components to external servers are acceptable

Status: The discussion remains open with no responses yet. The developer is seeking best practices and potential pitfalls before beginning development.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Hi, I’ve an angular application that use babylonjs, it is exported as a web componet and we are currently using it as a woocommerce plugin. The UI is written using tailwind, and directly makes api calls to our server and load the data for babylonjs.

We are planning to create a shopify clone for this app. I was wondering if I could use the web component (hosted in my server), by loading the script using a script tag inside the shopify admin side.
Is this considered an anti-pattern?

If so, will bundling the web component inside the shopify app bundle be considered the right way to embed a web component?
Do you think using web componets itself is considered a bad practice? If not, is it okay for web components to make api calls directly to my serve?

What other things you think might be essential for us to know, before we start writing something like this?