Lebenslauf für Webentwickler/innen: Beispiele und Anleitung

Dieses Muster zeigt eine Webentwicklerin mit rund sechs Jahren Erfahrung, die von der Kommunikationsabteilung einer Universität zu einer Direktvertriebsmarke und dann zu einer Digitalagentur gewechselt ist, wo sie Kundenwebsites baut. Name, Arbeitgeber und Links sind erfunden. Übernehmen Sie den Aufbau und setzen Sie Ihren eigenen Stack, Ihre Projekte und Ihre Zahlen ein.

Lebensläufe für die Webentwicklung werden zweimal gelesen: zuerst vom Recruiting, das Schlüsselwörter abgleicht, dann von einer Teamleitung oder einem Tech Lead, der nach Belegen sucht. Beide Seiten nennen dieselben vier Punkte, die über ein Gespräch entscheiden.

• Passender Stack, in den Worten der Anzeige. Steht dort „React, TypeScript, Next.js, PostgreSQL“, müssen genau diese Begriffe in Ihrem Profil oder bei den Kenntnissen stehen. Das Recruiting sucht danach; die technische Leitung prüft, ob Sie sie im Beruf oder nur in Tutorials eingesetzt haben.
• Ausgelieferte Arbeit mit Link. Eine Live-Website, ein GitHub-Repository mit echter Commit-Historie, ein Eintrag im App Store. Etwas, das sich in 10 Sekunden anklicken lässt. Ein Lebenslauf ohne Link wirft die Frage auf, warum.
• Zahlen, die Größenordnung und Wirkung zeigen. Sitzungen, Nutzer, Seiten, Produkte, Anfragen pro Sekunde, Ladezeit, Lighthouse-Wert, Conversion-Rate, Verfügbarkeit, Zahl der ausgelieferten Websites. Kleine Zahlen sind in Ordnung, fehlende nicht.
• Grundlagen und Verantwortung. Haben Sie Barrierefreiheit, Performance, Tests und Deployment selbst übernommen oder weitergereicht? In kleinen Unternehmen und Agenturen wird erwartet, dass Sie die ganze Seite verantworten.

“Ich öffne den GitHub- oder Portfolio-Link, bevor ich den Lebenslauf zu Ende gelesen habe. Wenn der Code echt ist und die Seite auf meinem Handy schnell lädt, muss der Lebenslauf nur noch den Stack bestätigen und ein, zwei Zahlen zeigen. Ohne Link muss der Lebenslauf viel mehr leisten.”

Die Webentwicklung ist eines der wenigen Berufsfelder, in denen der Lebenslauf nach außen verlinken darf. Nutzen Sie das. So verteilen Sie die Angaben.

• Kopfzeile: GitHub und Portfolio oder eigene Website als gut lesbare URL (github.com/ihrname, ihrname.de). Instagram und X lassen Sie weg. LinkedIn oder Xing ist optional.
• Projektabschnitt (Pflicht für den Einstieg, optional mit Berufserfahrung): 2 bis 4 Projekte, jeweils mit einer Zeile Beschreibung, dem Stack, einem Link zur Live-Version und einem zum Code sowie einer Zeile dazu, was es leistet, oder einer Kennzahl (Nutzer, Ladezeit, Tests). Echte Projekte schlagen Kursklone; eine To-do-App aus dem Tutorial sagt nichts.
• In den Stichpunkten der Stellen: Nennen Sie die Live-Website mit Namen oder Art („ein Shopify-Plus-Shop mit 40 Templates“), sofern der Kunde es erlaubt. Agenturen untersagen manchmal die Nennung von Kunden; beschreiben Sie dann Branche und Größenordnung.
• Machen Sie GitHub klickwürdig: Pinnen Sie die 3 bis 4 Repositories, die gesehen werden sollen, schreiben Sie ein README mit Screenshot, Live-Link und Installationsschritten und nehmen Sie aufgegebene Forks aus der Auswahl. Das Recruiting sucht nicht weiter.
• Portfolio-Website: schnell, responsiv und barrierefrei, denn sie ist eine Arbeitsprobe. Ein langsames Portfolio bei jemandem, der Core Web Vitals als Kenntnis angibt, beendet das Gespräch. Nehmen Sie darüber auch Aufträge an, gehört in Deutschland ein Impressum nach § 5 DDG dazu, und sobald Analytics oder eingebettete Inhalte laufen, eine Datenschutzerklärung und gegebenenfalls ein Consent-Banner (DSGVO, TDDDG).
• Open Source und Community: ein gemergter Pull Request in einem echten Projekt, ein veröffentlichtes npm-Paket mit Downloads, ein Vortrag bei einem lokalen Meetup. Je eine Zeile, mit Link.

Drei bis vier Zeilen unter Ihrem Namen: Jahre und Schwerpunkt, Ihr wichtigster Stack in den Worten der Anzeige, ein oder zwei ausgelieferte Ergebnisse mit Zahlen und wie Sie arbeiten (volle Verantwortung, Agenturtempo, remote). Für den Einstieg schreiben Sie ein Berufsziel, das auf Projekten statt auf Jahren aufbaut.

Die schwache Version dieses Lebenslaufs übernimmt die Stellenbeschreibung: „responsive Websites entwickelt, mit Designern zusammengearbeitet, Code gepflegt“. Das hat jede Entwicklerin und jeder Entwickler getan. Formulieren Sie jede Aufgabe mit Stack, Größenordnung und Ergebnis neu. Sieben Beispiele:

Wenn Ihnen eine betriebswirtschaftliche Zahl fehlt, nehmen Sie eine technische: Bundle-Größe, Build-Zeit, Testabdeckung, Seitenzahl, verarbeitete Anfragen, Zahl der Komponenten oder Templates. Diese Werte findet jede Entwicklerin und jeder Entwickler in den eigenen Werkzeugen.

Gliedern Sie Ihre Kenntnisse nach Ebenen und nennen Sie insgesamt 12 bis 18 Einträge. Verwenden Sie die genauen Namen aus der Anzeige. Verzichten Sie auf Skill-Balken und Prozentwerte; sie sagen einer technischen Leitung nichts und werden im Bewerbermanagementsystem schlecht gelesen. Microsoft Word gehört nicht auf die Liste.

Frontend:

• HTML5, CSS3 (Grid, Flexbox, Custom Properties), Sass, Tailwind CSS
• JavaScript (ES2023), TypeScript
• React, Next.js, Vue oder Nuxt, Svelte, Angular (nur die, mit denen Sie ausgeliefert haben)
• State und Daten: Redux, Zustand, TanStack Query, GraphQL-Clients
• Barrierefreiheit (WCAG 2.2, BFSG, BITV 2.0 für öffentliche Stellen), responsives Design, browserübergreifende Tests

Backend, Daten und Plattformen:

• Node.js, Express, Fastify; oder PHP und Laravel; oder Python und Django, je nach Hintergrund
• Entwurf von REST- und GraphQL-APIs, Authentifizierung (OAuth, JWT), Webhooks
• PostgreSQL, MySQL, MongoDB, Redis; ORMs wie Prisma
• CMS und E-Commerce: WordPress, Shopify, Shopware, WooCommerce, Sanity, Contentful, Strapi
• Hosting und Deployment: Vercel, Netlify, AWS, Cloudflare, Grundkenntnisse in Docker

Werkzeuge und Arbeitsweise:

• Git und GitHub oder GitLab, Reviews von Pull Requests, GitHub Actions oder andere CI
• Tests: Jest, Vitest, React Testing Library, Playwright, Cypress
• Performance: Core Web Vitals, Lighthouse, Bundle-Analyse
• Technisches SEO, Analytics (GA4), Tag-Management und Consent-Management nach DSGVO und TDDDG
• Figma-Übergabe, Designsysteme, Storybook
• Agile oder Scrum, Ticketsysteme wie Jira oder Linear

In deutschen Stellenanzeigen heißt es „Junior“, „Berufseinstieg“ oder „für Absolventinnen und Absolventen“. Mehrjährige Berufserfahrung erwartet dort niemand. Erwartet wird ein Nachweis, dass Sie bauen und ausliefern können. Bauen Sie die Seite so auf:

1. 1Schreiben Sie „Junior-Webentwickler/in“ oder „Frontend-Entwickler/in“ unter Ihren Namen und setzen Sie GitHub- und Portfolio-Link in die Kopfzeile.
2. 2Schreiben Sie ein Berufsziel aus drei Zeilen mit Fakten: Ihr Stack, wie Sie ihn gelernt haben (Studium, Ausbildung zur Fachinformatikerin oder zum Fachinformatiker für Anwendungsentwicklung, Bootcamp oder Selbststudium mit Zeitraum), ein Projekt mit Link und Zahl.
3. 3Machen Sie die Projekte zum größten Abschnitt. Wählen Sie 3 echte Projekte, die für jemanden ein Problem lösen, jeweils mit Live-Link, Code-Link, Stack und einer Kennzahl. Ersetzen Sie Tutorial-Klone durch etwas selbst Entworfenes, auch wenn es klein ist.
4. 4Nennen Sie trotzdem Erfahrung: Praktika, Werkstudentenstellen, freiberufliche Websites für lokale Betriebe, einen Hackathon, einen Pull Request in einem Open-Source-Projekt, die Website einer Hochschulgruppe. Beschreiben Sie alles nach demselben Muster aus Stack, Größenordnung und Ergebnis.
5. 5Machen Sie aus einem Job außerhalb der IT in einer Zeile eine Stärke: Kundenkontakt, Termindruck, Teamführung. Quereinsteigerinnen und Quereinsteiger mit mehreren Jahren Führungserfahrung sind für Agenturen interessant.
6. 6Kenntnisse: Nennen Sie nur, was Sie tatsächlich in einem Projekt eingesetzt haben. Eine technische Leitung fragt nach jedem Punkt der Liste.
7. 7Eine Seite als PDF, und prüfen Sie vor dem Versand, dass Ihre Portfolio-Website in Lighthouse über 90 erreicht.

Für die Webentwicklung ist in Deutschland kein bestimmter Abschluss vorgeschrieben, und die meisten Teamleitungen gewichten ausgelieferte Arbeit höher als Zeugnisse. Einige Nachweise sind trotzdem eine Zeile wert, weil sie echt und bekannt sind.

• Abschlüsse: Informatik, Wirtschaftsinformatik oder Medieninformatik (B.Sc. oder M.Sc.), die IHK-Ausbildung zur Fachinformatikerin oder zum Fachinformatiker für Anwendungsentwicklung oder ein Bootcamp-Zertifikat. Nennen Sie Abschluss, Hochschule oder Schule und Jahr; die Abschlussnote nur, wenn sie gut ist und der Abschluss höchstens zwei Jahre zurückliegt.
• Bootcamps und Weiterbildungen: Nennen Sie das Programm und den vermittelten Stack. Bei weniger bekannten Anbietern ergänzen Sie die Dauer in Monaten. Viele Weiterbildungen sind nach AZAV zugelassen und über einen Bildungsgutschein der Agentur für Arbeit förderbar.
• AWS Certified Cloud Practitioner oder AWS Certified Developer – Associate: nützlich, wenn Sie auf AWS deployen oder sich bei Unternehmen bewerben, die das tun.
• Meta Front-End Developer Professional Certificate (Coursera) und freeCodeCamp-Zertifikate (Responsive Web Design, JavaScript Algorithms and Data Structures): echt, kostenlos oder günstig und für den Einstieg ein fairer Beleg für Einsatz.
• Google-Analytics-4-Zertifizierung (Skillshop), Kurse der Shopify Partner Academy, Zertifizierungen für WordPress, Shopware oder Contentful: relevant für Agentur- und E-Commerce-Arbeit.
• Führen Sie Teilnahmebescheinigungen von Videokursen nicht einzeln auf. Wenn ein Kurs Ihnen einen Stack beigebracht hat, den Sie nutzen, nennen Sie den Stack, nicht den Kurs.

• Eine Seite für den Einstieg, mit mehrjähriger Erfahrung höchstens zwei. Zwei Seiten sind in Deutschland üblich und lohnen sich vor allem bei vielen Produkten oder langer Beratungs- und Agenturtätigkeit.
• Reihenfolge mit Berufserfahrung: Kopf mit Links, Profil, Kenntnisse nach Ebenen, Berufserfahrung, Projekte (optional), Ausbildung und Zertifikate. Reihenfolge für den Einstieg: Kopf, Berufsziel, Projekte, Kenntnisse, Erfahrung (Praktika, Werkstudentenstellen, freiberuflich), Ausbildung.
• Schlichtes, einspaltiges Layout. Zweispaltige Vorlagen, Icons und Skill-Balken geraten in Bewerbermanagementsystemen oft durcheinander. Das Design gehört ins Portfolio; im Lebenslauf zählt, dass er sauber gelesen wird.
• Einheitliche Schreibweise im Stack: „JavaScript“ statt „Javascript“, „Node.js“, „PostgreSQL“, „Next.js“. Technische Leitungen achten darauf.
• Links als sichtbarer Text, nicht nur als Hyperlink, weil sie beim Ausdrucken und Einlesen verloren gehen.
• Bewerbungsfoto, Geburtsdatum und Familienstand sind in Deutschland üblich, aber freiwillig. Als Ort genügen die Stadt und gegebenenfalls der Wunsch nach „remote“ oder „hybrid“.
• PDF mit dem Namen „Vorname-Nachname-Lebenslauf-Webentwicklung.pdf“. Ein kurzes Anschreiben wünschen Agenturen und Mittelstand noch häufig, bei vielen Tech-Unternehmen ist es optional; Arbeitszeugnisse legen Sie bei, wenn die Anzeige vollständige Unterlagen verlangt.

Die oben verwendete cvplex-Vorlage „tech-dark“ hat einen einspaltigen, ATS-sicheren Aufbau mit einem gut sichtbaren Block für Kenntnisse und Platz für Links in der Kopfzeile, also genau das, was Recruiting und technische Leitung sehen wollen.

Viele Unternehmen lassen Lebensläufe durch ein Bewerbermanagementsystem laufen, bevor ein Mensch sie liest, und das Recruiting durchsucht seine Datenbank nach Technologienamen. Übernehmen Sie die genauen Begriffe der Anzeige und testen Sie Ihre Datei dann mit einem kostenlosen ATS-Check.

• Berufsbezeichnungen: Webentwickler/in, Frontend-Entwickler/in, Full-Stack-Entwickler/in, JavaScript-Entwickler/in, WordPress-Entwickler/in, Shopify- oder Shopware-Entwickler/in, Junior-Webentwickler/in, Fachinformatiker/in Anwendungsentwicklung
• Sprachen und Frameworks in der Schreibweise der Anzeige: JavaScript, TypeScript, React, Next.js, Vue, Node.js, PHP, HTML, CSS, Tailwind
• Plattformen: WordPress, WooCommerce, Shopify, Shopware, Headless-CMS, Sanity, Contentful, AWS, Vercel
• Begriffe aus der Arbeitsweise: responsives Design, Barrierefreiheit, WCAG, BFSG, Core Web Vitals, REST-API, GraphQL, Unit-Tests, CI/CD, Git, Agile
• Kurz- und Langform, wo sie sich unterscheiden, sowie deutsche und englische Begriffe: „CI/CD“ und „Continuous Integration“, „SEO“ und „Suchmaschinenoptimierung“, „Barrierefreiheit“ und „Accessibility“