Intro to Web Development
01: Laying the Foundation
A. FOUNDATION / SERVICES
UNDERSTANDING THE REQUEST PROCESS
Let’s make a request

(1) REQUEST FUNDABLE.COM   (2) REQUEST IS ROUTED   (3) REQUEST RECEIVED




(6) RESPONSE PROCESSED     (5) RESPONSE ROUTED      (4) RESPONSE SENT


      CLIENT                 INTERNET                 SERVER
       FRONT-END                                        BACK-END
A look into a web server


       OS + Web Service




      Code          Data
Today’s Fundable server
Tomorrow’s server
A look into a browser


      HTML/DOM Parser


       Javascript Engine


         CSS Parsing
Looking at a response




  HTML           JAVASCRIPT          CSS
STATIC CONTENT    DYNAMIC ACTION   STYLE RULES
B. FOUNDATION / MARKUP
ADDING BASIC HTML AS YOUR FIRST TOOL
Basic HTML Tags
<p> Paragraph              <span> “Weak” Container

<a> Anchor (Link)          <table> Data Table

<br> Line Break            <ul> Unordered List

<h#> Headings (1-6)        <ol> Ordered List

<img> Image                <form> Form

<hr> Horizontal Rule       <input> Various Form Fields

<div> “Strong” Container   <select> Multi-Choice Selection
Basic HTML Structure
Basic HTML Structure
Let’s edit live
HTML + Live Preview
http://htmledit.squarefree.com
C. QUESTIONS & RESEARCH
RECOMMENDED RESOURCES + QUESTION TIME
HTML Resources

lynda.com

developer.mozilla.org/en-US/learn/html

sitepoint.com

teamtreehouse.com
Let’s discuss

How many people are somewhat comfortable?

What are you stuck on?

What area would you like to focus on next time?
(a) CSS, (b) Javascript, (c) Server Side / PHP

Introduction to Web Development: Part 1