KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#dsh #ai-agents #dsh-plugin #codex #developer-tools #claude-code #windows #desktop-app #typescript #rust #ai-agent #cli

br-frontend-tooling-links

★ 36 Open GitHub ↗

Links and resources for our Build Right: Frontend Tooling workshop

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Links and Resources
*Build Right: Frontend Tooling* from [Sparkbox](http://seesparkbox.com)

[Google docs link](https://docs.google.com/document/d/1gRGBwj6k0NDEAqrSX4JXhMdOqtSaMHTEc0iFv1L1bAU/edit?usp=sharing)

## Path of Pain

* [A Baseline for Front-End Developers](http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/)

## Productivity

**CLI**

* [Learn the CLI the hard way](http://cli.learncodethehardway.org/book/)
* [Getting to Know the Command Line](http://www.davidbaumgold.com/tutorials/command-line/)
* [The designer’s guide to the OSX command prompt](http://wiseheartdesign.com/articles/2010/11/12/the-designers-guide-to-the-osx-command-prompt/)
* [Command Line Tools for Frontend Developers](http://seesparkbox.com/foundry/command_line_tools_for_frontend_developers)
* [Awesome Shell](https://github.com/alebcay/awesome-shell)

**Mouse Clicks**

* [Alfred App](http://alfredapp.com)
  * [Colors workflow](http://tylereich.github.io/Alfred-Extras/#/Colors)
  * [JavaScript to CoffeeScript workflow](http://www.alfredforum.com/topic/2816-js2coffee-workflow/)
  * [Alfred-Harvest workflow](https://github.com/neilrenicker/alfred-harvest)
  * [Alfred-Pinboard workflow](https://github.com/eknkc/alfred-pinboard)
  * [Say workflow] (http://www.alfredforum.com/topic/1055-say-text-to-speech-with-option-of-voices/) (Text to speech, with a variety of voices. This one's fun!)
  * [Toggle Visibility of Hidden Files workflow](http://matthojo.co.uk/articles/alfred-hide-show-hidden-file-extentions/)
* [Launchy](http://www.launchy.net) (Windows launcher)
* [Dash](http://kapeli.com/dash)
    * [Velocity - like Dash for Windows](http://velocity.silverlakesoftware.com)
    * [Zeal - like Dash for Windows](http://zealdocs.org)
* [Vimium](http://vimium.github.io)
* [BulletTrain](http://bullettrain.com)

**Document Saving, Retrieving & Organizing**

* [Markdown](http://daringfireball.net/projects/markdown/)
* [Byword App](http://bywordapp.com/)
* [nvAlt](http://brettterpstra.com/projects/nvalt/)
* [MacDown](http://macdown.uranusjr.com)

**Excessive Typing**

* [TextExpander](http://smilesoftware.com/TextExpander)
* [Emmet](http://emmet.io)
* [Adam's Dotfiles](https://github.com/asimpson/dotfiles)
* [Dotfiles](http://dotfiles.github.io)

**Distraction**

* [Moom](http://manytricks.com/moom/)

## Editors

* [Sublime Text](http://sublimetext.com)
* [Vim](http://vim.org)

**Sublime Packages**

* [Package Control](https://sublime.wbond.net/installation)
* [Sidebar Enhancements](https://github.com/titoBouzout/SideBarEnhancements)
* [AdvancedNewFile](https://github.com/skuroda/Sublime-AdvancedNewFile)
* [GitGutter](https://github.com/jisaacks/GitGutter)

**Vim resources**

* [Vim for people who think things like Vim are weird and hard](http://csswizardry.com/2014/06/vim-for-people-who-think-things-like-vim-are-weird-and-hard/)
* [Ethan's Vim Dotfiles](github.com/ethanmuller/dotvim/)
* [VimAwesome](http://vimawesome.com/)
* [Vimbits](http://vimbits.com/)
* [Vimcasts](http://vimcasts.org/)

## Source Control
* [Git: The tree of possibilities for the curious designer](https://medium.com/design-ux/92f2350fd047)
* [Deliberate Git](http://steelcityruby.confbots.com/video/72762735)
* [GitHub Fundamentals](http://www.teehanlax.com/blog/github-fundamentals/)
* [The Git Parable](http://tom.preston-werner.com/2009/05/19/the-git-parable.html)
* [Github for Windows](http://windows.github.com)
* [Github for Mac](http://mac.github.com)
* [Hub app for Mac](thehubapp.com/) (Github Notifications in your menu bar)

## Static Design Tools

**Version Control for Visual Design**
* [LayerVault](https://layervault.com/)
* [Pixelapse](https://www.pixelapse.com/)

**Wireframing Tools**

* [Keynote](http://apple.com/mac/keynote/)
* [Moqups](http://moqups.com/)
* [Foundation](http://foundation.zurb.com/)
* [Bootstrap](http://getbootstrap.com/)

**Visual Design Tools**

* [Sketch](http://www.bohemiancoding.com/sketch/)

**Hybrid apps**

* [Macaw](http://macaw.co)
* [Froont](http://froont.com)
* [Reflow](http://html.adobe.com/edge/reflow/)
* [Ben on these apps and RWD](http://seesparkbox.com/foundry/dissecting_design)

## Browser Developer Tools

* [Ember dev tools extension](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi?hl=en)
* [Grunt dev tools extension](https://chrome.google.com/webstore/detail/grunt-devtools/fbiodiodggnlakggeeckkjccjhhjndnb?hl=en)
* [Rails Panel](https://chrome.google.com/webstore/detail/railspanel/gjpfobpafnhjhbajcjgccbbdofdckggg?hl=en-US)

## Preprocessing

* [Semantic Shift](http://en.wikipedia.org/wiki/Semantic_change)
* [Google ngrams](http://books.google.com/ngrams/)

**CSS Preprocessing**

* [Less CSS](http://lesscss.org/)
* [Stylus CSS](http://learnboost.github.io/stylus/)
* [Sass CSS](http://sass-lang.com/)
* [Compass for Sass](http://compass-style.org/)
* [Bourbon for Sass](http://bourbon.io/)
* [Scut for Sass](http://davidtheclark.github.io/scut/)

**JavaScript Preprocessing**

* [CoffeeScript](http://coffeescript.org/)

**HTML Preprocessing**

* [Jade](http://jade-lang.com/)
* [HAML](http://haml.info/)
* [Emmet](http://emmet.io/)

**Pulling it all together**

* [CodeKit for Mac](https://incident57.com/codekit/)
* [Prepros for Windows and Mac](http://alphapixels.com/prepros/)
* [Less.app](http://incident57.com/less/)
* [Compass.app](http://compass.kkbox.com/)
* [Scout app for Compass and Sass](http://mhs.github.io/scout-app/)

**The open source preprocessing stack**

* [Bundler](http://bundler.io/)
* [Install Node and npm (the Node Package Manager)](http://nodejs.org/download/)
* Optionally, install Node and npm with [Homebrew](http://brew.sh/)
* [Grunt](http://gruntjs.com/)
* [Getting started with Grunt](http://gruntjs.com/getting-started)
* [Gulp](http://gulpjs.com/)
* [Bower](http://bower.io/)
* [Handlebars](http://handlebarsjs.com/)
* [Assemble](http://assemble.io/) *Note: installing Assemble will install and use Handlebars as a dependency.*

**Windows Downloads**
* [Patrick's awesome post](http://seesparkbox.com/foundry/love_your_frontend_tools_windows)
* [Msysgit](http://msysgit.github.io/)

## Local Servers
* [Anvil](http://anvilformac.com)
* [MAMP](http://www.mamp.info/en/index.html)
* [WAMP](http://www.wampserver.com/en/)
* [Homebrew](http://brew.sh)
* [Vagrant](http://www.vagrantup.com)
* [Sword](https://sword.mu/)

## Device Testing
* [VirtualBox](https://www.virtualbox.org/)
* [Parallels](https://www.parallels.com/)
* [Modern.ie](http://modern.ie)
* [IEVMs Script](http://github.com/xdissent/ievms)
* [Browserstack](www.browserstack.com)
* [Edge Inspect](http://html.adobe.com/edge/inspect/)
* [BrowserSync](http://www.browsersync.io/)
* [Ghostlab](http://vanamco.com/ghostlab/)
* [XScope](http://iconfactory.com/software/xscope)

## Accessibility
* [A11y project](http://a11yproject.com/)
* [aria roles](http://www.w3.org/WAI/PF/aria-practices/)

## Automated Deployment

**Services**

* [Beanstalk](http://beanstalkapp.com/)
* [FTPloy](http://ftploy.com/)
* [Deploy](http://deployhq.com/)
* [Springloops](http://www.springloops.io/)
* [Wrecker](http://wercker.com/)
* [Divshot](http://divshot.com)
* [CircleCI](https://circleci.com/)

**Roll Your Own**

* [Mina](https://github.com/nadarei/mina)
* [Capistrano](https://github.com/capistrano/capistrano)

br-frontend-tooling-links

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README