A presentation at KonferenSE:21 by Robin Pokorny
T for TypeScript, T for Train, Robust Code You Will Maintain Robin Pokorny
Example A Simple Response To A Request Happy-Path Code What if data is not valid? const action = (req, res) 1 validate(req); { const newData = updateDB(req.body); 2 log(newData); 3 return res.send(newData); }; > 2 = What if log fails? What if the DB is unreachable?
Functional Programming Don’t leave! 3
Monad Semigroup Category Sum type Functor Foldable
Erlang Haskell I ❤ FP Closure
Next 20 minutes 1 2 3 Show TypeScript Code Don’t tell But, why? Yes, really 6
Scott Wlaschin Railway Oriented Programming 7
🍏 🍌 Function Apple -> Banana 8
Input Success Failure 9
Success DB g Lo e te da up at id al V Failure 11
Input Success Also input? Failure 12
type Success<T> = { tag: ‘success’, value: T } type Failure<S> = { tag: ‘failure’, value: S } type Result<T, S> = Success<T> | Failure<S> 13
{ if (Number.isInteger(input)) { return { tag: “success”, value: input as number, }; } else { return { tag: “failure”, value: “NOT_AN_INTEGER”, }; } };
const validate = ( input: unknown ): Result<number, “NOT_AN_INTEGER”> {
YAGNI…? You Ain’t Gonna Need It… ? 15
Typescript Self-Documenting Code 16
type Validate = (input: unknown) Result<number, “NOT_AN_INTEGER”>;
= 17
Typescript Self-Documenting Code Exhaustive Failure Checking 18
19
=
= Result<Date, “DB_UNAVAILABLE”>’ is not assignable to parameter of type ‘(input: number) Date’.
Promise.resolve() YAGNI…? You Ain’t Gonna Need It… ? 22
Promises Limited API 23
Promises API Methods Combinators Promise#then Promise.race Promise#catch Promise.allSettled Promise# nally Promise.all Promise.any fi 24
Promises Limited API Domain ✖ Panic 25
Errors Domain Expected Panic Unhandleable t s u ha x E o N s k c e h c e v i INVALID INPUT DATA OUT OF MEMORY EXTERNAL SYSTEM UNREACHABLE DIVIDE BY ZERO 26
Bypass 27
const chain = <T, S, E>(f: (a: T) Result<S, E>) <F>(result: Result<T, F>): Result<S, E | F> if (result.tag return result; } { “failure”) { return f(result.value); }; const validated = validate(input); const updated = chain(updateDB)(validated);
=
=
28
Fp-ts https://github.com/gcanti/fp-ts 29
T for TypeScript, T for Train, Robust Code I Now Maintain!
Success DB g Lo e te da up at id al V Failure 32
FASHION PRESENTATION Minimal, Stylish And Trendy
sewing patterns & technics How We Make It Awesome 01 | fashion process Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. 02 | Our fashion designers Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros. © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 34
Techniques for Sewing with Vinyl Working With Water Resistant Fabrics Can Be Really Fun FASHION PROCESS We use only top quality materials. Don’t forget to change needle. ff fi © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN Working with water resistant First, let’s understand what each fabrics can be really fun if you’re of these are. Vinyl can be looking to sew a makeup bag, a everything from a thin shower lunch bag, or a picnic blanket! curtain to a heavyweight vinyl But sewing these kinds of that you nd on car seats. Oil fabrics is really di erent than cloth is a woven fabric that has sewing with regular woven been treated with linseed oil to fabrics because they are plastic create a water-resistant surface. or covered in plastic. Laminated cotton is regular woven cotton on the wrong side and is coated with a plastic. 35
These Are Cool Wristbands That Are Good For Boys And Girls. STEPS Find three 2 foot (0.6 m) long pieces of cloth. They should be an inch or so wide. Tie the ends together. Have someone hold the knot. Braid all the strips together as tightly as you can. Measure the braid around you wrist, if you can slip it on and o your hand, it’s ready to be tied. Untie the knot that you tied in the rst place. TIE BOTH ENDS TOGETHER You may add some more braids there. Tie both ends together. If there “Measure The Braid Around You Wrist, If You Can Slip It On And Off Your Hand, It’s Ready To Be Tied.” is any extra cloth, you can cut it of. That’s it. You’ve just nished your rst braided wristband! fi ff © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN fi fi Make a Braided Wristband out of Cloth 36
How to Make a Pocket Tie Lacking A Good Place To Keep Your Wallet While Wearing A Suit? FIRST STEPS Cut or remove seam along Pocket tie can be created on a variety of surfaces. SECOND HEADING Lorem ipsum dolor sit amet, the back of the tie. This will consectetuer adipiscing elit, reveal the base of the tie and sed diam nonummy nibh overall shape (when not euismod tincidunt ut laoreet stitched together). Leave the dolore magna aliquam erat piece of sti white cloth in volutpat. Ut wisi enim ad tact. This cloth gives the tie its minim veniam, quis nostrud shape. Cut your pocket from exerci tation ullamcorper the small piece of fabric. suscipit lobortis nisl ut aliquip Consider sizing it up with your phone or wallet. ff © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN This trick works well for both men and women ex ea commodo consequat. Duis autem vel eum iriure 37
magazine slides
BEACH FASHION SUMMER WOMEN 28 Cringeworthy Fashion Moments We Witnessed on Laguna Beach Before they were designers or style and visor shades might just prove setters, not even Lauren Conrad that Lauren, Kristin, Heidi, Brody, and Kristin Cavallari were immune and the rest of their crew weren’t to the truly horrifying fashion of the really all that di erent from you and early 2000s — and we have the your friends in high school. But don’t footage to prove it. If you were to take our word for it — scroll through rewind to 2004 and binge-watch the for 28 completely cringeworthy shows that rst made them famous, fashion moments straight from we’re betting the microminis, Laguna Beach and The Hills. bandage dresses, pedal pushers, ff fi © MTV //BY Hannah Weil McKinley 39
Main TAG RETRO POST-MODERN Vintage style: The rise of retro fashion Cupcakes, bunting and pre-loved treasures coming to a village hall near you soon. The rise of vintage from fashion to furniture has been well documented on blogs and in the media . But as more businesses rebrand second hand as shabby chic will retro style fall out of favour? “Even if you go back two or three years you used to get real bargains. You could bid on old furniture and get it for 99p, now the same items are £60,” says Estelle. © MTV //BY Hannah Weil McKinley “We Used To Go To Charity Shops And Pick Up Furniture For Next To Nothing But You Can’t Do That Now,” She Said. 40
Reinventing Swimwear for Women The sun is out, and the surf is up, but women everywhere can be found in front of full-length mirrors facing an age-old dilemma, thinking: “What swimsuit can I possibly pull o with my body type?” The bathing suit hunt is nothing less than discouraging. When met with most store’s racks crammed with handkerchief-size designs with bottoms that slip down and tops that ride up, women truly get the short end of the stick when it comes to summer swimwear, ff 41
how To Handle Woman Sports At Your Fingertips What To Wear With What To Be Hipster? 1966 fashion For Trendy Men cars The New Collection can I Learn To Be Gentlemen?
how LISTEN & WATCH To Cook Pelmeni When You Are Alone place TO GO New York Jazz Lounge Piano Bar hedonism Choose Wine For Dates Easy Tips To Handle Woman Sports Push To The Limit
fl For the American Ballet Theater’s 75th Brother, Can You Spare A Million? “I like my gown,” said Samantha Winer, who had just graduated from the N.Y.U. On Monday night around House. “But you’re more And the American the fountain at Lincoln interested in doing good Ballet Theater Center, two kinds of gowns than being rich,” her wasn’t ooded the plaza in a whirling mass: purple choir gowns, worn by graduating students of New York University, and pricey designer gowns, worn by patrons of the American Ballet Theater, arriving at the Metropolitan Opera © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN grandmother told her. Who says you can’t do both? After all, this is a city that would be in big trouble without the blood sport it calls fundraising. “I Love PeopleWatching From A Balcony,” Said Giovanna Battaglia, A Fashion Editor And Stylist. 44
28 Cringeworthy Fashion Moments We Witnessed on Laguna Beach Before they were designers or style setters, not even Because why decide between pants or shorts? Lauren Lauren Conrad and Kristin Cavallari were immune to the Conrad certainly didn’t while visiting TRL. Heidi showed o truly horrifying fashion of the early 2000s — and we have the going-out uniform in a barely there bandage dress and the footage to prove it. If you were to rewind to 2004 and platform heels. binge-watch the shows that rst made them famous, we’re betting the microminis, bandage dresses, pedal pushers, and visor shades might just prove that Lauren, Kristin, Heidi, Brody, and the rest of their crew weren’t really all that di erent from you and your friends in high school. But don’t take our word for it — scroll through for 28 completely cringeworthy fashion moments straight from Laguna Beach and The Hills. ff fi ff 45
5 Key Men’s Style Experts And What They Can Do For You When it comes to honing your personal style and look, An experienced tailor will not only be able to alter your asking for help can be di cult. While many guys treat trouser and jacket length, but should also be adept at their training and grooming routines as a private ritual, darting your shirts, replacing collars, tapering your you’ll nd it always helps to have an arsenal of people you trousers, relining your jacket, and other individual can trust at your disposal, each with the knowledge and customisations. expertise to show you what works best for you. ffi fi © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN Hannah Weil McKinley 46
coat With Bomber Detail And Ruched Back Directional, Exciting And Diverse Removable hood. BREAKING RULES With a wide variety of leathers, hardware and a variety of tweeds, eece, denim jackets textures make up many jacket and more to choose from, and coats for women, and the warm, functional performance details rival some of the best doesn’t mean you have to put designer handbags. Check out your sense of style on the back all styles from Western to burner. Women’s jackets, coats performance jackets and coats and parkas are often the most for women from brands like visible garment on women, so Columbia Sportswear, Mountain the style and cut matter. Hardwear and True Grit. Princess seams, pleats, color, fl © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN Machine Wash According To Instructions 1 2 Mid-weight, woven cotton. 3 47
10 Simple Ways to Relieve Stress Many people try to treat their depression by taking drugs and burrowing away by themselves, says Dr. Steve Ilardi, a clinical psychologist. But he believes this is the wrong approach. Ilardi suggests that people ditch the drugs and change their lifestyles, instead. According to the U.K. Guardian, roughly 20 percent of the British population su ers from depression. In the U.S., that number is around ten percent. But rather than remain in isolation until it “goes away”, which is ff what most people with depression. 48
10 Simple Ways to Relieve Stress Many people try to treat their depression by taking drugs and burrowing away by themselves, says Dr. Steve Ilardi, a clinical psychologist. But he believes this is the wrong approach. Ilardi suggests that people ditch the drugs and change their lifestyles, instead. According to the U.K. Guardian, roughly 20 percent of the British population su ers from depression. In the U.S., that number is around ten percent. But rather than remain in isolation until it “goes away”, which is ff what most people with depression. 49
E-commerce
WOMEN SKIRTS Glamorous Bodycon Mini Skirt in Pink Flamingo Print ABOUT BRAND An eclectic mix of vintage in uences and contemporary partywear are at the heart of Manchester based label Glamorous, where individual style is the key. The carefully sourced fabrics and prints channel a fun and youthful vibe into their fashion forward collection of shorts, playsuits and party dresses that you can mix and match to suit your own personality. AVAILABLE SIZES AVAILABLE COLORS $189 XXS XS S M fl 51
cosy casual shirt MEN CASUAL SHIRTS ABOUT BRAND AVAILABLE SIZES High street favourites River Island XXS are known for the unique XS S M L touches they add to their directional pieces of men’s AVAILABLE COLORS clothing. River Island o er a complete menswear range that covers everything from the newest cuts in jeans to graphic INFO print t-shirts and knitwear. 95% Polyester, 5% Elastane. $79 Model’s height: 170 cm/5’7” Hand Wash Only ff 52
MEN SUIT JACKET SKINNY $519 Noose & Monkey Suit Jacket With Contrast Piping In Skinny Fit ABOUT ME AVAILABLE SIZES XXS XS S M L Body: 70% Cotton, 27% Polyester, 3% Lycra Elastane, Lining: 55% Polyester, 45% AVAILABLE COLORS Viscose. LOOK AFTER ME 53
The Elegant Tivoli Has A Classic Rounded Shape And Provides Great Storage Capacity. With Its Feminine Pleated Monogram Canvas, This Bag Is Ideal For Everyday Style About Town. Tivoli GM Monogram Canvas $1,960 54
MEN’s stylish WATCHES It’s Time For A New Watch! $519 Ballon Bleu De Cartier © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN $340 Santos De Cartier $399 Calibre De Cartier 55
MEN’s stylish WATCHES It’s Time For A New Watch! $340 Santos De Cartier © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN $399 Calibre De Cartier $179 Simon Carter Complete 56
MEN’s stylish WATCHES It’s Time For A New Watch! $399 Calibre De Cartier © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN $179 Simon Carter Complete $389 Simon Carter White 57
the Best Men’s style Brands of 2015 Who Is In The Running And Who Takes The Gold 1 Tie from Italian luxury brand Brunello Cucinelli. Marc By Marc Jacobs Tan smooth leather class act briefcase 2 Check out the new Mondaine Helvetica 3 4 Idris Elba Really, Really Loves Bow Ties (And So Should You) Shoes by Hugo Boss, £210. © 2015 WE ARE FASHION LTD. 5 58
About us
meet our team We Work Like A Charm Together John Doe Katy Frost Miranda Smith CEO & Founder Designer Marketing Director © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 60
meet our team We Work Like A Charm Together John Doe SHORT BIO CEO & Founder consectetuer adipiscing elit, Lorem ipsum dolor sit amet, sed diam nonummy nibh FASHION DESIGN HAIRDRESSING MAKEUP STYLE GUIDE euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. AWESOMNESS © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN Duis autem vel eum iriure 61
How WE Design Clothes Designing Clothes Takes Creativity And Dedication 1 3 2 4 BEGIN TO DRAW ADD COLOR USE ACCESSORIES ASSEMBLE DESIGN Draw on paper, or with a computer software. Either way, start with a basic human form. A lot of the success of your design can depend on what colors you use. Frame your design by drawing in accessories such as belts, scarves, jewelry, hats or shoes. Once you know how to sew and create a pattern, build your design. © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 62
our story Amazing Subtitle Goes Here 15 20 14 20 13 20 12 20 FINDING THE IDEA FOUNDATION BIG FISH OUR FIRST AWARD Lorem ipsum dolor sit Lorem ipsum dolor sit Lorem ipsum dolor sit Lorem ipsum dolor sit amet, consectetuer amet, consectetuer amet, consectetuer amet, consectetuer adipiscing elit, sed diam adipiscing elit, sed diam adipiscing elit, sed diam adipiscing elit, sed diam nonummy nibh euismod nonummy nibh euismod nonummy nibh. nonummy nibh euismod tincidunt ut laoreet. tincidunt. © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN tincidunt ut. 63
goals and outcomes Amazing Subtitle Goes Here 100 line 1 description line 2 description 75 Lorem ipsum dolor sit amet, We hire! consectetuer adipiscing elit, sed diam nonummy nibh 50 euismod tincidunt ut laoreet We made it on June! dolore magna aliquam erat 25 volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper April May June © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN July suscipit lobortis nisl ut aliquip 64
Spotlight on statistics How We Grow FASHION TITLE The fashion industry is a global abundance of product variety, industry, where fashion and complex supply chains. designers, manufacturers, merchandisers, and retailers from all over the world collaborate to design, manufacture, and sell clothing, shoes, and accessories. The industry is characterized by short product life cycles, erratic April In this Spotlight, we take a look at the fashion industry’s supply chain—including import and May producer prices, employment in the apparel manufacturing June and fashion-related wholesale and retail trade industrie. consumer demand, an © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN July 25 50 75 100 65
APP SLIDES
amazing fashion app Available On App Store Best Ui/Ux Practice Best App Of The Week Retina Graphics Highly Customisable 5 Stars By User Reviews Stunning Animations 67
our new shiny application Available For Tablets As Well ABOUT OUR APP For all but the most well consumer retail channel. But capitalised young brands, building a standalone online opening physical retail stores is store can also be a cost- cost-prohibitive. With online intensive and technically sales of apparel and daunting undertaking. Then, accessories growing faster than there’s the challenge of getting any other product category customers to actually visit. except consumer electronics, e-commerce o ers emerging fashion labels a more attainable path to a lucrative direct-to- ff ff © 2015 WE ARE FASHION LTD. Could EBay, with its marketplace model, low barriers to entry and large builtin audience, o er a solution. 68
our NEW site Imroved And Rewised User Interface Notification Widget “The Site Continues To Deliver A Wealth Of Choice That Surpasses The Rest Of The High-Street.” 1 2 Share Article Buttons 4 3 Social Share For Images Advertising Banners Cover Images In The Post 5 69
application showcase The Fashion Right On Your Device 70
application showcase The Fashion Right On Your Device 71
what clients say
WE CREATE FASHION TRENDS. THAY YOU’LL FOLLOW and LOVE. BECAUSE WE CAN. — John Doe 73
“You can never be overdressed or overeducated.” 74
Pin Up Girl, headed by Laura Byrnes, has been specializing in the highest quality vintage inspired fashion. 75
WE CREATE FASHION TRENDS. THAY YOU’LL FOLLOW and LOVE. BECAUSE WE CAN. — John Travolta 76
Final Slides
we proud Awards And Achievements ACHIEVEMENTS Many thanks! Lorem ipsum dolor sit amet, consectetuer adipiscing elit, Beach Fashion 2015 sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad New York Fashion Award minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip Best Fashion Brand 2014 © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN ex ea commodo consequat. Duis autem vel eum iriure Best Women’s Hat 2014 78
we proud Awards And Achievements FASHION AWARDS Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 79
we are social Follow Us, Like And Share With Us 1,290 3,894 1,4M Retweets Followers Views © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 80
our clients We Love Clients 128 Clients Overall © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 81
Store locator Stores In Philadelphia SIMPLY FASHION SIMPLY FASHION SIMPLY FASHION PHILADELPHIA PHILADELPHIA PHILADELPHIA 6046-6048 5675 NORTH FRONT 69-73 W. CHELTEN WOODWARD AVE STREET, SUITE 100 AVENUE PHILADELPHIA PHILADELPHIA PA 19142 PHILADELPHIA PA 19120 PA 19144 215-990-8309 267-353-3188 215-435-1317 © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 82
Store locator Stores In Philadelphia SIMPLY FASHION SIMPLY FASHION SIMPLY FASHION PHILADELPHIA PHILADELPHIA PHILADELPHIA 5675 NORTH FRONT 69-73 W. CHELTEN 2437 SOUTH 24TH STREET, SUITE 100 AVENUE PHILADELPHIA STREET PHILADELPHIA PHILADELPHIA PA 19120 PA 19144 PA 19145 267-353-3188 215-435-1317 215-764-0260 © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 83
Store locator Stores In Philadelphia SIMPLY FASHION SIMPLY FASHION SIMPLY FASHION PHILADELPHIA PHILADELPHIA PHILADELPHIA 69-73 W. CHELTEN 2437 SOUTH 24TH 5610 LANCASTER AVE. AVENUE PHILADELPHIA STREET PHILADELPHIA UNIT #900 A&B PA 19144 PA 19145 PHILADELPHIA PA 19131 215-435-1317 215-764-0260 267-317-0453 © 2015 WE ARE FASHION LTD. // CHAPTER HEADING OR SLOGAN 84
Contact us Visit Our Stores Or Contact Us Directly OFFICE: London HQ, Greater London CUSTOMER Building 2. Peoplebuilding, House, Hampstead Road, CARE: Maylands Avenue, Hemel LONDON, UK, NW1 7FB Hempstead Industrial Estate, HEMEL HEMPSTEAD, UK, HP2 LOGISTICS: Park Spring Road, GRIMETHORPE, BARNSLEY, UK, S72 7GX PHONE: +38 (067) 636-64-66 EMAIL: info@fashion.com 4NW
Thanks for watching! Special Warm Message Is Here
When we code, we tend to focus on the ‘happy path’. But in the real world, our application has to deal with validation, logging, network errors, and other ‘un-happy paths’.
The good news is that we know about these different paths: we know that validations may fail and we know that network requests may not come back. Railway-oriented programming is an approach that makes sure we think about and handle all these possible outcomes.
In our team, we were programming in a railway-oriented style before we discovered it has a name. Today, we are fully aware of and embrace this approach in every PR we make. Thanks to this, our services are very robust.
Railway-oriented programming is a term coined by Scott Wlaschin, who talks and writes about it using F# language. I will show how we in our team write it in TypeScript with the help of a library called fp-ts.
for free. You
can too.