Devtools Training

A premium training course to master the browser devtools, launching soon.

A premium video training package by REMY SHARP covering all aspects of the browser developers tools to help you apply the best workflow to your day to day debugging.

About Remy Sharp

Remy Sharp

Remy has been working commerically on the web since 1999, and known for being an expert in JavaScript and debugging.

Remy is the founder and curator of ffconf, the hugely popular UK based JavaScript event. He also ran jQuery for Designers the video tutorials web site and co-authored Introducing HTML5 with Bruce Laweson, deputy CEO of Opera.

Whilst he's not writing articles or running and speaking at conferences, he runs his own development and training company called Left Logic. He also built JS Bin, HTML5 Demos, nodemon, and many other projects.

  • Click Through

    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.

  • Lead Generation

    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.

  • Other Purposes

    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.

What you'll learn

Improve your workflow

Learn how to make your brower devtools your development IDE

Advanced console

Learn how to go way beyond your regular console logging

Memory leaks

Learn how to identify and rememidate memory leaks with live examples

Networking

Discover what's slow, why it's slow and the details behind the requests

Performance analysis

Understand how to investigate rendering issues and costly execution

Mobile & responsive

Learn how to take advantage of emulation modes and how to debug tiny machines

You're in good company

320
Minutes of video
39
Videos
8
Modules
358
Happy students

Course material

Getting started

  • Introduction to The Art of Debugging (01:01)
  • Workshop overview (03:34)
  • Creating a clean debugging workspace (02:28)
  • Using the latest devtools and experiments (04:03)
  • Prerequisites for this workshop (02:12)

Source: Working with code

  • Devtools as an IDE: Creating workspaces (06:33)
  • Navigating the source code (03:42)
  • Live changes (05:47)
  • All about breakpoints (16:26)
  • Watches (04:30)
  • Workspace file management (and inline JavaScript quirks) (03:32)
  • History and diffs (03:32)
  • Snippets (05:43)
  • Tweaking CSS (01:56)
  • Task: fixing JavaScript bugs (plus solution) (08:15)

Console: going beyond dot-log

  • Familiarising yourself with the console UI (history, scope, context) (07:17)
  • log, styling and stack traces (06:13)
  • All about $ (and inspect) (07:06)
  • Copying and visualising data (02:44)
  • Capturing globals from private scope (03:49)
  • console.time("label")/timeEnd, table, group/groupEnd
  • monitorEvents/unmonitorEvents and getEventListeners
  • Task: collect all the HTTP status codes from wikipedia (07:59)

General tips

  • Keyboard shortcuts and the command palette (04:31)
  • Finding high usage tabs (02:01)
  • Working with live sites (sourcemaps, right click, save as)

More coming in the following weeks.

Pricing

Order your package today and take advantage of the special pre-order price.

Starter pack

$ 57
Pre-order price $89
  • Access the first 20 modules
  • Stream course from any device
  • All the source code and completed examples
  • Exclusive access to discussion boards
  • Unlimited updates

Team package

$ 249
Pre-order price $400
  • For teams of up to 10
  • Includes everything from master package
  • 24/7 Customer Support
  • Remy's workshop showed me how to do at least three things I'd previously thought were impossible.

    James O'Brien, Freelance UX designer
  • Learnt a tonne in Remy's debugging workshop. I'm eager to put it all to use!

    Mark Perkins, Clear Left

    I attended Remy's workshop in the past and it was awesome. Would attend again 😄

    George Stefanis, Disney
  • Solid pragmatic immense knowledge about...like anything you would throw at him. Easy to change his plans to respond to the audience interests.

    Stepan Reznikov, Booking.com.

Frequently Asked Questions

What format are the videos? How do I watch them?

Once you buy a package, you will be mailed access to a course viewer area where you can stream all the videos. The Master Collection will also be able to download them for offline viewing. All the videos were professionally recorded at HD 2560×1440.

Do you offer a student discount?

Absolutely! Send me an email with some proof that you are a student - such as an ID, acceptance letter, or student email address - and I'll send you a discount code. This applies to anyone in any type of schooling, including evening classes and coding bootcamps!

What if I'm not satisfied with the course?

I'm confident you'll love the courses, I want to make sure you get real value out of the material, which means you are absolutely thrilled! If you aren't satisfied, please get in touch within 10 days with your order number. If you have completed more than 50% of a course, I reserve the right to decline a refund.

Are there any prerequites?

It's recommended that you're able to write and understand your own HTML, basic knowledge of CSS, have some basic knowledge on how to manipulate the DOM, along with some JavaScript knowledge, including using XMLHttpRequest (Ajax) and basic practices.

Will you be running courses for other browsers?

I absolutely intend to, I want to release similar content around Firefox, Safari and Internet Explorer. Get notified to find out when.

I have another question!

No problem, just drop me an email me at remy@leftlogic.com.

Ready to start? Take the first step and get notified when the course launches