SlideShare ist ein Scribd-Unternehmen logo
1 von 79
Downloaden Sie, um offline zu lesen
Lean Startup mit
JavaScript
WHO AM I?
• Sebastian Springer	

• aus München	

• arbeite bei Mayflower	

• https://github.com/sspringer82	

• @basti_springer	

• Consultant,Trainer,Autor
Was machen wir
denn so?
Was erzähle ich euch heute?
Welche Erfahrungen haben wir bei
der Entwicklung innovativer Projekte
gemacht? Welche Fehler sind passiert
und was haben wir daraus gelernt?
Lean Startup?
Business-Hypothesen-getriebene
Entwicklung mit iterativen
Releases und validiertem Lernen.
Wie bringe ich meine Idee schnell auf den
Markt?
Wie finde ich heraus, ob meine Idee gut ist?
Wie erreiche ich eine schnelle
Reaktionsfähigkeit?
Die Problemstellung
Alexandra H. / pixelio.de
Das Internet -
unendliche Weiten
Ein Kunde hat eine
erfolgversprechende
Idee
Der Kunde hat Geld
I-vista / pixelio.de
Nachdem das geklärt
ist, kann es losgehen.
K. Bangwa / pixelio.de
#1
Wie bringe ich
meine Idee schnell
auf den Markt?
Das Web ist extrem
schnelllebig
Unser Kunde muss der erste oder
zumindest der erfolgreichste mit
seiner Idee auf dem Markt sein.
Bevor es losgeht: Die Idee
muss verstanden sein.
Und was hat das Ganze
jetzt mit JavaScript zu
tun?
Der Benutzer steht im Fokus, also müssen
wir alles tun, um sichtbare Ergebnisse zu
liefern.
Das geht im Web mit JavaScript am
schnellsten. Es ist überall verfügbar und in
der Kombination mit HTML5 und CSS3 ein
sehr mächtiges Werkzeug.
Was wird für die
Umsetzung benötigt?
Gila Hanssen / pixelio.de
Eine Umgebung
Virtualisierung
VirtualBox, Puppet
und Vagrant
$ vagrant up
Paketmanager
Rainer Sturm / pixelio.de
Bower für unser Frontend. NPM
oder Composer für das Backend,
je nach verwendeter Technologie.
$ bower install —save angular !
$ bower install —save requirejs
bower.json!
“dependencies”: {!
“angular”: “~1.2.16”,!
“requirejs”: “~2.1.11”!
}
Yeoman bietet Scaffolding für
Projekte. Es gibt Generatoren für
die verschiedensten Libraries und
Frameworks.
$ yo angular:controller user!
$ yo angular:directive myDirective
Frameworks &
Libraries
D
o
notreinventthe
w
heel
Das Backend
Christa Nöhren / pixelio.de
Anforderungen: Registrierung,
Authentifizierung und
Datenhaltung.
Standardisierte
Kommunikation
Aka / pixelio.de
Vorhandene Tools nutzen,
z.B. Werkzeuge zur
Datenbank-Administration
Welche Technologien
setzen wir im Backend
ein?
Frontend
Corinna Dumat / pixelio.de
Angular bietet Struktur für eine Applikation
und liefert zahlreiche Lösungsansätze out
of the box. Außerdem dient es als Basis für
zusätzliche Erweiterungen mit eigenen
oder fremden Modulen.
Modulsystem zum Laden von
Dateien und Auflösen von
Abhängigkeiten. Verfügt über
einen eigenen Optimizer.
D3 dient zur Manipulation von
Dokumenten basierend auf Daten.
D3 setzt sehr stark auf existierende
Standards wie HTML, CSS und SVG.
Testing?
Rike / pixelio.de
Wir testen nur Kernkomponenten
und Features, von denen wir
wissen, dass sie länger in unserer
Applikation bleiben.
Keine!
Experimente!
Tim Reckmann / pixelio.de
Keep it simple
N
o
overengineering
#2
Wie finde ich
heraus, ob meine
Idee gut ist?
Wir brauchen
Hypothesen!
Hansjörg Keller / pixelio.de
10.000
Neuregistrierungen im
ersten Monat
Jeder Nutzer generiert
pro Woche 10 Beiträge
Ein durchschnittlicher
Registrierungsprozess
dauert 2 Minuten.
SMART
Spezifisch
Messbar
Akzeptiert
Realistisch
Terminiert
Independent
Negotiable
Valuable
Estimatable
Scalable
Testable
INVEST
Messen
roja48 / pixelio.de
So ziemliche jede Aktion auf der Seite
muss aufgezeichnet werden. Vom
einfachen Pageload über Aktionen wie
Mausklicks oder Workflows bis hin zu
Fehlermeldungen.
Auch die Dauer bestimmter
Aktionen ist relevant, z.B.
Ladezeiten, Durchlaufzeiten, etc.
Fire and Forget
Siegfried Fries / pixelio.de
Die Messwerte
kontinuierlich beobachten
hamma / pixelio.de
Die Messwerte
regelmäßig hinterfragen.
Tool der Wahl: Google
Analytics
Wir brauchen
Feedback!
Forum anlegen, FAQ sammeln,
kontextabhängige Feedbackformulare,
die einfach erreichbar sind,
Realtimechat mit Applikationssupport.
#3
Wie erreiche ich
eine schnelle
Reaktionsfähigkeit?
Continuous
Deployment
Die Hürde, ein neues Release zu
erstellen, muss sehr klein sein. Im
Idealfall ist es lediglich ein
Mausklick.
Features ein- und
ausschalten
pogobuschel / pixelio.de
Features werden im Frontend und
Backend an-/abgeschaltet. Per
Konfiguration werden Features,
Routen etc. deaktiviert.
angular.module(‘app.routes’).config(function(
$stateProvider, $urlRouterProvider, $config) {!
$urlRouterProvider.otherwise('/list');!
!
if ($config.isEnabled(‘forum’)) {!
$stateProvider.state('forum', {!
url: '/forum',!
template: tplForum,!
controller: 'ForumCtrl'!
});!
}
A/B-Testing
Erich Westendarp / pixelio.de
Die Zielgruppe wird unterteilt und jede
Gruppe erhält eine andere Version der
Applikation oder bestimmter Features.
Das Verhalten der Gruppen wird
gemessen. Erlaubt Rückschlüsse auf
die Akzeptanz bestimmter Varianten.
Modularisierung
Initiative Echte Soziale Marktwirtschaft IESM / pixelio.de
Ein Modul pro Feature. Jedes Feature
hat sein eigenes Verzeichnis mit allen
Komponenten.
RequireJS und AngularJS in
Kombination zur Modularisierung.
define(['angular', 'ngRouter',
‘text!../../tpl.html'],!
function(angular, router, tpl) {!
angular.module(‘app.index',
[‘ui.router']);!
…!
}!
);!
Kontinuierliche
Modernisierung
Michael Loeper / pixelio.de
Fazit
Tim Reckmann / pixelio.de
Fehler zulassen
Wir wollen nicht alle Fehler im Vorfeld
vermeiden, sondern eine Infrastruktur,
die das Erkennen von Fehlern und
deren Behebung sehr einfach macht.
Rahmen zum Lernen
aufspannen
Benutzer in den
Entwicklungsprozess
einbeziehen
Fragen?
Rainer Sturm / pixelio.de
KONTAKT
Sebastian Springer
sebastian.springer@mayflower.de
!
Mayflower GmbH
Mannhardtstr. 6
80538 München
Deutschland
!
@basti_springer
!
https://github.com/sspringer82

Weitere ähnliche Inhalte

Ähnlich wie Lean Startup mit JavaScript

Lean startup | Webmonday Graz
Lean startup | Webmonday GrazLean startup | Webmonday Graz
Lean startup | Webmonday GrazWohnportal Graz
 
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...SYNGENIO AG
 
Xing LearningZ: Digitale Geschäftsmodelle entwickeln
Xing LearningZ: Digitale Geschäftsmodelle entwickelnXing LearningZ: Digitale Geschäftsmodelle entwickeln
Xing LearningZ: Digitale Geschäftsmodelle entwickelnDigicomp Academy AG
 
UX & AGILE vom SCRUM Stammtisch Graz
UX & AGILE vom SCRUM Stammtisch GrazUX & AGILE vom SCRUM Stammtisch Graz
UX & AGILE vom SCRUM Stammtisch GrazHAnnes Robier
 
Agiles Anforderungsmanagement bei HEC
Agiles Anforderungsmanagement bei HECAgiles Anforderungsmanagement bei HEC
Agiles Anforderungsmanagement bei HECChristian Seedig
 
Move slow and fix things
Move slow and fix thingsMove slow and fix things
Move slow and fix thingsScreamin Wrba
 
Wjax Vortrag 2018: Von DevOps bis DesignThinking
Wjax Vortrag 2018: Von DevOps bis DesignThinkingWjax Vortrag 2018: Von DevOps bis DesignThinking
Wjax Vortrag 2018: Von DevOps bis DesignThinkingAnnegret Junker
 
PRfact Kurze Einführung in unsere digitale Arbeit
PRfact Kurze Einführung in unsere digitale ArbeitPRfact Kurze Einführung in unsere digitale Arbeit
PRfact Kurze Einführung in unsere digitale ArbeitAdrian Huwyler
 
2012-07 Lean Startup at #bcka by Calpano
2012-07 Lean Startup at #bcka by Calpano2012-07 Lean Startup at #bcka by Calpano
2012-07 Lean Startup at #bcka by CalpanoMax Völkel
 
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...Produktbezogen.de
 
The Great MVP Swindle
The Great MVP SwindleThe Great MVP Swindle
The Great MVP SwindleScreamin Wrba
 
Orange Hills GmbH: Transformation von Geschäftsmodellen
Orange Hills GmbH: Transformation von GeschäftsmodellenOrange Hills GmbH: Transformation von Geschäftsmodellen
Orange Hills GmbH: Transformation von GeschäftsmodellenOrange Hills GmbH
 
code.talks 2019 - Schneller vom Problem zum Prototypen mit Design Sprints
code.talks 2019 - Schneller vom Problem  zum Prototypen  mit Design Sprintscode.talks 2019 - Schneller vom Problem  zum Prototypen  mit Design Sprints
code.talks 2019 - Schneller vom Problem zum Prototypen mit Design SprintsAndreas Behrens
 
Innovationsmanagement auf SharePoint 2010
Innovationsmanagement auf SharePoint 2010Innovationsmanagement auf SharePoint 2010
Innovationsmanagement auf SharePoint 2010IPI GmbH
 
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...Jean Maurice Port
 

Ähnlich wie Lean Startup mit JavaScript (20)

Lean startup | Webmonday Graz
Lean startup | Webmonday GrazLean startup | Webmonday Graz
Lean startup | Webmonday Graz
 
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...
Auf zu neuen Ufern! Mit „Lean Startup“ den Kundengeschmack treffen. Elmar Bor...
 
Xing LearningZ: Digitale Geschäftsmodelle entwickeln
Xing LearningZ: Digitale Geschäftsmodelle entwickelnXing LearningZ: Digitale Geschäftsmodelle entwickeln
Xing LearningZ: Digitale Geschäftsmodelle entwickeln
 
UX & AGILE vom SCRUM Stammtisch Graz
UX & AGILE vom SCRUM Stammtisch GrazUX & AGILE vom SCRUM Stammtisch Graz
UX & AGILE vom SCRUM Stammtisch Graz
 
eStrategy Magazin 02 / 2013
eStrategy Magazin 02 / 2013eStrategy Magazin 02 / 2013
eStrategy Magazin 02 / 2013
 
Agiles Anforderungsmanagement bei HEC
Agiles Anforderungsmanagement bei HECAgiles Anforderungsmanagement bei HEC
Agiles Anforderungsmanagement bei HEC
 
Move slow and fix things
Move slow and fix thingsMove slow and fix things
Move slow and fix things
 
Agile Business Software mit der Enterprise Cloud
Agile Business Software mit der Enterprise CloudAgile Business Software mit der Enterprise Cloud
Agile Business Software mit der Enterprise Cloud
 
Wjax Vortrag 2018: Von DevOps bis DesignThinking
Wjax Vortrag 2018: Von DevOps bis DesignThinkingWjax Vortrag 2018: Von DevOps bis DesignThinking
Wjax Vortrag 2018: Von DevOps bis DesignThinking
 
PRfact Kurze Einführung in unsere digitale Arbeit
PRfact Kurze Einführung in unsere digitale ArbeitPRfact Kurze Einführung in unsere digitale Arbeit
PRfact Kurze Einführung in unsere digitale Arbeit
 
Bessere Produktentscheidungen treffen mit GIST
Bessere Produktentscheidungen treffen mit GISTBessere Produktentscheidungen treffen mit GIST
Bessere Produktentscheidungen treffen mit GIST
 
2012-07 Lean Startup at #bcka by Calpano
2012-07 Lean Startup at #bcka by Calpano2012-07 Lean Startup at #bcka by Calpano
2012-07 Lean Startup at #bcka by Calpano
 
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...
Digitale Produktentwicklung - Theorie trifft auf Realität, anhand eines aktue...
 
KI for YOU.pdf
KI for YOU.pdfKI for YOU.pdf
KI for YOU.pdf
 
The Great MVP Swindle
The Great MVP SwindleThe Great MVP Swindle
The Great MVP Swindle
 
Orange Hills GmbH: Transformation von Geschäftsmodellen
Orange Hills GmbH: Transformation von GeschäftsmodellenOrange Hills GmbH: Transformation von Geschäftsmodellen
Orange Hills GmbH: Transformation von Geschäftsmodellen
 
code.talks 2019 - Schneller vom Problem zum Prototypen mit Design Sprints
code.talks 2019 - Schneller vom Problem  zum Prototypen  mit Design Sprintscode.talks 2019 - Schneller vom Problem  zum Prototypen  mit Design Sprints
code.talks 2019 - Schneller vom Problem zum Prototypen mit Design Sprints
 
Innovationsmanagement auf SharePoint 2010
Innovationsmanagement auf SharePoint 2010Innovationsmanagement auf SharePoint 2010
Innovationsmanagement auf SharePoint 2010
 
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...
Von der bloßen Idee bis zum ersten Kunden - Digital Marketing im Kontext der ...
 
Angebot Homepagescanner
Angebot HomepagescannerAngebot Homepagescanner
Angebot Homepagescanner
 

Mehr von Sebastian Springer

Creating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.jsCreating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.jsSebastian Springer
 
Divide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.jsDivide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.jsSebastian Springer
 
From Zero to Hero – Web Performance
From Zero to Hero – Web PerformanceFrom Zero to Hero – Web Performance
From Zero to Hero – Web PerformanceSebastian Springer
 
Von 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im WebVon 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im WebSebastian Springer
 
ECMAScript 6 im Produktivbetrieb
ECMAScript 6 im ProduktivbetriebECMAScript 6 im Produktivbetrieb
ECMAScript 6 im ProduktivbetriebSebastian Springer
 
Große Applikationen mit AngularJS
Große Applikationen mit AngularJSGroße Applikationen mit AngularJS
Große Applikationen mit AngularJSSebastian Springer
 
Best Practices für TDD in JavaScript
Best Practices für TDD in JavaScriptBest Practices für TDD in JavaScript
Best Practices für TDD in JavaScriptSebastian Springer
 
Warum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser machtWarum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser machtSebastian Springer
 

Mehr von Sebastian Springer (20)

Schnelleinstieg in Angular
Schnelleinstieg in AngularSchnelleinstieg in Angular
Schnelleinstieg in Angular
 
Creating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.jsCreating Enterprise Web Applications with Node.js
Creating Enterprise Web Applications with Node.js
 
Divide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.jsDivide and Conquer – Microservices with Node.js
Divide and Conquer – Microservices with Node.js
 
From Zero to Hero – Web Performance
From Zero to Hero – Web PerformanceFrom Zero to Hero – Web Performance
From Zero to Hero – Web Performance
 
Von 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im WebVon 0 auf 100 - Performance im Web
Von 0 auf 100 - Performance im Web
 
A/B Testing mit Node.js
A/B Testing mit Node.jsA/B Testing mit Node.js
A/B Testing mit Node.js
 
Angular2
Angular2Angular2
Angular2
 
Einführung in React
Einführung in ReactEinführung in React
Einführung in React
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
ECMAScript 6 im Produktivbetrieb
ECMAScript 6 im ProduktivbetriebECMAScript 6 im Produktivbetrieb
ECMAScript 6 im Produktivbetrieb
 
Streams in Node.js
Streams in Node.jsStreams in Node.js
Streams in Node.js
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
Große Applikationen mit AngularJS
Große Applikationen mit AngularJSGroße Applikationen mit AngularJS
Große Applikationen mit AngularJS
 
Testing tools
Testing toolsTesting tools
Testing tools
 
Node.js Security
Node.js SecurityNode.js Security
Node.js Security
 
Typescript
TypescriptTypescript
Typescript
 
Reactive Programming
Reactive ProgrammingReactive Programming
Reactive Programming
 
Best Practices für TDD in JavaScript
Best Practices für TDD in JavaScriptBest Practices für TDD in JavaScript
Best Practices für TDD in JavaScript
 
Warum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser machtWarum ECMAScript 6 die Welt ein Stückchen besser macht
Warum ECMAScript 6 die Welt ein Stückchen besser macht
 
Webapplikationen mit Node.js
Webapplikationen mit Node.jsWebapplikationen mit Node.js
Webapplikationen mit Node.js
 

Lean Startup mit JavaScript