So you wanna be a web developer... – How does a web developer do? – Be aware.

View Github Repository Open presentation in a new window

weshardee

See all presentation from weshardee

So you wanna be a web developer... – How does a web developer do? – Be aware.

0 0

so-you-wanna-be-a-web-developer

A presentation on getting started in client-side web development.

On Github weshardee / so-you-wanna-be-a-web-developer

So you wanna be a web developer...

Created by Wes Hardee

I work for The Nerdery

Yes, you heard me right.

How does a web developer do?

### Common features & Tech - Responsive design - CSS Animations/Transitions - Canvas - Carousels (aka slideshows) - API calls / CORS / JSON - OAuth - Parallax - Accessibility Compliance - Frameworks (Angular)
### Performance & Readability - Uglifying/minification - Styleguides - Image optimization
### Tooling - NPM/Node - Bower - SASS/LESS/Stylus/CSSNext - RequireJS/Webpack/Browserify - Grunt/Gulp - git (& git-flow) - scss-lint, js-hint / eslint - Vagrant - Mocha / Jasmine - Atom/Sublime Text - JSDocs - Handlebars templating

Yay?

## What happened to the good 'ol days? You know, when all you needed was some html, CSS, and JS?

When I was in college...

  • Chrome wasn’t a thing.
  • Internet Explorer 7 was released, but IE6 was still king.
  • iPhones came out.
  • Android wasn’t a thing.
  • Flash/ActionScript was the bomb.
  • I thought Dreamweaver was cool. WYSIWYG 4 EVER
  • Gmail was in beta limbo (and I didn’t know it existed).
  • I learned Java.

^ Me

Be aware.

So how do I start?

Know JS

  • build a carousel
  • build it again without jQuery
  • debugging with breakpoints
  • Object.prototype
  • `this`
  • JS Closures (global scope)

Git cozy with the command line

Browser Testing

Know some node

Try the back end

Get modular with CSS

  • learn to love the media object
  • OOCSS/SmaCSS
  • Block Formatting Context

Understand Document Outlines

Get started on your GIF collection

Now you're awesome

You'll still feel like an imposter

And that's OK. Be HUMBLE.

## I can haz knowledge? - [codepen.io](http://codepen.io) - [caniuse.com](http://caniuse.com) - [MDN](https://developer.mozilla.org/en-US/) - [css-tricks.com](https://css-tricks.com) - [AirBnB JS Styleguide](http://airbnb.io/javascript/) - [Smashing Magazine](http://www.smashingmagazine.com/)

W3schools

But I'm not a front-end developer

The End