- 
https://www.youtube.com/user/DevTipsForDesigners/playlists?shelf_id=0&view=1&sort=dd Travis Neilson
 - 
https://github.com/theskillwithin/hrtcup (eslint, browersync, etc confic)
 
#index
- Git (plz use cli instead of gui):
 - Design and code my person website from start to finish:
 - Sass, sourcemaps, autoprefixer, devops stuff:
 - Flexbox all the things!:
 - Sematics
 - Centering in CSS
 - misc awesome
 - CSS Transitions:
 - Know Thy Editor Awesome Sauce - Sublime Text 3
 - Vagrant
 - CSS Units
 - Design:
 - SVG
 - podcasts
 - Email lists
 - Browser
 - sass-lint.yml
 
- 
https://youtu.be/JPKOESR1k04?list=PLqGj3iMvMa4LFz8DZ0t-89twnelpT4Ilw
 - 
https://github.com/robbyrussell/oh-my-zsh ❤️ (osx and i also use on ubuntu)
 - 
https://github.com/robbyrussell/oh-my-zsh/wiki/Cheatsheet#git glog ftw https://www.iterm2.com/ (osx)
 - 
git add -A git commit -m "msg" git push origin master git checkout -b new_branch git checkout master git merge new_branch git push origin master
 - 
making ssh key and adding it to ssh client https://help.github.com/articles/generating-an-ssh-key/
 
- 
https://www.youtube.com/playlist?list=PLqGj3iMvMa4LE0uTAwo9wIFQYuGhIu7Gw
 - 
syntax: https://youtu.be/-Z3qznaE9vc
 - 
easy to start:
- https://incident57.com/codekit/ (mac) ❤️
 - https://prepros.io/ (mac, windows, linux)
 - https://css-tricks.com/why-npm-scripts/
 
 - 
https://github.com/theskillwithin/hrtcup/blob/master/package.json ❤️
 - 
https://github.com/DevTips/DevTips-Starter-Kit (organized file structure!) ❤️
 - 
{ "scripts": { "build": "browserify main.js | uglifyjs -cm | gzip > bundle.js.gz", "watch": "watchify main.js -dv -o bundle.js" }, "browserify": { "transform": [ ["babelify",{"presets":["es2015"]}] ] } }
 
- http://codepen.io/theskillwithin/pen/QKawNx ( ul nav list )
 - http://maintainablecss.com/
 <header> <nav> <footer> <section> <article>- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl
 - http://learnlayout.com/
 
- 
https://css-tricks.com/findingfixing-unintended-body-overflow/ (got some overflow on mobile? and use body overflow-x: hidden )
 - 
https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
 - 
background-size: cover
 - 
https://youtu.be/dG1VQf0o6ns (subl command to open sublime text, open . for current folder)
 - 
https://youtu.be/wzAWI9h3q18 (do you even Jade bro?)
 - 
https://github.com/theskillwithin/hrtcup/blob/master/src/assets/css/3-modules/_gallery-controller.sass ( pure css slider using :target hack )
 - 
https://github.com/theskillwithin/hrtcup/blob/master/src/assets/css/4-pages/_page-home.sass#L55 (hover effect outside of an element)
 
- https://youtu.be/NZelrwd_iRs | https://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/
 - https://www.youtube.com/playlist?list=PLqGj3iMvMa4LvJ8VctoXnPI0dtE40wfid (animation series)
 - https://youtu.be/8NGNKBIA_eI (discover perspective property)
 
- https://youtu.be/_zNhqUnBfis?t=4m25s ❤️ ( know what is possible then u can learn bit by bit and google later Wes Bos)
 - https://www.sublimetext.com/3 ❤️
 - https://packagecontrol.io/installation ❤️
 - https://github.com/wesbos/cobalt2 ❤️
 - http://docs.emmet.io/cheat-sheet/ ❤️
 - https://github.com/skovhus/SublimeLinter-contrib-sass-lint
 - https://i.imgur.com/eUbezVA.png codepen.io
 - https://gist.github.com/wesbos/a3b12cfda064a906ac04 (I do "translate_tabs_to_spaces": false,)
 - http://wes.io/iBjt newer wes bos settings
 
- https://github.com/theskillwithin/intelliamor2/blob/master/scripts/install.sh (custom vagrant provision)
 - https://puphpet.com/ =[
 - https://youtu.be/HW07wq2lllw (how to use vagrant with magento)
 
- https://youtu.be/qrduUUdxBSY
 - vw and vh
 
- Shop Talk Show (Chris Coyer owner of css-tricks.com and codepen.io)
 - The Tim Ferris Podcast
 - Yayqeuery (old)
 - Late nights with Trav And Los
 - /dev/hell
 
- Responsive Design Weekly
 - Web Design Weekly
 - https://umaar.com/dev-tips/
 
- https://chrome.google.com/webstore/detail/material-simple-dark-grey/ookepigabmicjpgfnmncjiplegcacdbm
 - https://github.com/nitayneeman/material-dark-devtools (chrome devtools theme)
 - https://www.google.com/chrome/browser/canary.html
 - https://www.mozilla.org/en-US/firefox/developer/
 
# sass-lint config generated by make-sass-lint-config v0.1.2
# 
# The following scss-lint Linters are not yet supported by sass-lint:
# DisableLinterReason, ElsePlacement, PropertyCount, SelectorDepth
# SpaceAroundOperator, TrailingWhitespace, UnnecessaryParentReference, Compass::*
# 
# The following settings/values are unsupported by sass-lint:
# Linter Indentation, option "allow_non_nested_indentation"
# Linter Indentation, option "character"
# Linter NestingDepth, option "ignore_parent_selectors"
# Linter PropertySortOrder, option "min_properties"
# Linter PropertySortOrder, option "separate_groups"
# Linter SpaceBeforeBrace, option "allow_single_line_padding"
# Linter VendorPrefix, option "identifier_list"
files:
  include: '**/*.sass'
options:
  formatter: stylish
  merge-default-rules: false
rules:
  bem-depth:
    - 0
    - max-depth: 1
  border-zero:
    - 1
    - convention: none
  brace-style:
    - 1
    - allow-single-line: true
  class-name-format:
    - 0
    - convention: hyphenatedlowercase
  clean-import-paths:
    - 1
    - filename-extension: false
      leading-underscore: false
  empty-line-between-blocks:
    - 0
    - ignore-single-line-rulesets: true
  extends-before-declarations: 1
  extends-before-mixins: 1
  final-newline:
    - 0
    - include: true
  force-attribute-nesting: 1
  force-element-nesting: 0
  force-pseudo-nesting: 0
  function-name-format:
    - 1
    - allow-leading-underscore: true
      convention: hyphenatedlowercase
  hex-length:
    - 1
    - style: short
  hex-notation:
    - 1
    - style: lowercase
  id-name-format:
    - 1
    - convention: camelcase
  indentation:
    - 1
    - size: tab
  leading-zero:
    - 0
    - include: false
  mixin-name-format:
    - 1
    - allow-leading-underscore: true
      convention: hyphenatedlowercase
  mixins-before-declarations: 1
  nesting-depth:
    - 1
    - max-depth: 3
  no-color-keywords: 0
  no-color-literals: 0
  no-css-comments: 1
  no-debug: 1
  no-duplicate-properties: 1
  no-empty-rulesets: 1
  no-extends: 0
  no-ids: 0
  no-important: 1
  no-invalid-hex: 1
  no-mergeable-selectors: 1
  no-misspelled-properties:
    - 1
    - extra-properties: []
  no-qualifying-elements:
    - 0
    - allow-element-with-attribute: false
      allow-element-with-class: false
      allow-element-with-id: false
  no-trailing-zero: 1
  no-transition-all: 0
  no-url-protocols: 1
  no-vendor-prefixes:
    - 1
    - additional-identifiers: []
      excluded-identifiers: []
  placeholder-in-extend: 1
  placeholder-name-format:
    - 1
    - convention: hyphenatedlowercase
  property-sort-order:
    - 0
    - ignore-custom-properties: false
  property-units:
    - 1
    - global:
        - ch
        - em
        - ex
        - rem
        - cm
        - in
        - mm
        - pc
        - pt
        - px
        - q
        - vh
        - vw
        - vmin
        - vmax
        - deg
        - grad
        - rad
        - turn
        - ms
        - s
        - Hz
        - kHz
        - dpi
        - dpcm
        - dppx
        - '%'
      per-property: {}
  quotes:
    - 1
    - style: single
  shorthand-values:
    - 1
    - allowed-shorthands:
        - 1
        - 2
        - 3
  single-line-per-selector: 0
  space-after-bang:
    - 1
    - include: false
  space-after-colon:
    - 1
    - include: true
  space-after-comma:
    - 1
    - include: true
  space-before-bang:
    - 1
    - include: true
  space-before-brace:
    - 1
    - include: true
  space-before-colon: 1
  space-between-parens:
    - 1
    - include: false
  trailing-semicolon: 0
  url-quotes: 1
  variable-for-property:
    - 0
    - properties: []
  variable-name-format:
    - 0
    - allow-leading-underscore: true
      convention: camelcase
  zero-unit: 1
https://www.smashingmagazine.com/2016/11/css-grids-flexbox-and-box-alignment-our-new-system-for-web-layout/?utm_source=CSS-Weekly&utm_campaign=Issue-239&utm_medium=email