Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Intro to Javascript
Search
Yuri Victor
May 25, 2013
Technology
6
1.6k
Intro to Javascript
From Society for News Design iPad workshop.
Yuri Victor
May 25, 2013
Tweet
Share
More Decks by Yuri Victor
See All by Yuri Victor
HIG
yurivictor
2
580
Why The Washington Post uses WordPress lightning
yurivictor
1
13k
Why the Washington Post uses WordPress
yurivictor
3
450
Other Decks in Technology
See All in Technology
Amazon EKS Auto ModeでKubernetesの運用をシンプルにする
sshota0809
0
120
「ラベルにとらわれない」エンジニアでいること/Be an engineer beyond labels
kaonavi
0
160
OPENLOGI Company Profile for engineer
hr01
1
22k
React Server Componentは 何を解決し何を解決しないのか / What do React Server Components solve, and what do they not solve?
kaminashi
6
1.3k
IAMのマニアックな話 2025 ~40分バージョン ~
nrinetcom
PRO
8
950
PostgreSQL Unconference #52 pg_tde
nori_shinoda
1
230
Javaの新しめの機能を知ったかぶれるようになる話 #kanjava
irof
3
4.9k
SaaSプロダクト開発におけるバグの早期検出のためのAcceptance testの取り組み
kworkdev
PRO
0
470
Keynote - KCD Brazil - Platform Engineering on K8s (portuguese)
salaboy
0
130
年末調整プロダクトの内部品質改善活動について
kaomi_wombat
0
210
技術好きなエンジニアが _リーダーへの進化_ によって得たものと失ったもの / The Gains and Losses of a Tech-Enthusiast Engineer’s “Evolution into Leadership”
kaminashi
0
210
数百台のオンプレミスのサーバーをEKSに移行した話
yukiteraoka
0
680
Featured
See All Featured
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
12
610
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.6k
Faster Mobile Websites
deanohume
306
31k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Optimizing for Happiness
mojombo
377
70k
Java REST API Framework Comparison - PWX 2021
mraible
29
8.5k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.1k
Designing Experiences People Love
moore
141
23k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
12k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.3k
Rails Girls Zürich Keynote
gr2m
94
13k
Transcript
JS
@yurivictor
WHAT IS JAVASCRIPT?
JAVASCRIPT IS A MULTI-PARADIGM, WEAKLY TYPED, PROTOTYPE-BASED INTERPRETED PROGRAMMING LANGUAGE
ORIGINALLY INTENDED FOR WEB BROWSERS SO CLIENT-SIDE SCRIPTS COULD INTERACT WITH THE USER, CONTROL THE BROWSER, COMMUNICATE ASYNCHRONOUSLY AND ALTER THE DOCUMENT CONTENT
NO!
THAT’S SCARY
JAVASCRIPT LET’S YOU DO COOL STUFF ON THE WEB* *AND
BEYOND
YES!
LET’S DO THAT
LET’S TALK TUTORIALS
HERE’S A SECRET
TUTORIALS SUCK
alert( 'Hello SND' );
NO!
PROGRAMMING TUTORIALS SUCK BECAUSE THEY TEACH PROGRAMMING
NO!
LET’S LEARN HOW TO BUILD COOL STUFF
YES!
THREE THINGS
ADDING
REMOVING
MOVING
LET’S TALK JAVASCRIPT
JAVASCRIPT IS STRANGE
JAVASCRIPT IS POWERFUL
HERE’S A SECRET
USE GOOGLE
YOU ARE GOING TO
10 LINES OF CODE
10 NEXT APPS
5 MINUTES PER LINE
WE’RE GOING TO LEARN
VARIABLES
FUNCTIONS
IF/ELSE
JQUERY
LET’S GET IT STARTED(HA)
OPEN YOUR TEXT EDITOR
SAVE A NEW FILE AS awesome.html
DRAG THE FILE INTO YOUR BROWSER
<h1>0</h1> <h2>AWESOMENESS</h2> <button id="decrease">-</button> <button id="increase">+</button> <script src="jquery.min.js"></script> <script> var
awesomeness = 0; // We suck $( 'button' ).click( function() {! ! if ( $( this ).attr( 'id' ) === 'increase' ) { ! ! awesomeness = awesomeness + 10; ! } else { ! ! awesomeness = awesomeness - 1; ! } ! $( 'h1' ).text( awesomeness ); } ); </script>
None
SAME CODE AS
None
None
SAME CODE AS
None
WHAT’S NEXT
ANIMATION
DATA
WORLD DOMINATION
HOW TO KEEP GOING
READ OTHER’S CODE wapo.st/ThoL6P
BUILD REAL THINGS
BREAK STUFF
LEARN JS PROPERLY bit.ly/TwAwZr
None