Skip to content

Instantly share code, notes, and snippets.

@rdebeasi
rdebeasi / mvc-in-authors-own-words.md
Last active August 29, 2015 14:05
JavaScript MVC Frameworks in the authors' own words

#Ember "Ember.js, therefore, is a synthesis of the powerful tools of our native forebears with the lightweight sensibilities of the modern web." "...we're not willing to give you a little bit of rope if we think you'll just end up hanging yourself with it as your app grows. " - Tom Dale

#Backbone "Backbone.js is intended to be fairly agnostic about many common patterns in client-side code." "'Two way data-binding' is avoided. While it certainly makes for a nifty demo, and works for the most basic CRUD, it doesn't tend to be terribly useful in your real-world app." - Jeremy Ashkenas

#Angular "Other frameworks deal with HTML’s shortcomings by either abstracting away HTML, CSS, and/or JavaScript or by providing an imperative way for manipulating the DOM. Neither of these address the root problem that HTML was not designed for dynamic views." "Unlike other frameworks, there is no need to inherit from proprieta

@rdebeasi
rdebeasi / client-feedback.md
Created August 15, 2014 16:02
Responding to client feedback

Original question: But how do you make clients consider your advice? If they don't like what you have to say, that's fine. Do you ever have clients who think they are designers? (On Designer News)


At the beginning of a project, I try to get a sense of what the client wants: general goals, websites or apps they like, etc. Then when problems come up, I try to explain them in terms of the client's goals.

For example: "You mentioned that you want the focal point of the page to be the 'buy' button. The copy that you gave me is a little long and would push the buy button offscreen for most users. What do you think about shortening the copy so that it's easier to see the buy button?"

Or: "The navigation that you proposed totally makes sense in light of your product lineup, but I'm worried that it might be confusing to users who aren't already familiar with your products. That shopping site

@rdebeasi
rdebeasi / autorun.bat
Created July 10, 2014 13:35
Batch file to set up OSX-style shortcuts to commonly used commands
@echo off
:: the "2>NUL" surpresses error messages. Web workbench executes autorun
:: but does not have access to sublime text or meld, so it throws errors.
2>NUL doskey subl="C:\Program Files\Sublime Text 3\sublime_text.exe" $*
2>NUL doskey opendiff="C:\Program Files (x86)\Meld\meld\meld.exe" $*
2>NUL doskey open="explorer" $*
2>NUL doskey ajaxmin="C:\Program Files (x86)\Microsoft\Microsoft Ajax Minifier\ajaxmin.exe" $*
@rdebeasi
rdebeasi / SassMeister-input.scss
Created February 10, 2014 15:56
Generated by SassMeister.com.
// ----
// Sass (v3.3.0.rc.3)
// Compass (v1.0.0.alpha.18)
// ----
%placeholder {
color: blue;
}
@mixin dostuff($color: red){
@rdebeasi
rdebeasi / gotime.sh
Last active December 23, 2015 00:48
Simple deployment script for a Django app running on Heroku. This will commit and push any changes you've made to static files, so be sure to run git status before running this command.
#!/bin/sh
echo "~*~*~ IT'S GO TIME!!! ~*~*~"
echo "Collecting static files..."
python manage.py collectstatic --noinput
echo "Adding & committing..."
git add staticfiles
git commit -m "Collected static files."
# If the push to origin fails, abort the script. It's ok if the commit fails: the user might not have had any static file changes to commit.
set -e
@rdebeasi
rdebeasi / nth-child.css
Created July 2, 2013 19:56
Counting with nth-child
:nth-child(4n+1) {} /* - For 1, 5, 9, 13...*/
:nth-child(4n-2) {} /* For 2, 6, 10, 14... */
:nth-child(4n-1) {} /* For 3, 7, 11, 15... */
:nth-child(4n) {} /* For 4, 8, 12, 16... */
@rdebeasi
rdebeasi / override-bootstrap-breakpoint.less
Last active December 19, 2015 00:49
Override Bootstrap's default breakpoint for stacking to 1 column. Hopefully we'll be able to change this with a variable in Bootstrap 3.
@import "mixins.less";
@import "variables.less";
@media (min-width: 400px) and (max-width: 767px) {
/* Restore standard bootstrap grid for medium-sized devices. */
#grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);
}
@rdebeasi
rdebeasi / .profile
Last active December 16, 2015 14:59
Bash profile with git sync command (see https://gist.github.com/rdebeasi/5155522) and virtual host setup command. Uses MAMP and Sublime Text.
export PATH=/opt/subversion/bin:~/bin:/opt/local/bin:/opt/local/sbin:~/Documents/util/scripts:$PATH
# Pyhton virtualenv
export WORKON_HOME=~/Envs
source /usr/local/bin/virtualenvwrapper.sh
# Use Sublime Text as editor
export EDITOR='subl -w'
# Commands
alias gs='gsync.sh'
alias vhost='subl /etc/hosts /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf'
@rdebeasi
rdebeasi / grid-no-gutter.less
Last active December 16, 2015 13:48
This tweak allows you to remove gutters from some columns in Bootstrap 2 while leaving margins on other columns intact. (To remove gutters from all columns, just change the column and gutter variables in variables.less).
@import "mixins.less";
@import "variables.less";
.grid-no-gutter {
/* Removes margin from Bootstrap Grid. This class goes at least one level above row-fluid.
Works in Bootstrap 2. In Bootstrap 3, #grid has been removed. */
#grid > .fluid( percentage( 1 / @gridColumns ), 0 );
}
@rdebeasi
rdebeasi / tinygrid.less
Last active December 15, 2015 20:59
Simple tiny-screen grid system for use alongside Bootstrap 2. Bootstrap 3 will have a built-in small device grid, but if you can't wait for that, Tiny Grid might be able to hold you over.
/* Simple 4-col tiny grid - designed as a companion to the Bootstrap grid
Overrides Bootstrap's default stacking behavior for "tiny" devices (<=400px).
Feel free to change this breakpoint to match your needs - 767px is probably a more natural fit with Bootstrap defaults.
Made with love in PROD - http://www.prod4ever.com/ */
@import "variables.less";
@import "mixins.less";
/* Utility Classes
Tiny grid is a subest of the phone grid, so visible-phone and hidden-phone apply to tiny devices as well. */