1. Produkter
  2.   E-post
  3.   Node.js
  4.   Email-Builder-js
 
  

Open Source Nodd.js-bibliotek for e-postmaler

Et kraftig Node.js e-postbibliotek gjør det mulig for programvareutviklere å bygge tilpassbare e-postmaler programmatisk. Det bruker gjenbrukbare komponenter som topptekster, bunntekster og innholdsseksjoner

Å lage polerte, profesjonelle e-postmaler er viktig for applikasjoner som sender automatiserte meldinger som velkomst-e-poster, nyhetsbrev, transaksjonsvarsler og lignende. Å skrive HTML-e-poster kan være vanskelig på grunn av kompatibilitetsproblemer mellom e-postklienter og enheter. Når det gjelder å bygge tilpassede e-postmaler, møter utviklere ofte utfordringer knyttet til layoutkonsistens, tilpasning og responsivt design. Email-Builder-js er et kraftig åpen kildekode JavaScript-bibliotek som forenkler opprettelse og håndtering av e-postmaler i JavaScript-applikasjoner. Dette kraftige verktøyet gjør det enkelt for utviklere å designe, tilpasse og integrere dynamiske e-postmaler i sine applikasjoner.

Email-Builder-js er et Node.js-bibliotek for å lage HTML-e-postmaler med fokus på modulært design, kryssklient-kompatibilitet og tilpasset styling. Det har et brukervennlig dra‑og‑slipp‑grensesnitt som gjør det enkelt for utviklere å legge til og arrangere elementer, som tekst, bilder og knapper, i e-postmalene sine. Det gjør det mulig for programvareutviklere å generere e-postmaler programmatisk, og unngår bryet med inline‑styling og HTML‑spesifikke quirks ved å håndtere mye av dette bak kulissene. Ved å bruke biblioteket kan maler bygges fra gjenbrukbare komponenter, noe som gjør det enkelt å opprettholde konsistens på tvers av ulike e-poster og sparer utviklingstid. Biblioteket er svært praktisk for apper som trenger personaliserte e-poster. Den modulære oppsettet, tilpasningsalternativene og evnen til å fungere sømløst med e-posttjenester gjør det svært nyttig for dine kommunikasjonsbehov og programvareutvikling.

Previous Next

Kom i gang med Email-Builder-js

Den anbefalte måten å installere Email-Builder-js-biblioteket på er å bruke NPM. Vennligst bruk følgende kommando for en smidig installasjon.

Installer Email-Builder-js via NPM

npm install --save @usewaypoint/email-builder
 

Lag komponentbasert e-postmaldesign

I kjernen av det åpne kildekode-biblioteket Email-Builder-js ligger fokuset på komponenter. Med denne tilnærmingen kan programvareutviklere lage gjenbrukbare deler som overskrifter, bunntekster, innholdsseksjoner og knapper. Disse komponentene kan blandes og matches uten anstrengelse for å danne en komplett mal. Ved å bryte ned designet på denne måten, blir ikke bare koden bedre organisert, men det blir også enklere å oppdatere og administrere malene dine. I det følgende eksemplet blir hver komponent opprettet individuelt, noe som gir fleksibel sammensetning og fremtidige oppdateringer uten å endre hele strukturen.

Hvordan lage e-postkomponenter og kombinere dem ved hjelp av Node.js-biblioteket?

 
const EmailBuilder = require('email-builder-js');

const email = new EmailBuilder();

// Create reusable components
const header = email.createComponent({
  tag: 'header',
  content: '

Velkommen til vår plattform!

', style: { color: '#333', textAlign: 'center', padding: '10px' }, }); const mainContent = email.createComponent({ tag: 'div', content: '

Vi er glade for å ha deg med om bord. Nyt funksjonene våre!

', style: { color: '#666', fontSize: '16px', padding: '20px' }, }); const footer = email.createComponent({ tag: 'footer', content: '

Med vennlig hilsen,
Team

', style: { color: '#999', textAlign: 'center', padding: '10px' }, }); // Combine components into a template const template = email.buildTemplate({ components: [header, mainContent, footer], }); // Output the complete HTML template console.log(template);

Bruk tilpasset styling og merkevarebygging på maler

For å sikre at e‑postmaler samsvarer med en applikasjons merkevare, tillater Email-Builder-js‑biblioteket omfattende tilpasning gjennom style‑attributtet for hver komponent. Dette inkluderer justering av farger, skrifttyper, størrelser og oppsett av malene. Programvareutviklere kan bruke inline‑styling, som er kritisk for å sikre at e‑postklienter gjengir designene som tiltenkt. Følgende kodeeksempel lager en knapp med bakgrunnsfarge, polstring og avrundede hjørner, stilisert for å ligne en typisk handlingsknapp som samsvarer med merkevarens farger.

Hvordan lage en knapp med bakgrunnsfarge, padding og avrundede hjørner i Node.js?

 
const button = email.createComponent({
  tag: 'a',
  content: 'Click Here to Get Started',
  attributes: { href: 'https://example.com/get-started' },
  style: {
    display: 'inline-block',
    padding: '10px 20px',
    backgroundColor: '#007bff',
    color: '#fff',
    textDecoration: 'none',
    borderRadius: '5px',
    textAlign: 'center'
  },
});

const template = email.buildTemplate({
  components: [button],
});

console.log(template);
 

Dynamisk innsetting av innhold i e-poster i Node.js

For applikasjoner som sender personlige e‑poster, som ordrebekreftelser eller bruker‑spesifikke varsler, støtter det åpne kildekode‑biblioteket Email-Builder-js dynamisk innholdsinjeksjon. Programvareutviklere kan programmessig sette inn bruker‑spesifikk informasjon (som navn, adresse eller kjøpsdetaljer) i maler, noe som muliggjør opprettelse av mer engasjerende og relevante e‑poster. Ved å bruke template literals kan utviklere enkelt erstatte plassholdere med dynamisk innhold. Denne tilnærmingen er svært effektiv for transaksjonelle e‑poster og enhver situasjon hvor personalisering er nøkkelen, som vist i følgende eksempel.

Hvordan lage e-poster ved å injisere dynamisk innhold via Node.js-biblioteket?

 
const userName = 'John Doe';
const product = 'Premium Subscription';

const personalizedContent = email.createComponent({
  tag: 'div',
  content: `

Hei ${userName},

Takk for at du kjøpte vår ${product}!

`, style: { color: '#333', fontSize: '16px' }, }); const template = email.buildTemplate({ components: [personalizedContent], }); console.log(template);
 Norsk