Top Banner
JAVASCRIPT Rails Girls July 2014
38

Rails Girls Sydney JavaScript July 2014

Jul 11, 2015

Download

Software

gregmcintyre
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: Rails Girls Sydney JavaScript July 2014

JAVASCRIPTRails Girls July 2014

Page 2: Rails Girls Sydney JavaScript July 2014

LIFE WITHOUT JAVASCRIPT?

Page 3: Rails Girls Sydney JavaScript July 2014

HTML + CSS = “PAGES”

Page 4: Rails Girls Sydney JavaScript July 2014

FULL PAGE LOADS

Page 5: Rails Girls Sydney JavaScript July 2014

BORING BORING PAGES

Page 6: Rails Girls Sydney JavaScript July 2014

HOW DOES IT FIT IN?

Page 7: Rails Girls Sydney JavaScript July 2014

WHAT DOES IT LOOK LIKE?

Page 8: Rails Girls Sydney JavaScript July 2014
Page 9: Rails Girls Sydney JavaScript July 2014

WHEN WOULD I USE IT?

Page 10: Rails Girls Sydney JavaScript July 2014

IN-PAGE UPDATESAJAX = Asynchronous JavaScript and XML

Page 11: Rails Girls Sydney JavaScript July 2014

REARRANGING THE PAGEDOM = Document Object Model

Page 12: Rails Girls Sydney JavaScript July 2014

NON-STANDARD FORM INPUTSCalendars, sliders, etc.

Page 13: Rails Girls Sydney JavaScript July 2014

CHATWeb sockets, “push”, “long polling”

Page 14: Rails Girls Sydney JavaScript July 2014

CROSS-BROWSER PATCHESe.g. Vector graphics and Internet Explorer, “shims”,

“polyfills”

Page 15: Rails Girls Sydney JavaScript July 2014

LIGHTBOXES

Page 16: Rails Girls Sydney JavaScript July 2014

INFINITE SCROLLINGTumblr, Facebook, Pinterest

Page 17: Rails Girls Sydney JavaScript July 2014

MAKING UP FOR CSS BEING CRAPSame-height columns

Page 18: Rails Girls Sydney JavaScript July 2014

MENUS THAT SLIDE IN AND OUTSo slidey

Page 19: Rails Girls Sydney JavaScript July 2014

SLIDESHOWSSuch slide, very wow

Page 20: Rails Girls Sydney JavaScript July 2014

3D GRAPHICS, GAMESCanvas

Page 21: Rails Girls Sydney JavaScript July 2014

STEALING PASSWORDSXSS = Cross Site Scripting

Page 22: Rails Girls Sydney JavaScript July 2014

HOW DO I TRY IT?

Page 23: Rails Girls Sydney JavaScript July 2014

CHROME

VIEW > DEVELOPER > JAVASCRIPT CONSOLE

Page 24: Rails Girls Sydney JavaScript July 2014

FIREFOX !

TOOLS > WEB DEVELOPER > WEB CONSOLE

Page 25: Rails Girls Sydney JavaScript July 2014

TYPE 1 + 1 AND HIT ENTER2!!!

Page 26: Rails Girls Sydney JavaScript July 2014

MAKE A NEW HTML FILE (MAYBE IN SUBLIME)

Page 27: Rails Girls Sydney JavaScript July 2014
Page 28: Rails Girls Sydney JavaScript July 2014

CONSOLE.LOG(STUFF);

Page 29: Rails Girls Sydney JavaScript July 2014

JQUERYAbstraction, convenience, standards

Page 30: Rails Girls Sydney JavaScript July 2014

RICH APPS

Page 31: Rails Girls Sydney JavaScript July 2014

BACKBONE.JS EMBER.JS

ANGULAR.JS

Page 32: Rails Girls Sydney JavaScript July 2014

SERVER-SIDE JAVASCRIPTAlternative to Ruby on Rails

Page 33: Rails Girls Sydney JavaScript July 2014
Page 34: Rails Girls Sydney JavaScript July 2014

COFFEESCRIPT

Page 35: Rails Girls Sydney JavaScript July 2014

STACKOVERFLOW.COM

Page 36: Rails Girls Sydney JavaScript July 2014

WWW.SYDJS.COMI missed cupcake day :(

Page 37: Rails Girls Sydney JavaScript July 2014

QUESTIONS

Page 38: Rails Girls Sydney JavaScript July 2014

INSPIRED BY

TRACY “DISCERNING” MU SUNG

@gregmcintyre