command line for designers - wordcamp philly
TRANSCRIPT
THE COMMAND LINE FOR DESIGNERSTHE COMMAND LINE FOR DESIGNERSIntro to
Presented by / Lauren Pittenger @laurenpittenger
Slides: bit.ly/command-line-for-designers
Front End Designer & Developer at LBDesign, a globalcommunications consultancyInstructor for the Women's Coding Collective ofWordPress Basics and JavaScript & jQuery coursesTA & Volunteer for GirlDevelopIt
ABOUT LAURENABOUT LAUREN
You are a designerYou want to learn how to complete commontasks using the command line such as usingversion control and compiling SASSYou want to bridge the gap between yourdesigner & developer skills
ABOUT YOUABOUT YOU
What is the command line?Benefits of using the command line over GUIsA few basic commandsExercise: setting up a local WordPress install
WHAT WE'LL COVERWHAT WE'LL COVER
A way for us to tell programs what to do throughsequential lines of text called commands, as
opposed to using the mouse to point and click
WHAT IS THE COMMAND LINE?WHAT IS THE COMMAND LINE?
We can use the command line to reduce number ofprograms running simultaneouslyIt can serve as a "home base" when working on unfamiliarcomputersGives us access to functionality otherwise unavailable tousAs we advance our command line skills, it can help save usa lot of time
I'M A DESIGNER. WHO CARES?I'M A DESIGNER. WHO CARES?
COMMAND LINE VS. GUICOMMAND LINE VS. GUI“ For one, the command line is the only place youcan run all Git commands – most of the GUIs only
implement some subset of Git functionality forsimplicity.
Git - The Command Line
WHAT CAN I DO WITH IT?WHAT CAN I DO WITH IT?Download & install WordPress core, themesand pluginsSet up & manage a local databaseCompile SassVersion controlMake ASCII artSo much more!
ON A MACON A MACApplications › Utilities › Terminal
WHERE TO FIND ITWHERE TO FIND IT
ON WINDOWSON WINDOWSStart › All Programs › Accessories › Command Prompt
THE ANATOMY OF THE PROMPTTHE ANATOMY OF THE PROMPT
~ represents the user's home folder
BASIC COMMANDSBASIC COMMANDS
PRINT WORKING DIRECTORYPRINT WORKING DIRECTORYpwd
LIST DIRECTORY CONTENTSLIST DIRECTORY CONTENTSls
CHANGE DIRECTORIESCHANGE DIRECTORIEScd
NAVIGATINGNAVIGATING
Go home
Go one directory up from current directory
Go to root
A FEW TIPSA FEW TIPSTab to Autocomplete
Up arrow key to scroll through commands previously entered
COMMANDS TO BE CAREFUL OFCOMMANDS TO BE CAREFUL OFrm filename
Permanently delete a file immediately
Does not go to Trash
rmdir directoryname
Permanently delete a folder immediately
Does not go to Trash
NEED HELP?NEED HELP?help
Access user manual
NOW THAT WE KNOW A FEWNOW THAT WE KNOW A FEWBASIC COMMANDSBASIC COMMANDS
LET'S PUT THEM INTO ACTIONLET'S PUT THEM INTO ACTION
ONEONETWOTWOTHREETHREEFOURFOUR
cd ~/Desktop
Navigate to Desktop
mkdir mynewdirectory
Create new directory
cd mynewdirectory
Enter new directory
pwd
Check your current location
INSTALLING WORDPRESS EXERCISEINSTALLING WORDPRESS EXERCISE
FIVEFIVESIXSIXSEVENSEVEN
DOWNLOAD & EXTRACTINGDOWNLOAD & EXTRACTINGDownload WordPress
curl -O https://wordpress.org/latest.zip
unzip latest.zip
Extracting the file
cd wordpress
Navigate into "wordpress" directory
SET UP YOUR DATABASESET UP YOUR DATABASEComplete this step the way you normally would
CREATE & EDIT WP-CONFIG.PHPCREATE & EDIT WP-CONFIG.PHPcp wp-config-sample.php wp-config.php
Copy wp-config-sample.php to wp-config.php
open wp-config.php
Open the file with default editor
NINENINETENTEN
Fosswire Unix/LinuxCommand ReferenceCheatsheetWP-CLI: A command lineinterface for WordPressGit: Getting Started
Lifehacker: A CommandLine Primer for BeginnersGetting Started with Sassand CompassThe designer’s guide to theOSX command prompt
RESOURCESRESOURCES
THE DESIGNER'S COMMAND LINETHE DESIGNER'S COMMAND LINEGit: Getting StartedGetting Started with Sass and CompassThe designer’s guide to the OSX command prompt
BEFORE WE GOBEFORE WE GObanner -w 30 THX!
ANY QUESTIONS?ANY QUESTIONS?Slides: bit.ly/command-line-for-designers
@laurenpittenger
laurenpittenger.com