Sharing is Caring - Web Development Resources

Sharing Is Caring

Trevor Barnes Lead Web Developer MSU Communications and Brand Strategy

2

PremiseSo what’s this all about anyway…

Chris Coyier CSS-Tricks (no, that’s not me)

I bet if you stopped reading any dev tech news for a year, you could catch up in a week.

3

OverviewSo what’s this all about anyway…

The sites, feeds and conferences that matter most to me…

Resources

The apps I absolutely can’t do my job without and can’t remember life before I used them…

Tools

You’re the meaning in my life, you’re the inspiration…

Inspiration

4

• I like coming back from conferences or presentations with DOZENS of resources… • I like lists of resources, but I want to know what someone’s favorites are… • I like seeing things ranked… • I like this animation…

And the gold foil star goes to…

FormatWe’re all winners, there are no losers…

5

ToolsApps and such that I like…

Tools

6

Overview • Like Git but with a GUI • Very easy to jump right in (at least for me) • Does everything the command line tool does • Very nice graphical interface • Used by Apple, Google, Adobe, Amazon, IBM, Starbucks… (not going

away anytime soon)

Honorable Mention - Tower

Website: git-tower.com

Tools

7

Overview • Lossless! • Free! • Fast! • Much better than Photoshop’s “Save for Web” • Combines several leading image optimizers into one product: PNGOUT,

Zopfli, Pngcrush, AdvPNG, extended OptiPNG, JpegOptim, jpegrescan, jpegtran, and Gifsicle.

• The average % saved in file size will make you feel good deep down inside

Honorable Mention - ImageOptim

Website: imageoptim.com

Tools

8

Overview • Easy to use… • …difficult to truly master • Deeper than you might realize • Check out the FREE class about Dev Tools on CodeSchool.com, I learned a

ton even though I’d been using them for years • Also check out Google Chrome Canary, some very nice cutting edge

features for devs (RWD, test your site on 3G speeds and under, etc.)

Honorable Mention - Chrome Developer Tools

Website: google.com

Tools

9

Overview • Is there anything else like it out there? • Dozens (hundreds?) of REAL browser combinations • All flavors of IE • Could easily be my #1 but not used every single day during the dev

process

#3 - BrowserStackWebsite: browserstack.com

Tools

10

Overview • Task manager like Grunt but with a GUI • Compile Everything (Sass, LESS, CoffeeScript…) • Compass, Bourbon built-in • Auto-Refresh Browsers (all yer devices!) • JSLint, Minifiers • Bower Built-In • Autoprefixer • Image Optimizer • Source Maps • Very well supported and updated

#2 - CodeKitWebsite: incident57.com/codekit

Tools

11

Overview • When you reach Ninja levels, it’s very zen • Goto Anything • Command Palette • Multiple Selections • Split Screen Editing • Plugins • Emmet (ok, so it’s a plugin but so much win) • You will likely fall in love with this app • Nagware but worth the $70 • Tuts+ has a great series of Sublime Text tutorials

#1 - Sublime TextWebsite: sublimetext.com

12

ResourcesSites and such…

Resources

13

Overview • Because…duh… • I just figure that everyone already uses and knows about it • It’s almost part of Google for me at this point • Will answer all of your questions and then some

Honorable Mention - Stack Overflow

Website: stackoverflow.com

Resources

14

Overview • Closest thing to a news site for web devs I suppose • Lots of content • Respected names • Timely stories

Honorable Mention - Smashing Magazine

Website: smashingmagazine.com

Resources

15

Overview • Chateau Marmont of web developers - all the Rock Stars gather there • Trendsetting • A bit high brow (which can be good and bad) • Preachy at times • A Book Apart series

#3 - A List ApartWebsite: alistapart.com

Resources

16

Overview • If it fits your learning style, it’s great • Easy at first, but ramps up in difficulty • Videos followed by exercises, only let you proceed when you’ve

successfully completed the task • Several different Paths with multiple courses • Javascript, HTML/CSS, iOS, Ruby • Electives: free courses like Angular.js, Chrome Developer Tools • Several free courses, others require a subscription

#2 - Code SchoolWebsite: codeschool.com

Resources

17

Overview • Chris Coyier is just plain easy to understand • Videos are excellent, have taught me a lot • Very timely topics • Excellent guest bloggers

#1 - CSS-TricksWebsite: css-tricks.com

18

InspirationGet yer motor runnin’…

Inspiration

19

The Conferences

Very inspirational, “it changed my world”, top notch conference in every way

An Event Apart

Website: aneventapart.com

Heard great things about it, would like to attend in the future

Smashing Conference

Website: smashingconf.com

Higher ed + web dev - like peanut butter and chocolate

HighEdWeb

Website: highedweb.org

Recharge your batteries…

Inspiration

20

There are some very smart people to follow, Twitter is only as annoying as the people you choose to follow.

The Twitters

Brad Frost @brad_frost

Jared Spool @jmspool

Eric A. Meyer @meyerweb

Luke Wroblewski @lukew

Chris Coyier @chriscoyier

Jeffrey Zeldman @zeldman

Ethan Marcotte @beep

Scott Jehl @scottjehl

Lea Verou @LeaVerou

Smashing Magazine @SmashingMag

Paul Irish @paul_irish

Dan Cedarholm @simplebits

A List Apart @alistapart

Responsive Design @RWD

Inspiration

21

The Newsletters

I generally read 95% of the links they include each week

Responsive Design Weekly

Website: responsivedesignweekly.com

Some overlap, but also go a little deeper at times

cssweekly

Website: css-weekly.com

Definitely more technical, Angular, Ember, Backbone

JavaScript Weekly

Website: javascriptweekly.com

If you don’t want to keep up all week long, they’ll find the “best” links for you...

Inspiration

22

Communication…good

Coworkers

MSUYou…you complete me…

Tech talk, and all you can eat desserts

Code Lunch

Website: plus.google.com/communities - Search for: “Michigan State University Developers”

We’re singlehandedly keeping Google+ alive

Google+ Communities - Michigan State University Developers

Website: plus.google.com/communities - Search for: “Michigan State University Developers”

23

ThanksGlad you could make it

Trevor Barnes Michigan State University tdb@msu.edu

Thank you, enjoy the PIZZA & BEER.