Grunt, Gulp, Sass, Sublime, Coda, MAMP, FirefoxDeveloperEdition, Git, etc

1

So, whats your workflow?
Your OS, your software, your languages, your preprocessors, your version control, your deployment, your … everything :slight_smile:

I’m excited to hear about it!

3 Likes
2

First :smile:

I’m working on a 2015 MacBook Air connected to a 27" Thunderbolt Display in the office. I’m running Mac OX Yosemite. For years I was using the built-in Apache and PHP installations plus VirtualHostX but currently switched to MAMP Pro to simplify a couple things when I’m upgrading the OS and to test multiple PHP versions. I use SublimeText 3 for all kinds of text editing and coding, Transmit as FTP client, the Terminal, Tower for most Git stuff, Tweetbot to stay connected with you on Twitter, Fastmail as my main Email Client, Protonet as my project management tool and file storage, Debitoor for invoicing and bookkeeping, Firefox as my main Browser, DeployHQ for some deployments, Webfaction, DigitalOcean, Linode and Domaingo for hosting, a personal Gitlab installation for private repos and Github for public repos and I guess that’s about it.

3 Likes
3
  • MacBook Pro running El Capitan
  • Mamp Pro
  • Atom
  • Transmit
  • Git
  • sometimes SourceTree
  • the command line
  • Bitbucket, Github, self-hosted GitLab
  • Safari, Chrome, Firefox with several add ons
  • VirtualBox for different Browsers
  • SASS
  • Gulp, (CodeKit)
  • Adobe Creative Cloud (mainly Illustrator, Photoshop, Indesign)
  • Typekit for fonts
  • Quiver
  • LICEcap for Gifs
  • OwnCloud
  • VPS
  • …
4

This is the core of my Workflow.

  • 2014 MacBook Air
  • Atom
  • CodeKit (for scss compilation, image optimisation and browser refreshing)
  • A Kirby-Server-Automator-App to start a php server if I drop a folder on it
  • FirefoxDeveloperEdition for debugging (Chrome for standard browsing)
  • Tower for git (and deploying)
  • Transmit for everything else
  • Terminal (but I try to automate all recurring tasks)
  • AffinityDesigner for screen designs
  • Fontcase
  • Quiver for notes and code snippets
  • Todoist for tasks
  • Usage by Media Atelier to keep track of the time spent in each app
  • Papierkram for invoicing
  • …
3 Likes
5
  • Macbook Pro and Imac (Mavericks)
  • Sublime Text 3
  • Gulp
  • Sass
  • Skecth 3
  • Mamp
  • FontPrep
  • Balsamic Mockups
  • Chrome add ons
  • Photoshop
  • Illustrator
6
  • 2013 MacBook Pro Retina 13" running Yosemite connected to a HP ZR2740w
  • Used the built-in Apache at first, but quickly changed to the simple php Dev-Server for all projects
  • RVM for multiple Ruby versions/gemsets
  • Sublime Text 3 as main text editor and “IDE”
  • GitHub for OpenSource, own GitLab for private repos
  • Tower 2 as Git Client
  • Gulp for preprocessing
  • iTerm 2 with Oh-My-Zsh
  • Transmit for FTP
  • Chrome
  • Apple Mail
  • Twitter for Mac
  • Sketch, Photoshop for the occasional design mockup
  • Uberspace for Hosting
  • INWX for domains
7

Hardware

  • Mac Pro 2008 running Yosemite
  • 34" LG ultra-wide display
  • Synology Diskstation (mainly for backups, also holds my private git repositories)

Software

  • Mamp Pro
  • Atom
  • Github for Mac
  • Transmit (FTP + S3)
  • iTerm (command line)
  • Composer & Bower (vendor/asset management)
  • Gulp (for preprocessing)
  • Chrome
  • Apple Mail
  • Adobe Creative Suite

Services

  • Github
  • DeployHQ
  • Typekit

Hosting

8

Hardware

  • MacBook Pro 13" 2014 on Yosemite
  • 27" external display

Software

  • MAMP Pro
  • Sublime Text 3
  • Transmit
  • Github for Mac (tho still warming up in using git)
  • CodeKit
  • Pixelmator
  • Safari, Apple Mail…
  • YNAB for money stuff

Thingies

  • SASS + Bourbon
  • enhance.js

Hosting

  • all-inkl (thinking about switching to uberspace)
9

Late 2011 MacBook Pro, with a brand new motherboard because the old one fried just before my Applecare ended. Two SSD and 16 Gb RAM, so it’s still able to rock Yosemite.

  • built-in Apache and PHP for now
  • Atom
  • Tower
  • BrowserSync
  • Sketch 3 for websites, because it’s so much better than Photoshop for that
  • Illustrator for logos & complex illustrations, because it’s still so much better than Sketch for that
  • Photoshop (a lot less these days, because of Sketch and Lightroom)

And the usual suspects: Git, Github, Bitbucket, iTerm, Tweebot, Things…

Cheapass hosting at OVH. Should evaluate other options.

Still looking for a way to handle deployments with Kirby that works well for me.

By the way, great idea:

A Kirby-Server-Automator-App to start a php server if I drop a folder on it

1 Like
10

Hardware

  • 15" MacBook Pro (Matte Screen) - Early 2011
  • 16 GB RAM
  • 500 GB SSD

Software

  • OSX: Yosemite
  • Languages: HTML, CSS, JS, PHP, Ruby
  • Editors: Sublime Text 3, Coda 2.5, CodeRunner
  • Preprocessor: CodeKit (Sass, Susy, Bourbon)
  • Design: Sketch, Pixelmator
  • UI Tools: xScope, GluePrint
  • Documentation: Dash
  • Terminal: iTerm
  • Git Hosting: BitBucket
  • Git Client: SourceTree
  • Diff Tool: Kaleidoscope
  • Notes: Quiver, FoldingText
  • Local Server: MAMP Pro
  • Default Browser: Firefox / Firefox Developer Edition
  • Browser Testing: BrowserStack (service)
  • Project Managment: Trello
  • Hosting: A Small Orange, Dreamhost
  • Others: 1Password 5, Soulver, Clocks, Divvy, Alfred, LittleIpsum, Tweetbot, DaisyDisk, SuperDuper!, Omnigraffle, Choosy, Unibox, Fantastical, Hazel, Day One, On The Job, Transmit, Slack, Shush, Gradient
11

Shocking to see Mac is dominating.

For kirby stuff I am using

PC ( custom power saving/performance built machine roughtly clocking in at 35-50 watts average ) + Dell 27"

  • xampp
  • notepad++
  • filezilla
  • thunderbird
  • firefox
  • gimp for images
  • mostly other open source

Notebook ( 13" Macbook Pro sometime in 2010 with Core Duo 2,53 ghz maxed specs - until it’ll die)

  • not in use for development
1 Like
12

Hardware: 2011 13" Macbook Pro (Yosemite)

Browser: Firefox
Email: Mac Mail
Server: AMPPS *
Hosting: Site5, Amazon

Editor: Sublime Text 3
Design: Photoshop CC / Illustrator CC
FTP: Transmit
Database: Sequel Pro
Git: Terminal & GitHub Desktop App

Additional commonly used workflow resources include: Dash, Google, Browser Stack, Email on Acid, Node, Grunt, Grunt Browser Sync, Grunt CLI, Grunt Contrib Sass, Grunt Contrib Watch, Grunt Init, Bourbon, Neat, Bootstrap, Skrollr, ScrollMagic. Not all resources used on all projects, but ones I’ve used and would consider using again.

* I’ve experimented with a lot of other server software (Vagrant, MAMP, XAMP, Native OSX Apache, etc) but I’ve been the happiest all around with AMPPS so far.

13

I guess I’m the only one so far who runs an actual VM as a Local Server? It’s quite handy, and fairly low overhead.

Hardware: Late-2012 iMac 27"

  • 2.9gHz i5
  • 16gb RAM
  • 500gb SSD (self-installed…oh boy that was fun, but worth it++++.)

Software:

  • Yosemite
  • Debian 7 VM (VMWare Fusion) running a LAMP stack on 512MB of virtual memory and just one core; my local network DNS is configured to route all *.dev domains to the VM (very handy for mobile device testing)
  • Brackets for HTML/CSS/JS/PHP & Git
  • Adobe CC (mostly use just Photoshop and Illustrator) for Design
  • Codekit for Sass compilation, Bower modules, and JS minifying.
  • Sequel Pro for MySQL management
  • Transmit for the rare project that needs an FTP client (mostly I use SSH & Git to sync projects)
  • All the browsers.
  • Windows 7 VM with IE9 installed for Windows testing. (Image from modern.ie)
  • Apple Mail
18

A lot like Bastian, but I use Sublime SFTP to sync/upload directly from Sublime Text.

21

My current setup…

Hardware

• 2010 15" MacBook Pro ( …upgrading this year :slight_smile: )
• 2014 10" Lenovo touchscreen Win8 laptop ( I prefer a “live” PC to a VM for testing )

Software

• MAMP (Mac/PC)
• Brackets (PC)
• Tower (Git)
• Kaleidoscope (Diff)
• BBEdit
• Coda 2
• Transmit
• CodeKit
• Ghostlab
• Sketch
• xScope
• Firefox dev tools
• iA Writer Pro

New Kirby site currently in progress! :wink:

22

Whee, fun.

Hardware

Computer: Early 2011 13" Macbook Pro 13"(Yosemite) with a SSD in place of the CD drive (scary installation but totally worth it!)
External Monitor: 24" Apple Cinema Display
External Drive: 1TB MyPassport Ultra
Fun: Wii U bluetooth controller (I don’t even own a Wii but this controller is flawless)

Software

Design: Sketch 3 (if you’re still using Photoshop for UI design buy Sketch ASAP… going back to Adobe is painful for me at this point)
Server: MAMP
Editor: Sublime Text 3
Git: GitHub for Mac
Magic: CodeKit
FTP: Transmit
Browser: Chrome/Safari, depending on which one is giving me more of a headache
Productivity: Apple Mail, Calendar, and Notes
Fun: OpenEmu :smile:

Hosting: A Small Orange

23

Here is my stuff and things

  • Computer: Mid 2011 Macbook Pro 17" Yosemite
  • Coding:
    • Atom
    • Chocolat (if Atom starts being a CPU hog)
    • Gulp, Npm, Scss, Jade, Jeet, Bower and others
    • iTerm
    • Bitbucket
    • Dash for snippets and code brain
    • OSX Apache + VirtualhostX
  • Design:
    • Sketch 3,
    • Affinity Designer,
    • Pixelmator
    • (Playing around with) Affinity Photo Beta
  • Other Apps:
    • Safari Browser
    • Omnifocus
    • Mailbox (beta)
    • Pixa (image management)
    • Forklift for FTP and file management
24

Well, lets see…

First of all, nearly everything here starts with pen and paper. I’m mostly using a Koh-I-Noor pencil with a very thick core and my Leuchtturm A4 notebook. Very analougish I think, but this helps me, to break things down, sketching designs, graphs, flowcharts, notes etc etc.

And then there are the digital tools:

  • Macbook Air 13" (Mid '13) with a Thunderbolt Display 27" and a Tragic Macpad
  • Sublime for all coding stuff
  • Codekit for all those Preprocessors (I’m still using LESS for the most projects)
  • Photoshop and Illustrator for graphic “preprocessing”
  • Transmit for sFTP Uploads
  • Terminal for… you know… terminalstuff
  • Tower is my Git client of choice
  • Sequel for digging into MySQL databases
  • MAMP for running PHP and MySQL locally
  • VMWare allows me to test on various Windows systems with various browsers
  • as we speak about browsers: My primary browser at the moment is Firefox

For organizing my work there are some other tools

  • Mail

  • Slack (for team correspondance)

  • Tyme for tracking time

  • YNAB for bookkeeping

  • Bill for writing Invoices

  • Umsatz for the Umsatzsteuervoranmeldung

  • Pecunia to avoid the buggy onlinebanking of the Sparkasse

25

Hardware

15" Retina Macbook Pro

Software

  • MAMP
  • Coda 2.5
  • Sublime Text 3
  • Git
  • Terminal
  • Safari
  • Less, Sprockets, UglifyJS as Preprocessors
  • Pixelmator
  • Byword
  • Day One
  • Slack

Hosting

  • Rackspace Cloud Servers
29

To keep it short and simple I’ll just link to my site where I wrote about my setup. I also posted some workflowish thoughts a few months ago.

3 Likes