00 день 00 час 00 минут 00 секунд

Ваш последний шанс! Получите скидку 30% по промокоду «Литуз»!

Web Coding & Development All-in-One for Dummies

99990 UZS

-Do'stlaringizga tafsiya etish!

Описание

«Unlock the World of Web Coding & Development with ‘Web Coding & Development All-in-One for Dummies’!

This comprehensive guide is your one-stop resource for mastering every aspect of web coding and development. Authored by a team of experts, ‘Web Coding & Development All-in-One for Dummies’ covers everything from HTML and CSS to JavaScript, PHP, and more.

Whether you’re a beginner looking to build your first website or an experienced developer seeking to enhance your skills, this book has you covered. With its clear explanations, practical examples, and hands-on tutorials, ‘Web Coding & Development All-in-One for Dummies’ guides you through every step of the web development process.

From designing responsive layouts to integrating multimedia content and deploying web applications, this book provides comprehensive coverage of the tools and techniques needed to succeed in the world of web development. With its user-friendly approach and extensive coverage, ‘Web Coding & Development All-in-One for Dummies’ is the ultimate resource for aspiring web developers and seasoned professionals alike.

Get ready to unleash your creativity and build stunning websites with ‘Web Coding & Development All-in-One for Dummies’ as your trusted companion!»

Детали

Количество листов:

843

Mundarija

Table of Contents
INTRODUCTION . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
About This Book . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
Foolish Assumptions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
“I’ve never coded before!”………………………………3
“I have coded before!” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Icons Used in This Book . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Beyond the Book . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
BOOK 1: GETTING READY TO CODE FOR THE WEB . . . . . . . . . . 5
CHAPTER 1: How Web Coding and Development Work . . . . . . . . . . . 7
The Nuts and Bolts of Web Coding and Development . . . . . . . . . . . . . 8
How the web works . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
How the web works, take two . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Understanding the Front End: HTML and CSS . . . . . . . . . . . . . . . . . . . 12
Adding structure: HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Adding style: CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Understanding the Back End: PHP and MySQL . . . . . . . . . . . . . . . . . . . 15
Storing data on the server: MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . 16
Accessing data on the server: PHP . . . . . . . . . . . . . . . . . . . . . . . . . . 16
How It All Fits Together: JavaScript and jQuery . . . . . . . . . . . . . . . . . . . 16
Front end, meet back end: JavaScript . . . . . . . . . . . . . . . . . . . . . . . . 16
Making your web coding life easier: jQuery . . . . . . . . . . . . . . . . . . 17
How Dynamic Web Pages Work . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
What Is a Web App? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
What Is a Mobile Web App? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
What’s the Difference between Web Coding
and Web Development? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
CHAPTER 2: Setting Up Your Web Development Home . . . . . . . . . . 21
What Is a Local Web Development Environment? . . . . . . . . . . . . . . . . 22
Do You Need a Local Web Development Environment? . . . . . . . . . . . 22
Setting Up the XAMPP for Windows Development Environment . . . . 23
Installing XAMPP for Windows . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Running the XAMPP for Windows Control Panel . . . . . . . . . . . . . . 26
Accessing your local web server . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Setting Up the XAMPP for OS X Development Environment . . . . . . . . 29
Installing XAMPP for OS X . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
Running the XAMPP Application Manager . . . . . . . . . . . . . . . . . . . . 30
Accessing your local web server . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
Choosing Your Text Editor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
CHAPTER 3: Finding and Setting Up a Web Host . . . . . . . . . . . . . . . . . . . 35
Understanding Web Hosting Providers . . . . . . . . . . . . . . . . . . . . . . . . . 36
Using your existing Internet provider . . . . . . . . . . . . . . . . . . . . . . . . 36
Finding a free hosting provider . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
Signing up with a commercial hosting provider . . . . . . . . . . . . . . . 37
A Buyer’s Guide to Web Hosting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
Finding a Web Host . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Finding Your Way around Your New Web Home . . . . . . . . . . . . . . . . . 41
Your directory and your web address . . . . . . . . . . . . . . . . . . . . . . . 42
Making your hard disk mirror your web home . . . . . . . . . . . . . . . . 42
Uploading your site files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Making changes to your web files . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
BOOK 2: CODING THE FRONT END, PART 1:
HTML & CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
CHAPTER 1: Structuring the Page with HTML . . . . . . . . . . . . . . . . . . . . . . 49
Getting the Hang of HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
Understanding Tag Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
Learning the Fundamental Structure of an HTML5 Web Page . . . . . . 53
Giving your page a title . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
Adding some text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Some Notes on Structure versus Style . . . . . . . . . . . . . . . . . . . . . . . . . . 57
Applying the Basic Text Tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Emphasizing text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Marking important text……………………………….59
Nesting tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
Adding headings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
Adding quotations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61
Creating Links…………………………………………62
Linking basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
Anchors aweigh: Internal links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Building Bulleted and Numbered Lists . . . . . . . . . . . . . . . . . . . . . . . . . . 65
Making your point with bulleted lists . . . . . . . . . . . . . . . . . . . . . . . . 65
Numbered lists: Easy as one, two, three . . . . . . . . . . . . . . . . . . . . . 67
Inserting Special Characters . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68
Inserting Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Carving Up the Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
The <header> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
The <nav> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
The <main> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
The <article> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
The <section> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
The <aside> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75

The <footer> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75
Handling non-semantic content with <div> . . . . . . . . . . . . . . . . . . . 76
Handling words and characters with <span> . . . . . . . . . . . . . . . . . 77
CHAPTER 2: Styling the Page with CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
Figuring Out Cascading Style Sheets . . . . . . . . . . . . . . . . . . . . . . . . . . . 80
Styles: Bundles of formatting options . . . . . . . . . . . . . . . . . . . . . . . 80
Sheets: Collections of styles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80
Cascading: How styles propagate . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
Getting the Hang of CSS Rules and Declarations . . . . . . . . . . . . . . . . . 81
Adding Styles to a Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
Inserting inline styles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
Embedding an internal style sheet . . . . . . . . . . . . . . . . . . . . . . . . . . 84
Linking to an external style sheet . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
Styling Page Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87
Setting the type size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87
Getting comfy with CSS measurement units . . . . . . . . . . . . . . . . . . 88
Applying a font family . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89
Making text bold . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
Styling text with italics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
Styling links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
Aligning paragraph text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
Indenting a paragraph’s first line . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
Working with Colors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93
Specifying a color . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93
Coloring text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Coloring the background . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Getting to Know the Web Page Family . . . . . . . . . . . . . . . . . . . . . . . . . . 95
Using CSS Selectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96
The class selector . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
The id selector . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98
The descendant selector . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99
The child selector . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99
Revisiting the Cascade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100
CHAPTER 3: Sizing and Positioning Page Elements . . . . . . . . . . . . . 103
Learning about the CSS Box Model . . . . . . . . . . . . . . . . . . . . . . . . . . . 104
Styling Sizes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
Adding Padding . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107
Building Borders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109
Making Margins . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 110
Resetting the padding and margin . . . . . . . . . . . . . . . . . . . . . . . . . 111
Collapsing margins ahead! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111
Getting a Grip on Page Flow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113
Floating Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115
Clearing your floats . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
Collapsing containers ahead! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 117
Positioning Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
Using relative positioning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121
Giving absolute positioning a whirl . . . . . . . . . . . . . . . . . . . . . . . . . 122
Trying out fixed positioning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 125
CHAPTER 4: Creating the Page Layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
What Is Page Layout? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 128
Laying Out Page Elements with Floats . . . . . . . . . . . . . . . . . . . . . . . . . 128
Laying Out Page Elements with Inline Blocks . . . . . . . . . . . . . . . . . . . 132
Making Flexible Layouts with Flexbox . . . . . . . . . . . . . . . . . . . . . . . . . 136
Setting up the flex container . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Aligning flex items along the primary axis . . . . . . . . . . . . . . . . . . . 139
Aligning flex items along the secondary axis . . . . . . . . . . . . . . . . . 140
Centering an element horizontally and vertically . . . . . . . . . . . . . 141
Laying out a navigation bar with flexbox . . . . . . . . . . . . . . . . . . . . 143
Allowing flex items to grow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 144
Allowing flex items to shrink . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146
Laying out content columns with flexbox . . . . . . . . . . . . . . . . . . . 149
Flexbox browser support . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152
Shaping the Overall Page Layout with CSS Grid . . . . . . . . . . . . . . . . . 153
Setting up the grid container . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154
Specifying the grid rows and columns . . . . . . . . . . . . . . . . . . . . . . 154
Creating grid gaps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155
Assigning grid items to rows and columns . . . . . . . . . . . . . . . . . . 157
Aligning grid items . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160
Laying out content columns with Grid . . . . . . . . . . . . . . . . . . . . . . 161
Grid browser support . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163
Providing Fallbacks for Page Layouts . . . . . . . . . . . . . . . . . . . . . . . . . . 164
BOOK 3: CODING THE FRONT END, PART 2:
JAVASCRIPT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
CHAPTER 1: An Overview of JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . 169
JavaScript: Controlling the Machine . . . . . . . . . . . . . . . . . . . . . . . . . . . 170
What Is a Programming Language? . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
Is JavaScript Hard to Learn? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172
What Can You Do with JavaScript? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173
What Can’t You Do with JavaScript? . . . . . . . . . . . . . . . . . . . . . . . . . . . 174
What Do You Need to Get Started? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
Basic Script Construction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
The <script> tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
Handling browsers with JavaScript turned off . . . . . . . . . . . . . . . . 176
Where do you put the <script> tag? . . . . . . . . . . . . . . . . . . . . . . . . 176
Example #1: Displaying a message to the user . . . . . . . . . . . . . . . 177
Example #2: Writing text to the page . . . . . . . . . . . . . . . . . . . . . . . 179
Adding Comments to Your Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 180
Creating External JavaScript Files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181
CHAPTER 2: Understanding Variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
What Is a Variable? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Declaring a variable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184
Storing a value in a variable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
Using variables in statements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
Naming Variables: Rules and Best Practices . . . . . . . . . . . . . . . . . . . . 187
Rules for naming variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187
Ideas for good variable names . . . . . . . . . . . . . . . . . . . . . . . . . . . . 188
Understanding Literal Data Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
Working with numeric literals . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
Working with string literals . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191
Working with Boolean literals . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193
JavaScript Reserved Words . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193
JavaScript Keywords . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 194
CHAPTER 3: Building Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Understanding Expression Structure . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Building Numeric Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 199
A quick look at the arithmetic operators . . . . . . . . . . . . . . . . . . . . 199
Using the addition (+) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200
Using the increment (++) operator . . . . . . . . . . . . . . . . . . . . . . . . . 200
Using the subtraction and negation (-) operators . . . . . . . . . . . . 201
Using the decrement (–) operator . . . . . . . . . . . . . . . . . . . . . . . . . 202
Using the multiplication (*) operator . . . . . . . . . . . . . . . . . . . . . . . 202
Using the division (/) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202
Using the modulus (%) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . 204
Using the arithmetic assignment operators . . . . . . . . . . . . . . . . . 204
Building String Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205
Building Comparison Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
The comparison operators . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
Using the equal (==) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
Using the not equal (!=) operator . . . . . . . . . . . . . . . . . . . . . . . . . . 209
Using the greater than (>) operator . . . . . . . . . . . . . . . . . . . . . . . . 209
Using the less than (<) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . 209
Using the greater than or equal (>=) operator . . . . . . . . . . . . . . . 210
Using the less than or equal (<=) operator . . . . . . . . . . . . . . . . . . 210
The comparison operators and data conversion . . . . . . . . . . . . . 211
Using the identity (===) operator . . . . . . . . . . . . . . . . . . . . . . . . . . 212
Using the non-identity (!==) operator . . . . . . . . . . . . . . . . . . . . . . . 212
Using strings in comparison expressions . . . . . . . . . . . . . . . . . . . 213
Using the ternary (?:) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . 214
Building Logical Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
The logical operators . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
Using the AND (&&) operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
Using the OR (, ) operator……………………………216
Using the NOT (!) Operator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 217
Advanced notes on the && and, operators . . . . . . . . . . . . . . . . 217
Understanding Operator Precedence . . . . . . . . . . . . . . . . . . . . . . . . . 219
The order of precedence . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220
Controlling the order of precedence . . . . . . . . . . . . . . . . . . . . . . . 221
CHAPTER 4: Controlling the Flow of JavaScript . . . . . . . . . . . . . . . . . . 225
Understanding JavaScript’s Control Structures . . . . . . . . . . . . . . . . . . 226
Making True/False Decisions with if() Statements . . . . . . . . . . . . . . . 226
Branching with if(). . .else Statements . . . . . . . . . . . . . . . . . . . . . . . . . 228
Making Multiple Decisions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 229
Using the AND (??) and OR (, ) operators . . . . . . . . . . . . . . . . . . . 230
Nesting multiple if() statements . . . . . . . . . . . . . . . . . . . . . . . . . . . 230
Using the switch() statement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 231
Understanding Code Looping . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
Using while() Loops . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235
Using for() Loops . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
Using do. . .while() Loops . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 241
Controlling Loop Execution . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243
Exiting a loop using the break statement . . . . . . . . . . . . . . . . . . . 243
Bypassing loop statements using the continue statement . . . . . 245
Avoiding Infinite Loops . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 246
CHAPTER 5: Harnessing the Power of Functions . . . . . . . . . . . . . . . . 249
What Is a Function? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
The Structure of a Function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250
Where Do You Put a Function? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Calling a Function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
Calling a function when the <script> tag is parsed . . . . . . . . . . . . 252
Calling a function after the page is loaded . . . . . . . . . . . . . . . . . . 253
Calling a function in response to an event . . . . . . . . . . . . . . . . . . 254
Passing Values to Functions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255
Passing a single value to a function . . . . . . . . . . . . . . . . . . . . . . . . 256
Passing multiple values to a function . . . . . . . . . . . . . . . . . . . . . . . 257
Returning a Value from a Function . . . . . . . . . . . . . . . . . . . . . . . . . . . . 258
Understanding Local versus Global Variables . . . . . . . . . . . . . . . . . . . 259
Working with local scope . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260
Working with global scope . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261
Using Recursive Functions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262
CHAPTER 6: Working with Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 267
What Is an Object? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 267
The JavaScript Object Hierarchy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 269
Manipulating Object Properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271
Referencing a property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271
Some objects are properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 272
Changing the value of a property . . . . . . . . . . . . . . . . . . . . . . . . . . 273
Working with Object Methods . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273
Playing Around with the window Object . . . . . . . . . . . . . . . . . . . . . . . 275
Referencing the window object . . . . . . . . . . . . . . . . . . . . . . . . . . . . 275
Some window object properties you should know . . . . . . . . . . . 275
Working with JavaScript timeouts and intervals . . . . . . . . . . . . . . 276
Interacting with the user . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280
Programming the document Object . . . . . . . . . . . . . . . . . . . . . . . . . . . 284
Specifying an element . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284
Working with elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 287
CHAPTER 7: Working with Arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291
What Is an Array? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291
Declaring an Array . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293
Populating an Array with Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294
Declaring and populating an array at the same time . . . . . . . . . . 295
Using a loop to populate an array………………………296
Using a loop to work with array data . . . . . . . . . . . . . . . . . . . . . . . 297
Creating Multidimensional Arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299
Using the Array Object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 300
The length property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 300
Concatenating to create a new array: concat() . . . . . . . . . . . . . . . 301
Creating a string from an array’s elements: join()…………..302
Removing an array’s last element: pop() . . . . . . . . . . . . . . . . . . . . 303
Adding elements to the end of an array: push() . . . . . . . . . . . . . . 303
Reversing the order of an array’s elements: reverse() . . . . . . . . . 304
Removing an array’s first element: shift() . . . . . . . . . . . . . . . . . . . 305
Returning a subset of an array: slice() . . . . . . . . . . . . . . . . . . . . . . 305
Ordering array elements: sort() . . . . . . . . . . . . . . . . . . . . . . . . . . . . 306
Removing, replacing, and inserting elements: splice() . . . . . . . . . 308
Inserting elements at the beginning of an array: unshift() . . . . . 310
CHAPTER 8: Manipulating Strings, Dates, and Numbers . . . . . . 311
Manipulating Text with the String Object . . . . . . . . . . . . . . . . . . . . . . 311
Determining the length of a string . . . . . . . . . . . . . . . . . . . . . . . . . 312
Finding substrings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 313
Methods that extract substrings . . . . . . . . . . . . . . . . . . . . . . . . . . . 315
Dealing with Dates and Times . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 323
Arguments used with the Date object . . . . . . . . . . . . . . . . . . . . . . 324
Working with the Date object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 324
Extracting information about a date…………………….325
Setting the date . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330
Performing date calculations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 332
Working with Numbers: The Math Object . . . . . . . . . . . . . . . . . . . . . . 335
Converting between strings and numbers . . . . . . . . . . . . . . . . . . 336
The Math object’s properties and methods……………….338
CHAPTER 9: Debugging Your Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 341
Understanding JavaScript’s Error Types . . . . . . . . . . . . . . . . . . . . . . . . 342
Syntax errors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 342
Runtime errors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 342
Logic errors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 343
Getting to Know Your Debugging Tools . . . . . . . . . . . . . . . . . . . . . . . . 344
Debugging with the Console . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 345
Displaying the console in various browsers . . . . . . . . . . . . . . . . . 346
Logging data to the Console . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 346
Executing code in the Console . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 347
Pausing Your Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 348
Entering break mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 348
Exiting break mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 350
Stepping through Your Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 350
Stepping into some code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 351
Stepping over some code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 351
Stepping out of some code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 352
Monitoring Script Values . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 352
Viewing a single variable value . . . . . . . . . . . . . . . . . . . . . . . . . . . . 352
Viewing all variable values . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 353
Adding a watch expression . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 354
More Debugging Strategies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 355
Top Ten Most Common JavaScript Errors . . . . . . . . . . . . . . . . . . . . . . 356
Top Ten Most Common JavaScript Error Messages . . . . . . . . . . . . . . 359
BOOK 4: CODING THE FRONT END, PART 3: jQUERY . . . . 363
CHAPTER 1: Developing Pages Faster with jQuery . . . . . . . . . . . . . . 365
Getting Started with jQuery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 366
How to include jQuery in your web page . . . . . . . . . . . . . . . . . . . . 366
Understanding the $ function . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 368
Where to put jQuery code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 368
Selecting Elements with jQuery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 369
Using the basic selectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 370
Working with jQuery sets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 371
Manipulating Page Elements with jQuery . . . . . . . . . . . . . . . . . . . . . . 373
Adding an element . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374
Replacing an element’s HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 375
Replacing an element’s text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 376
Removing an element . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377
Modifying CSS with jQuery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377
Working with CSS properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 378
Manipulating classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 382
Tweaking HTML Attributes with jQuery . . . . . . . . . . . . . . . . . . . . . . . . 385
Reading an attribute value . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 385
Setting an attribute value . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 385
Removing an attribute . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 386
CHAPTER 2: Livening Up Your Page with Events
and Animation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 387
Building Reactive Pages with Events . . . . . . . . . . . . . . . . . . . . . . . . . . . 388
What’s an event? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 388
Understanding the event types . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
Setting up an event handler . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 390
Using jQuery’s shortcut event handlers . . . . . . . . . . . . . . . . . . . . . 391
Getting data about the event . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 393
Preventing the default event action . . . . . . . . . . . . . . . . . . . . . . . . 394
Getting your head around event delegation . . . . . . . . . . . . . . . . . 396
Turning off an event handler . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 398
Building Lively Pages with Animation . . . . . . . . . . . . . . . . . . . . . . . . . . 398
Hiding and showing elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 399
Fading elements out and in . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 400
Sliding elements……………………………………401
Controlling the animation duration and pace . . . . . . . . . . . . . . . . 402
Example: Creating a web page accordion . . . . . . . . . . . . . . . . . . . 403
Animating CSS properties…………………………….406
Running code when an animation ends………………….408
CHAPTER 3: Getting to Know jQuery UI . . . . . . . . . . . . . . . . . . . . . . . . . . . 411
What’s the Deal with jQuery UI? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 412
Getting Started with jQuery UI . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 413
Working with the jQuery UI Widgets . . . . . . . . . . . . . . . . . . . . . . . . . . . 415
Dividing content into tabs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 415
Creating a navigation menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 418
Displaying a message in a dialog……………………….420
Hiding and showing content with an accordion . . . . . . . . . . . . . . 422
Introducing jQuery UI Effects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 424
Applying an effect . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 424
Checking out the effects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 426
Taking a Look at jQuery UI Interactions . . . . . . . . . . . . . . . . . . . . . . . . 428
Applying an interaction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 428
Trying out the interactions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 429
BOOK 5: CODING THE BACK END:
PHP AND MYSQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 433
CHAPTER 1: Learning PHP Coding Basics . . . . . . . . . . . . . . . . . . . . . . . . . 435
Understanding How PHP Scripts Work . . . . . . . . . . . . . . . . . . . . . . . . 436
Learning the Basic Syntax of PHP Scripts . . . . . . . . . . . . . . . . . . . . . . 436
Declaring PHP Variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 438
Building PHP Expressions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 438
Outputting Text and Tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 439
Adding line breaks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 440
Mixing and escaping quotation marks . . . . . . . . . . . . . . . . . . . . . . 441
Outputting variables in strings . . . . . . . . . . . . . . . . . . . . . . . . . . . . 442
Outputting long strings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 443
Outputting really long strings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 444
Working with PHP Arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 445
Declaring arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 445
Giving associative arrays a look . . . . . . . . . . . . . . . . . . . . . . . . . . . . 446
Outputting array values . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 447
Sorting arrays . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 448
Looping through array values . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 450
Creating multidimensional arrays . . . . . . . . . . . . . . . . . . . . . . . . . . 450
Controlling the Flow of Your PHP Code . . . . . . . . . . . . . . . . . . . . . . . . 451
Making decisions with if() . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 452
Making decisions with switch() . . . . . . . . . . . . . . . . . . . . . . . . . . . . 453
Looping with while() . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 454
Looping with for() . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 455
Looping with do. . .while()…………………………….456
Working with PHP Functions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 456
Passing values to functions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 457
Returning a value from a function . . . . . . . . . . . . . . . . . . . . . . . . . 458
Working with PHP Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 458
Rolling your own objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 458
Creating an object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 461
Working with object properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . 461
Working with object methods . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 462
Debugging PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 463
Configuring php.ini for debugging . . . . . . . . . . . . . . . . . . . . . . . . . 463
Accessing the PHP error log . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 464
Debugging with echo statements . . . . . . . . . . . . . . . . . . . . . . . . . . 465
Debugging with var_dump() statements . . . . . . . . . . . . . . . . . . . . 466
CHAPTER 2: Building and Querying MySQL Databases . . . . . . . . . 467
What Is MySQL? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 468
Tables: Containers for your data . . . . . . . . . . . . . . . . . . . . . . . . . . . 468
Queries: Asking questions of your data . . . . . . . . . . . . . . . . . . . . . 469
Introducing phpMyAdmin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 470
Importing data into MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 471
Backing up MySQL data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 473
Creating a MySQL Database and Its Tables . . . . . . . . . . . . . . . . . . . . . 473
Creating a MySQL database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 473
Designing your table . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 474
Creating a MySQL table . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477
Adding data to a table . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 479
Creating a primary key . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 479
Querying MySQL Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 480
What Is SQL? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 480
Creating a SELECT query . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 481
Understanding query criteria . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 482
Querying multiple tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 485
Adding table data with an INSERT query . . . . . . . . . . . . . . . . . . . . 490
Modifying table data with an UPDATE query………………491
Removing table data with a DELETE query . . . . . . . . . . . . . . . . . . 492
CHAPTER 3: Using PHP to Access MySQL Data . . . . . . . . . . . . . . . . . . . 493
Understanding the Role of PHP and MySQL in Your Web App . . . . . 494
Using PHP to Access MySQL Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 495
Parsing the query string . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 495
Connecting to the MySQL database . . . . . . . . . . . . . . . . . . . . . . . . 497
Creating and running the SELECT query . . . . . . . . . . . . . . . . . . . . 499
Storing the query results in an array . . . . . . . . . . . . . . . . . . . . . . . 500
Looping through the query results . . . . . . . . . . . . . . . . . . . . . . . . . 501
Incorporating query string values in the query . . . . . . . . . . . . . . . 501
Creating and Running Insert, Update, and Delete Queries . . . . . . . . 504
Separating Your MySQL Login Credentials . . . . . . . . . . . . . . . . . . . . . 505
BOOK 6: CODING DYNAMIC WEB PAGES . . . . . . . . . . . . . . . . . . 507
CHAPTER 1: Melding PHP and JavaScript with
Ajax and JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 509
What Is Ajax? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 510
Making Ajax Calls with jQuery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 511
Learning more about GET and POST requests . . . . . . . . . . . . . . . 511
Handling POST requests in PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . 513
Using .load() to update an element with server data . . . . . . . . . . 514
Using .get() or .post() to communicate with the server . . . . . . . . 523
Introducing JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 526
Learning the JSON syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 526
Declaring and using JSON variables . . . . . . . . . . . . . . . . . . . . . . . . 527
Returning Ajax Data as JSON Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 528
Converting server data to the JSON format . . . . . . . . . . . . . . . . . . 528
Handling JSON data returned by the server . . . . . . . . . . . . . . . . . 530
CHAPTER 2: Building and Processing Web Forms . . . . . . . . . . . . . . . 533
What Is a Web Form? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 534
Understanding How Web Forms Work . . . . . . . . . . . . . . . . . . . . . . . . . 535
Building an HTML5 Web Form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 536
Setting up the form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 536
Adding a form button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 537
Working with text fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 538
Coding checkboxes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 543
Working with radio buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 548
Adding selection lists . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 551
Programming pickers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 555
Handling and Triggering Form Events . . . . . . . . . . . . . . . . . . . . . . . . . 557
Setting the focus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 558
Monitoring the focus event . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 559
Blurring an element . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 559
Monitoring the blur event . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 560
Listening for element changes . . . . . . . . . . . . . . . . . . . . . . . . . . . . 560
Submitting the Form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 561
Triggering the submit event . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 562
Preventing the default form submission . . . . . . . . . . . . . . . . . . . . 562
Preparing the data for submission . . . . . . . . . . . . . . . . . . . . . . . . . 563
Submitting the form data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 563
CHAPTER 3: Validating Form Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 565
Validating Form Data in the Browser . . . . . . . . . . . . . . . . . . . . . . . . . . 566
Making a form field mandatory . . . . . . . . . . . . . . . . . . . . . . . . . . . . 566
Restricting the length of a text field . . . . . . . . . . . . . . . . . . . . . . . . 567
Setting maximum and minimum values on a numeric field . . . . 568
Validating email fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 569
Making field values conform to a pattern . . . . . . . . . . . . . . . . . . . 570
Styling invalid fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571
Validating Form Data on the Server . . . . . . . . . . . . . . . . . . . . . . . . . . . 574
Checking for required fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 575
Validating text data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 578
Validating a field based on the data type . . . . . . . . . . . . . . . . . . . . 580
Validating against a pattern . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 582
Regular Expressions Reference . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 582
BOOK 7: CODING WEB APPS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 591
CHAPTER 1: Planning a Web App . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 593
What Is a Web App? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 594
Planning Your Web App: The Basics . . . . . . . . . . . . . . . . . . . . . . . . . . . 595
What is my app’s functionality? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 595
What are my app’s data requirements? . . . . . . . . . . . . . . . . . . . . . 596
How will my app work? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 597
How many pages will my app require?…………………..597
What will my app’s pages look like? . . . . . . . . . . . . . . . . . . . . . . . . 598
Planning Your Web App: Responsiveness . . . . . . . . . . . . . . . . . . . . . . 599
Planning Your Web App: Accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . 605
Planning Your Web App: Security . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 608
Understanding the dangers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 609
Defending your web app . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 612
CHAPTER 2: Laying the Foundation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 619
Setting Up the Directory Structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . 620
Setting up the public subdirectory . . . . . . . . . . . . . . . . . . . . . . . . . 621
Setting up the private subdirectory . . . . . . . . . . . . . . . . . . . . . . . . 623
Creating the Database and Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . 624
Getting Some Back-End Code Ready . . . . . . . . . . . . . . . . . . . . . . . . . . 626
Defining PHP constants . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 626
Understanding PHP sessions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 627
Securing a PHP session . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 628
Including code from another PHP file . . . . . . . . . . . . . . . . . . . . . . 629
Creating the App Startup Files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 630
Creating the back-end initialization file . . . . . . . . . . . . . . . . . . . . . 631
Creating the front-end common files . . . . . . . . . . . . . . . . . . . . . . . 633
Building the app home page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 635
CHAPTER 3: Managing Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 637
Handling Data the CRUD Way . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 638
Starting the web app’s data class . . . . . . . . . . . . . . . . . . . . . . . . . . 639
Creating a data handler script . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 640
Creating New Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 643
Building the form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 643
Sending the form data to the server . . . . . . . . . . . . . . . . . . . . . . . 648
Adding the data item………………………………..649
Reading and Displaying Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 652
Getting the home page ready for data . . . . . . . . . . . . . . . . . . . . . . 652
Making an Ajax request for the data . . . . . . . . . . . . . . . . . . . . . . . 654
Reading the data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 655
Displaying the data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 656
Filtering the data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 657
Updating and Editing Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 661
Deleting Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 668
CHAPTER 4: Managing App Users . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 673
Configuring the Home Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 674
Setting Up the Back End to Handle Users . . . . . . . . . . . . . . . . . . . . . . 677
Starting the web app’s user class . . . . . . . . . . . . . . . . . . . . . . . . . . 678
Creating a user handler script . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 679
Signing Up a New User . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 682
Building the form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 683
Sending the data to the server . . . . . . . . . . . . . . . . . . . . . . . . . . . . 685
Sending a verification email . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 688
Adding the user to the database . . . . . . . . . . . . . . . . . . . . . . . . . . . 689
Verifying the user . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 690
Signing a User In and Out……………………………….696
Checking for a signed-in user . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 696
Adding the form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 697
Checking the user’s credentials . . . . . . . . . . . . . . . . . . . . . . . . . . . . 700
Signing out a user . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 704
Resetting a Forgotten Password . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 704
Deleting a User . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 714
BOOK 8: CODING MOBILE WEB APPS . . . . . . . . . . . . . . . . . . . . . . 721
CHAPTER 1: Exploring Mobile-First Web Development………. 723
What Is Mobile-First Web Development? . . . . . . . . . . . . . . . . . . . . . . . 724
Learning the Principles of Mobile-First Development . . . . . . . . . . . . 725
Mobile first means content first . . . . . . . . . . . . . . . . . . . . . . . . . . . 725
Pick a testing width that makes sense for your site . . . . . . . . . . . 726
Get your content to scale with the device . . . . . . . . . . . . . . . . . . . 726
Build your CSS the mobile-first way . . . . . . . . . . . . . . . . . . . . . . . . 727
Pick a “non-mobile” breakpoint that makes sense
for your content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 727
Going Mobile Faster with jQuery Mobile . . . . . . . . . . . . . . . . . . . . . . . 729
What is jQuery Mobile? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 729
Adding jQuery Mobile to your web app . . . . . . . . . . . . . . . . . . . . . 730
Working with Images in a Mobile App . . . . . . . . . . . . . . . . . . . . . . . . . 731
Making images responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 731
Delivering images responsively . . . . . . . . . . . . . . . . . . . . . . . . . . . . 732
Storing User Data in the Browser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 734
Understanding web storage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 735
Adding data to storage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 735
Getting data from web storage . . . . . . . . . . . . . . . . . . . . . . . . . . . . 736
Removing data from web storage . . . . . . . . . . . . . . . . . . . . . . . . . . 737
CHAPTER 2: Building a Mobile Web App . . . . . . . . . . . . . . . . . . . . . . . . . . 739
Building the Button Builder App . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 740
Getting Some Help from the Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 741
Building the App: HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 741
Setting up the home page skeleton . . . . . . . . . . . . . . . . . . . . . . . . 741
Configuring the header . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 744
Creating the app menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 745
Adding the app’s controls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 745
Building the App: CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 754
Building the App: JavaScript and jQuery . . . . . . . . . . . . . . . . . . . . . . . 757
Setting up the app data structures . . . . . . . . . . . . . . . . . . . . . . . . . 757
Setting the app’s control values . . . . . . . . . . . . . . . . . . . . . . . . . . . 758
Getting the app’s control values . . . . . . . . . . . . . . . . . . . . . . . . . . . 761
Writing the custom CSS code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 763
Running the code…………………………………..765
Saving the custom CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 765
Copying the custom CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 766
Resetting the CSS to the default . . . . . . . . . . . . . . . . . . . . . . . . . . . 767
INDEX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 769

Отзывы

Отзывов пока нет.

Будьте первым, кто оставил отзыв на “Web Coding & Development All-in-One for Dummies”

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Похожие книги

Домашняя страница
Э-Книги
0
Cart
Моя страница