Immobilienmakler

Für Makler, die Immobilien für Eigentümer verkaufen. Eine Online-Bewertung, der Verkauf im Wochenraster, der Wochenbericht für Verkäufer, verkaufte Referenzen und ein Marktbericht nach Stadtteil.

5 Variants

Kategorie wechseln

Online-Bewertung

Drei kurze Schritte mit einer Leiste, die sich füllt, jeder Schritt gleitet herein. Am Ende zählt der Wert hoch, eine Spanne mit Markierung springt herein und ein kostenloser Termin wird angeboten.

Im Studio öffnen

Installv1.0.0

aiw add @ai-website/real-estate-agent

Bringt mit utils, kit, button, icon, input, section, motion, slider

Usage

<RealEstateAgent variant="valuation" types={[{ id, label, icon, perM2: 4200 }]} />

Source

Verkaufsablauf

Der Verkauf im Wochenraster, jeder Schritt ein Balken, der beim Scrollen nacheinander hereinwächst. Zeigen auf eine Zeile hebt sie hervor. Auf dem Telefon eine Liste mit den Wochen als kleinem Balken.

Im Studio öffnen

Installv1.0.0

aiw add @ai-website/real-estate-agent

Bringt mit utils, kit, button, icon, input, section, motion, slider

Usage

<RealEstateAgent variant="sale-process" steps={[{ title, text, from: 1, to: 2, icon }]} />

Source

Verkäuferbericht

Der Wochenbericht für Eigentümer. Wochen auf einem gleitenden Schalter wechseln, die Kennzahlen zählen, die Tagesbalken wachsen und der Trichter vom Aufruf zum Angebot folgt, mit einer Notiz der Maklerin.

Im Studio öffnen

Installv1.0.0

aiw add @ai-website/real-estate-agent

Bringt mit utils, kit, button, icon, input, section, motion, slider

Usage

<RealEstateAgent variant="seller-report" property="…" weeks={[{ label, views: [120, …], saved, inquiries, viewings, offers, note }]} />

Source

Verkaufte Referenzen

Verkaufte Häuser mit Banderole, Tagen bis zum Verkauf und dem erzielten Preis über Angebot. Nach Stadtteil auf Chips filtern, die Karten steigen neu auf, Bilder zoomen beim Zeigen.

Im Studio öffnen

Installv1.0.0

aiw add @ai-website/real-estate-agent

Bringt mit utils, kit, button, icon, input, section, motion, slider

Usage

<RealEstateAgent variant="references" references={[{ id, title, district, days, asking, achieved, area, image }]} />

Source

Marktbericht

Stadtteile mit Quadratmeterpreis und Veränderung, eine Linie markiert den gewählten. Ein Diagramm zeichnet den Fünfjahrestrend neu, der Preis zählt zu seinem Wert.

Im Studio öffnen

Installv1.0.0

aiw add @ai-website/real-estate-agent

Bringt mit utils, kit, button, icon, input, section, motion, slider

Usage

<RealEstateAgent variant="market-report" startYear={2021} districts={[{ id, name, prices: [4100, 4400, 4300, 4500, 4700, 4850], days }]} />

Source

Details

Was Immobilienmakler mitbringt, aus Registry und Quellcode gelesen.

Bereich: Industries
Variants: 5
Version: 1.0.0 · seit 1.1.0
Datei: components/ui/real-estate-agent.tsx
Bringt mit: utilskitbutton icon inputsectionmotionslider
npm-Pakete: Keine
Sprachen: Englisch und Deutsch, 45 eigene Texte
Studio: Alle 5 Variants bearbeitbar
Mit KI bauen: Per MCP in Claude, Cursor, Copilot und Codex

Props

Die Schnittstelle RealEstateAgentProps aus components/ui/real-estate-agent.tsx. Beschreibungen stammen aus den Kommentaren im Code und sind auf Englisch.

variantoptional
RealEstateAgentVariant
valuationsale-processseller-reportreferencesmarket-report
eyebrowoptional
React.ReactNode
titleoptional
React.ReactNode
descriptionoptional
React.ReactNode
typesoptional
AgentPropertyType[]
valuation
stepsoptional
AgentStep[]
sale-process
propertyoptional
string
seller-report: the property and its weeks on the market
weeksoptional
AgentWeek[]
referencesoptional
AgentReference[]
references
districtsoptional
AgentDistrict[]
market-report
startYearoptional
number
market-report: the first year of the price series
currencyoptional
string

Eingebaute Texte

Diese Texte schreibt Immobilienmakler selbst. Die Sprache folgt dem KitProvider, über die Prop labels ersetzt du einzelne.

Alle 45 Texte anzeigen

Schlüssel	Englisch	Deutsch
step	Englisch Step {n} of {total}	Deutsch Schritt {n} von {total}
kind	Englisch What do you want to sell?	Deutsch Was möchtest du verkaufen?
area	Englisch Living area	Deutsch Wohnfläche
year	Englisch Built in	Deutsch Baujahr
condition	Englisch Condition	Deutsch Zustand
renovate	Englisch Needs work	Deutsch Renovierungsbedürftig
good	Englisch Good	Deutsch Gepflegt
new	Englisch Like new	Deutsch Neuwertig
postcode	Englisch Postcode	Deutsch Postleitzahl
next	Englisch Continue	Deutsch Weiter
back	Englisch Back	Deutsch Zurück
show	Englisch Show my estimate	Deutsch Meine Schätzung zeigen
estimate	Englisch Estimated market value	Deutsch Geschätzter Marktwert
perM2	Englisch {price} per m²	Deutsch {price} pro m²
range	Englisch Range	Deutsch Spanne
precise	Englisch Get a precise valuation for free	Deutsch Kostenlose Bewertung vor Ort
again	Englisch Start again	Deutsch Neu starten
weeksTotal	Englisch In {n} weeks to the notary	Deutsch In {n} Wochen zum Notartermin
week	Englisch Week	Deutsch Woche
weekN	Englisch Week {n}	Deutsch Woche {n}
weeksRange	Englisch Weeks {from} to {to}	Deutsch Woche {from} bis {to}
plan	Englisch Plan your sale with us	Deutsch Verkauf mit uns planen
views	Englisch Views	Deutsch Aufrufe
saved	Englisch Saved	Deutsch Gemerkt
inquiries	Englisch Inquiries	Deutsch Anfragen
viewings	Englisch Viewings	Deutsch Besichtigungen
offers	Englisch Offers	Deutsch Angebote
funnel	Englisch From view to offer	Deutsch Vom Aufruf zum Angebot
perDay	Englisch Views per day	Deutsch Aufrufe pro Tag
days	Englisch Mon,Tue,Wed,Thu,Fri,Sat,Sun	Deutsch Mo,Di,Mi,Do,Fr,Sa,So
report	Englisch Your weekly report	Deutsch Dein Wochenbericht
sold	Englisch Sold	Deutsch Verkauft
soldIn	Englisch Sold in {n} days	Deutsch Verkauft in {n} Tagen
asking	Englisch Asking	Deutsch Angebotspreis
achieved	Englisch Achieved	Deutsch Erzielt
over	Englisch {n}% over asking	Deutsch {n} % über Angebot
atAsking	Englisch At the asking price	Deutsch Zum Angebotspreis
all	Englisch All	Deutsch Alle
sellToo	Englisch Sell with us	Deutsch Mit uns verkaufen
district	Englisch District	Deutsch Stadtteil
trend	Englisch {n}% in {years} years	Deutsch {n} % in {years} Jahren
onMarket	Englisch Days on market	Deutsch Tage am Markt
m2	Englisch per m²	Deutsch pro m²
reportCta	Englisch Download the full market report	Deutsch Ganzen Marktbericht herunterladen
zipError	Englisch Please enter a postcode with four or five digits	Deutsch Bitte gib eine Postleitzahl mit vier oder fünf Ziffern ein

Aus dem Quellcode der Component abgeleitet.

Immobilienmakler reagiert selbst auf die Tasten Pfeil hoch, Pfeil runter, Pfeil links, Pfeil rechts und Leertaste.
Setzt aria-checked, aria-label und aria-live, damit Screenreader Zweck und Zustand ansagen.
Nutzt die Rollen radio und radiogroup.
Meldet Änderungen über eine Live-Region, ohne den Fokus zu verschieben.
Ergänzt Text für Screenreader, wo Icons und Grafiken allein stehen.
Zeigt bei Bedienung mit der Tastatur einen sichtbaren Fokusring.
Der Server rendert den Startzustand vollständig, JavaScript ergänzt nur die Interaktion.

Bewegung

Bringt eigene Animationen mit, ruhig getaktet und ohne Wackeln.
Bei reduzierter Bewegung (prefers-reduced-motion) bleibt sie ruhig. 7 Stellen im Code schalten Bewegung dann ab.

Häufige Fragen

Wie installiere ich Immobilienmakler?

Mit aiw add @ai-website/real-estate-agent. Der Befehl legt die Datei components/ui/real-estate-agent.tsx in dein Projekt, der Code gehört danach dir. Mit dabei sind button, icon, input, section, motion und slider. Weitere npm-Pakete braucht sie nicht.

Welche Varianten hat Immobilienmakler?

5 Varianten, Online-Bewertung, Verkaufsablauf, Verkäuferbericht, Verkaufte Referenzen und Marktbericht. Du wählst sie mit der Prop variant, zum Beispiel variant="sale-process".

Kann ich die Texte von Immobilienmakler übersetzen?

Ja. Immobilienmakler bringt 45 eigene Texte auf Deutsch und Englisch mit, etwa „Was möchtest du verkaufen?“, „Wohnfläche“ und „Baujahr“. Die Sprache folgt dem KitProvider, einzelne Texte ersetzt du über die Prop labels.

Kann ein KI-Assistent Immobilienmakler einbauen?

Ja. Über den MCP-Server der aiw CLI finden Claude, Cursor, GitHub Copilot, Windsurf, Codex und Gemini Immobilienmakler mit aiw_components und installieren sie mit aiw_add @ai-website/real-estate-agent. Nenn im Prompt die Variante, etwa variant="valuation", dann schreibt der Assistent deine Inhalte direkt in die Props.

Kann ich Immobilienmakler ohne Code anpassen?

Ja, im Studio. Alle 5 Varianten lassen sich dort bearbeiten, Texte, Listen und Schalter. Das Studio schreibt den passenden RealEstateAgent-Code zum Kopieren.

Wird oft kombiniert mit

Sections, die auf einer Seite meist neben Immobilienmakler stehen.