Learning Web Design, 5th Edition

20. Modern Web Development Tools

20

Modern Web Development Tools

In this chapter

Introduction to the command line

CSS preprocessors and postprocessors

Build tools and task runners

Git version control

In the exercises in this book, you’ve been writing static HTML pages with embedded style sheets, saving them, and opening them in your browser. Although that is a perfectly valid approach, it is likely not the way you would work if you were doing web development for a living. I figure if you are learning web design and development, you should be familiar with how things are done in a professional environment.

This chapter introduces you to some of the tools used by web developers to make their work easier and their code more robust:

• CSS processors for writing CSS more efficiently and optimizing the resulting code so it works across all browsers
• Build tools that automate the sorts of repetitive tasks you encounter when producing code
• Git, a version control program that keeps track of your previous versions and makes it easy for teams to work together on the same code

What these advanced tools have in common is that they are generally used with a command-line interface (CLI). So, before we look at specific tools, let’s first get up to speed with the command line.

Getting Cozy with the Command Line

You probably use a computer with a graphical user Interface (GUI), with icons that stand for files and folders, pull-down menus full of options, and intuitive actions like dragging ...