# Talk: Tooling & The Webapp Development Stack

DevFeed: [Talk: Tooling & The Webapp Development Stack](<https://devfeed.tech/articles/talk-tooling-the-webapp-development-stack-21674.md>)

Original publisher: [Read original article](<https://paulirish.com/2012/talk-tooling-the-webapp-development-stack/>)

Author: Paul Irish

Published: 2012-05-01T16:57:00Z

Content type: article

Language: en

Sources: [Paul Irish](<https://devfeed.tech/sources/paul-irish.md>)

Topics: [Tooling](<https://devfeed.tech/topics/tooling.md>), [Development](<https://devfeed.tech/topics/development.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>), [Web app](<https://devfeed.tech/topics/webapp.md>), [Testing](<https://devfeed.tech/topics/testing.md>), [Optimization](<https://devfeed.tech/topics/optimization.md>), [Framework](<https://devfeed.tech/topics/framework.md>), [Boilerplate](<https://devfeed.tech/topics/boilerplate.md>), [mvc](<https://devfeed.tech/topics/mvc.md>), [Instrumentation](<https://devfeed.tech/topics/instrumentation.md>), [Integration testing](<https://devfeed.tech/topics/integration-testing.md>)

Tags: [code](<https://devfeed.tech/tags/code.md>), [components](<https://devfeed.tech/tags/components.md>), [developers](<https://devfeed.tech/tags/developers.md>), [development](<https://devfeed.tech/tags/development.md>), [front-end](<https://devfeed.tech/tags/front-end.md>), [instrumentation](<https://devfeed.tech/tags/instrumentation.md>), [integration-testing](<https://devfeed.tech/tags/integration-testing.md>), [mvc](<https://devfeed.tech/tags/mvc.md>), [optimization](<https://devfeed.tech/tags/optimization.md>), [testing](<https://devfeed.tech/tags/testing.md>), [tooling](<https://devfeed.tech/tags/tooling.md>), [tools](<https://devfeed.tech/tags/tools.md>), [workflow](<https://devfeed.tech/tags/workflow.md>)

## AI overview

This article presents a talk about the tooling ecosystem for front-end web application development. It organizes tools by development phase, covering boilerplate, authoring abstractions, frameworks and application stacks, iteration and testing, performance tuning, build optimization, and deployment.

## Source excerpt

One of the things I recognize at Google is how productive developers surround themselves with powerful tools for iterative development and debugging. For us front-end developers, the ecosystem of tools has exploded in the past two years, as we have a lot more software and libraries beyond Firebug and jQuery to help us build webapps. In the talk below I walk through the current ecosystem of tools and how they can make your development experience a more enjoyable one. My slides: Because there are so many tools around, I wanted to break them down somehow. I think contextualizing the tools as to what phase of development that assist with works well: (You could think of the Y-axis here as the amount of code in a project..) Looking at our tools this way we end up with: Boilerplate You likely start a project with more than a single blank text file. Authoring Abstractions CSS preprocessors, Languages that transpile to JS, Templating Frameworks and Application Stack Clientside MVC, UI Components, Widgets Iteration Workflow Browser Devtools, Browser/Unit/Integration Testing Performance Tuning Profiling, Memory mgmt, browser instrumentation Build & Optimization Minifiers, Concat, Image compression... Deploy Continuous Integration, Continuous deployment I've been thinking a lot about workflow and integrating these tools together. Screencasts like Andrey Tarantsov's Sublime Text Workflow really excite me and I'm eager to see more people exploring a robust development setup. 2012.05.16: Mr Jon Kemp wrote up an outline of my talk with all the links, for easy clickability: https://gist.github.com/2713513