Slide 1

Slide 1 text

Practical JavaScripting

Slide 2

Slide 2 text

Me! University of Bath Computer Science Student Software Developer at Kainos Blogger at javascriptplayground.com Talker on upfrontpodcast.com Twitterer @Jack_Franklin

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

Free Stuff 5 Copies of "Beginning jQuery" to get rid of Tweet #port80jquery and I'll pick some randomly.

Slide 5

Slide 5 text

What we're not going to talk about Do NOT let me do my Welsh accent we won't discuss England letting Wales beat us at rugby

Slide 6

Slide 6 text

The Agenda Web Sites vs Web Apps Sensible JavaScript Writing Workflow & Tooling Don't get caught in the storm Book giveaway (Easy) Questions and (hopefully some) Answers

Slide 7

Slide 7 text

Web Sites vs Web Apps is there a difference?

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

I don't think there is any difference and that's a good thing

Slide 10

Slide 10 text

we're all building sites people visit, do something and leave stop trying to differentiate

Slide 11

Slide 11 text

differentiating web sites vs web apps is no good to anyone

Slide 12

Slide 12 text

a lot of people ignore new JS tools, methods or approaches because those are just for "web apps"

Slide 13

Slide 13 text

don't be so quick to discredit your code

Slide 14

Slide 14 text

Writing sensible JavaScript

Slide 15

Slide 15 text

I get to see a lot of JavaScript and people write some weird stuff

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

People put a lot of thought into CSS (OOCSS, SMACSS, etc) (and this is a good thing) But does the same happen with the JavaScript?

Slide 20

Slide 20 text

Too often people treat JavaScript like a black box of magic and throw everything into one file

Slide 21

Slide 21 text

Too often it's an after thought let's quickly add some jQuery to animate that button

Slide 22

Slide 22 text

"weeks of coding can save hours of planning"

Slide 23

Slide 23 text

Let's talk about jQuery

Slide 24

Slide 24 text

ditching jQuery has the time come?

Slide 25

Slide 25 text

jQuery 2 drops IE6, 7, 8 jQuery 1.X supports them

Slide 26

Slide 26 text

jQuery isn't going anywhere fast and the file size isn't that big...

Slide 27

Slide 27 text

Organise your code multiple JS files, modular approaches

Slide 28

Slide 28 text

organising your code is really simple lots of files and a bunch of script tags

Slide 29

Slide 29 text

or you can go further AMD approaches like Matt talked about look at RequireJS

Slide 30

Slide 30 text

learn how JavaScript works

Slide 31

Slide 31 text

bits of JavaScript will catch you out and even jQuery can't save you from that

Slide 32

Slide 32 text

the better you know JavaScript, the better you know jQuery Would you write SCSS without knowing CSS?

Slide 33

Slide 33 text

regular JS isn't that bad. Make an effort to improve your JS knowledge you can still use jQuery. Knowing JS means you'll use it better and appreciate it more learn.jquery.com

Slide 34

Slide 34 text

Tooling

Slide 35

Slide 35 text

don't dismiss tools out of hand but don't go crazy and use them all, either

Slide 36

Slide 36 text

The JS ecosystem has evolved a gazillionbillion* times over * needs attribution

Slide 37

Slide 37 text

you're not a real developer if you don't use the command line* * loljk.

Slide 38

Slide 38 text

Grunt! does everything. gruntjs.com

Slide 39

Slide 39 text

Testing Minifying & Building Validating Templating

Slide 40

Slide 40 text

you might not think your site needs {insert library here}

Slide 41

Slide 41 text

there are a lot of times when you think your solution is too basic to require any additional libraries / tools but any chance you get to make your life easier is worth taking

Slide 42

Slide 42 text

not getting caught in the storm

Slide 43

Slide 43 text

don't worry about using the newest of the new tools if you do this, you'll never get any work done

Slide 44

Slide 44 text

sure, when something new pops up, give it a quick look people (like me) will blog about them

Slide 45

Slide 45 text

find a workflow, set of tools and some of your favourite libraries that work for you stick with them

Slide 46

Slide 46 text

revisit every few months to see if something new has popped up

Slide 47

Slide 47 text

spot small things that take up too much time and solve them

Slide 48

Slide 48 text

Something takes you 5 minutes to do You spend an hour setting up that tool which makes that 5 minute thing a 1 minute thing everytime you do it you now save 4 minutes do that thing 15 times = your hour back

Slide 49

Slide 49 text

take time to improve and perfect your workflow mundane but important tasks should be effortless

Slide 50

Slide 50 text

the moment a mundane task takes considerable effort, you wont do it

Slide 51

Slide 51 text

build for small wins lots of small wins > one big win

Slide 52

Slide 52 text

we're all building web applications just some are a bit more complex than others

Slide 53

Slide 53 text

develop accordingly, but don't treat your JS like this black box of magic

Slide 54

Slide 54 text

and go make awesome

Slide 55

Slide 55 text

Books! I'm going to give 3 out now randomly via Twitter Which means I'll have 2 left. At the after party, come and find me and tell me your best joke. If I like it, you can have a copy. If I don't, you get to buy me a drink.* * not really. Twitter Draw

Slide 56

Slide 56 text

Stickers! Come and find me.

Slide 57

Slide 57 text

Questions? jackfranklin.co.uk @Jack_Franklin @upfrontpodcast / upfrontpodcast.com javascriptplayground.com tilvim.com github.com/jackfranklin toomanysoddingsideprojects.com* * not really