Sobald Sie sich ein wenig näher mit einem CMS wie WordPress be­schäf­ti­gen, eine App in Auftrag geben oder sich tie­fer­ge­hend in eine neue Software ein­ar­bei­ten, werden Sie auf die Begriffe „Frontend“ und „Backend“ stoßen. In welcher Beziehung stehen Frontend und Backend zu­ein­an­der und wie un­ter­schei­den sie sich?

Frontend und Backend: Zwei ver­schie­de­ne Ebenen einer Software

Frontend und Backend finden Sie in jeder Software und damit auch auf jeder Website. Einfach gesagt be­schrei­ben die beiden Begriffe zwei un­ter­schied­li­che Ebenen, aus denen Programme oder Seiten bestehen. Eine wirklich adäquate deutsche Über­set­zung für die beiden Ausdrücke aus der In­for­ma­ti­ons­tech­nik gibt es leider nicht. Am ehesten treffend wären „Überbau“ für das Frontend und „Unterbau“ für das Backend. Eine bessere Hil­fe­stel­lung bietet die jeweils ersten Silbe: „Front-“ weist auf den Vor­der­grund und „Back-“ auf den Hin­ter­grund hin.

Um zu verstehen, was Frontend und Backend bedeuten, ist es sinnvoll, sie zunächst un­ab­hän­gig von­ein­an­der zu be­trach­ten. Zwar hängen beide Ebenen sehr eng zusammen, erfüllen aber dennoch komplett un­ter­schied­li­che Aufgaben. Nur wenn Frontend und Backend perfekt in­ein­an­der­grei­fen, funk­tio­niert auch die ent­spre­chen­de Anwendung pro­blem­los.

Was ist ein Frontend?

Möchte man erklären, was das Frontend genau ist, versetzt man sich am besten in die Lage eines Users. Wenn Sie eine Website aufrufen oder eine App öffnen, ist die grafische Be­nut­zer­ober­flä­che, die Sie sehen können, das Frontend. Alle Inhalte, die offen vor Ihnen liegen, gehören dazu: Bilder und Texte, aber auch das gesamte Design der Seite bzw. Software, von der Farbe über die Schrift bis zur Plat­zie­rung der einzelnen Elemente. Das Frontend, also der Überbau, er­mög­licht eine In­ter­ak­ti­on zwischen Nutzer bzw. Nutzerin und Programm.

Bild: Screenshot der Login-Seite von IONOS
Das Frontend ist der Bereich, auf den Nutzer zugreifen können.

Im Artikel „Was ist Frontend?“ gehen wir aus­führ­li­cher auf die Ei­gen­schaf­ten und Funk­tio­nen des Frontends ein.

Was ist ein Backend?

Unter dem Backend versteht man all die Dinge, die quasi hinter den Kulissen ablaufen: Gemeint sind damit all die Prozesse, auf die User keinen direkten Zugriff haben, die aber die Funktion der Website oder Anwendung erst er­mög­li­chen. Im Backend wird die ad­mi­nis­tra­ti­ve Arbeit gemacht, die für den rei­bungs­lo­sen Ablauf ver­ant­wort­lich ist. Bei­spiels­wei­se werden Funk­tio­nen fest­ge­legt, Da­ten­ban­ken ein­ge­pflegt und Än­de­run­gen am Layout vor­ge­nom­men. Das Backend ist also ge­wis­ser­ma­ßen das Herz einer Seite oder eines Programms und sorgt im Hin­ter­grund dafür, dass Nut­ze­rin­nen und Nutzer das best­mög­li­che Erlebnis bekommen.

Bild: Screenshot des WordPress-Dashboards
Im Backend des CMS WordPress können Sie alle wichtigen ad­mi­nis­tra­ti­ven Aufgaben erledigen.

Aus­führ­li­che­re In­for­ma­tio­nen zum Backend finden Sie im separaten Artikel „Was ist Backend?“.

Frontend vs. Backend: Wo liegen die Un­ter­schie­de?

Der große Un­ter­schied zwischen Frontend und Backend liegt also in dem Nut­zungs­zweck der beiden Kom­po­nen­ten. Das cli­ent­sei­ti­ge Frontend ist der offen sichtbare Bereich einer Software und der direkte Be­rüh­rungs­punkt für alle Endnutzer und End­nut­ze­rin­nen. Das ser­ver­sei­ti­ge Backend ist als Unterbau nicht direkt sichtbar und bleibt dies in der Regel für die Anwender und An­wen­de­rin­nen des Programms auch.

Aus diesem Umstand re­sul­tie­ren un­ter­schied­li­che An­for­de­run­gen bei der Ent­wick­lung von Frontend und Backend: Frontend-Developer müssen eine an­spre­chen­de, nut­zer­freund­li­ches Be­nut­zer­ober­flä­che in den Vor­der­grund ihrer Arbeit stellen. Auch Faktoren wie Per­for­mance und ein re­spon­si­ves Design, das sich au­to­ma­tisch an ver­schie­de­ne Dis­play­grö­ßen anpasst, sind zu beachten. Bei der Ent­wick­lung des Backends steht die Funk­tio­na­li­tät an erster Stelle. Die passende tech­ni­sche Basis für das Frontend muss geliefert werden – inklusive der re­le­van­ten APIs (Schnitt­stel­len).

Bei der Pro­gram­mie­rung von Frontend und Backend setzt man aus den genannten Gründen auf ver­schie­de­ne Pro­gram­mier­spra­chen, Frame­works und Bi­blio­the­ken – weshalb es nicht un­ge­wöhn­lich ist, dass man sich als Ent­wick­le­rin bzw. Ent­wick­ler konkret auf ein Feld spe­zia­li­siert. In der nach­fol­gen­den Tabelle haben wir die be­lieb­tes­ten Tools für Frontend und Backend ge­gen­über­ge­stellt.

Frontend Backend
Pro­gram­mier­spra­chen HTML, CSS, Ja­va­Script PHP, Java, Python, C++, Ruby
Frame­works Angular.JS, Bootstrap, jQuery Django, Spring Boot, Laravel, Ruby on Rails
Bi­blio­the­ken React.js, Backbone.js Express.js
Tipp

Sie planen ein Web­pro­jekt mit WordPress und wollen sich gänzlich auf die Ge­stal­tung Ihrer Website kon­zen­trie­ren? Mit Managed Hosting für WordPress von IONOS richten Sie Ihr Projekt bequem ein und halten den Ad­mi­nis­tra­ti­ons­auf­wand minimal.

Das Zu­sam­men­spiel von Frontend und Backend

Backend und Frontend un­ter­schei­den sich grund­le­gend von­ein­an­der. Gleich­zei­tig sorgt ihr Zu­sam­men­wir­ken dafür, dass eine Seite ideal läuft. Die Funk­tio­na­li­tät einer Software wird durch das Backend si­cher­ge­stellt und nur ein über­sicht­li­ches und an­spre­chen­des Frontend er­mög­licht ein gutes Nut­zer­er­leb­nis. Um einen rei­bungs­lo­sen Ablauf zu ge­währ­leis­ten, sollten beide Kom­po­nen­ten also möglichst eng auf­ein­an­der ab­ge­stimmt sein. So entsteht eine Software, die gleich­zei­tig be­nut­zer­freund­lich, optisch an­spre­chend, funk­ti­ons­stark und sicher ist.

Tipp

Klas­si­scher­wei­se sind in einem CMS Backend und Frontend so mit­ein­an­der verknüpft, dass sich das Backend immer nur auf ein Frontend bezieht. Bei einem Headless CMS ist das anders – über eine Schnitt­stel­le lassen sich in diesem Fall un­be­grenzt viele Frontends durch ein einziges Backend versorgen.

Zum Hauptmenü