Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Test-Driven Development
with TypeScript+Jasmine
+AngularJS
1
#smartorgdev
Somik Raha Kai Wu
Github repo: https://github.co...
2
A Brief History of Software
Engineering
ENIAC, 1946-55
3
Programs were input with Punched Cards
Human labor was cheap. Computer time was expensive.
More value in getting program...
4
IBM 360 Mainframes
Time-sharing computers
Late 1960s
Waterfall is a result of human
confusion
5
“Managing the Development of Large Software Systems”, Dr.
Winston W. Royce (Lin...
6
For some mysterious reason, people latched
on to Fig 2, and thought it looked like a
waterfall.
The name caught up and u...
7
But Dr. Royce had a Fig. 3
8
And a Fig. 4! As far back as 1970, Royce
was describing the
beginnings of an agile
mindset, but the Waterfall
religion h...
Meanwhile, a community of philosophers in
software engineering started forming in the
90’s
9
Ward Cunningham
Founding of t...
10
1995, caused a revolution in

Object-Oriented thinking
Book knows as the
“Gang of Four”
The false religion of Waterfall was then seriously
challenged in 2000
11
12
Source: agileatlas.org
Barry Boehm’s Cost of Change Curve
We were initially justified in doing high-quality design when
...
13
Aspirational Cost of Change curve
But now, programmer time is much more expensive, and we
would love to flatten the curv...
The XP Practices
14
The “Planning Game” had
strong influences from Scrum
What’s the difference?
Test-Driven Development
versus
Unit Testing
15
XP’s success led to a broader umbrella under a
more neutral-sounding “Agile Software
Development”
16
Core practices like T...
17
Erich Gamma
One of the Gang of Four, authored
JUnit with Kent Beck, while on a long flight together,
1997
Great Article ...
Lots of JUnit ports, generally
referred to as xUnit
18
nUnit - C#
cppUnit - C++
pyunit- Python
Functional Programming/
Behavior-Driven Development
19
Jasmine: TDD with JS from Pivotal Labs
Lettuce: DSL for testing and...
Continuous Build Servers
20
21
Let’s experience some TDD now
22
23
Anagram Unjumbler
leppa
zizap
couisldei
Unjumble this
We will use TypeScript
24
Anders Hejlsberg
Creator of C# and
TypeScript
Superset of Javascript
Supports class-based OO con...
We will use Testem
25
Continuously runs our unit tests
Step 1. git clone https://github.com/behappyrightnow/anagram.git
Step 2. cd anagram
Step 3. git checkout step1
Step 4. Ins...
Let’s start by writing tests
27
Come up with 5 English words, jumble them up
Find all other words you can create with thos...
Challenge for you
28
Make the following game using existing codebase to help
game show hosts construct a puzzle.
Given an ...
PASS 1: Write the code without any tests
PASS 2: Keep your code aside, write tests first and then write code
Reflection: Wri...
Upcoming SlideShare
Loading in …5
×

Test-Driven Development with TypeScript+Jasmine+AngularJS

5,947 views

Published on

A session held for students at San Jose State University. A live pair-programming session and these slides were used before that session. For the code in the live exercise, follow instructions in the slides.

Published in: Education
  • Be the first to comment

  • Be the first to like this

Test-Driven Development with TypeScript+Jasmine+AngularJS

  1. 1. Test-Driven Development with TypeScript+Jasmine +AngularJS 1 #smartorgdev Somik Raha Kai Wu Github repo: https://github.com/behappyrightnow/anagram Thilak Selvan
  2. 2. 2 A Brief History of Software Engineering ENIAC, 1946-55
  3. 3. 3 Programs were input with Punched Cards Human labor was cheap. Computer time was expensive. More value in getting program right the first time.
  4. 4. 4 IBM 360 Mainframes Time-sharing computers Late 1960s
  5. 5. Waterfall is a result of human confusion 5 “Managing the Development of Large Software Systems”, Dr. Winston W. Royce (Link) - 1970
  6. 6. 6 For some mysterious reason, people latched on to Fig 2, and thought it looked like a waterfall. The name caught up and ushered in “phased” mindset of development.
  7. 7. 7 But Dr. Royce had a Fig. 3
  8. 8. 8 And a Fig. 4! As far back as 1970, Royce was describing the beginnings of an agile mindset, but the Waterfall religion had already started, based on a misunderstanding!
  9. 9. Meanwhile, a community of philosophers in software engineering started forming in the 90’s 9 Ward Cunningham Founding of the WikiWikiWeb in 1994. Ward’s wiki became the home for conversations on Design Patterns.
  10. 10. 10 1995, caused a revolution in
 Object-Oriented thinking Book knows as the “Gang of Four”
  11. 11. The false religion of Waterfall was then seriously challenged in 2000 11
  12. 12. 12 Source: agileatlas.org Barry Boehm’s Cost of Change Curve We were initially justified in doing high-quality design when computer time was more expensive than programmer time
  13. 13. 13 Aspirational Cost of Change curve But now, programmer time is much more expensive, and we would love to flatten the curve time costofchange This is what Extreme Programming was inviting us to consider
  14. 14. The XP Practices 14 The “Planning Game” had strong influences from Scrum
  15. 15. What’s the difference? Test-Driven Development versus Unit Testing 15
  16. 16. XP’s success led to a broader umbrella under a more neutral-sounding “Agile Software Development” 16 Core practices like TDD and Refactoring are no longer controversial - they are a part of a programmer’s foundation. Martin Fowler’s book is now a classic. Most conventional IDEs support automated refactoring.
  17. 17. 17 Erich Gamma One of the Gang of Four, authored JUnit with Kent Beck, while on a long flight together, 1997 Great Article by Alberto Savoia: Beautiful Tests History of xUnit by Martin Fowler “JUnit took off like a rocket - and was essential to supporting the growing movement of Extreme Programming and Test Driven Development. I've seen a huge change of attitude towards testing in the last decade, and I think JUnit played a big role in that. By being small and simple it encouraged people to learn and use it. It also proved amenable to others extending it integrating it into tools.” — Martin Fowler
  18. 18. Lots of JUnit ports, generally referred to as xUnit 18 nUnit - C# cppUnit - C++ pyunit- Python
  19. 19. Functional Programming/ Behavior-Driven Development 19 Jasmine: TDD with JS from Pivotal Labs Lettuce: DSL for testing and beyond by Gabriel Falcao
  20. 20. Continuous Build Servers 20
  21. 21. 21
  22. 22. Let’s experience some TDD now 22
  23. 23. 23 Anagram Unjumbler leppa zizap couisldei Unjumble this
  24. 24. We will use TypeScript 24 Anders Hejlsberg Creator of C# and TypeScript Superset of Javascript Supports class-based OO concepts Takes the tedium out of JS Keeps you in JS paradigm (as opposed to coffee script)
  25. 25. We will use Testem 25 Continuously runs our unit tests
  26. 26. Step 1. git clone https://github.com/behappyrightnow/anagram.git Step 2. cd anagram Step 3. git checkout step1 Step 4. Install NodeJS from http://nodejs.org/ Step 5. npm install testem Let’s start with checking out a basic stub from Github 26
  27. 27. Let’s start by writing tests 27 Come up with 5 English words, jumble them up Find all other words you can create with those letters List your tests. e.g. INPUT OUTPUT leppa apple rodo door, odor
  28. 28. Challenge for you 28 Make the following game using existing codebase to help game show hosts construct a puzzle. Given an input word, create clues by adding one extra letter. INPUT OUTPUT rose horse without “h” sores without “s” Game show host can now use this program to construct their show saying: Can you find flowers using this clue… Your web-interface should provide this:
  29. 29. PASS 1: Write the code without any tests PASS 2: Keep your code aside, write tests first and then write code Reflection: Write an essay on what you learned by comparing Pass 1 and Pass 2, and in general what you learned from this session Crack this challenge in the following way: 29

×