Aufbau zusammensetzbarer Plattformen mit Harmony

In der heutigen schnelllebigen digitalen Landschaft ist der Bedarf an adaptiven, skalierbaren und wartbaren Softwaresystemen größer denn je.

Herkömmliche monolithische Architekturen können diesen Anforderungen aufgrund ihrer Starrheit und Komplexität oft nicht gerecht werden. Betreten Sie Harmony, ein Framework, das zusammensetzbare Plattformen mit hoher Effizienz und Flexibilität ermöglicht.

In diesem Artikel untersuchen wir, wie Harmony, powered by Bit, die Art und Weise verändert, wie wir moderne Anwendungen erstellen und warten.

Was ist Harmonie?

Harmony ist ein minimalistisches und dennoch leistungsstarkes Abhängigkeitsinjektions-Framework, das auf die Erstellung zusammensetzbarer Architekturen zugeschnitten ist. Indem es Entwicklern ermöglicht, unabhängig entwickelte Bit-Komponenten zusammenzufügen, ermöglicht Harmony Teams die Entwicklung von Anwendungen, die nicht nur modular, sondern auch an sich ändernde Geschäftsanforderungen anpassbar sind. Harmony unterstützt die Zusammensetzbarkeit des gesamten Stapels und eignet sich daher ideal für die Integration von Frontend- und Backend-Funktionalitäten in zusammenhängende Plattformen.

Hauptmerkmale von Harmony

• Pluggable Aspects: Modulare Geschäftsfunktionen, sogenannte Aspekte, können einfach in Plattformen integriert werden.

• Laufzeitflexibilität: Offizielle Unterstützung für Node.js und Browserumgebungen gewährleistet Kompatibilität in verschiedenen Anwendungsfällen.

Warum Zusammensetzbarkeit wichtig ist

Composability ermöglicht Organisationen Folgendes:

• Schnell anpassen: Neue Funktionen können unabhängig hinzugefügt oder aktualisiert werden, ohne das bestehende System zu stören.

• Förderung der Wiederverwendbarkeit: Gemeinsam genutzte Komponenten können über mehrere Projekte hinweg genutzt werden, wodurch Duplikate reduziert und die Konsistenz erhöht werden.

• Zusammenarbeit fördern: Teams können an isolierten Aspekten oder Komponenten arbeiten, ohne sich gegenseitig auf die Füße zu treten.

Aufbau eines zusammensetzbaren Systems mit Harmonie

Wie bereits erwähnt, sind die Bausteine ​​eines Harmony-Systems Bit-Komponenten. Da es sich bei Bit-Komponenten jedoch um Container für beliebige Softwareeinheiten handelt, ist nicht jede Bit-Komponente geeignet.

Harmony verwendet Komponenten mit einem bestimmten Design, um ihnen die Nutzung und Bereitstellung von „Diensten“ für andere Aspekte zu ermöglichen. Dabei kann es sich um reine Frontend-, reine Backend- oder Full-Stack-Funktionen handeln.

Ein Aspekt stellt eine einzelne Geschäftsfähigkeit dar, die in ein größeres System eingebunden werden kann, um eine vollständige Lösung, eine neue Anwendung, zu bilden.

Aspekte erweitern andere Aspekte durch die Registrierung bei ihrer „Slot“-API. Diese Umkehrung der Kontrolle ermöglicht es Teams, Funktionen oder Geschäftsfunktionen mit minimalem Overhead zu erstellen, da der Aspekt für die Integration verantwortlich ist und nicht das System, das sie erstellt.

Bei der folgenden Harmony-App handelt es sich beispielsweise um einen Onlineshop für Surferbekleidung.

Das für diesen Online-Shop verantwortliche Team hat beschlossen, seiner Website einen Blog hinzuzufügen. Nachdem sie auf der Bit-Plattform nach geeigneten Aspekten gesucht hatten, stießen sie auf diesen Blog-Aspekt. Sie beschlossen, es zu verwenden und fügten es ihrer Hamrony-Anwendung hinzu:

/**
 * @coponentId: learnbit.apparel-waves/apparel-waves
 * @filename: apparel-waves.bit-app.ts
 */ 

// imports...
import { SymphonyPlatformAspect } from '@bitdev/symphony.symphony-platform';
import { ApparelWavesPlatformAspect } from '@learnbit/apparel-waves.apparel-waves-platform';
import { BlogAspect } from '@learnbit/blog-pbc.blog';

export const ApparelWaves = HarmonyPlatform.from({
  name: 'apparel-waves',
  platform: [
   /**
    * ascpects register themsevles to the 'platform' aspect which
    * is the entry point for this application
    */
    SymphonyPlatformAspect,
    {
      name: 'Apparel Waves',
      slogan: 'Making waves in fashion',
      domain: 'apparel-waves.com',
    },
  ],
  /**
    * aspects can run in multiple runtime environments. here, aspects 
    * provide functionalitis to the NodeJS services and to the web frontend apps
   */
  runtimes: [new BrowserRuntime(), new NodeJSRuntime()],

  aspects: [
    /* 'apperal waves' aspect extends the system with its 
     * own unique functionalities. this aspect is maintained by 
     * a team that composes the apsects for their own solution.
     */
    ApparelWavesPlatformAspect,
    /**
     * the blog aspect extends the system with content 
     * management capabilities. it is maintained by the blog PBC team.
     */
    [
      BlogAspect,
      {
       /**
         * the blog aspect also provide a config api for this app to use
         * in this case, since the the blog uses the Contenful platform,
         * the fusion team need to provide it with their own Contentful space ID
         */        
        spaceId: 'contentful-spaceId',
      },
    ],
  ],
});

export default ApparelWaves;

Der Blog-Aspekt registriert sich auf verschiedene Arten auf der Plattform:

1. Es erweitert das GraphQL-Schema des Systems um einen Knoten zum Abrufen von Inhalten. Dies erfolgt in der NodeJS Runtime.

2. Es erweitert das Routing des Systems um die /blog-Route. Dies geschieht in der Browser Runtime.

3. Es erweitert die Kopfzeile um ein zusätzliches Element, einen „Blog“-Link zu /blog. Dies geschieht in der Browser Runtime.

NodeJS-Laufzeit

/**
 * @coponentId: learnbit.blog-pbc/blog
 * @filename: blog.node.runtime.ts
 */

export class BlogNode {
  constructor(private config: BlogConfig) {}

  async getBlogPosts() {
    const blogData = new BlogData(this.config);
    return blogData.getBlogPosts();
  }

  static dependencies = [SymphonyPlatformAspect];

  static async provider(
    [symphonyPlatform]: [SymphonyPlatformNode],
    config: BlogConfig
  ) {
    const blog = new BlogNode(config);
    const gqlSchema = blogGqlSchema(blog);

    symphonyPlatform.registerBackendServer([
      {
        gql: gqlSchema,
      },
    ]);

    return blog;
  }
}

export default BlogNode;

Browser-Laufzeit

**
 * @coponentId: learnbit.blog-pbc/blog
 * @filename: blog.browser.runtime.ts
 */


export class BlogBrowser {
  constructor(private config: BlogConfig) {}

  static dependencies = [SymphonyPlatformAspect, HeaderAspect];

  static async provider(
    [symphonyPlatform, header]: [SymphonyPlatformBrowser, HeaderBrowser],
    config: BlogConfig
  ) {
    const blog = new BlogBrowser(config);

    symphonyPlatform.registerRoute([
      {
        path: '/blog',
        component: () => {
          return (
            <apolloblogprovider spaceid="{config.spaceId}">
              <bloglobby></bloglobby>
            </apolloblogprovider>
          );
        },
      },
    ]);

    header.registerLink([{ label: 'Blog', href: '/blog' }]);

    return blog;
  }
}

export default BlogBrowser;

Der Blog-Aspekt in diesem Beispiel verwendet das Contentful-Content-Management-System. Es bietet eine kohärente „Sprache“ für gekaufte Dienste innerhalb des Aspektökosystems des Unternehmens und stellt sicher, dass sie effektiv kommunizieren und nahtlos zusammenarbeiten können.

/**
 * @coponentId: learnbit.blog-pbc/blog
 * @filename: blog-data.ts
 */

import { ApolloClient, InMemoryCache, HttpLink, gql } from '@apollo/client';
import type { BlogConfig } from './blog-config.js';

export class BlogData {
  constructor(private readonly config: BlogConfig) {}

  private contentfulClient = new ApolloClient({
    link: new HttpLink({
      uri: `https://graphql.contentful.com/content/v1/spaces/${this.config.spaceId}`,
      headers: {
        Authorization: `Bearer ${process.env.CONTENTFUL_ACCESS_TOKEN}`,
      },
      fetch,
    }),
    cache: new InMemoryCache(),
  });

  getBlogPosts = async () => {
    const { data } = await this.contentfulClient.query({
      query: gql`
        query GetBlogs {
          pageBlogPostCollection {
            items {
              title
              slug
              author {
                name
              }
            }
          }
        }
      `,
    });
    return data.pageBlogPostCollection.items.map((item) => ({
      title: item.title,
      slug: item.slug,
      author: {
        name: item.author ? item.author.name : null,
      },
    }));
  };
}

Nächste Schritte

Entdecken Sie den Bereich „Blog“ (mit dem Blog-Aspekt)

Besuchen Sie diese Bit-Bereiche, um Demo-Aspekte zu erkunden, und verzweigen (kopieren) Sie sie in Ihren Bit-Arbeitsbereich, um schnell loszulegen.

Besuchen Sie den Blog-Bereich

Entdecken Sie den Bereich „Apparel Waves“ (mit einer Harmony-Plattform)

Besuchen Sie den Bereich Apparel Waves

Besuchen Sie die offizielle Dokumentation von Bit

Bisschen. Zusammensetzbare Software.

Bit ist ein Build-System für die Entwicklung zusammensetzbarer Software.

bit.dev

Das obige ist der detaillierte Inhalt vonAufbau zusammensetzbarer Plattformen mit Harmony. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!