Friday, September 2, 2016

Useful *NIX Shell Commands for Web Developers

So, why *NIX and why do you need to go to the console?

According to the statistics of W3Techs, Unix is used by 68% of all the websites whose operating system they know. This means that if you are web developer, your code is most probably running on a Linux server. And at least you need to know how to configure and debug your code on Unix and Linux systems. Let's find out what you need to know to feel comfortable in the command line.

The Basics

The basic *NIX command consists of three components:

  • command or program to run
  • options to alter or specify the behavior of the command
  • arguments or input data that is needed to run the command   

For example, if you need to get a list of files in the directory /var/www, you need to run the command ls with the argument /var/www. To add the size of files to the output, you need to add the -s option, and the final command will look like this:

I/O Redirections and Pipelines

Many *NIX commands use text input and output which you can operate with, and the great feature of this is that you can send the output results of the command to a file using redirect, or even pass the output of one command to the input of another command using the pipelines. For example, we can output the command from the previous example to a file:

This command will create or erase file /var/www/files.txt and output a list of files in the /var/www directory. Here is a list of standard I/O redirections and pipelines:

  • > Redirect output from a command to a file on disk. The file will be erased and overwritten.
  • >> The same redirect, but appending the output file.
  • < Get input to command from a file.
  • | Pass the output of one command to the input of another command.
  • tee Both redirect output to a file and pass it to the next command in the pipeline.

The Main Commands

To get manual pages for a command, run man. Manual pages follow a common layout and may include name, synopsis, description, and usage examples. This will display the documentation for the chmod command:

To execute some commands like saving configurations or rebooting processes, you need to run them as the super user. To do this, you need to prepend sudo to your command:

If you need to execute a bunch of commands as a super user, you can use su, or switch user command.

Note: To save the security layer and avoid accidental execution of objectionable commands, do not use sudo and su without any purpose.

Into the Real World

Basic Navigation

There are three main commands to navigate in the file tree:

  • pwd to print the name of the current working directory
  • cd to change directory
  • ls to list directory contents

Here is an example of using these commands with the output of terminal:

Searching Files

There is the find command to search for files in a directory hierarchy. This command is very powerful and can search for files and directories by name, access permissions, date, and size.

Find all directories with the “logs” name in the /var/www directory using the -type option:

To search PHP files in the current directory, add the -name option:

Find files with defined permissions using the -perm option:

Find all files which are greater than 500MB:

Of course, you can combine all of those options in one command, and this is only the basics of the find command, which is a very powerful tool for searching files. Use manual pages to get more information.

Manipulating Files and Folders

There are five main commands for manipulating files and folders in *NIX system:

  • touch is used to change timestamps on existing files and directories, but also this is the easiest way to create new file
  • mkdir to make directories
  • cp to copy files and directories
  • mv to move or rename files and directories
  • rm to delete files and folders

The next example will create a file index.html, copy this file to the new directory in /var/www, and remove the source file.

Another great command is ln, which is designed to make links between files. The command ln is often used to create a symbolic link for enabling a virtual host:

Change Access Permissions

To change the file owner and group, use chown. Don't forget to grant ownership to the apache user when you are creating a new virtual host of your web application:

Sometimes cache or log directories of your application must be writable for all users so you need to change access modes to 777 with the chmod command. Add the -R option to add permission to all nested files and folders.

If you just want to make a file executable, use chmod with the +x option.

File Reading

To view files in the console, you can use the cat command. With cat, you can concatenate files' contents using extra parameters, and you can also use mask in filenames.

But the cat command will get you confused very fast, because it shows output in raw format without any paging—so it is inconvenient to use with log output. To get a filter for paging through text one screenful at a time, you should use the more or less commands, which are much of a muchness.

Another useful command is tail, which is created to output the last part of files. This command is perfect to look through log histories. By default, this tail command prints the last 10 lines, and you can change this number using the -n parameter.

But if you have, for example, a bunch of log files, you need something more powerful to make a proper search. Something like grep—a program that reads from standard input, tests each line against a pattern, and writes to standard output the lines that match this pattern. By using it in combination with cat and pipelines, you will get what you want.

If you want to filter text-lines of output, you can use the grep command:

As you can see, grep is good for using in pipelines. In this example, the last command will output all lines containing the “shutting down” string from log-files.

File Editing

If you want to edit text files in console mode, you can use one of the three most popular text editors:

  • GNU nano, a small and friendly default text editor, which is a perfect choice for basic tasks
  • Vim, an improved programmers' text editor, which is most powerful, but complex for beginners
  • mcedit, a full-featured windowed editor from Midnight Commander, which is easy to use but not installed by default on *NIX systems

Compare them and make your choice:

Archiving

Sometimes you need to back up or compress some data on your server.

The most common archiving utilities are tar and zip. Notice that the zip command may not be installed on your server by default.

You can create an archive with the following commands:

If you want just to see a list of files in the archive, you can use the -l option for both tar and unzip:

Or extract some source files:

Schedule Tasks

If you want to schedule your scripts to run periodically, you need to use the Cron utility, which is driven by a cron table—a configuration file that specifies the shell commands to run periodically on a given schedule. And the command to maintain cron tables is crontab.

Calling crontab with option -l will show your cron table.

Also, the -u option is provided to specify the name of the user whose crontab is being used. If you are going to run tasks of your web application, it is better to edit crontab for user www-data.

In this output, you can take a look at an example of a cron table. As you can see, every line is scheduled by minute, hour, day of month, month, and day of week. Every field may be an asterisk, which means every value of the field. Also you can use sets and ranges using commas and hyphens. Following a range with a slash specifies skips of the number's value through the range. In this example, the first command will run every five minutes, and the second command will run from Monday to Friday at 15:00.

To edit this list, run crontab with the -e key instead of -l. The cron list will be opened in your default editor. Use the -r option to clear the cron list.

Performance Monitoring

Command top shows system summary information and provides a dynamic real-time view of running system processes. Press Shift-M to sort processes by memory usage, or Shift-P to sort by CPU usage.

To display the amount of free and used memory in the system, use the free command. Add the -h option to display output fields in human-readable format.

Another useful command is df, which is a command to report file system disk space usage. You can call it with the -a option to show all the file systems of your server. Also, don't forget to add the -h option for human-readable format.

Command Line History

You can use the !! command to repeat the previous command, or use sudo !! if you forgot to run a command with sudo.

If you forgot the syntax of commands or are feeling lazy about typing a large command query, you can use history to display your command history. It is good to combine this command with strings filter commands like grep, tail and others to find exactly what you want.

Conclusion

Using the console is not rocket science. Unix and Linux systems are easy to understand and use because of their simple design and good documentation. I hope this article will make you pretty comfortable with the command line and bring you to the next level of managing your web applications with the command line.

If you have any questions or you want to share your favourite console commands, don't hesitate to leave a comment below the article.

Further Reading


by Anton Bagaiev via Envato Tuts+ Code

Facebook Split Testing: How to Make Your Ads Better

ms-podcast213-andrea-vahl-600

Do you run Facebook ads? Have you tried split testing? To explore different ways to split test your Facebook ads so you can refine your ad campaigns, I interview Andrea Vahl. More About This Show The Social Media Marketing podcast is an on-demand talk radio show from Social Media Examiner. It’s designed to help busy [...]

This post Facebook Split Testing: How to Make Your Ads Better first appeared on .
- Your Guide to the Social Media Jungle


by Michael Stelzner via

The Jason Bourne Experience

Where were you on that day? What did you do? Who were you with? Can you recall all your past, or some of it has been deleted as Jason Bourne’s? Thanks to the Jason Bourne immersive experience & its innovative algorithm, challenge your Facebook and Instagram memories through Google Streetview!
by via Awwwards - Sites of the day

Thursday, September 1, 2016

Pinterest Marketing Tips to Improve Your Visibility


Pinterest is one of the most engaging tools out there for getting people to see your brand. Whether you are sharing content or products, they can gain a lot of exposure through repins and likes. If you get onto a popular board with a lot of followers, your referrals could blow up. So how do you make sure this happen – and how do you increase those referrals? Here are a few tips to help you out improve your market visibility through Pinterest.

by Guest Author via Digital Information World

10 jQuery Panorama Image Display Plugins

Let your visitors enjoy the 360 degrees view of your website images by integrating these cool jQuery Panorama Image Display plugins. Possible uses include Virtual Tours, Panorama Viewers/Scrolling, Image cubes, Endless Photo Sliders and more. Enjoy!

[author_more]

Related posts:

1. Threesixtyslider

Threesixtyslider is a plugin for creating 360 degree images using jQuery. Those using this plugin will be happy to find that it is supported across all major browsers (IE6+ Included), and is also fully responsive!

This, along with the SpriteSpin library, both provide similar functionality through which a user can fully rotate an image. This is particularly effective when displaying images on an eCommerce website where a full 360 degree view is beneficial to the users.

For configuration, the 360slider provides a handful of options ranging from height and width to playSpeed and disableSpin, which allow users to craft a completely custom experience.

Threesixtyslider Homepage

Threesixtyslider Demo

2. Paver

Next on our list is Paver, a jQuery plugin created to make panoramic and widescreen images more accessible. Terry Mun, the creator of Paver, upgraded from an iPhone 4 to an iPhone 6 and was blown away by the phone's ability to capture panoramic images.

Although he was infatuated with panoramic images, Mun became frustrated of seeing the skewed way in which these images are displayed on an iPhone. What good is a panoramic photo if it can not be shown off?

To ensure images render correctly, Paver focuses on providing compatible aspect ratios across devices so that widescreen and panoramic images will render as they should.

In fact, Paver does such a good job that news website The Verge relied on the plugin to display wide-screen images of the United States' First Lady, Michele Obama in an article about her mastering social media .

Michelle Obama Paver Screenshot

Paver GitHub

Paver Demo

3. jQuery Spherical Panorama Viewer

jQuery Spherical Panorama View is the first of two libraries from Open Studio Labs. The jQuery spherical panorama allows users to show a completely 360 degree view of an image, making this plugin great for showing off restaurants, apartments, etc.

Continue reading %10 jQuery Panorama Image Display Plugins%


by Thomas Greco via SitePoint

Off Page SEO Checklist for the Optimized Page

Off Page SEO checklist

This article is part of an SEO series from WooRank. Thank you for supporting the partners who make SitePoint possible.

Once you’ve completed our on page SEO checklist, it’s time to move on to off page SEO. But where to start? Backlinks are the obvious answer, but off page SEO is so much more than that. It can seem like a daunting task that intimidates even seasoned SEOs. That’s why we’ve broken it down into bite-sized pieces to help you get started in acquiring link juice and building trust and authority for your website.

Link Audit

Backlinks are still one of the most important ranking signals for helping your page improve its search rankings. Google wouldn’t have created the Penguin update or impose manual link penalties if backlinks, and their manipulation, didn’t matter. Every link building campaign starts with conducting a link audit and analyzing your backlink profile.

Check Your Current Profile

If your website has been around for a while, it has probably acquired a good amount of backlinks. However, there’s a good chance some of these links are actually doing more harm than good. It’s possible that SEO consultants or agencies you’ve previously worked with used tactics that have since gone from sitting in a bit of a gray area to violating Google’s guidelines, potentially working against you.

Performing a link audit will help you spot any unwanted, harmful links. It starts with gathering a list of all the links pointing back to your domain and their sources and anchor text, and then evaluating them to determine which ones are helping and which links are hurting your SEO. You can download a list of your backlinks in Google Search Console in Links to Your Site under Search Traffic. You can look at your links here a couple of different ways: by linking domain, by pages that have received links or by anchor text.

Links to Your Site in Google Search Console

You can export these lists as either .csv files or as a Google document.

Link Analysis

The next step is to determine the value of your links and to spot any attempts at negative SEO or other low quality links you wound up attracting. To weed out low quality and spammy links, first look at the anchor text. A healthy backlink profile will have a natural mix of exact match, partial match, branded, page title and generic ("read more," “click here,” etc.) anchor texts. Your profile will look unnatural or spammy if you have too much of the following anchor text:

  • Exact match: Putting keyword exact match anchor text in irrelevant or gibberish content is a common spam tactic. However, a profile of nothing but exact match anchor text is going to look very unnatural to Google regardless of the content it’s in. Too much and you could wind up with a link penalty.
  • Irrelevant anchor text: This anchor text is completely irrelevant to your page content. The most common are Viagra and text related to casinos, gambling (particularly online poker) and payday loans.

These low quality links are actively hurting your SEO, even if Google hasn’t hit you with a manual penalty. If you can’t get the links removed, prevent them from being counted against you by using Google and Bing’s disavow link tool.

Link auditing tools such as Majestic or Kerboo can help you gather extra information about your links, giving each one a score based on the quality of the linking page. You can upload your list of links to Kerboo, or let the tool crawl the web and find links aimed at your domain. Filter and tag the links based on how you want to deal with them, adding low quality links to your disavow list as you go, to improve your link profile score. You can use Majestic to identify and score the pages linking to your site to help you gauge the value they pass.

Kerboo link audit

Link analysis isn’t just for finding spam links. Now is the time to find your most valuable links as well. The name of this metric depends on the tool you’re using, but in general your best links will come from pages that:

  • Have relevant page content
  • Also link to other high quality sites
  • Use links within the text of the page
  • Are hosted on quality domains.

Use this list to find new opportunities or build a list of websites to target during a link building campaign or while conducting blogger outreach.

Link Reclamation

Check your backlinks, starting with your most valuable, for broken or dead links. Start by finding pages that return 404 errors. You can build a list based on Crawl Errors in Google Search Console, or use a tool like DeepCrawl or Screaming Frog. These tools will crawl your website and return a list of information about your URLs. Filter your list of URLs to find all that return a 404 error. Export the list to Excel and paste the list of URLs into the spreadsheet that had all your backlinks. Use the VLOOKUP function to map URL to status code (since you only copied over URLs with 404 codes, all your other pages will show blank in this column).

Using this list of broken backlinks, reclaim your links. You can do this two ways: set up a 301 redirect for the broken URL, sending everyone to the functioning page. However, even though 301 redirects pass full link juice now, Google still prefers fully resolved links. Send the linking site owner a short email with the updated URL. Point out that broken links cause a bad user experience and hurt their SEO, so replacing the broken link is a win-win situation. These should generally have a high conversion rate.

Social Media Engagement

Social media’s impact on SEO is far from a settled matter. Google has come out and explicitly said they don’t use social media factors like Facebook likes, followers and Retweets as a ranking factor. So, unfortunately, being really popular on Twitter and Instagram isn’t going to make you rank higher in SERPs, and links to your site on Facebook won’t pass you any link juice. Luckily, there are ways you can use your social media pages to help SEO:

Continue reading %Off Page SEO Checklist for the Optimized Page%


by Greg Snow-Wasserman via SitePoint

This week's JavaScript news, issue 299

This week's JavaScript newsRead this e-mail on the Web
JavaScript Weekly
Issue 299 — September 1, 2016
The creator of the Bluebird promise library shares 3 JavaScript performance fundamentals he’s encountered.
Petka Antonov

A minifier that copes with modern JavaScript syntax and allows smaller file sizes when targeted at browsers with native ES6+ support.
Babel

Claims to be very fast, flexible, clean and elegant in the way it integrates with existing JS libraries. OCaml is a great language so it’s worth a look.
Hongbo Zhang

Heroku
Ramp up on React and focus on what’s different and interesting about your app. Deploy a React app in minutes.
Heroku   Sponsor

How is state updated throughout a React-backed app and how can Facebook’s Immutable help?
Eric Greene

Annotated simplified examples of many of the common data structures written in easy to read JavaScript. Essentially a great article but written in code.
James Kyle

Introducing Ohm, a JavaScript parser generator for building your own programming languages.
Josh Marinacci

“Knowledge of implementation details is crucial not only to writing fast JavaScript code but even to simply measuring the difference between fast and slow.” 45 minute video.
Vyacheslav Egorov

More preliminary results from the State of JavaScript survey shared last week, this time looking at the variants of JavaScript people use (e.g. ES6, CoffeeScript, TypeScript).
Sacha Greif

Jobs Supported by Hired.com

  • Senior Front-End Engineer at 1stdibs. (New York City)We're looking for a phenomenal senior JavaScript engineer to lead the development of the client and server front-end of the 1stdibs.com buyer experience. Interested in React and GraphQL? Let's talk! 1stdibs
  • Sr. JavaScript / Ruby DeveloperSticker Mule is looking for passionate engineers to join our remote team. Come help us build the best e-commerce experience using Ruby, Rails, React, Node, Docker and more. Sticker Mule
  • Find Your Perfect Company MatchYou're smart, you're efficient. Why job hunt the old way? Try Hired and get your profile in front of thousands of top tech companies. Hired.com

In brief

Google's Closure Compiler Now Available in Pure JavaScript news
We linked it last week but now Google have explained more.
Google

Announcing TypeScript 2.0 RC news
Microsoft

ES Proposal: Function.prototype.toString Revision news
Dr. Axel Rauschmayer

Angular 2.0 Release Candidate 6 Released news

Lightning-fast Hosts for Your JavaScript tools
The perfect hosting solution for your javascript project. Use promo code JAVASCRIPT20 for $20 credit.
Linode  Sponsor

ngMigrate: From angular.module to ngModule tutorial
Todd Motto

Using ES2015/ES6 'Proxy' for Fun and Profit tutorial
Alon Niv

11 Simple npm Tricks tutorial node
Tierney Coren

JavaScript's Role in Artificial Intelligence, AR, and VR podcast
An hour-long podcast (with transcription) exploring how JS will play a role in AI and Virtual Reality.
Christophe Limpalair and Eric Elliott

Why I Use a JavaScript Style Guide and Why You Should Too opinion
Mark Brown explains how a style guide can help reduce friction when working as part of a team.
Sitepoint

Building Animated Components, or How React Makes D3 Better opinion
Swizec Teller

Creating Your Own 'JavaScript': Should You? opinion
You can use Babel to fix some of the ‘ugly parts’ in JavaScript, but should you?
Karolis Masiulis

A Curated Collection of 396 React Components tools
Romuald Brillout

Find and Fix Node.js Errors Faster (and have fun doing it) tools
Quickly pinpoint what’s broken and why. Get the context and insights to defeat all Node errors.
ROLLBAR  Sponsor

in-view: Get Notified When A DOM Element Enters or Exits The Viewport code
Cam Wiegert

Vexwarp: Audio Time Stretching and Pitch Shifting code
JS implementations of STFT and phase vocoder algorithms. Demo.

Cesium: A WebGL Virtual Globe and Map Engine code
Cesium

React Dates: A Date Picker from Airbnb code
An accessible, easily internationalizable, mobile-friendly date-picker library for the web.
Airbnb

Postmate: A Powerful, Promise-based postMessage Library code
This allows a parent page to speak with a child iFrame across origins.
Dollar Shave Club

xterm.js: A Full Xterm Terminal Component, in Your Browser code
Enables apps to provide fully featured terminals.
SourceLair

Dext: A Smart App Launcher for Mac, Powered by JavaScript code
Vu Tran

Curated by Peter Cooper and published by Cooper Press.

Stop getting JavaScript Weekly : Change email address : Read this issue on the Web

© Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK


by via JavaScript Weekly