SHOW YOURDEVELOPER TOOLSStefan Didakhttp://www.stefandidak.com(“not a web developer”)the “and the kitchen sink too” versio...
HOLD ONTOYOUR SEATThis presentation will commence at Warp 11 speedDue to time restraints I will not be going into how to i...
NOT A WEB DEVELOPERThe first thing I did was SEARCH for the best tools!Every job requires the right tool.How do you find the...
UHM... OK....Something about “real developers” and those that callthemselves “developers”... and why I don’t do public spe...
REALITY CHECKNot being a “web developer” doesn’t mean we can’t teach “webdevelopers” a thing or two. Or three, or four, or...
ISTHISYOUR DEVTOOL?Good for you!Saturday, June 15, 13
OR IS IT MORE LIKETHIS?Unfortunately this is what an awful lot of “developers” use!Saturday, June 15, 13
THETOPICSWhat we’ll be covering in this session todayHow to develop LOCALLY... and WHYVarious LAMP stacks and Virtualizati...
FAVORITE FEATURESBut there are just too many to cover todaySaturday, June 15, 13
LIVE DEMODepending on what JetBrains will showGreat debugger integrationRefactoring tools for PHPAutomatically formatting ...
BECAUSE LOCAL IS FAST!Save yourself some time and work at lightning speedHow to developLOCALLY...the WHY part!Saturday, Ju...
BECAUSE LOCAL JUST RULESTry to avoid working on LIVE sites, always!Safer than messing with a live siteFaster than working ...
WAYSTO DEVELOP LOCALLYYou decide how much time or money you wish to investA LAMP installation on your system(local install...
LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedMAMPMAMP PROFor Apple OSX...and things like Homebrew...or j...
LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedXAMPPWAMPFor Windows...and M$ Web Platform Installer...or j...
LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedThe GOOD:You only need one computer to do it all......but c...
LAMPVIRTUAL MACHINEBecause virtualization is the best invention since sliced bread“Virtualization for Dummies”Run multiple...
LAMPVIRTUAL MACHINEBecause you get to decide which solution works best for youMicrosoft Hyper-V (Windows),VMware Workstati...
LAMPVIRTUAL MACHINERun one or more OS’es as if they were “real”.Saturday, June 15, 13
LAMPVIRTUAL MACHINESafely experiment, develop, and test, while you control theenvironment that your stuff is running on, o...
LAMPVIRTUAL MACHINE(S)Why stop at just one when you can have as many as yoursystem resources will allow you to run?Saturda...
LAMPVIRTUAL MACHINE(S)VMware Workstation running several LAMP/Linux serversSaturday, June 15, 13
LAMPVIRTUAL MACHINESANDBOXING IS NOTTHE SAME AS AVIRTUAL MACHINESaturday, June 15, 13
LAMPVIRTUAL MACHINEA small LAMPVM can run on as little as 512MB of RAM.The GOOD:Isolated from your main system.Control ove...
LAMPVIRTUAL MACHINEThe mother of all UNDO functionsSNAPSHOTSImagine messing up your systemto the point of having a total l...
DEDICATED/VIRTUAL LOCALWhether you run on bare metal or virtualize it allStep 1Repurpose or buy a suitable computerStep 2I...
DEDICATED/VIRTUAL LOCALThis Big? Well... if you want to, sure, why not! :-)How Big?Saturday, June 15, 13
DEDICATED/VIRTUAL LOCALLike 3 pizza boxes... my “mini” virtual server web-dev clusterHow Small?Saturday, June 15, 13
DEDICATED/VIRTUAL LOCALHaving your “development servers” in the cloud is not alwaysthe most cost effective way to do thing...
DEDICATEDTINY LOCALSmall Atom’s with 4GB RAM and 120GB SSD’s.Perfect for small LAMP servers. Runs about $300-400.How Much?...
VIRTUAL LOCALThe advantages never stop and there’s too much to list!Try NGINX instead of Apache to create yourself aLEMP (...
DEDICATED/VIRTUAL LOCALThe learning curve for building and managingVM’s locally isreally not that bad. Really.Try it and b...
SETUP A LAMP SERVERLAMP = Linux,Apache, MySQL, PHPUnfortunately we will not have time forthat today so if there is enough ...
A LOCAL SITE COPYWhether you work on a local copy of a live site or developthe site locally for later deployment to a live...
METHOD ONEUse the MySQL client command line or ensure you havephpMyAdmin installed on your local serverStep 1Get a copy of...
METHODTWOI’ve done this also but still prefer the manualcontrol provided by method one.Step 1Install a Backup Plugin(ithem...
EDIT WP-CONGIF.PHPFor your local server you probably will need to edit thewp-config.php file.define(DB_NAME, myclientsite);de...
BUTYOU’RE NOT DONEYET!Just copying the site’s files and DB to a local server doesnot make it magically work.Your system/com...
EDITINGYOUR HOSTS FILEYou can find the hosts file in C:Windowssystem32driversetcon Windows and /etc/hosts on OSX10.0.2.80 my...
ALLTHIS LOCAL STUFF WHY?Local servers allow you to use the tools they were intended to!XDEBUGDebugging, Profiling, TracingL...
XDEBUG / ZEND DEBUGGERBecause your using a rock to hammer nails rather than ahammer! Stop using a rock dammit!THIS IS YOUR...
XDEBUG / ZEND DEBUGGERDon’t get lost. Get debugging!This is your brain WITHOUT XDEBUGSaturday, June 15, 13
“WHY LOCAL” YOU ASKED?Don’t try using XDEBUG on a remote server.You’ll be sorry you tried.XDEBUG is an Apache Moduleand ne...
LIVE XDEBUG DEMORunning off a 15” Mac Retina, 16GB RAM, 768GB SSDwith a 4GB RAM LAMP server onVMware FusionDebugging into ...
PROFILING = PINPOINTINGI would still not want XHPROF running all the timewithin a production environmentXHPROF is an Apach...
PROFILING LIVE DEMOStill running off a 15” Mac Retina, 16GB RAM, 768GB SSDwith a 4GB RAM LAMP server onVMware FusionXHPROF...
VERSIONINGIf you don’t use versioning of any kind......stop calling yourself a developer, please!Saturday, June 15, 13
SCM, RCS,VCS,WHATEVER!There are many version control systems out there, too many tomention and too many to cover here.Subv...
YOUR CLIENT APPOr go hard core and use the command line like“real” developers do!Tortoise SVN, Tortoise GIT,Tortoise HG (f...
WHAT DO I NEED?Personal preference dominates the versioning spectrum.Use what you or your team are most comfortable with.S...
WHY HOW WHAT HUHVersioning is not a science (well, it might be!) but whatever youdo make sure you’re doing it.There is no ...
DOING IT IN STYLE!CSS should be the end point that is generated,not the “language” you should directly interact with.Satur...
SCSS, SASS, LESSLots of differences between SCSS/SASS and LESSBut also much of the same conceptAll the things you MISS in ...
SCSS, SASS, LESSHigh adoption rate!Lots of support provided by theeditor you use.Syntax highlightingIntelligent editing su...
SCSS, SASS, LESSToo much to tell and too little time since this couldeasily fill several meetups worth of time.Personal Pre...
SCSS, SASS, LESSVARIABLES$red: #cc0000;$margin: 20px;.content-block {border-color: $red;color: darken($red, 15%);}.border ...
SCSS, SASS, LESSVARIABLES$red: #cc0000$margin: 20px.content-blockborder-color: $redcolor: darken($red, 15%).borderpadding:...
SCSS, SASS, LESSVARIABLES$red: #cc0000;$litered: (@red + #222);.content-block {border-color: @red;color: @litered;}Saturda...
SCSS VERSUS CSSSELECTOR INHERITANCE.content {border: 1px #f00;background: #fcc;}.thick-content {@extend .content;border-wi...
SCSS VERSUS CSSNESTING - Efficient and improves readability and maintenance#navbar {width: 80%;height: 23px;ul { list-style...
SCSS VERSUS CSSNESTING - Efficient and improves readability and maintenance#navbar {width: 80%;height: 23px;}#navbar ul {li...
SCSS, SASS, LESSUsing PHPStorm and FileWatchers to automatically“transpile” SCSS, SASS, LESS, into CSS files.Saturday, June...
BONUS DEVELOPERTOOL 1Sennheiser HD800 - a must have if you’re serious!THE FUN PART OF FINISHING THISSaturday, June 15, 13
BONUS DEVELOPERTOOLS 2You’ll need many of these when you develop for real! :-)Single Malt ScotchHi Stefan!TequilaHi Kelly!...
DOWNLOADTHE SLIDESBecause all of this must have gone way too fast for you!http://eastbaywp.com/Saturday, June 15, 13
LINKINGTOTHE ENDBYE BYE! See y’all next month... unless you kill me...THANKS FOR HAVINGME BORE THE LIVING...something OUT ...
THINGS MENTIONED (1/2)In case you want to go look stuff up for yourselfJetBrains PHPStormhttp://www.jetbrains.com/phpstorm...
THINGS MENTIONED (2/2)In case you want to go look even more stuff up for yourselfVisual SVN (Windows)http://www.visualsvn....
QUESTIONSBecause I’m sure there’ll be some!Saturday, June 15, 13
Upcoming SlideShare
Loading in …5
×

Real Developer Tools for WordPress by Stefan Didak

1,998 views

Published on

Indispensable tools for development of WordPress sites, including PhpStorm, xDebug, XHProf, and Subversion

Published in: Technology, Design
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,998
On SlideShare
0
From Embeds
0
Number of Embeds
91
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Real Developer Tools for WordPress by Stefan Didak

  1. 1. SHOW YOURDEVELOPER TOOLSStefan Didakhttp://www.stefandidak.com(“not a web developer”)the “and the kitchen sink too” versionSaturday, June 15, 13
  2. 2. HOLD ONTOYOUR SEATThis presentation will commence at Warp 11 speedDue to time restraints I will not be going into how to installthings, how to configure things, or what best practices are bestapplied when dealing with the things we’ll be covering today.You’re encouraged to check the slides on the website, followthe links and whatever you do... DOTRYTHIS AT HOME!Saturday, June 15, 13
  3. 3. NOT A WEB DEVELOPERThe first thing I did was SEARCH for the best tools!Every job requires the right tool.How do you find the right tools?What are the right tools?Depends on WHO you ASK!Saturday, June 15, 13
  4. 4. UHM... OK....Something about “real developers” and those that callthemselves “developers”... and why I don’t do public speaking.Saturday, June 15, 13
  5. 5. REALITY CHECKNot being a “web developer” doesn’t mean we can’t teach “webdevelopers” a thing or two. Or three, or four, or five...A “real” developer issomeone who......owns domains like arealdeveloper.com, like me! :-)...develops the tools YOU USE and the software thatruns the servers YOU and YOUR CLIENTS run on.Saturday, June 15, 13
  6. 6. ISTHISYOUR DEVTOOL?Good for you!Saturday, June 15, 13
  7. 7. OR IS IT MORE LIKETHIS?Unfortunately this is what an awful lot of “developers” use!Saturday, June 15, 13
  8. 8. THETOPICSWhat we’ll be covering in this session todayHow to develop LOCALLY... and WHYVarious LAMP stacks and VirtualizationDeveloping CODETools, Editing, Debugging, Profiling, Managing,Versioning, and more...Doing it in STYLESCSS, SASS, LESS, Compass, etc.Saturday, June 15, 13
  9. 9. FAVORITE FEATURESBut there are just too many to cover todaySaturday, June 15, 13
  10. 10. LIVE DEMODepending on what JetBrains will showGreat debugger integrationRefactoring tools for PHPAutomatically formatting codeFile Watches to process filesVersioning integration & supportUnit Testing (if you’re into thatTDD crap :-)Saturday, June 15, 13
  11. 11. BECAUSE LOCAL IS FAST!Save yourself some time and work at lightning speedHow to developLOCALLY...the WHY part!Saturday, June 15, 13
  12. 12. BECAUSE LOCAL JUST RULESTry to avoid working on LIVE sites, always!Safer than messing with a live siteFaster than working on a remote serverWill work for you if your internet/host is downBackups and local CONTROLFull control over EVERYTHINGResources are YOURS to defineEasier testing and faster to undo a screwupAnd many more reasons...Saturday, June 15, 13
  13. 13. WAYSTO DEVELOP LOCALLYYou decide how much time or money you wish to investA LAMP installation on your system(local install or another system you’ve got)Virtual Machine with a LAMP stack(local install or another system you’ve got)Dedicated or Virtual LOCAL HOSTING(the ultimate freedom and power)Saturday, June 15, 13
  14. 14. LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedMAMPMAMP PROFor Apple OSX...and things like Homebrew...or just installing things yourself...or just compiling your own builds...or all of those are just a PITASaturday, June 15, 13
  15. 15. LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedXAMPPWAMPFor Windows...and M$ Web Platform Installer...or just installing things yourself...or just compiling your own builds...or all of those are just a PITASaturday, June 15, 13
  16. 16. LAMP ONYOUR SYSTEMMany solutions from free to moderately pricedThe GOOD:You only need one computer to do it all......but could be tweaked to run on another.Great to take along to do live demos.All the other good stuff about doing it locally.The BAD:Smaller systems may get slow(...er).The better local LAMP solutions aren’t free.Saturday, June 15, 13
  17. 17. LAMPVIRTUAL MACHINEBecause virtualization is the best invention since sliced bread“Virtualization for Dummies”Run multiple OS’es......without crappy “dual boot” stuffSaturday, June 15, 13
  18. 18. LAMPVIRTUAL MACHINEBecause you get to decide which solution works best for youMicrosoft Hyper-V (Windows),VMware Workstation (Windows),VMware ESX (Server based), VMwareFusion (Apple OSX), VMware Server(obsolete), Oracle VM, Sun xVM,Virtuozzo Containers, OpenVZ,Xen, KVM, VServer,VirtualBox, ...and more.Saturday, June 15, 13
  19. 19. LAMPVIRTUAL MACHINERun one or more OS’es as if they were “real”.Saturday, June 15, 13
  20. 20. LAMPVIRTUAL MACHINESafely experiment, develop, and test, while you control theenvironment that your stuff is running on, or in.ISOLATIONDoes notinterfere withyour actual OSon the systemSaturday, June 15, 13
  21. 21. LAMPVIRTUAL MACHINE(S)Why stop at just one when you can have as many as yoursystem resources will allow you to run?Saturday, June 15, 13
  22. 22. LAMPVIRTUAL MACHINE(S)VMware Workstation running several LAMP/Linux serversSaturday, June 15, 13
  23. 23. LAMPVIRTUAL MACHINESANDBOXING IS NOTTHE SAME AS AVIRTUAL MACHINESaturday, June 15, 13
  24. 24. LAMPVIRTUAL MACHINEA small LAMPVM can run on as little as 512MB of RAM.The GOOD:Isolated from your main system.Control over your entire environment & config.Snapshots and “undo”.The BAD:Smaller systems may not be capable.Can get very resource hungry.The betterVM solutions aren’t free.Saturday, June 15, 13
  25. 25. LAMPVIRTUAL MACHINEThe mother of all UNDO functionsSNAPSHOTSImagine messing up your systemto the point of having a total loss...... and then undoing it all withone clickSaturday, June 15, 13
  26. 26. DEDICATED/VIRTUAL LOCALWhether you run on bare metal or virtualize it allStep 1Repurpose or buy a suitable computerStep 2Install a LAMP stack or VM solutionStep 3Start using it.How Big? How Small? How Much?Saturday, June 15, 13
  27. 27. DEDICATED/VIRTUAL LOCALThis Big? Well... if you want to, sure, why not! :-)How Big?Saturday, June 15, 13
  28. 28. DEDICATED/VIRTUAL LOCALLike 3 pizza boxes... my “mini” virtual server web-dev clusterHow Small?Saturday, June 15, 13
  29. 29. DEDICATED/VIRTUAL LOCALHaving your “development servers” in the cloud is not alwaysthe most cost effective way to do things.Three Quad Core Xeon’s each with16GB RAM, 250GB SSD’s and 2TBRAID1 storage.Can host +/- 35-65virtual machines for developmentpurposes. Low power consumption.Costs +/- $4000 to OWN.But +/- $800 to $1500 A MONTH (at aVM/VPS/VHost)Saturday, June 15, 13
  30. 30. DEDICATEDTINY LOCALSmall Atom’s with 4GB RAM and 120GB SSD’s.Perfect for small LAMP servers. Runs about $300-400.How Much?Saturday, June 15, 13
  31. 31. VIRTUAL LOCALThe advantages never stop and there’s too much to list!Try NGINX instead of Apache to create yourself aLEMP (not LAMP) server.Install and experiment with PHP APC,memcached, Varnish, and all the other coolperformance boosters.Be able to MAKE PROPER USE of the manygreat developer tools that are out there.Saturday, June 15, 13
  32. 32. DEDICATED/VIRTUAL LOCALThe learning curve for building and managingVM’s locally isreally not that bad. Really.Try it and be pleasantly surprised.The GOOD:Everything mentioned on slide 19.Endless possibilities going virtual.Highest speed and performance.Online/hosted servers are no match for it.The BAD:Hardware isn’t free.You will have to invest.There’s a learning curve.You will invest time also.Saturday, June 15, 13
  33. 33. SETUP A LAMP SERVERLAMP = Linux,Apache, MySQL, PHPUnfortunately we will not have time forthat today so if there is enough interestin the topic I might be persuaded tocome back and cover that topic.It is not really that difficult.If you know how to copy and paste you canget quite far!Saturday, June 15, 13
  34. 34. A LOCAL SITE COPYWhether you work on a local copy of a live site or developthe site locally for later deployment to a live serverHow to create aLOCAL copyof a LIVE siteSaturday, June 15, 13
  35. 35. METHOD ONEUse the MySQL client command line or ensure you havephpMyAdmin installed on your local serverStep 1Get a copy of the MySQL DB(command line, phpMyAdmin, etc.)Step 2Get a copy of all the files for the site(through sFTP, FTP, etc.)Step 3Copy the files to your local server &import the MySQL DB into your localserver’s MySQL instanceSaturday, June 15, 13
  36. 36. METHODTWOI’ve done this also but still prefer the manualcontrol provided by method one.Step 1Install a Backup Plugin(ithemes BackupBuddy works really well and is highly popular)Step 2Use the Backup PluginStep 3Restore the backup to your local serverSaturday, June 15, 13
  37. 37. EDIT WP-CONGIF.PHPFor your local server you probably will need to edit thewp-config.php file.define(DB_NAME, myclientsite);define(DB_USER, myclientsitedbuser);define(DB_PASSWORD, magicpass);define(DB_HOST, localhost);Saturday, June 15, 13
  38. 38. BUTYOU’RE NOT DONEYET!Just copying the site’s files and DB to a local server doesnot make it magically work.Your system/computer does not knowyet where to find the local copy of thesite because DNS resolution will causeyour browser to see the actual remoteand live site.Let’s take care of that...Saturday, June 15, 13
  39. 39. EDITINGYOUR HOSTS FILEYou can find the hosts file in C:Windowssystem32driversetcon Windows and /etc/hosts on OSX10.0.2.80 my.supersite.comAdd a single line to your hosts filecontaining the IP address of your localdevelopment server and the FQDN ofyour site.Saturday, June 15, 13
  40. 40. ALLTHIS LOCAL STUFF WHY?Local servers allow you to use the tools they were intended to!XDEBUGDebugging, Profiling, TracingLive demo using JetBrains PHPStormXHPROFReally seeing what’s going onLive demo on profiling with XHPROFSaturday, June 15, 13
  41. 41. XDEBUG / ZEND DEBUGGERBecause your using a rock to hammer nails rather than ahammer! Stop using a rock dammit!THIS IS YOUR BRAIN... (we hope)Saturday, June 15, 13
  42. 42. XDEBUG / ZEND DEBUGGERDon’t get lost. Get debugging!This is your brain WITHOUT XDEBUGSaturday, June 15, 13
  43. 43. “WHY LOCAL” YOU ASKED?Don’t try using XDEBUG on a remote server.You’ll be sorry you tried.XDEBUG is an Apache Moduleand needs to be installed on the serverYou will need full control on your serverNot possible on shared hostingNot possible on managed hostingNot feasible on VPS/Virtual hostingNot sensible in a production environmentSaturday, June 15, 13
  44. 44. LIVE XDEBUG DEMORunning off a 15” Mac Retina, 16GB RAM, 768GB SSDwith a 4GB RAM LAMP server onVMware FusionDebugging into a WordPress PluginDebugging into a WordPress ThemeDebugging is the same for any PHP codeand not WordPress specific. Debug stepping throughWordPress itself helps you learn, understand, and attimes makes you feel appalled at what you see!Saturday, June 15, 13
  45. 45. PROFILING = PINPOINTINGI would still not want XHPROF running all the timewithin a production environmentXHPROF is an Apache Module(originally developed by Facebook to deal with PHP performance issues)and needs to be installed on the serverYou will need full control on your serverNot possible on shared hostingNot possible on managed hostingIS possible in a production environmentSaturday, June 15, 13
  46. 46. PROFILING LIVE DEMOStill running off a 15” Mac Retina, 16GB RAM, 768GB SSDwith a 4GB RAM LAMP server onVMware FusionXHPROFPinpoint bottlenecks.Pinpoint badly performing code.Pinpoint site/page performance issues.Pinpoint which developer to blame.Pinpointing.Get the point here?Saturday, June 15, 13
  47. 47. VERSIONINGIf you don’t use versioning of any kind......stop calling yourself a developer, please!Saturday, June 15, 13
  48. 48. SCM, RCS,VCS,WHATEVER!There are many version control systems out there, too many tomention and too many to cover here.Subversion (SVN), GIT, CVS, Mercurial,Perforce, and many others...Even if you’re not part of a team and workingalone, use versioning and use it religiously.Plan your repository ahead of time to avoid anasty mess as development progresses overtime. You’ll thank me for it later.Saturday, June 15, 13
  49. 49. YOUR CLIENT APPOr go hard core and use the command line like“real” developers do!Tortoise SVN, Tortoise GIT,Tortoise HG (for Mercurial),CornerStone (OSX)(personal recommendation for Subversion)There are so many, both free or commercial there’s noway I can even begin to mention the top 50.Try some out and see what you like.Saturday, June 15, 13
  50. 50. WHAT DO I NEED?Personal preference dominates the versioning spectrum.Use what you or your team are most comfortable with.Step 1Deploy a versioning serverStep 2Setup your repositoriesStep 3Install a client for what you pickedStep 4Always backup your repository!Saturday, June 15, 13
  51. 51. WHY HOW WHAT HUHVersioning is not a science (well, it might be!) but whatever youdo make sure you’re doing it.There is no info on this slide becausethis is such a BIG TOPIC to cover that I’m justgoing to “wing it” live and not have any helpful hintson this slide.I HOPE that everyone already uses versioning ofsome sort. If not, those folks can line up outside of thevenue here for mandatory execution and/or hot-coal and/or flogging “treatment” to deal with this“ailment”. :-)Saturday, June 15, 13
  52. 52. DOING IT IN STYLE!CSS should be the end point that is generated,not the “language” you should directly interact with.Saturday, June 15, 13
  53. 53. SCSS, SASS, LESSLots of differences between SCSS/SASS and LESSBut also much of the same conceptAll the things you MISS in CSSVariablesNested RulesMixinsFunctionsSelector InheritanceControl (i.e. if, for, while...)Math (i.e. border-size * 2)Saturday, June 15, 13
  54. 54. SCSS, SASS, LESSHigh adoption rate!Lots of support provided by theeditor you use.Syntax highlightingIntelligent editing support“Transpilation” support in a growingnumber of editors/IDE’s.Saturday, June 15, 13
  55. 55. SCSS, SASS, LESSToo much to tell and too little time since this couldeasily fill several meetups worth of time.Personal PreferenceSCSS/SASSCommand line......or through utility applications...or through your editor/IDESaturday, June 15, 13
  56. 56. SCSS, SASS, LESSVARIABLES$red: #cc0000;$margin: 20px;.content-block {border-color: $red;color: darken($red, 15%);}.border {padding: $margin / 2;margin: $margin / 2;border-color: $red;}Saturday, June 15, 13
  57. 57. SCSS, SASS, LESSVARIABLES$red: #cc0000$margin: 20px.content-blockborder-color: $redcolor: darken($red, 15%).borderpadding: $margin / 2margin: $margin / 2border-color: $redSaturday, June 15, 13
  58. 58. SCSS, SASS, LESSVARIABLES$red: #cc0000;$litered: (@red + #222);.content-block {border-color: @red;color: @litered;}Saturday, June 15, 13
  59. 59. SCSS VERSUS CSSSELECTOR INHERITANCE.content {border: 1px #f00;background: #fcc;}.thick-content {@extend .content;border-width: 5px;}.content,.thick-content {border: 1px #f00;background: #fcc;}.thick-content {border-width: 5px;}Saturday, June 15, 13
  60. 60. SCSS VERSUS CSSNESTING - Efficient and improves readability and maintenance#navbar {width: 80%;height: 23px;ul { list-style-type: none; }li {float: left;a { font-weight: bold; }}}Saturday, June 15, 13
  61. 61. SCSS VERSUS CSSNESTING - Efficient and improves readability and maintenance#navbar {width: 80%;height: 23px;}#navbar ul {list-style-type: none;}#navbar li {float: left;}#navbar li a {font-weight: bold;}Saturday, June 15, 13
  62. 62. SCSS, SASS, LESSUsing PHPStorm and FileWatchers to automatically“transpile” SCSS, SASS, LESS, into CSS files.Saturday, June 15, 13
  63. 63. BONUS DEVELOPERTOOL 1Sennheiser HD800 - a must have if you’re serious!THE FUN PART OF FINISHING THISSaturday, June 15, 13
  64. 64. BONUS DEVELOPERTOOLS 2You’ll need many of these when you develop for real! :-)Single Malt ScotchHi Stefan!TequilaHi Kelly!BourbonHi Mitch!BeerHi Andrei!Saturday, June 15, 13
  65. 65. DOWNLOADTHE SLIDESBecause all of this must have gone way too fast for you!http://eastbaywp.com/Saturday, June 15, 13
  66. 66. LINKINGTOTHE ENDBYE BYE! See y’all next month... unless you kill me...THANKS FOR HAVINGME BORE THE LIVING...something OUT OF YOU!LINKS AHEAD...Saturday, June 15, 13
  67. 67. THINGS MENTIONED (1/2)In case you want to go look stuff up for yourselfJetBrains PHPStormhttp://www.jetbrains.com/phpstorm/MAMP and MAMP PROhttp://www.mamp.infoXAMPPhttp://www.apachefriends.org/en/xampp.htmlWAMP SERVERhttp://www.wampserver.com/en/Microsoft Web Platform Installerhttp://www.microsoft.com/web/downloads/platform.aspxVMware (VMware ESX, VMware Workstation, VMware Fusion)http://www.vmware.com/Parallels Desktophttp://www.parallels.com/products/desktop/Virtualization Solutionshttp://www.cyberciti.biz/tips/linux-virtualization-software.htmlMore on Virtualization and Sandboxinghttp://goo.gl/PESjoVarnishhttps://www.varnish-cache.org/Memcachedhttp://memcached.org/PHP APChttp://php.net/manual/en/book.apc.phpXDEBUGhttp://xdebug.org/Zend Debugger, Zend Server, Zend Studiohttp://www.zend.comXHPROFhttps://github.com/facebook/xhprofXHGUIhttps://github.com/preinheimer/xhprofithemes BackupBuddyhttp://ithemes.com/purchase/backupbuddy/anything I forgot to add here... simple... google itSaturday, June 15, 13
  68. 68. THINGS MENTIONED (2/2)In case you want to go look even more stuff up for yourselfVisual SVN (Windows)http://www.visualsvn.com/Subversion (SVN)http://subversion.apache.org/Tortoise SVN (Windows)http://tortoisesvn.net/Tortoise GIT (Windows)https://code.google.com/p/tortoisegit/CornerStone (OSX)http://www.zennaware.com/cornerstone/index.phpGIThttp://git-scm.com/CVShttp://cvs.nongnu.org/Mercurialhttp://mercurial.selenic.com/Tortoise HGhttp://mercurial.selenic.com/wiki/TortoiseHgPerforcehttp://www.perforce.com/anything I forgot to add here... simple... google itSCSS & Sasshttp://sass-lang.com/LESShttp://lesscss.org/Compasshttp://compass-style.org/Compass App (OSX)http://compass.handlino.com/Atlassianhttp://www.atlassian.com/Altovahttp://www.altova.com/And finally, a “real developer’s” home office :-)http://www.stefandidak.com/office/http://www.flickr.com/photos/didak/sets/72157633152434208/http://www.flickr.com/photos/didak/sets/72157632343719954/http://www.flickr.com/photos/didak/sets/72157632244753177/Saturday, June 15, 13
  69. 69. QUESTIONSBecause I’m sure there’ll be some!Saturday, June 15, 13

×