shownotes_20120908

My "Other" Job
  So while I have been podcasting for almost 9 years and I have been doing it as one of my main sources of income for almost 4 years it's not all I do
  A another big part of my day is taken up with web development, but that's not a side of my life i talk about too much
  I have just completed a big project upgrading the core engine and doing a full redesign of The Mac Observer and realized that I've never really shared details on how I use my Mac in that capacity.
  Today I figured I share a little bit of that part of my life.
OS X Core is great for developers
  The awesome thing about the core of OS X is that it's BSD Unix
  That means that in addition to the great GUI we get all the power under the hood that BSD offers
  That means Apache, PHP, MySQL, Python, Ruby, PERL, you name it.
  For me this is good because I like to set up a full development environment that will mirror the sever environments that I will be deploying my web sites to
  Even though OS X is a client OS it has the power of server right there
Apache, MySQL, PHP
  Apache
  Up until Mountain Lion if you wanted to run an Apache web server all you had to do was go to System Preferences -> Sharing and turn on Web Sharing
    Obviously to serve up public facing websites you'd need to do more tricks, but flipping the switch, opening an web browser, and typing in localhost (or clicking the link from the System Preference pane) will return a web page served up by Apache
    By default pages are served from /Library/WebServer/Documents folder or if you add ~ username to the end of the URL from your ~/Sites folder
    Apache is still under the hood in Mountain Lion, but all the folders and the control panel options have been removed
      Luckily the developer of Virtual Hosts X released a free preference pane on his blog to bring the functionality back
  PHP
  To get PHP working it's a bit more work and requires some terminal hacking
    PHP is installed in OS X by default, but the module needed in Apache is disabled by default
    Finder > Go > Go to Folder…
    Open the httpd.conf file in a text editor (may want to make a backup first). Will need to enter your admin username and password.
    Look for a line that says '#LoadModule php5_module' and remove the '#' from the beginning of the line.
    I also like to add index.php to the 'dir_module' directive
      DirectoryIndex index.php default.php index.html default.html index.htm index.shtml index.shtm
    Save the file, again entering your admin credentials, and the close it
    Restart apache. System Preferences > Sharing > Disable and Re-enable Web Sharing
      If you're logged into an admin account you can also type 'sudo apachectl graceful' from the Terminal. Enter your admin password when prompted.
  MySQL
  For MySQL you can just run the installer
    Download MySQL Community Server, select the version for your OS and 32-bit vs. 64-bit
    the Mac OS X ver. 10.6 (x86, 64-bit), DMG Archive version (works fine on 10.7 and 10.8)
    Alternately you may also want to install the MySQL.prefPane, just double click it, and the MySQLStatupItem.pkg
    After you've installed it's a good idea to set a root password
      /usr/local/mysql/bin/mysqladmin -u root password 'yourpasswordhere'
  LAMP GUI tools
    VirtualHost X
      Also have the "Lift Off" service to allow reverse SSH back to local Mac so you can host and share with clients USD $10/mo.
      Can do the same thing for free on your own, but this makes it easy.
      DynDNS Pro $20.00/yr. and router port forwarding is also an option
    MAMP and MAMP Pro
Software and Tools
  TextMate
    This has been my code editor of choice for years
    Open my website folder and save it as a project.
      This lets you save custom project configurations
      Opening a folder or project gives you a project panel which hows all the folders and subfolders
    Textmate has a bunch of customizations you can do including color schemes for code highlighting, etc. There are also 'Bundles' that you can find and download that add on additional features and support for additional languages
    When you open a file with a particular extension it will recognize that and set the language to the appropriate bundle and syntax.
    Code completion by starting to type a command and pressing 'Esc'. Press multiple times to cycle through possible commands
    Many command have 'Tab triggers' where typing the command + tab will expand out entire code blocks or frameworks
      html:5 + tab = set up full html structure for HTML 5 page
      class + tab = sets up a php class block, including the shell for the class and constructor function
      lorem + TAB to insert placeholder text
    Useful command
      Cmd + T: Start typing name of a file to open it
      Cmd + Shift + T: Search for a function/class name in current file
      Ctrl + W: Select word currently under the cursor
      Ctrl + Shift + W: wrap the current selection in tabs (type the tag after it's wrapped)
      Cmd + R: Run the php-script that is open
      Hold the opt key: To make vertical selections
      Ctrl + H to get the PHP docs for a function the cursor is currently in
      Option + F1 to get tooltip style docs for selected function.
  Sublime Text 2
    I had been anxiously awaiting the arrival of TextMate 2, but the developer abandoned the project and open sourced it. Which is good, but I don;t like to compile my own OS X apps, so I'm switching to Sublime Text 2
    It's fast. My biggest complain with the current 1.X version of Textmate
    Supports all the Textmate themes
    Also has it's own "packages" that can add on additional functionality.
      Easiest way to find add and install Sublime Text 2 packages is to get wbond Package Control
      Once installed you can type Command + Shift + P in Sublime to command and type 'Package Control" and select 'List Packages' to see whats available to install
    You can use packages to customize the 'theme' (how the editor looks i.e. tabs, project manager, etc) and the Color Schemes (code highlighting).
    Open folders as projects with a file list on the right. Can save projects to retain project specific settings.
    Access commands (snippets, convert case, sort lines, and toggle various interface options, etc.) from the command palette, Command + Shift + P
    Command + P (works like Command + T does in Textmate). Go to file to jump right to a particular file in a project.
      Begin typing a file name and it filters the list
      Select the file from the list to 'Preview' it. Hit enter to load it in the editor
      add the @ and go directly to an id, class, or function to jump right to that when you open the file. You can also use Command + R when you are in a file to bring up the 'Go To File' palette with the @ already in place to search for an id, class, or function
      Use a '#' to search the tree of an HTML document
      adding a : (colon) in the 'Go To Palette' will let you jump to a specific line. Command + G in an existing file goes the same thing
    Muliti-Selection
      Hold down the Command key and click to place cursors in multiple locations in a file
        Press Command + D to expand the cursor selection to the word
        Type to make the same change all locations at the same time. Awesome if you've copied and pasted a piece of text throughout a file with the same typo.
      Place the cursor over a particular word, and press Control/Command + D repeatedly to select additional occurrences of that word.
    Project navigation
      When selecting a file in the Project list just clicking it will "preview it" in the main pane
      Double click the file to actually open it in the editor.
  Transmit
    I have been using this as my FTP client of choice for years
    I like the ability to set up folders, so I can organize sites for clients and projects
    Connects to FTP, SFTP (ssh), S3, and WebDAV
    Has Quicklook built in, great for checking remote images
    Sync feature to 'merge'
    Set up rules for skipping files. Config or HTACCESS files. Image folders, uploads, cache. etc.
  CSS Edit, now Espresso
    Still use this for debugging CSS
    Can load a web page then use the X-ray feature to highlight a element in the tree
    Load or extract the CSS file, or even have it extract the css into a new stylesheet so you can play around and override
    There is a breadcrumb trail of the tree so you can move up and down nested tags.
    Info panel to add tags
    drag and drop to reorganize elements
  CodeKit
    Rather than use CSS I've recently been dabbling in using LESS and SASS, but these need to be complied back down to CSS
    Codekit handle that. Will do Less, Sass, Stylus, Jade, Haml, Slim, CoffeeScript, Javascript and Compass
    Also does validation and debugging using JSHint and JSLint
    Image optimizations
    Live updates the browser after a SASS compile
    When ready to go live I can combine and minify the working files for deployment.
  Terminal
    Applications > Utilities > Terminal
    Mainly used for SSH so I can remotely connect to an mange my servers
  Console
    Applications > Utilities > Console
    Apache will log all errors, including PHP when you have enable PHP logging
    Logs are under the /var/log/apache2 section on the left. May need to expand it.
    Use the search to filter the errors
  1Password
    This is where I manage and store all those logins I need for projects
    Control panel logins, SSH logins, MySQL server names and passwords, FTP accounts and info
    Using the appropriate 'Type' when creating a new entry is key
      Logins -> for website logins
      Accounts -> FTP, SSH, MySQL, Email, ISP
    Organized into folder by client
    Use secure notes for additional sensitive information related to a project
  Git and Github
    Source code version control
    GitHub has instructions for setting up
    You can actually use Git without Github
      Local "repository" keeps track of changes each time you commit a file to it.
      Works very much like Apple's versions in OS X Lion
      Only keeps track of the things that have changed
      Can revert back to any point
    GitHub's Git app gives you a visual tool for:
      Creating new local repositories
      Committing and managing files in your repository
      Viewing file history
      Cloning or forking repositories from GitHub
      Syncing files with the remote GitHub repository
    The github Git app is fairly basic and limited
      Full git functionality is available from the command line
      Also Apps like Tower seem more full featured
  Markdown
    I have begun to take most of my notes and do documentation using Markdown
    I write this in Sublime Text and then use the awesome Marked app for live previewing it
    I recently discover ByWord, which looks like an awesome editor for Markdown files
      Versions for iOS and Mac
    The beauty of markdown is that everything is in human readable TXT files that I can then convert to HTML, RTF, or even formatted PDF using Marked
    Marked offers some great stock styles and you can even make your own since it's just CSS
    I will often store my documentation files and project notes as markdown on dropbox since so many of my iOS apps and my macs have access to those files.