Full Stack Web Development
Full stack web developers are always in demand—do you have the skillset? Between these pages you’ll learn to design websites with CSS, structure them with HTML, and add interactivity with JavaScript. You’ll master the different web protocols, formats, and architectures and see how and when to use APIs, PHP, web services, and other tools and languages. With information on testing, deploying, securing, and optimizing web applications, you’ll get the full frontend and backend instructions you need!
- Your all-in-one overview of full stack web development, from design and interactivity to security and operations
- Learn about frontend tools, including HTML, CSS, JavaScript, APIs, and more
- Work with backend technologies, including Node.js, PHP, web services, and databases
You'll learn about:
- Web Basics:
Get an overview of how web development works and learn about terms like URL, HTTP, HTML, CSS, JavaScript, and DNS.
- Webpage Design and Creation:
Master frontend development! Discover the key elements of HTML and walk through CSS frameworks, style guides, and architecture. See how to use variables, constants, data types, and operations with JavaScript—and much more!
- Backend Programming:
Walk through common web architectures and understand the programming languages behind every modern website. Test, secure, and optimize your web applications.
Key Highlights:
- Frontend programming
- Backend programming
- HTML
- CSS
- JavaScript
- APIs
- Single-page applications
- Web architecture
- Testing
- Deployment
- Security
- Optimization
View Full Table of Contents
- Foreword
- Preface
- Intended Audience
- Structure of the Book
- How Should I Read This Book?
- Acknowledgments
- 1 Understanding the Basics
- 1.1 Terminology
- 1.1.1 Client and Server
- 1.1.2 Relationship between URLs, Domains, and IP Addresses
- 1.2 Structure of Web Applications
- 1.2.1 Creating Web Pages Using HTML
- 1.2.2 Designing Web Pages with CSS
- 1.2.3 Making Web Pages Interactive with JavaScript
- 1.2.4 Making Web Pages Dynamic Using Server-Side Logic
- 1.3 Full Stack Development
- 1.3.1 What Are Software Stacks?
- 1.3.2 What Types of Stacks Exist?
- 1.3.3 What Is a Full Stack Developer?
- 1.3.4 Structure of This Book
- 1.4 Tools for Full Stack Developers
- 1.4.1 Editors
- 1.4.2 Development Environments
- 1.4.3 Browsers
- 1.5 Summary and Outlook
- 1.5.1 Key Points
- 1.5.2 Outlook
- 2 Structuring Web Pages with HTML
- 2.1 Introduction
- 2.1.1 Versions
- 2.1.2 Using Elements and Attributes
- 2.1.3 Saving Web Pages as HTML Documents
- 2.2 Using the Most Important Elements
- 2.2.1 Using Headings, Paragraphs, and Other Text Formatting
- 2.2.2 Creating Lists
- 2.2.3 Defining Links
- 2.2.4 Including Images
- 2.2.5 Structuring Data in Tables
- 2.2.6 Defining Forms
- 2.2.7 Further Information
- 2.3 Summary and Outlook
- 2.3.1 Key Points
- 2.3.2 Recommended Reading
- 2.3.3 Outlook
- 3 Designing Web Pages with CSS
- 3.1 Introduction
- 3.1.1 The Principle of CSS
- 3.1.2 Including CSS in HTML
- 3.1.3 Selectors
- 3.1.4 Cascading and Specificity
- 3.1.5 Inheritance
- 3.2 Applying Colors and Text Formatting
- 3.2.1 Defining the Text Color and Background Color
- 3.2.2 Designing Texts
- 3.3 Lists and Tables
- 3.3.1 Designing Lists
- 3.3.2 Designing Tables
- 3.4 Understanding the Different Layout Systems
- 3.4.1 Basic Principles of Positioning with CSS
- 3.4.2 Float Layout
- 3.4.3 Flexbox Layout
- 3.4.4 Grid Layout
- 3.5 Summary and Outlook
- 3.5.1 Key Points
- 3.5.2 Recommended Reading
- 3.5.3 Outlook
- 4 Making Web Pages Interactive with JavaScript
- 4.1 Introduction
- 4.1.1 Including JavaScript
- 4.1.2 Displaying Dialog Boxes
- 4.1.3 Using the Developer Console
- 4.1.4 Introduction to Programming
- 4.2 Variables, Constants, Data Types, and Operators
- 4.2.1 Defining Variables
- 4.2.2 Defining Constants
- 4.2.3 Using Data Types
- 4.2.4 Using Operators
- 4.3 Using Control Structures
- 4.3.1 Using Conditional Statements and Branching
- 4.3.2 Using Loops
- 4.4 Functions and Error Handling
- 4.4.1 Defining and Calling Functions
- 4.4.2 Passing and Analyzing Function Parameters
- 4.4.3 Defining Return Values
- 4.4.4 Responding to Errors
- 4.5 Objects and Arrays
- 4.5.1 Using Objects
- 4.5.2 Using Arrays
- 4.6 Summary and Outlook
- 4.6.1 Key Points
- 4.6.2 Recommended Reading
- 4.6.3 Outlook
- 5 Using Web Protocols
- 5.1 Hypertext Transfer Protocol
- 5.1.1 Requests and Responses
- 5.1.2 Structure of HTTP Requests
- 5.1.3 Structure of HTTP Responses
- 5.1.4 Header
- 5.1.5 Methods
- 5.1.6 Status Codes
- 5.1.7 MIME Types
- 5.1.8 Cookies
- 5.1.9 Executing HTTP from the Command Line
- 5.2 Bidirectional Communication
- 5.2.1 Polling and Long Polling
- 5.2.2 Server-Sent Events
- 5.2.3 WebSockets
- 5.3 Summary and Outlook
- 5.3.1 Key Points
- 5.3.2 Recommended Reading
- 5.3.3 Outlook
- 6 Using Web Formats
- 6.1 Data Formats
- 6.1.1 CSV
- 6.1.2 XML
- 6.1.3 JSON
- 6.2 Image Formats
- 6.2.1 Photographs in the JPG Format
- 6.2.2 Graphics and Animations in the GIF Format
- 6.2.3 Graphics in the PNG Format
- 6.2.4 Vector Graphics in the SVG Format
- 6.2.5 Everything Gets Better with the WebP Format
- 6.2.6 Comparing Image Formats
- 6.2.7 Programs for Image Processing
- 6.3 Video and Audio Formats
- 6.3.1 Video Formats
- 6.3.2 Audio Formats
- 6.4 Summary and Outlook
- 6.4.1 Key Points
- 6.4.2 Recommended Reading
- 6.4.3 Outlook
- 7 Using Web APIs
- 7.1 Changing Web Pages Dynamically Using the DOM API
- 7.1.1 The Document Object Model
- 7.1.2 The Different Types of Nodes
- 7.1.3 Selecting Elements
- 7.1.4 Modifying Elements
- 7.1.5 Creating, Adding, and Deleting Elements
- 7.1.6 Practical Example: Dynamic Creation of a Table
- 7.2 Loading Data Synchronously via Ajax and the Fetch API
- 7.2.1 Synchronous versus Asynchronous Communication
- 7.2.2 Loading Data via Ajax
- 7.2.3 Loading Data via the Fetch API
- 7.3 Other Web APIs
- 7.3.1 Overview of Web APIs
- 7.3.2 Browser Support for Web APIs
- 7.4 Summary and Outlook
- 7.4.1 Key Points
- 7.4.2 Recommended Reading
- 7.4.3 Outlook
- 8 Optimizing Websites for Accessibility
- 8.1 Introduction
- 8.1.1 Introduction to Accessibility
- 8.1.2 User Groups and Assistive Technologies
- 8.1.3 Web Content Accessibility Guidelines
- 8.2 Making Components of a Website Accessible
- 8.2.1 Structuring Web Pages Semantically
- 8.2.2 Using Headings Correctly
- 8.2.3 Making Forms Accessible
- 8.2.4 Making Tables Accessible
- 8.2.5 Making Images Accessible
- 8.2.6 Making Links Accessible
- 8.2.7 Accessible Rich Internet Applications
- 8.2.8 Miscellaneous
- 8.3 Testing Accessibility
- 8.3.1 Types of Tests
- 8.3.2 Tools for Testing
- 8.4 Summary and Outlook
- 8.4.1 Key Points
- 8.4.2 Recommended Reading
- 8.4.3 Outlook
- 9 Simplifying CSS with CSS Preprocessors
- 9.1 Introduction
- 9.1.1 How CSS Preprocessors Work
- 9.1.2 Features of CSS Preprocessors
- 9.1.3 Sass, Less, and Stylus
- 9.2 Using Sass
- 9.2.1 Installing Sass
- 9.2.2 Compiling Sass Files to CSS
- 9.2.3 Using Variables
- 9.2.4 Using Operators
- 9.2.5 Using Branches
- 9.2.6 Using Loops
- 9.2.7 Using Functions
- 9.2.8 Implementing Custom Functions
- 9.2.9 Nesting Rules
- 9.2.10 Using Inheritance and Mixins
- 9.3 Summary and Outlook
- 9.3.1 Key Points
- 9.3.2 Recommended Reading
- 9.3.3 Outlook
- 10 Implementing Single-Page Applications
- 10.1 Introduction
- 10.2 Setup
- 10.3 Components: The Building Blocks of a React Application
- 10.3.1 State: The Local State of a Component
- 10.3.2 The Lifecycle of a Component
- 10.4 Styling Components
- 10.4.1 Inline Styling
- 10.4.2 CSS Classes and External Stylesheets
- 10.4.3 Overview of Other Styling Options
- 10.5 Component Hierarchies
- 10.6 Forms
- 10.7 The Context API
- 10.8 Routing
- 10.9 Summary and Outlook
- 10.9.1 Key Points
- 10.9.2 Recommended Reading
- 10.9.3 Outlook
- 11 Implementing Mobile Applications
- 11.1 The Different Types of Mobile Applications
- 11.1.1 Native Applications
- 11.1.2 Mobile Web Applications
- 11.1.3 Hybrid Applications
- 11.1.4 Comparing the Different Approaches
- 11.2 Responsive Design
- 11.2.1 Introduction: What Is Responsive Design?
- 11.2.2 Viewports
- 11.2.3 Media Queries
- 11.2.4 Flexible Layouts
- 11.3 Cross-Platform Development with React Native
- 11.3.1 The Principle of React Native
- 11.3.2 Installation and Project Initialization
- 11.3.3 Starting the Application
- 11.3.4 The Basic Structure of a React Native Application
- 11.3.5 User Interface Components
- 11.3.6 Building and Publishing Applications
- 11.4 Summary and Outlook
- 11.4.1 Key Points
- 11.4.2 Recommended Reading
- 11.4.3 Outlook
- 12 Understanding and Using Web Architectures
- 12.1 Layered Architectures
- 12.1.1 Basic Structure of Layered Architectures
- 12.1.2 Client-Server Architecture (Two-Tier Architecture)
- 12.1.3 Multi-Tier Architecture
- 12.2 Monoliths and Distributed Architectures
- 12.2.1 Monolithic Architecture
- 12.2.2 Service-Oriented Architecture
- 12.2.3 Microservice Architecture
- 12.2.4 Component-Based Architecture
- 12.2.5 Microfrontends Architecture
- 12.2.6 Messaging Architecture
- 12.2.7 Web Service Architecture
- 12.3 MV* Architectures
- 12.3.1 Model-View-Controller
- 12.3.2 Model-View-Presenter
- 12.3.3 Model-View-Viewmodel
- 12.4 Summary and Outlook
- 12.4.1 Key Points
- 12.4.2 Recommended Reading
- 12.4.3 Outlook
- 13 Using Programming Languages on the Server Side
- 13.1 Types of Programming Languages
- 13.1.1 Programming Languages by Degree of Abstraction
- 13.1.2 Compiled and Interpreted Programming Languages
- 13.2 Programming Paradigms
- 13.2.1 Imperative and Declarative Programming
- 13.2.2 Object-Oriented Programming
- 13.2.3 Functional Programming
- 13.3 What Are the Programming Languages?
- 13.3.1 Rankings of Programming Languages
- 13.3.2 Which Programming Language Should You Learn?
- 13.3.3 But Seriously Now: Which Programming Language Should You Learn?
- 13.4 Summary and Outlook
- 13.4.1 Key Points
- 13.4.2 Recommended Reading
- 13.4.3 Outlook
- 14 Using JavaScript on the Server Side
- 14.1 JavaScript on Node.js
- 14.1.1 Node.js Architecture
- 14.1.2 A First Program
- 14.1.3 Package Management
- 14.2 Using the Integrated Modules
- 14.2.1 Reading Files
- 14.2.2 Writing Files
- 14.2.3 Deleting Files
- 14.3 Implementing a Web Server
- 14.3.1 Preparations
- 14.3.2 Providing Static Files
- 14.3.3 Using the Express.js Web Framework
- 14.3.4 Processing Form Data
- 14.4 Summary and Outlook
- 14.4.1 Key Points
- 14.4.2 Recommended Reading
- 14.4.3 Outlook
- 15 Using the PHP Language
- 15.1 Introduction to the PHP Language
- 15.2 Installing PHP and the Web Server Locally
- 15.3 Variables, Data Types, and Operators
- 15.3.1 Using Variables
- 15.3.2 Using Constants
- 15.3.3 Using Operators
- 15.4 Using Control Structures
- 15.4.1 Conditional Statements
- 15.4.2 Loops
- 15.5 Functions and Error Handling
- 15.5.1 Defining Functions
- 15.5.2 Function Parameters
- 15.5.3 Defining Return Values
- 15.5.4 Using Data Types
- 15.5.5 Anonymous Functions
- 15.5.6 Declaring Variable Functions
- 15.5.7 Arrow Functions
- 15.5.8 Responding to Errors
- 15.6 Using Classes and Objects
- 15.6.1 Writing Classes
- 15.6.2 Creating Objects
- 15.6.3 Class Constants
- 15.6.4 Visibility
- 15.6.5 Inheritance
- 15.6.6 Class Abstraction
- 15.6.7 More Features
- 15.7 Developing Dynamic Websites with PHP
- 15.7.1 Creating and Preparing a Form
- 15.7.2 Receiving Form Data
- 15.7.3 Verifying Form Data
- 15.8 Summary and Outlook
- 15.8.1 Key Points
- 15.8.2 Recommended Reading
- 15.8.3 Outlook
- 16 Implementing Web Services
- 16.1 Introduction
- 16.2 SOAP
- 16.2.1 The Workflow with SOAP
- 16.2.2 Description of Web Services with WSDL
- 16.2.3 Structure of SOAP Messages
- 16.2.4 Conclusion
- 16.3 REST
- 16.3.1 The Workflow with REST
- 16.3.2 The Principles of REST
- 16.3.3 Implementing a REST API
- 16.3.4 Calling a REST API
- 16.4 GraphQL
- 16.4.1 The Disadvantages of REST
- 16.4.2 The Workflow of GraphQL
- 16.5 Summary and Outlook
- 16.5.1 Key Points
- 16.5.2 Recommended Reading
- 16.5.3 Outlook
- 17 Storing Data in Databases
- 17.1 Relational Databases
- 17.1.1 The Functionality of Relational Databases
- 17.1.2 The SQL Language
- 17.1.3 Real-Life Example: Using Relational Databases in Node.js
- 17.1.4 Object-Relational Mappings
- 17.2 Non-Relational Databases
- 17.2.1 Relational versus Non-Relational Databases
- 17.2.2 The Functionality of Non-Relational Databases
- 17.2.3 Key-Value Databases
- 17.2.4 Document-Oriented Databases
- 17.2.5 Graph Databases
- 17.2.6 Column-Oriented Databases
- 17.3 Summary and Outlook
- 17.3.1 Key Points
- 17.3.2 Recommended Reading
- 17.3.3 Outlook
- 18 Testing Web Applications
- 18.1 Automated Tests
- 18.1.1 Introduction
- 18.1.2 Types of Tests
- 18.1.3 Test-Driven Development
- 18.1.4 Running Automated Tests in JavaScript
- 18.2 Test Coverage
- 18.2.1 Introduction
- 18.2.2 Determining Test Coverage in JavaScript
- 18.3 Test Doubles
- 18.3.1 The Problem with Dependencies
- 18.3.2 Replacing Dependencies with Test Doubles
- 18.3.3 Spies
- 18.3.4 Stubs
- 18.3.5 Mock Objects
- 18.4 Summary and Outlook
- 18.4.1 Key Points
- 18.4.2 Recommended Reading
- 18.4.3 Outlook
- 19 Deploying and Hosting Web Applications
- 19.1 Introduction
- 19.1.1 Building, Deploying, and Hosting
- 19.1.2 Types of Deployment
- 19.1.3 Types of Hosting
- 19.1.4 Requirements for Servers
- 19.2 Container Management
- 19.2.1 Docker
- 19.2.2 Real-Life Example: Packaging a Web Application using Docker
- 19.2.3 Number of Docker Images
- 19.2.4 Docker Compose
- 19.3 Summary and Outlook
- 19.3.1 Key Points
- 19.3.2 Recommended Reading
- 19.3.3 Outlook
- 20 Securing Web Applications
- 20.1 Vulnerabilities
- 20.1.1 Open Web Application Security Project
- 20.1.2 Injection
- 20.1.3 Broken Authentication
- 20.1.4 Sensitive Data Exposure
- 20.1.5 XML External Entities
- 20.1.6 Broken Access Control
- 20.1.7 Security Misconfiguration
- 20.1.8 Cross-Site Scripting
- 20.1.9 Insecure Deserialization
- 20.1.10 Using Components with Known Vulnerabilities
- 20.1.11 Insufficient Logging and Monitoring
- 20.1.12 Outlook
- 20.2 Encryption and Cryptography
- 20.2.1 Symmetric Cryptography
- 20.2.2 Asymmetric Cryptography
- 20.2.3 SSL, TLS, and HTTPS
- 20.3 Same-Origin Policies, Content Security Policies, and Cross-Origin Resource Sharing
- 20.3.1 Same Origin Policy
- 20.3.2 Cross-Origin Resource Sharing
- 20.3.3 Content Security Policy
- 20.4 Authentication
- 20.4.1 Basic Authentication
- 20.4.2 Session-Based Authentication
- 20.4.3 Token-Based Authentication
- 20.5 Summary and Outlook
- 20.5.1 Key Points
- 20.5.2 Recommended Reading
- 20.5.3 Outlook
- 21 Optimizing the Performance of Web Applications
- 21.1 Introduction
- 21.1.1 What Should Be Optimized and Why?
- 21.1.2 How Can Performance Be Measured?
- 21.1.3 Which Tools Are Available for Measuring Performance?
- 21.2 Options for Optimization
- 21.2.1 Optimizing Connection Times
- 21.2.2 Using a Server-Side Cache
- 21.2.3 Optimizing Images
- 21.2.4 Using a Client-Side Cache
- 21.2.5 Minifying the Code
- 21.2.6 Compressing Files
- 21.2.7 Lazy Loading: Loading Data Only When Needed
- 21.2.8 Preloading Data
- 21.3 Summary and Outlook
- 21.3.1 Key Points
- 21.3.2 Recommended Reading
- 21.3.3 Outlook
- 22 Organizing and Managing Web Projects
- 22.1 Types of Version Control Systems
- 22.1.1 Central Version Control Systems
- 22.1.2 Decentralized Version Control Systems
- 22.2 The Git Version Control System
- 22.2.1 How Git Stores Data
- 22.2.2 The Different Areas of Git
- 22.2.3 Installation
- 22.2.4 Creating a New Git Repository
- 22.2.5 Transferring Changes to the Staging Area
- 22.2.6 Committing Changes to the Local Repository
- 22.2.7 Committing Changes to the Remote Repository
- 22.2.8 Transferring Changes from the Remote Repository
- 22.2.9 Working in a New Branch
- 22.2.10 Transferring Changes from a Branch
- 22.3 Summary and Outlook
- 22.3.1 Key Points
- 22.3.2 Recommended Reading
- 22.3.3 Outlook
- 23 Managing Web Projects
- 23.1 Classic Project Management versus Agile Project Management
- 23.1.1 Classic Project Management
- 23.1.2 Agile Project Management
- 23.2 Agile Project Management Based on Scrum
- 23.2.1 The Scrum Workflow
- 23.2.2 The Roles of Scrum
- 23.2.3 Events in Scrum
- 23.2.4 Artifacts in Scrum
- 23.3 Summary and Outlook
- 23.3.1 Key Points
- 23.3.2 Recommended Reading
- 23.3.3 Outlook
- Appendices
- A HTTP
- A.1 HTTP Status Codes
- A.2 MIME Types
- A.3 Headers
- B HTML Elements
- B.1 HTML and Metadata
- B.2 Page Areas
- B.3 Content Grouping
- B.4 Text
- B.5 Changes to the Document
- B.6 Embedded Content
- B.7 Tables
- B.8 Forms
- B.9 Scripts
- C Tools and Command References
- C.1 Node.js
- C.2 Testing Tools
- C.3 Git Command Reference
- C.4 Docker Command Reference
- C.5 Docker Compose Command Reference
- D Conclusion
- E The Author
- Index
