Every Web Designers Should Know These Essential Command Lines

Every Web Designers Should Know These Essential Command Lines

Hello friends today we gonna learn about Every Web Designers Should Know These Essential Command Lines. So read this article, Every Web Designers Should Know These Essential Command Lines step by step so you may understand it in a better way. If you have query related to same article you may contact us. So Lets begin:

Guide: Every Web Designers Should Know These Essential Command Lines

You may have come across instructions in web design and development tutorials telling you to do things like npm install or git clone, etc. These are Command Line Interfaces (CLI). We use them for tell the computer to perform specific tasks, usually by typing specific commands in Terminal and Command Prompt.

Terminal and Command Prompt may not be the most convenient tool to use, especially for web designers, which is quite understandable given that web designers may be more familiar with graphical interfaces. Yet tools such as Yeoman, Bower and Google Web Starter Kit work via command lines

If you’re not a fan of typing commands, this post will start you off with just a few basic command lines to familiarize you with them.

back to menu ↑

But first…

We need to talk about Terminal and Command Prompt. Both are powerful apps that give you access to the core of the operating system you are on. Once you make a change to it, the change is not reversible so whatever you do with these two apps, should be done with caution (and preferably if you know exactly what you are getting into).

The second thing to know is that you cannot use the mouse to move the cursor within Terminal or Command Prompt. This means no searching or highlighting text with the cursorEverything happens on the keyboard and so keyboard shortcuts are your new best friends

Note that some useful command lines may not be found in Windows. So, for Windows users, I would recommend using Cygwin, UnxUtils or Windows Services for UNIX Version 3.5, which brings some UNIX utilities to Windows. Now is the time for you to happily rub your hands and start.

back to menu ↑

1. Change directory

You often have to navigate through folders. Terminal and command prompts both use the same cd command to change your current directory to the destination specified in the command. Let’s say you want to go to a folder called foo, you type:

cd foo

You can see below that the current directory is displayed before the blinking cursor.

You can navigate directly to the subfolder of foo like:

cd foo / subfolder

To go back to the previous folder or go up a level up from the current directory, type:

cd ..

back to menu ↑

2. Create a new folder

Another command that you often need is mkdir. This command creates a new folder with the specified name. For example, the following command creates a new folder named foo

mkdir foo

We can also create multiple folders at the same time. In this example below, three folders are created at once named foo, hello, and world.

mkdir foo hello world

The mkdir command is compatible in both Terminal and Command Prompt.

back to menu ↑

3. Create new file

Use the touch command to create an empty file. For example:

touch filename.html

You can specify additional file names as follows to create multiple files at once.

touch file.html style.css

back to menu ↑

4. Move files

Use the mv command to move a particular file to a folder. This example below moves the style.css to a folder called / C.S.S

mv style.css / css

You can also use the mv command to rename files and folders. This example below will rename the index.html in about.html.

mv index.html about.html

back to menu ↑

5. Copy files

To copy a file or folder, type cp command or copy. Below is an example where we copy index.html and name the new file as about.html.

cp index.html about.html

If you’re on Windows, use the copy command instead.

back to menu ↑

6. Directory contents list

This is one of the commands I personally use often, List Directory or known as ls. With this command you can display the contents of a folder.

Specifying a folder name before the ls command displays the contents of the specified folder, for example:

In addition, you can also get the details of the listed content, such as directory date (created), directory permission, and directory owners. To do this, type ls -l or just ll.

However, the ls command only works in a UNIX shell. You can run the ls command in Ubuntu and OS X, but not Windows. In Windows, type the command dir.

back to menu ↑

7. Open files

The open command opens files from folders in the default app. This command below will open the Desktop folder in Finder.

open ~ / Desktop

The following command will open a .txt folder in TextEdit, the default app in OS X to edit plain text files.

open readme.txt

Windows users must use edit. Given the same example, you can run:

edit readme.txt

back to menu ↑

8. Create a symbolic link

Symbolic link or symlink works like a folder of shortcuts, but the system handles them as if it were a real mapMy personal favorite when using Symlink is to sync folders from / Dropbox to my / Sites folder, where I put all my web development files.

This is how the command is specified:

ln -s / source / destination

To create a Symlink from your / Dropbox to the / Sites folder, run:

ln -s ~ / Dropbox / project ~ / Sites / project

Windows users can use the mklink / d command.

back to menu ↑

9. Using Nano Editor

You may need to create a new VirtualHost with a new domain name. Here you need to edit the hosts file that registers the domain name and specified IP address. The fastest way to edit the hosts file is to type.

sudo nano / etc / hosts

back to menu ↑

10. Sublime Text CLI

Sublime Text comes with the CLI, subl, which allows us to control Sublime Text through Terminal and Command Prompt. For example, you can open a file with the subl command. However, the command is not recognized yet when you type subl in the Terminal.

First, run this command to add Sublime Text CLI.

ln -s “/ Applications / Sublime Text.app/Contents/SharedSupport/bin/subl” ~ / bin / subl

After that, you should be able to access the subl. For example, running the following command opens the style.css file.

subl style.css

Including the –add with the command will open the file or folder in the currently open Sublime Text window.

subl – add foo

For other uses, you can type subl –help.

Once you understand the command lines, including these basic commands, you will find that using command lines is leaner than using GUI counterparts for performing certain tasks. I hope this list can get you started.

back to menu ↑

More: Using command lines

Here are a few posts that let you do things through command lines.

  • Basic Shell Assignments for Bloggers
  • Install WordPress via the command line
  • Syntactically great stylesheets: Using Compass in Sass
  • How to easily install, update and remove web libraries with Bower
back to menu ↑

Every Web Designers Should Know These Essential Command Lines: benefits

  • The Every Web Designers Should Know These Essential Command Lines tutorial is free .
  • This guide already helps so many users follow up with interest in a timely manner.
  • The price of the Every Web Designers Should Know These Essential Command Lines guide is free.

back to menu ↑

Faq

Tutorial summary of Every Web Designers Should Know These Essential Command Lines

In this guide, we told you about the Every Web Designers Should Know These Essential Command Lines; please read all steps so that you understand Every Web Designers Should Know These Essential Command Lines in case if you need any assistance from us, then contact us.

How this tutorial helping you?

So in this guide, we discuss the Every Web Designers Should Know These Essential Command Lines, which undoubtedly helps you.

What is actual time in which this method complete?

The time to complete the Every Web Designers Should Know These Essential Command Lines tutorial is 10+ minutes.

What are the supported Device?

PC Laptop or Desktop


back to menu ↑

Final note

I hope you like the guide Every Web Designers Should Know These Essential Command Lines. In case if you have any query regards this article you may ask us. Also, please share your love by sharing this article with your friends.

For our visitors: If you have any queries regards the Every Web Designers Should Know These Essential Command Lines, then please ask us through the comment section below or directly contact us.
Education: This guide or tutorial is just for educational purposes.
Misinformation: If you want to correct any misinformation about the guide “Every Web Designers Should Know These Essential Command Lines”, then kindly contact us.
Want to add an alternate method: If anyone wants to add more methods to the guide Every Web Designers Should Know These Essential Command Lines, then kindly contact us.
Our Contact: Kindly use our contact page regards any help. You may also use our social and accounts by following us on Whatsapp, Facebook, and Twitter for your questions. We always love to help you. We answer your questions within 24-48 hours (Weekend off).
Channel: If you want the latest software updates and discussion about any software in your pocket, then here is our Telegram channel.

Compsmag
Logo
Shopping cart