Preface

When I began creating course materials of my own, I carried with me an acute awareness of several things. First, the volume of free, online reference materials including video tutorials, community groups, and books (now including this text) is so far greater than what a single printed volume could handle, that the idea of creating a comprehensive source seemed laughably redundant. Second, many of the texts that march across my desk for review each semester focus primarily on the underpinnings of a particular language, while spending little time introducing or reinforcing the methodology and general practice of the language in question. While this allows those authors to delve deeper into limited topics, I have found that focusing on how languages relate and intertwine is often more beneficial, especially when just beginning to study web development. Studying languages independent of one another does little to prepare a programmer for complex systems involving multiple languages.This text is meant to reduce the confusion brought about by integrating multiple languages into one site while at the same time providing an overview of the entire development process. Within, you will find information on a variety of topics involved in the overall process of planning, designing, and finally creating a website; this background will help you understand how these pieces fit together, so you are better able to understand and contribute to a project and work with others on your team.

As this is an introductory level text, the goal is not to exhaust the covered topics. Instead we will focus on familiarizing ourselves with each language’s abilities and how to fuse those languages and methods together to create a responsive, well-developed site. You will frequently find links and keywords throughout the text, which you can use as a starting point to further research topics that interest you.

We will examine web development in a full stack approach; the premise behind the phrase “full stack developer” is that the person has an understanding of all of the elements necessary to create and run a website. The topics included below all lend themselves towards this goal by touching each aspect of the process.

Section 1: Web Development

A brief history of the development of the Internet along with current trends and emerging technologies such as virtualization, botnets, internet of things, and more.

Web Servers: Analysis of the components of servers from both a hardware and software perspective with introduction to LAMP software and alternative solutions. Introduction to basic networking topics to provide an understanding of device addressing and URL translation.

Design: Techniques useful in the design of web projects including site maps, wireframes, storyboarding and more.

Development: Introduction to development models and best practices. Includes APIs, developing with or without others, and practices like pseudo-code, code formatting, and variable naming conventions.

Section 2: Document Markup

HTML5: Introduction to HTML including features from the current specifications for HTML5. Covers tags and attributes, layout elements, forms, canvas, and more.

CSS: Introduction to CSS3 including selectors and rules, classes, responsive styling, positioning, and more.

Section 3: Scripting Languages

PHP: Introduction to PHP including debugging, arrays, email, file interaction, logic and control structure, and more.

JavaScript: A brief contrast of JavaScript to PHP, use of jQuery, and the document object model. Demonstration of how to complete basic page manipulation using JavaScript.

Section 4: Data Storage

MySQL: Primary and foreign keys, normalization and design, query design, and more.

Section 5: Tying It Together

Security: An introduction to risk management and examples of basic methods of securing elements of a site.

Advanced Examples: Examples of site features and methods, which combine the languages and topics in the text.

Finishing Touches: Integration of common website elements that complete the user experience including search optimization, analytics, and important information.

Learning Features

Colored blocks of text provide additional notes, important reminders, or highlight useful features of a language.

Additional Notes

Important Reminders

Useful Features

Words found in bolded red are links that connect to definitions in the glossary.

Examples are interspersed throughout the entire text that you can try out as you follow the material. Each major section of the text also contains questions and assignments at the end to give you an opportunity to test your understanding of the material. Assessments include several small to medium sized assignments, discussion questions, and multiple-choice questions. Discussion questions are meant to encourage deeper examination of topics and will frequently require effort to find additional information beyond this text (hint: start with the following feature).

Select topics are followed by a “Learn More” box (shown below), which identifies vocabulary and other sources you can use to delve deeper into the topic. Whenever possible, these external sources will also be openly published, free material.

Learn More

Keywords, search terms:

Resource Name: Location

License

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

Preface by Michael Mendez is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.