command line for the beginner - using the command line in developing for the web

70
COMMAND LINE FOR THE BEGINNER USING THE COMMAND LINE IN DEVELOPING FOR THE WEB Created by Jim Birch jimbir.ch/cmd @thejimbirch Xeno Media, Inc.

Upload: jim-birch

Post on 07-Jan-2017

235 views

Category:

Internet


9 download

TRANSCRIPT

Page 1: Command line for the beginner -  Using the command line in developing for the web

COMMAND LINE FORTHE BEGINNERUSING THE COMMAND LINE IN DEVELOPINGFOR THE WEB

Created by

Jim Birchjimbir.ch/cmd@thejimbirchXeno Media, Inc.

Page 3: Command line for the beginner -  Using the command line in developing for the web

WHAT IS THECOMMAND LINE?A command-line interface ... is ameans of interacting with acomputer program where the user(or client) issues commands to theprogram in the form of successivelines of text (command lines). -Wikipedia

Page 4: Command line for the beginner -  Using the command line in developing for the web

OFTEN REFERRED TO AS CLIC - Command

L - Line I - Interface

Page 5: Command line for the beginner -  Using the command line in developing for the web

WHERE IS THIS COMMAND LINE?Linux - Built inMac - Terminal built in or additional apps like available.Windows - , or the brand new

iTerm

Cygwin Bash on Ubuntu onWindowsChromebook - Apps that provide limited functionality

Page 6: Command line for the beginner -  Using the command line in developing for the web

WHAT DOES THE TERMINAL LOOK LIKE?

Page 7: Command line for the beginner -  Using the command line in developing for the web

CUSTOMIZE MOST TERMINAL APPS

Page 8: Command line for the beginner -  Using the command line in developing for the web

THE COMMANDS

Page 9: Command line for the beginner -  Using the command line in developing for the web

ANATOMY OF A COMMAND$ command -flag argument/operand

command - The action we want to happenflag (optional) - Options for the commandoperand (optional) - What is acted upon

Most of the time you find commands written, they will beprefaced with a $

Page 10: Command line for the beginner -  Using the command line in developing for the web

COMMON COMMANDScd - Change Directory $ cd /path/to/folder $ cd ../../../ to move up the tree.cp - Copy $ cp wp-config-sample.php wp-config.phpgrep - globally search a regular expression and print $ grep term filetosearchin.txtls - List $ ls -la (l = long format, a = all files, even hidden)

mkdir - Make Directory $ mkdir directoryname

Page 11: Command line for the beginner -  Using the command line in developing for the web

COMMON COMMANDSmv - Move $ mv wp-config.php ../pwd - Print Working Directory $ pwdrm - Remove $ rm -rf whatyouwantremoved (r = recursive, f = force)

sudo - Superuser Do $ sudo anycommand (Use sudo if you need administrative access to run the command.)

touch - Touch $ touch newfilename.txt

Page 12: Command line for the beginner -  Using the command line in developing for the web

COMMON COMMANDSIf you enter a screen that has a page of information, like a

help screen:

Use your arrow keys to navigate up and down.Type q to exit.

Page 13: Command line for the beginner -  Using the command line in developing for the web

FLAGSFor most cases I have found, flags that are full words use two

dashes, flags that are acronyms use one dash.

--all-a

Page 14: Command line for the beginner -  Using the command line in developing for the web

ESCAPINGIf you ever need to cancel a command:

Hold the Control key and C

Page 15: Command line for the beginner -  Using the command line in developing for the web

ARCHIVING AND UNARCHIVING

Archive and compress; extract filesand folders quickly and easily rightfrom the command line.

Page 16: Command line for the beginner -  Using the command line in developing for the web

ZIP AND UNZIPTo compress a folder using zip:zip -r zip-file-name.zip path/to/folderzip -r zip-file-name.zip file1 file2file3To extract:unzip zip-file-name.zip

Page 17: Command line for the beginner -  Using the command line in developing for the web

TAR AND UNTARTo compress a folder using tar:tar -zcvf tar-file-name.tar.gzpath/to/folderTo extract:tar -zxvf tar-file-name.tar.gz

Page 18: Command line for the beginner -  Using the command line in developing for the web

NANO AND VI EDITORS

nano and vi are text editorsavailable in terminal so you can editfiles without needing any otherprograms.

Page 19: Command line for the beginner -  Using the command line in developing for the web

NANOnano file.txt to open a file

Control + (letter) for commands Control + G for help

Page 20: Command line for the beginner -  Using the command line in developing for the web

VI (OR VIM - "VI IMPROVED")vi file.txt to open a file

:help for commands :i to insert :w to save :q to exit

Page 21: Command line for the beginner -  Using the command line in developing for the web
Page 23: Command line for the beginner -  Using the command line in developing for the web

CONNECTING TO SERVERS BY SSH

Connect to other servers, like yourstaging and productionenvironments and run commandsas you would on your localcommand line.

Page 24: Command line for the beginner -  Using the command line in developing for the web

CREATING SSH KEYSCheck for existing keys $ ls -al ~/.sshCreate a new key ssh-keygen -t rsa -C"[email protected]"-t = Key Type, -C = CommentEnter file in which to save the key(/Users/Jim/.ssh/id_rsa): /Users/Jim/.ssh/clientname

Page 25: Command line for the beginner -  Using the command line in developing for the web

PUTTING YOUR KEY ON THE SERVERUI Interfaces like CPanel and PleskApache - Add your key to /%USER%/.etc/authorized_keysnginx - Install openssh and add your key to/%USER%/.ssh/authorized_keys

Page 26: Command line for the beginner -  Using the command line in developing for the web

CONNECTING TO SERVERssh [email protected] your password

SET UP AN SSH ALIASnano ~/.ssh/configHost hostname User usernameatserver HostName (IP Address or domain.name) Port 22 IdentityFile ~/.ssh/id_rsa Then, connect with ssh hostname

Page 27: Command line for the beginner -  Using the command line in developing for the web

TO DISCONNECT FROM A SERVER:Type exit

Page 28: Command line for the beginner -  Using the command line in developing for the web

MYSQL

Manage MySQL databases from thecommand line, including importingand exporting.

Page 29: Command line for the beginner -  Using the command line in developing for the web

CONNECTING TO MYSQLmysql -u username -p

You will be prompted for password.

* Note: You want to avoid using the password inline, as itwould be available in logs

Page 30: Command line for the beginner -  Using the command line in developing for the web

IMPORTING A DATABASEmysql -u username -p < database.sql

Page 31: Command line for the beginner -  Using the command line in developing for the web

EXPORTING A DATABASEmysqldump -u username -p > database.sql

Page 32: Command line for the beginner -  Using the command line in developing for the web

ONCE YOU HAVE CONNECTED TO MYSQL, YOUCAN RUN ANY SQL COMMAND

CREATE TABLE newtablename (id INT NOT NULLPRIMARY KEY AUTO_INCREMENT, name_of_table VARCHAR(30), sub_title VARCHAR(20), yes_or_no CHAR(1), date_of_thing DATE);

Page 33: Command line for the beginner -  Using the command line in developing for the web

WP-CLI

WP-CLI is a set of command-linetools for managing WordPressinstallations. You can updateplugins, set up multisite installs andmuch more, without using a webbrowser. - wp-cli.org

COMMON WP-CLI COMMANDS

Page 34: Command line for the beginner -  Using the command line in developing for the web

COMMON WP-CLI COMMANDShttp://wp-cli.org/commands/

wp media regenerate Regenerates all thumbnailswp post list List all the posts of a sitewp user delete 123 --reassign=567 Delete a user, and assign their posts to another.wp plugin install hello-dolly Installs Hello Dolly Plugin

Page 35: Command line for the beginner -  Using the command line in developing for the web

COMMON WP-CLI COMMANDSwp help Lists all commands and helpwp core update Updates Wordpress corewp theme list Lists all themes in the sitewp package http://wp-cli.org/commands/package/

Page 36: Command line for the beginner -  Using the command line in developing for the web

DRUSH

Drush is a command line shell andUnix scripting interface for Drupal. -drush.org

Page 37: Command line for the beginner -  Using the command line in developing for the web

ALIASES

In computing, alias is a command invarious command line interpreters(shells) ... which enables areplacement of a word by anotherstring. - Wikipedia

Page 38: Command line for the beginner -  Using the command line in developing for the web

ANATOMY OF AN ALIASname="command"

name - The name of the aliascommand - The action we want to happen

Page 39: Command line for the beginner -  Using the command line in developing for the web

WHERE TO PUT ALIASESMAC OS

Temporary - alias name="command"Permanent - nano ~/.bash_profile

Page 40: Command line for the beginner -  Using the command line in developing for the web

WHERE TO PUT ALIASESUBUNTU

Temporary - alias name="command"Permanent - nano ~/.bash_aliases

Page 41: Command line for the beginner -  Using the command line in developing for the web

WHERE TO PUT ALIASESWINDOWS

Temporary - DOSKEY name="command"Permanent - A lot more complicated!

Page 42: Command line for the beginner -  Using the command line in developing for the web

COMMON USE CASES FOR ALIASESNavigate to common folders alias htdocs="cd /var/www/public_html" alias backdropcms="cd/Users/Jim/jim.local/backdropcms.org"Run Common Tasks alias restart='sudo apachectl restart'

Page 43: Command line for the beginner -  Using the command line in developing for the web

COMMON USE CASES FOR ALIASESOpen Common Files alias bashprofile='sudo nano/Users/Jim/.bash_profile' alias sshconfig='nano ~/.ssh/config'Open Applications alias github='open -a Firefoxhttps://github.com/thejimbirch?tab=repositories\'

Page 44: Command line for the beginner -  Using the command line in developing for the web

COMMON USE CASES FOR ALIASESComplex Example

Accepts a url, opens chrome in 5 different sized browsers12345678910

hosted with ❤ by

# My Chrome developer profile is in the ̀Profile 1̀ directory, make sure to update with yours.# Best on an ultra wide monitor.

function rwdurl() { open -n -g -a "Google Chrome" --args --new-window --profile-directory=Profile\ 1 --app="data:text/html,<html><body><script>window.moveTo(0,0);window.resizeTo(320,1395);window.location='$1';</script></body></html>" open -n -g -a "Google Chrome" --args --new-window --profile-directory=Profile\ 1 --app="data:text/html,<html><body><script>window.moveTo(330,0);window.resizeTo(480,1395);window.location='$1';</script></body></html>" open -n -g -a "Google Chrome" --args --new-window --profile-directory=Profile\ 1 --app="data:text/html,<html><body><script>window.moveTo(815,0);window.resizeTo(640,1395);window.location='$1';</script></body></html>" open -n -g -a "Google Chrome" --args --new-window --profile-directory=Profile\ 1 --app="data:text/html,<html><body><script>window.moveTo(1460,0);window.resizeTo(800,1395);window.location='$1';</script></body></html>" open -n -g -a "Google Chrome" --args --new-window --profile-directory=Profile\ 1 --app="data:text/html,<html><body><script>window.moveTo(2265,0);window.resizeTo(1024,1395);window.location='$1';</script></body></html>"}

view rawrwdurl GitHub

Page 45: Command line for the beginner -  Using the command line in developing for the web

SEE ALSO

ln -s /path/to/file /path/to/symlink Example: htdocs > /var/www/public_html

Symbolic link (Symlinks)

Page 46: Command line for the beginner -  Using the command line in developing for the web

SEE ALSOBash Scripts

12345678

hosted with ❤ by

fullpath=̀pwd̀if [[ $fullpath =~/Users/Jim/Sites/.* ]]; thenIFS='/' array=($fullpath)open "http://${array[4]}.xenostaging.com"elseecho You are not in a webroot.fi

view rawssite bash script GitHub

Page 47: Command line for the beginner -  Using the command line in developing for the web

SEE ALSOBASH-IT

Bash-it is a collection of community Bash commands andscripts. (And a shameless ripoff of oh-my-zsh :smiley:)

Includes autocompletion, themes, aliases, custom functions,a few stolen pieces from Steve Losh, and more.

https://github.com/Bash-it/bash-it

Page 48: Command line for the beginner -  Using the command line in developing for the web

SECURE COPY PROTOCOL (SCP)

Secure copy or SCP is a means ofsecurely transferring computer filesbetween a local host and a remotehost or between two remote hosts.It is based on the Secure Shell (SSH)protocol. - Wikipedia

Page 49: Command line for the beginner -  Using the command line in developing for the web

COPY FILE FROM LOCAL TO SERVERscp example.txt username@server:myfile.txt

COPY ALL FILES IN REMOTE SITE TO LOCAL(FOLDER YOU ARE IN)

scp serveralias:/var/www/public_html/wp-uploads/* .

COPY FILES FROM ONE SERVER TO ANOTHERscp serveralias:/var/www/public_html/wp-

content/files/file1.zipsecondserveralias:/var/www/public_html/wp-

content/files/file1.zip

Page 51: Command line for the beginner -  Using the command line in developing for the web

GIT FOR VERSION CONTROL

Git is a widely used source codemanagement system for so�waredevelopment. It is a distributedrevision control system with anemphasis on speed, data integrity,and support for distributed, non-linear workflows. - Wikipedia

Page 52: Command line for the beginner -  Using the command line in developing for the web

GIT IN PLAIN ENGLISHGit gives us a canonical/main source of the code of theproject.Multiple versions can be checked out, and merged backin.History of commits/different versions can be saved.Easily sync multiple servers, Development, Staging,Productions.

Page 53: Command line for the beginner -  Using the command line in developing for the web

REALLY GREAT GIT TUTORIALhttps://git-scm.com/docs/gittutorial

Page 54: Command line for the beginner -  Using the command line in developing for the web

COMMON GIT COMMANDSgit clone repo.url Clones a repository to your computergit fetch Gets updated code from repositorygit merge origin/master Merges code from repository, master branchgit pull Fetch and merge in one step!git checkout -b branchname Makes a new branch

Page 55: Command line for the beginner -  Using the command line in developing for the web

COMMON GIT COMMANDSgit diff filename Shows the changes you have made to the filegit add -A Adds all files to "staging area"git commit Moves from "staging area" to a commitgit push origin master Pushes local master branch to origin mastergit log Lists history of commits

Page 56: Command line for the beginner -  Using the command line in developing for the web

AUTOMATION/TASK RUNNERS LIKEGRUNT AND GULP

Page 57: Command line for the beginner -  Using the command line in developing for the web

FUTURE DEVELOPMENT WILL BE POWEREDBY JAVASCRIPT

Node.js® is a JavaScript runtime built that runsNPM (Node Package Manager), the largest ecosystem ofopen source libraries in the world

I use Node.js® to install NPM to install Grunt which installs...

Page 58: Command line for the beginner -  Using the command line in developing for the web

TOOLS FOR OUR JAVASCRIPT FILES:jshint - Detect errors and potential problems in yourJavaScript code.jscs - Linter/formatter for programmatically enforcingyour style guide.uglify - Minify files with UglifyJSconcat - Concatenate (merge) files into one.

Page 59: Command line for the beginner -  Using the command line in developing for the web

TOOLS FOR OUR CSS FILES:grunt-contrib-less, grunt-sass - Compile LESS/SASS files toCSScsslint - Checks syntax checking and applys a set of rulesthat look for problematic patterns or signs of inefficiency.cssmin - Minimizes CSS filescsscomb - Formats and sorts style sheets to make themorganized and consistent.

Page 60: Command line for the beginner -  Using the command line in developing for the web

SO MANY USES:imagemin - Minify images seamlessly.copy - automate the copying of files or directories.Thousands more... [ ] [ ]Grunt Plugins Gulp Plugins

Page 61: Command line for the beginner -  Using the command line in developing for the web

WATCH!Once these tasks have been assembled in a Gruntfile.js file,

you can run the following command to implement thesetasks on any changes:

grunt watch

Any JS/CSS/LESS/SASS files changed will be checked andorganized!Images put in the folder I am watching will be minified.Any errors will be reported immediately!

Page 62: Command line for the beginner -  Using the command line in developing for the web

DEPENDENCY/PACKAGE MANAGERSLIKE COMPOSER

Composer helps you declare,manage and install dependencies ofPHP projects, ensuring you have theright stack everywhere. - Composer on Github

Page 63: Command line for the beginner -  Using the command line in developing for the web

AN OVERARCHING MAINTAINER OF YOURWEBSITE AND IT'S NEEDS

A composer.json file defines all of the things your websiteneeds. These are called dependencies.

This would include Wordpress itself, plugins, and themes. Itcould also include outside libraries like jQuery, Bootstrap,

Foundation, and more.

Page 64: Command line for the beginner -  Using the command line in developing for the web

AN OVERARCHING MAINTAINER OF YOURWEBSITE AND IT'S NEEDS

A composer.json file defines all of the things your websiteneeds. These are called dependencies.

This would include Wordpress/Drupal core,plugins/modules, and themes. It could also include outsidelibraries like jQuery, Bootstrap, Foundation, Masonry, and

more.

Page 65: Command line for the beginner -  Using the command line in developing for the web

REBUILD THIS PROJECT IN A MOMENT'SNOTICE

If all dependencies are defined in a composer.json file,composer install could be run to install the site

anywhere.

All you would need to do then is setup the database andmove the files.

Page 66: Command line for the beginner -  Using the command line in developing for the web

SUMMARYBEGINNER

Command Line BasicsCommands and FlagsArchiving and UnarchivingCommand Line Editors

Page 67: Command line for the beginner -  Using the command line in developing for the web

SUMMARYINTERMEDIATE

Connecting to Servers with SSHMySQLWP-CLI / DrushAliasesSecure Copy Protocol - SCP

Page 68: Command line for the beginner -  Using the command line in developing for the web

SUMMARYADVANCED

Git for Version ControlAutomation/task runners like Grunt and GulpDependency/Package Managers like Composer

Page 70: Command line for the beginner -  Using the command line in developing for the web

THE ENDCONTINUING THE CONVERSATION:

Created by

Jim Birchjimbir.ch/cmd@thejimbirchXeno Media, Inc.