Introduction to Web Development: Part 1

Intro to Web Development01: Laying the Foundation

A. FOUNDATION / SERVICESUNDERSTANDING THE REQUEST PROCESS

Let’s make a request

FRONT-END BACK-ENDINTERNETCLIENT SERVER

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

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

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

STATIC CONTENT STYLE RULESJAVASCRIPTHTML CSS

DYNAMIC ACTION

B. FOUNDATION / MARKUPADDING BASIC HTML AS YOUR FIRST TOOL

Basic HTML Tags<p> Paragraph

<a> Anchor (Link)

<br> Line Break

<h#> Headings (1-6)

<img> Image

<hr> Horizontal Rule

<div> “Strong” Container

<span> “Weak” Container

<table> Data Table

<ul> Unordered List

<ol> Ordered List

<form> Form

<input> Various Form Fields

<select> Multi-Choice Selection

Basic HTML Structure

Basic HTML Structure

Let’s edit liveHTML + Live Previewhttp://htmledit.squarefree.com

C. QUESTIONS & RESEARCHRECOMMENDED 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