28,99 €
Mehr erfahren.
- Herausgeber: John Wiley & Sons
- Kategorie: Wissenschaft und neue Technologien
- Sprache: Englisch
- Veröffentlichungsjahr: 2023
Learn the in-demand skills that let you turn lines of code into websites and apps Web Coding & Development All-in-One For Dummies is a one-stop resource for would-be developers who need guidance on the languages and steps used to build websites and applications. Learn the coding ropes and expand your existing skillset with this easy-to-understand guide. In these complete mini-books, you'll walk through the basics of web development, structuring a page, building and processing web forms, and beyond. Learn how to build a website or create your very own app with the advice of web coding and development experts. This edition expands JavaScript and CSS coverage while providing new content on server-side coding and the development stack. * Get essential knowledge of how web development works--even if you've never written a line of code in your life * Learn HTML, CSS, JavaScript, and other languages essential for building websites and apps * Discover how to make optimize your sites and apps for mobile devices * Expand on what you already know and improve your employability This Dummies All-in-One is great for you if want to develop coding skills but don't have a programming background. It's also perfect for professionals looking to brush up on their web development skills and get up to date on the latest trends and standards.
Sie lesen das E-Book in den Legimi-Apps auf:
Seitenzahl: 1069
Ähnliche
Web Coding & Development All-in-One For Dummies®
To view this book's Cheat Sheet, simply go to www.dummies.com and search for “Web Coding and Development All-in-One For Dummies Cheat Sheet” in the Search box.
Table of Contents
Cover
Title Page
Copyright
Introduction
About This Book
Foolish Assumptions
Icons Used in This Book
Beyond the Book
Book 1: Getting Ready to Code for the Web
Chapter 1: How Web Coding and Development Work
The Nuts and Bolts of Web Coding and Development
Understanding the Front End: HTML and CSS
Understanding the Back End: PHP and MySQL
How It All Fits Together: JavaScript
How Dynamic Web Pages Work
What Is a Web App?
Understanding the Difference between Web Coding and Web Development
Chapter 2: Setting Up Your Web Development Home
What Is a Local Web Development Environment?
Do You Need a Local Web Development Environment?
Setting Up the XAMPP for Windows Development Environment
Setting Up the XAMPP for OS X Development Environment
Choosing Your Text Editor
Chapter 3: Finding and Setting Up a Web Host
Understanding Web Hosting Providers
A Buyer’s Guide to Web Hosting
Finding a Web Host
Finding Your Way around Your New Web Home
Book 2: Coding the Front End, Part 1: HTML and CSS
Chapter 1: Structuring the Page with HTML
Getting the Hang of HTML
Understanding Tag Attributes
Learning the Fundamental Structure of a Web Page
Some Notes on Structure versus Style
Applying the Basic Text Tags
Creating Links
Building Bulleted and Numbered Lists
Inserting Special Characters
Inserting Images
Carving Up the Page
Commenting Your HTML Code
Chapter 2: Styling the Page with CSS
Figuring Out Cascading Style Sheets
Getting the Hang of CSS Rules and Declarations
Adding Styles to a Page
Styling Page Text
Working with Colors
Getting to Know the Web Page Family
Using CSS Selectors
Revisiting the Cascade
Chapter 3: Sizing and Positioning Page Elements
Learning about the CSS Box Model
Styling Sizes
Adding Padding
Building Borders
Making Margins
Getting a Grip on Page Flow
Floating Elements
Positioning Elements
Chapter 4: Creating the Page Layout
What Is Page Layout?
Making Flexible Layouts with Flexbox
Shaping the Overall Page Layout with CSS Grid
Book 3: Coding the Front End, Part 2: JavaScript
Chapter 1: An Overview of JavaScript
JavaScript: Controlling the Machine
What Is a Programming Language?
Is JavaScript Hard to Learn?
What You Can Do with JavaScript
What You Can’t Do with JavaScript
What You Need to Get Started
Basic Script Construction
A Quick Introduction to the Console
Dealing with a Couple of Exceptional Cases
Adding Comments to Your Code
Creating External JavaScript Files
Chapter 2: Understanding Variables
Understanding Variables
Naming Variables: Rules and Best Practices
Understanding Literal Data Types
JavaScript Reserved Words
JavaScript Keywords
Chapter 3: Building Expressions
Understanding Expression Structure
Building Numeric Expressions
Building String Expressions
Building Comparison Expressions
Building Logical Expressions
Understanding Operator Precedence
Chapter 4: Controlling the Flow of JavaScript
Making True/False Decisions with if Statements
Branching with if…else Statements
Making Multiple Decisions
Understanding Code Looping
Using while Loops
Using for Loops
Using do…while Loops
Controlling Loop Execution
Avoiding Infinite Loops
Chapter 5: Harnessing the Power of Functions
What Is a Function?
The Structure of a Function
Where Do You Put a Function?
Calling a Function
Passing Values to Functions
Returning a Value from a Function
Getting Your Head around Anonymous Functions
Moving to Arrow Functions
Running Functions in the Future
Understanding Variable Scope
Using Recursive Functions
Chapter 6: Playing with the Document Object Model
Working with Objects
Getting to Know the Document Object Model
Specifying Elements
Traversing the DOM
Manipulating Elements
Modifying CSS with JavaScript
Tweaking HTML Attributes with JavaScript
Chapter 7: Building Reactive Pages with Events
What’s an Event?
Understanding the Event Types
Listening for an Event
Getting Data about the Event
Preventing the Default Event Action
Example: The DOMContentLoaded Event
Example: The dblclick Event
Chapter 8: Working with Arrays
What Is an Array?
Declaring an Array
Populating an Array with Data
How Do I Iterate Thee? Let Me Count the Ways
Creating Multidimensional Arrays
Manipulating Arrays
Chapter 9: Manipulating Strings, Dates, and Numbers
Manipulating Text with the String Object
Dealing with Dates and Times
Working with Numbers: The Math Object
Chapter 10: Storing User Data in the Browser
Understanding Web Storage
Introducing JSON
Adding Data to Web Storage
Getting Data from Web Storage
Removing Data from Web Storage
Chapter 11: More JavaScript Goodies
Expanding Arrays and Objects with the Spread Operator
Condensing Arrays with the Rest Parameter
Exporting and Importing Code
Book 4: Coding the Back End: PHP and MySQL
Chapter 1: Learning PHP Coding Basics
Understanding How PHP Scripts Work
Outputting Text and Tags
Working with PHP Arrays
Controlling the Flow of Your PHP Code
Working with PHP Functions
Working with PHP Objects
Chapter 2: Building and Querying MySQL Databases
What Is MySQL?
Introducing phpMyAdmin
Creating a MySQL Database and Its Tables
Querying MySQL Data
Chapter 3: Using PHP to Access MySQL Data
Understanding the Role of PHP and MySQL in Your Web App
Using PHP to Access MySQL Data
Creating and Running Insert, Update, and Delete Queries
Separating Your MySQL Login Credentials
Book 5: Debugging Your Code
Chapter 1: Debugging CSS Code
Displaying the Web Development Tools
Inspecting an Element
Editing a Property Value
Disabling a Declaration
Adding an Inline Declaration to an Element
Adding an Element Declaration to the Inspector Stylesheet
Adding a Class to an Element
Simulating a Pseudo-Class State
Chapter 2: Debugging JavaScript Code
Understanding JavaScript’s Error Types
Getting to Know Your Debugging Tools
Debugging with the Console Window
Pausing Your Code
Stepping Through Your Code
Monitoring Script Values
More Debugging Strategies
The 10 Most Common JavaScript Errors
The 10 Most Common JavaScript Error Messages
Chapter 3: Debugging PHP Code
Configuring php.ini for Debugging
Accessing the PHP Error Log
Outputting Variable Values
Book 6: Coding Dynamic and Static Web Pages
Chapter 1: Fetching Data with PHP, JavaScript, and JSON
Getting Your Head Around Asynchronous Operations
Getting Remote Data Asynchronously with the Fetch API
Returning Fetch API Data as JSON Text
Chapter 2: Building and Processing Web Forms
What Is a Web Form?
Understanding How Web Forms Work
Building an HTML Web Form
Looking at the HTMLFormElement Object
Taking a Peek at the HTMLInputElement Object
Programming Text Fields
Coding Check Boxes
Dealing with Radio Buttons
Programming Selection Lists
Handling and Triggering Form Events
Creating Keyboard Shortcuts for Form Controls
Submitting the Form
Chapter 3: Validating Form Data
Validating Form Data in the Browser
Validating Form Data on the Server
Regular Expressions Reference
Chapter 4: Coding Static Web Pages
Static? Dynamic? What Am I Even Talking About?
Building Your Own Static Site Generator
Using GitHub to Store Your Static Site Files
Forging Your HTML Template File
Using PHP to Generate the Static Pages
Deploying Your Static Website
Book 7: Building Web Apps
Chapter 1 Planning a Web App
What Is a Web App?
Planning Your Web App: The Basics
Chapter 2: Making a Web App Responsive
Defining a Responsive Layout
Going with the Flow: Fluid Layouts
Querying Your Way to Responsiveness: Adaptive Layouts
Working with Images Responsively
Exploring the Principles of Mobile-First Development
Chapter 3: Making a Web App Accessible
Why You Need to Make Your Apps Accessible
Understanding Web Accessibility
Making Your App Structure Accessible
Making Text Accessible
Making Media Accessible
Buffing Up Your App Accessibility Semantics
Making Your Apps Keyboard-Friendly
Ensuring Sufficient Color Contrast
Validating the Accessibility of an App
Chapter 4: Securing a Web App
Web App Security: Nutshell Version
Understanding the Dangers
Sanitizing Incoming Data
Escaping Outgoing Data
Securing File Uploads
Securing Passwords
Setting Up a Secure Directory Structure
Understanding PHP Sessions
Creating a Back-End Initialization File
Index
About the Author
Advertisement Page
Connect with Dummies
End User License Agreement
List of Tables
Book 2 Chapter 2
TABLE 2-1 Some Common CSS Text Properties
TABLE 2-2 Some CSS Measurement Units
TABLE 2-3 Some Common Pseudo-Classes
TABLE 2-4 Some Common Pseudo-Elements
TABLE 2-5 Declaration Type/Origin Type Weight Hierarchy
Book 2 Chapter 3
TABLE 3-1 The
padding
Shorthand Property
TABLE 3-2 The
margin
Shorthand Property
Book 3 Chapter 2
TABLE 2-1 Common JavaScript Escape Sequences
TABLE 2-2 JavaScript’s Reserved Words
TABLE 2-3 JavaScript and HTML Keywords
Book 3 Chapter 3
TABLE 3-1 JavaScript Arithmetic Operators
TABLE 3-2 JavaScript Arithmetic Assignment Operators
TABLE 3-3 JavaScript Comparison Operators
TABLE 3-4 JavaScript Logical Operators
TABLE 3-5 Truth Table for the AND (&&) Operator
TABLE 3-6 Truth Table for the OR (||) Operator
TABLE 3-7 Truth Table for the NOT (!) Operator
TABLE 3-8 JavaScript Order of Precedence for Operators
Book 3 Chapter 6
TABLE 6-1 Useful Properties of the
document
Object
Book 3 Chapter 9
TABLE 9-1 String Object Methods for Searching for Substrings
TABLE 9-2 String Object Methods for Extracting Substrings
TABLE 9-3 Arguments Associated with the Date Object
TABLE 9-4 Date Object Methods That Extract Date Values
TABLE 9-5 Date Object Methods That Set Date Values
TABLE 9-6 The Properties of the Math Object
TABLE 9-7 Some Methods of the Math Object
Book 4 Chapter 2
TABLE 2-1 Comparison Operators for Criteria Expressions
TABLE 2-2 The LIKE Operator for Criteria Expressions
TABLE 2-3 Logical Operators for Criteria Expressions
Book 6 Chapter 3
TABLE 3-1 The Most Useful Regular Expression Symbols
Book 7 Chapter 2
TABLE 2-1 CSS Viewport Measurement Units
TABLE 2-2 New CSS Viewport Measurement Units
TABLE 2-3 CSS Container Query Measurement Units
Book 7 Chapter 3
TABLE 3-1 Landmark ARIA Roles
TABLE 3-2 Section Structure Roles without HTML Equivalents
TABLE 3-3 Section Structure Roles with HTML Equivalents
TABLE 3-4 Widget Roles without HTML Equivalents
TABLE 3-5 Widget Roles with HTML Equivalents
Guide
Cover
Table of Contents
Title Page
Copyright
Begin Reading
Index
About the Author
Pages
i
ii
1
2
3
4
5
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
Web Coding & Development All-in-One For Dummies®, 2nd Edition
Published by: John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030-5774, www.wiley.com
Copyright © 2024 by John Wiley & Sons, Inc., Hoboken, New Jersey
Media and software compilation copyright © 2024 by John Wiley & Sons, Inc. All rights reserved.
Published simultaneously in Canada
No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as permitted under Sections 107 or 108 of the 1976 United States Copyright Act, without the prior written permission of the Publisher. Requests to the Publisher for permission should be addressed to the Permissions Department, John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201) 748-6008, or online at http://www.wiley.com/go/permissions.
Trademarks: Wiley, For Dummies, the Dummies Man logo, Dummies.com, Making Everything Easier, and related trade dress are trademarks or registered trademarks of John Wiley & Sons, Inc. and may not be used without written permission. All other trademarks are the property of their respective owners. John Wiley & Sons, Inc. is not associated with any product or vendor mentioned in this book.
LIMIT OF LIABILITY/DISCLAIMER OF WARRANTY: WHILE THE PUBLISHER AND AUTHORS HAVE USED THEIR BEST EFFORTS IN PREPARING THIS WORK, THEY MAKE NO REPRESENTATIONS OR WARRANTIES WITH RESPECT TO THE ACCURACY OR COMPLETENESS OF THE CONTENTS OF THIS WORK AND SPECIFICALLY DISCLAIM ALL WARRANTIES, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. NO WARRANTY MAY BE CREATED OR EXTENDED BY SALES REPRESENTATIVES, WRITTEN SALES MATERIALS OR PROMOTIONAL STATEMENTS FOR THIS WORK. THE FACT THAT AN ORGANIZATION, WEBSITE, OR PRODUCT IS REFERRED TO IN THIS WORK AS A CITATION AND/OR POTENTIAL SOURCE OF FURTHER INFORMATION DOES NOT MEAN THAT THE PUBLISHER AND AUTHORS ENDORSE THE INFORMATION OR SERVICES THE ORGANIZATION, WEBSITE, OR PRODUCT MAY PROVIDE OR RECOMMENDATIONS IT MAY MAKE. THIS WORK IS SOLD WITH THE UNDERSTANDING THAT THE PUBLISHER IS NOT ENGAGED IN RENDERING PROFESSIONAL SERVICES. THE ADVICE AND STRATEGIES CONTAINED HEREIN MAY NOT BE SUITABLE FOR YOUR SITUATION. YOU SHOULD CONSULT WITH A SPECIALIST WHERE APPROPRIATE. FURTHER, READERS SHOULD BE AWARE THAT WEBSITES LISTED IN THIS WORK MAY HAVE CHANGED OR DISAPPEARED BETWEEN WHEN THIS WORK WAS WRITTEN AND WHEN IT IS READ. NEITHER THE PUBLISHER NOR AUTHORS SHALL BE LIABLE FOR ANY LOSS OF PROFIT OR ANY OTHER COMMERCIAL DAMAGES, INCLUDING BUT NOT LIMITED TO SPECIAL, INCIDENTAL, CONSEQUENTIAL, OR OTHER DAMAGES.
For general information on our other products and services, please contact our Customer Care Department within the U.S. at 877-762-2974, outside the U.S. at 317-572-3993, or fax 317-572-4002. For technical support, please visit https://hub.wiley.com/community/support/dummies.
Wiley publishes in a variety of print and electronic formats and by print-on-demand. Some material included with standard print versions of this book may not be included in e-books or in print-on-demand. If this book refers to media such as a CD or DVD that is not included in the version you purchased, you may download this material at http://booksupport.wiley.com. For more information about Wiley products, visit www.wiley.com.
Library of Congress Control Number: 2023951076
ISBN 978-1-394-19702-6 (pbk); ISBN 978-1-394-19704-0 (ebk); ISBN 978-1-394-19703-3 (ebk)
Introduction
When the web first came to the attention of the world’s non-geeks back in the mid-1990s, the vastness and variety of its treasures were a wonder to behold. However, it didn’t take long before a few courageous and intrepid souls dug a little deeper into this phenomenon and discovered something truly phenomenal: They could make web pages, too!
Why was that so amazing? Well, think back to (or, if you’re not old enough, imagine) those old days and consider, in particular, what it meant to create what we now call content. Consider television shows, radio programs, magazines, newspapers, books, and the other media of the time. The one thing they all had in common was that their creation was a decidedly uncommon thing. It required a team of professionals, a massive distribution system, and a lot of money. In short, it wasn’t something that your average Okie from Muskogee would have any hope of duplicating.
The web appeared to change all that because learning HTML was within the grasp of all of us who could feed ourselves, it had a built-in massive distribution system (the internet, natch), and it required little or no money. For the first time in history, content was democratized and was no longer defined as the sole province of governments and mega-corporations.
Then reality set in.
People soon realized that merely building a website wasn’t enough to attract “eyeballs,” as the marketers say. A site had to have interesting, useful, or fun content, or people would stay away in droves. Not only that, but this good content had to be combined with a solid site design, which meant that web designers needed a thorough knowledge of HTML and CSS.
But, alas, eventually even all that was not enough. To make their websites dynamic and interesting, to make their sites easy to navigate, and to give their sites those extra bells and whistles that surfers had come to expect, people needed something more than content, HTML, and CSS.
That missing link was code.
What we’ve all learned the hard way over the past few years is that you simply can’t put together a world-class website unless you have some coding prowess in your site design toolkit. You need to know how to program your way out of the basic problems that afflict most sites; how to use scripting to go beyond the inherent limitations of HTML and CSS; and how to use code to send and receive data from a web server. And it isn’t enough just to copy the generic scripts available on the web and paste them into your pages. Most of those scripts are poorly written, and they invariably need some customization to work properly on your site.
About This Book
In this book, I give you a complete education on web coding and development. You learn how to set up the tools you need, how to use HTML and CSS to design and build your site, how to use JavaScript to program your pages, and how to use PHP and MySQL to program your web server. I show you that these technologies aren’t hard to learn, and that even the greenest rookie programmers can learn how to put together web pages that will amaze their family and friends (and themselves).
If you’re looking for lots of programming history, computer science theory, and long-winded explanations of concepts, you won’t find them here. My philosophy throughout this book comes from Linus Torvalds, the creator of the Linux operating system: “Talk is cheap. Show me the code.” I explain what needs to be explained and then I move on without further ado (or, most of the time, without any ado at all) to examples and scripts that do more to illuminate a concept that any verbose explanations I could muster (and believe me, I can muster verbosity with the best of them).
How you approach this book depends on your current level of web coding expertise (or lack thereof):
If you’re just starting out, begin at the beginning with
Book 1
and work at your own pace sequentially through to
Books 2
and
3
. This approach will give you all the knowledge you need to pick and choose what you want to learn throughout the rest of the book.
If you know HTML and CSS, you can probably get away with taking a fast look at
Book 2
and then settling in with
Book 3
and beyond.
If you’ve done some JavaScript coding, I suggest working quickly through the material in
Book 3
, and then digging into the first two chapters of
Book 5
to bring your debugging skills up to snuff. You’ll then be ready to branch out and explore the rest of the book as you see fit.
If you’re a relatively experienced JavaScript programmer, use
Books 3
and
5
as a refresher, and then tackle
Book 4
to learn how to code the back end. I have a few tricks in there that you might find interesting. After that, feel free to consider the rest of the book as a kind of coding smorgasbord that you can sample as your web development taste buds dictate.
As I began updating this edition of the book, the world was awash in posts and talk and endless speculation about artificial intelligence, to the point where it seemed we’d soon be welcoming our new AI overlords. That’s not likely to happen anytime soon, but AI is here to stay and has already established itself as a significant part of many people’s workaday routines.
I’ve been as enamored of ChatGPT and its ilk as the biggest AI boosters. I use AI for entertainment and curiosity, but I don’t use it for work. That is to say, not one word of the text, code, or examples used in this book has been generated by AI. Everything you read here is, for good or ill, the product of my warped-from-birth brain.
Foolish Assumptions
This book is not a primer on the internet or using the World Wide Web. It's a coding and development book, pure and simple, where I assume the following:
You know how to operate a basic text editor and how to get around the operating system and file system on your computer.
You have an internet connection.
You know how to use your web browser.
Yep, that’s it.
If you’ve never done a stitch of computer programming before, even if you’re not quite sure what programming really is, don’t worry about it for a second because I had you in mind when I wrote this book. For too many years, programming has been the property of hackers and other technowizards. That made some sense because the programming languages they were using — with bizarre names such as C++ and Perl — were exceedingly difficult to learn and even harder to master.
This book’s main coding technologies — HTML, CSS, JavaScript, PHP, and MySQL — are different. They’re nowhere near as hard to learn as those for-nerds-only languages. I honestly believe that anyone can become a savvy and successful web coder, and this book is, I hope, the proof of that assertion. If you just follow along, examine my code carefully (particularly in the first few chapters), and practice what you learn, you will master web coding and development.
What if you’ve done some programming in the past? For example, you might have dipped a toe or two in the JavaScript waters already, or you might have dabbled with HTML and CSS. Will this book be too basic for you? No, not at all. In this book, I provide you with a ton of truly useful examples that you can customize and incorporate into your own site. The book’s first few chapters start slowly to avoid scaring off those new to this programming business. But once you get past the basics, I introduce you to lots of great techniques and tricks that will take your web coding skills to a higher level.
Icons Used in This Book
This icon points out juicy tidbits that are likely to be repeatedly useful to you — so please don’t forget them.
Think of these icons as the fodder of advice columns. They offer (I hope) wise advice or a bit more information about a topic under discussion.
Look out! In this book, you see this icon when I’m trying to help you avoid mistakes that can cost you time, money, or embarrassment.
When you see this icon, you’ve come across material that isn’t critical to understand but will satisfy the curious. Think “inquiring minds want to know” when you see this icon.
Beyond the Book
Some extra content for this book is available on the web. Go online to find the following:
The examples used in the book:
You can find these on my website:
https://paulmcfedries.com/books/web-coding-dev-aio-fd-2e/
Alternatively, the examples are also available via the book’s GitHub repository:
https://github.com/paulmcfe/web-coding-and-dev-fd-2e
The examples are organized by book and then by chapter within each book. For each example, you can view the code, copy it to your computer’s clipboard, and run the code in the browser.
The WebDev Workshop:
To view a few web coding tools and tutorials, as well as try your own code and see instant results, fire up the following site:
https://webdevworkshop.io
You won’t break anything, so feel free to use the site to run some experiments and play around with HTML, CSS, and JavaScript.
Book 1
Getting Ready to Code for the Web
Contents at a Glance
Chapter 1: How Web Coding and Development Work
The Nuts and Bolts of Web Coding and Development
Understanding the Front End: HTML and CSS
Understanding the Back End: PHP and MySQL
How It All Fits Together: JavaScript
How Dynamic Web Pages Work
What Is a Web App?
Understanding the Difference between Web Coding and Web Development
Chapter 2: Setting Up Your Web Development Home
What Is a Local Web Development Environment?
Do You Need a Local Web Development Environment?
Setting Up the XAMPP for Windows Development Environment
Setting Up the XAMPP for OS X Development Environment
Choosing Your Text Editor
Chapter 3: Finding and Setting Up a Web Host
Understanding Web Hosting Providers
A Buyer’s Guide to Web Hosting
Finding a Web Host
Finding Your Way around Your New Web Home
Chapter 1
How Web Coding and Development Work
IN THIS CHAPTER
Learning how the web works
Understanding the front-end technologies of HTML and CSS
Understanding the back-end technologies of MySQL and PHP
Figuring out how JavaScript fits into all of this
Learning about dynamic web pages, web apps, and mobile web apps
More than mere consumers of technology, we are makers, adapting technology to our needs and integrating it into our lives.
— DALE DOUGHERTY
The 1950s were a hobbyist’s paradise with magazines such as Mechanix Illustrated and Popular Science showing the do-it-yourselfer how to build a go-kart for the kids and how to soup up a lawnmower with an actual motor! Seventy years later, we’re now firmly entrenched in the age of do-it-yourself tech, where folks indulge their inner geek to engage in various forms of digital tinkering and hacking. The personification of this high-tech hobbyist renaissance is the maker, a modern artisan who lives to create things rather than merely consume them. Today’s makers exhibit a wide range of talents, but the skill most sought-after not only by would-be makers themselves but by the people who hire them is web coding and development.
Have you ever visited a website and thought, “Hey, I can do better than that!”? Have you found yourself growing tired of merely reading text and viewing images that someone else has put on the web? Is there something creative in you — stories, images, expertise, opinions — that you want to share with the world? If you answered a resounding “Yes!” to any of these questions, congratulations: You have everything you need to get started with web coding and development. You have, in short, the makings of a maker.
The Nuts and Bolts of Web Coding and Development
If, as the King said very gravely in Lewis Carroll’s Alice in Wonderland, it’s best to “begin at the beginning,” you’ve come to the right place. My goal here is to get you off on the right foot by showing you what web coding and web development are.
How the web works
Before you can understand web coding and development, you need to take a step back and understand a bit about how the web itself works. In particular, you need to know what happens behind the scenes when you click a link or type a web page address into your browser. Fortunately, you don’t need to be a network engineer to understand this stuff, because I can explain the basics without much in the way of jargon. Here’s a high-level (and not at all serious) blow-by-blow account of what happens:
You tell the web browser the web page you want to visit.
You do that either by clicking a link to the page or by typing the location — known as the uniform resource locator or URL (usually pronounced “you-are-ell,” but also sometimes “earl”) — into the browser’s address bar (see Figure 1-1).
FIGURE 1-1: One way to get to a web page is to type the URL in the browser’s address bar.
The browser decodes the URL.
Decoding the URL means two things. First, the browser sees what type of resource you’re requesting by checking the prefix of the URL; this is usually http:// or https://, both of which indicate that the resource is a web page. Second, it gets the URL's domain name — the something.com or whatever.org part — and asks the domain name system (DNS) to translate this into a unique location — called the IP (Internet Protocol) address — for the web server that hosts the page (see Figure 1-2).
FIGURE 1-2: The browser extracts the prefix, domain, and the server address from the URL.
The browser contacts the web server and requests the web page.
With the web server's unique IP address in hand, the web browser sets up a communications channel with the server and then uses that channel to send along a request for the web page (see Figure 1-3).
FIGURE 1-3: The browser asks the web server for the web page.
The web server decodes the page request.
