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
Perlの生きのこり - エンジニアがこの先生きのこるためのカンファレンス2025
kfly8
1
220
速くて安いWebサイトを作る
nishiharatsubasa
14
15k
OSS構成管理ツールCMDBuildを使ったAWSリソース管理の自動化
satorufunai
0
350
AIエージェント元年
shukob
0
120
(機械学習システムでも) SLO から始める信頼性構築 - ゆる SRE#9 2025/02/21
daigo0927
0
200
LINEギフトにおけるバックエンド開発
lycorptech_jp
PRO
0
100
php-conference-nagoya-2025
fuwasegu
0
110
「海外登壇」という 選択肢を与えるために 〜Gophers EX
logica0419
0
900
IAMポリシーのAllow/Denyについて、改めて理解する
smt7174
2
160
The Future of SEO: The Impact of AI on Search
badams
0
240
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
17
45k
急成長する企業で作った、エンジニアが輝ける制度/ 20250214 Rinto Ikenoue
shift_evolve
3
1.9k
Featured
See All Featured
Writing Fast Ruby
sferik
628
61k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
Building Applications with DynamoDB
mza
93
6.2k
Why Our Code Smells
bkeepers
PRO
336
57k
YesSQL, Process and Tooling at Scale
rocio
172
14k
What's in a price? How to price your products and services
michaelherold
244
12k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Large-scale JavaScript Application Architecture
addyosmani
511
110k
GitHub's CSS Performance
jonrohan
1030
460k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
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