Skip to content

Instantly share code, notes, and snippets.

@spinningcat
Forked from theskillwithin/resources.md
Created October 19, 2016 04:03
Show Gist options
  • Save spinningcat/1b65790b5e30b7348533312ab0b9b4fd to your computer and use it in GitHub Desktop.
Save spinningcat/1b65790b5e30b7348533312ab0b9b4fd to your computer and use it in GitHub Desktop.
Resource List
# 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.youtube.com/user/DevTipsForDesigners/playlists?shelf_id=0&view=1&sort=dd Travis Neilson

http://austinpeterson.info/hrtcup/dist/ https://github.com/theskillwithin/hrtcup (eslint, browersync, etc confic)

Git (plz use cli instead of gui): https://youtu.be/JPKOESR1k04?list=PLqGj3iMvMa4LFz8DZ0t-89twnelpT4Ilw https://github.com/robbyrussell/oh-my-zsh <3 (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 https://help.github.com/articles/generating-an-ssh-key/ making ssh key and adding it to ssh client

Design and code my person website from start to finish: https://www.youtube.com/playlist?list=PLqGj3iMvMa4KeBN2krBtcO3U90_7SOl-A

Sass, sourcemaps, autoprefixer, devops stuff: https://www.youtube.com/playlist?list=PLqGj3iMvMa4LE0uTAwo9wIFQYuGhIu7Gw syntax: https://youtu.be/-Z3qznaE9vc

easy to start:
	https://incident57.com/codekit/   (mac)  <3
	https://prepros.io/  (mac, windows, linux)
	https://css-tricks.com/why-npm-scripts/ 


https://github.com/damonbauer/npm-build-boilerplate  


https://github.com/theskillwithin/hrtcup/blob/master/package.json  <3

https://github.com/DevTips/DevTips-Starter-Kit (organized file structure!) <3

Flexbox all the things!: https://css-tricks.com/snippets/css/a-guide-to-flexbox/ https://youtu.be/G7EIAgfkhmg

https://youtu.be/qpdxiIDzg6Q    <3

https://github.com/Heydon/fukol-grids

http://codepen.io/theskillwithin/pen/QNBxyr

http://www.flexboxpatterns.com/

https://css-tricks.com/designing-a-product-page-layout-with-flexbox/

Sematics http://codepen.io/theskillwithin/pen/QKawNx ( ul nav list ) http://maintainablecss.com/

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dl http://learnlayout.com/ Centering in CSS https://css-tricks.com/centering-css-complete-guide/ https://www.youtube.com/watch?v=hIG-fZ2042k

misc awesome 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 http://youmightnotneedjquery.com/

http://www.hypexr.org/linux_scp_help.php

https://youtu.be/8rHd6vnKqKQ

https://youtu.be/dG1VQf0o6ns (subl command to open sublime text, open . for current folder)

https://www.sequelpro.com/

https://www.getpostman.com/

https://www.jetbrains.com/phpstorm/

https://panic.com/transmit/

http://kopy.io/

https://youtu.be/wzAWI9h3q18 (do you even Jade bro?)

https://deploybot.com/

https://www.paulirish.com/2012/box-sizing-border-box-ftw/

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)

CSS Transitions: 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)

Know Thy Editor Awesome Sauce - Sublime Text 3 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/equinusocio/material-theme OR 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

Vagrant 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)

CSS Units https://youtu.be/qrduUUdxBSY vw and vh

Design: www.adobe.com/ExperienceDesign‎ https://youtu.be/tsePToj6nw4

SVG https://thenounproject.com/ https://icomoon.io/app/#/select

podcasts 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

Email lists Responsive Design Weekly Web Design Weekly https://umaar.com/dev-tips/

Browser 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/

prefrences sublime text user:

{ "bold_folder_labels": true, "caret_extra_width": 2, "caret_style": "phase", "color_scheme": "Packages/Material Theme/schemes/Material-Theme-Darker.tmTheme", "font_size": 21, "highlight_line": true, "ignored_packages": [ "Vintage" ], "line_padding_bottom": 2, "line_padding_top": 2, "match_backets_braces": true, "match_brackets_content": true, "match_brackets_square": true, "overlay_scroll_bars": "enabled", "theme": "Material-Theme-Darker.sublime-theme" }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment