Top Banner
Comm4Dev <H1> CODING FOR COMMUNICATORS </H1>
20

Coding 4 Communicators

Aug 15, 2015

Download

Technology

Eric Firnhaber
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Coding 4 Communicators

Comm4Dev

<H1>CODING FOR COMMUNICATORS</H1>

Page 2: Coding 4 Communicators

CODING IS JUST TALKING TO YOUR HYPER LITERAL FRIEND, WHO DOES EXACTLY WHAT

YOU TELL THEM, DOWN TO THE PUNCTUATION MARK.

“Hello, World.”

Page 3: Coding 4 Communicators

A PROGRAMMER GOES TO THE GROCERY STORE…

…and his wife tells him, "Buy a gallon of milk. If there are eggs, buy a dozen."

So the programmer goes to the store, buys everything, and drives back to his house.

Upon arrival, his wife angrily asks him, "Why did you get 13 gallons of milk?" The programmer says,

"There were eggs!"

Page 4: Coding 4 Communicators

WE TURN TO REDDIT USER “YOURJOKEEXPLAINED”

This can be described as a conditional statement:

If E=>D "If there are eggs, then buy a dozen." In this case, the inverse, ~E=>~D "If there are no eggs, then don't buy a dozen (gallons is milk)".

Since there were eggs at the store, the programmer bought a dozen (12) gallons of milk.

Since 1+12=13, the programmer bought 13 gallons of milk.

Page 5: Coding 4 Communicators

SO WHAT ARE CODE LANGUAGES AND WHY DO WE CARE?

HTML – Hypertext markup language, the building blocks of the web: you must know this

CSS – Cascading Style Sheets, the clothing of the copy Javascript – Makes webpages dance

Jquery – Framework makes it easier for you to make webpages dance

PHP – Hypertext Preprocessor, talks to the serverRuby – Makes interactive web apps

Ruby on Rails – Framework makes it easier for youSQL – Structured Query Language, for talking to databasesPython – A rival to Ruby

Django – Framework makes it easier for youR – the new language of data analysis (not web based) Java – Big heavy hitter web app language, mostly

outdatedC family – (+, #, ++) Full on software language, not web

Page 6: Coding 4 Communicators

HTML IS LIKE A BOX OF CHOCOLATES

HTML is a series of nested elements similar to a box of chocolates.

The box (your webpage) is the container for all of the chocolates. Each chocolate has an individual wrapper or “div”.

Each “div” has identifiers called “id’s” or “classes” such as; milk or dark chocolate, filling, nuts, and fruit so you know which the code refers to.

Page 7: Coding 4 Communicators

TYPES OF CHOCOLATE

HTML Syntax<tagname>Content</tagname> - Each tag has a special meaning to the browser.

/Closing

Nesting {

Page 8: Coding 4 Communicators

TYPES OF CHOCOLATE

<html> <body> <h1>”Hello, World.”</h1> <p>I am a paragraph</p> <a href="http:// www.w3schools.com">This is a link</a> <img src="w3schools.jpg" alt="W3Schools.com” width="104" height="142”> </body></html>

HTML Example

Page 9: Coding 4 Communicators

MANY BOXES OF CHOCOLATE

Page 10: Coding 4 Communicators

THE BOX HAS LAYERS

Page 11: Coding 4 Communicators

CSS MAKES THINGS BEAUTIFUL

CSS Syntax

S p a c eColor &Defines:

Page 12: Coding 4 Communicators

CSS MAKES THINGS BEAUTIFUL

CSS Example

Page 13: Coding 4 Communicators

CSS IS BEAUTIFUL & FLEXIBLE

CSS Zen Garden

The Beauty of CSS Design

A demonstration of what can be accomplished through CSS-based design. Select any style sheet from the list to load it into this page.

Download the example html file and css file

The Road to Enlightenment

Littering a dark and dreary road lay the past relics of browser-specific tags, incompatible DOMs, broken CSS support, and abandoned browsers.

We must clear the mind of the past. Web enlightenment has been achieved thanks to the tireless efforts of folk like the W3C, WaSP, and the major browser creators.

Page 14: Coding 4 Communicators

CSS IS BEAUTIFUL

Page 15: Coding 4 Communicators

& FLEXIBLE

Page 16: Coding 4 Communicators

& BEAUTIFUL

Page 17: Coding 4 Communicators

& FLEXIBLE

Page 18: Coding 4 Communicators

& BEAUTIFUL

Page 19: Coding 4 Communicators

YOUR TURN

“Hello, World.”

Page 20: Coding 4 Communicators

RESOURCES

General Assembly DASH

Codecademy

the Muse