Web Refactoring into Testability Workshop


Duration: 180 mins
Scott Davis
Principal Engineer, ThoughtWorks

In his book Refactoring: Improving the Design of Existing Code, Martin Fowler gives a simple, compelling definition of the word: "noun: a change made to the internal structure of software to make it easier to understand and cheaper to modify without changing its observable behavior". The examples in the book are written in JavaScript and Java. Can the same principles be applied to web development?

In this workshop, expert Scott Davis (Web Architect and Developer Advocate, ThoughtWorks) brings the engineering rigor of Refactoring to an existing, perfectly functional website -- a website that works now, but might give anyone pause if they were tasked with adding some new functionality to it. The website is what Scott affectionately calls "20th Century Idiomatic" -- "page-centric" if one is feeling charitable; "monolithic" and "pathologically global" if less so.

Join Scott as he brings 21st Century web development practices and programming to the "internal structure" of the website -- web components and custom events; templates and shadow DOM; -- and modern testing tools -- Gauge and Taiko -- that "make it easier to understand and cheaper to modify without changing its observable behavior".

What you'll learn-and how you can apply it

By the end of this live, hands-on, online course, you’ll understand:

  • Refactoring and Testing strategies
  • HTML5 Custom Elements, Shadow DOM, HTML Templates, Custom Events
  • Free and open-source testing tools like Gauge and Taiko

And you’ll be able to:

  • Refactor a monolithic website into one based on framework-free, standards-based Web Components
  • Learn about modern testing strategies and tools

This training course is for you because...

  • You're a web developer
  • You work with standards-based HTML5 technologies
  • You want to become a better front-end web developer

Prerequisites

  • Basic familiarity with HTML, CSS, and JavaScript
  • We will be writing very little code from scratch. Most exercises involve rearranging existing code, finished labs will be provided for each exercise.

Recommended preparation:

  • Have NodeJS 10.x or higher installed on your local machine.
  • Use npm to download and install Taiko and Gauge.
  • Have a text editor or IDE of your choice ready to edit basic HTML, CSS, and JavaScript files, as well as a web browser to view your locally running web site.
  • Download or clone the GitHub repository link and bookmark the live demo website URL.

You may also be interested in

50 mins
Building Antifragile Teams

Antifragile systems thrive under stress and through failure. How can we help our teams – systems made up of people...

180 mins
Modern Software Development

Our industry never stops changing, but sometimes those changes are trivial and fluffy and we can ignore them. Sometimes they...

50 mins
Leading & Guiding Development Teams

By definition, a tech leader is responsible for leading and guiding development teams. In this session we will take a...

50 mins
10x productivity for Developers and Architects

Productivity is key to success in software development. We will be exploring different principles, so you do not have to...

25 mins
Eliminating Hero Culture on our Engineering Teams

Hero Culture can be found within any company dominated by employees that are constantly rewarded for going the extra mile,...

50 mins
Identifying And Removing Impediments

Executing a software project has many challenges. For a team to function smoothly and deliver working solution we have to...