It's recommended to download a fresh image of Raspbian Stretch from official Raspbian website, but if for whatever reason you don't want to do that, you can still upgrade from Jessie to Stretch.

1. Disk space

Check available disk space and make sure you have at least 1.5GB of free space.

df -h

2. Update current system

Before upgrading, make sure all your packages are up to date.

sudo apt-get update
sudo apt-get upgrade
sudo apt-get dist-upgrade

3. Update package lists

Update your package lists to use Stretch repositories. In both below files, change every occurrence of the word ‘jessie’ to ‘stretch’.

vim.tiny /etc/apt/sources.list
vim.tiny /etc/apt/sources.list.d/raspi.list

4. Update packages

Be aware this may take a while, depending on your internet connection and available resources. I'd say, around two hours.

sudo apt-get update
#sudo apt-get upgrade
sudo apt-get dist-upgrade

During installation, you'll be asked to confirm changes to configuration files. I suggest pressing D to see differences and then following with Y or N to accept or reject changes.
Especially when it comes to configuration file /etc/dhcpcd.conf be sure you don't loose your static IP address configuration if you had one set up.

5. Clean up after yourself

Below will remove no longer needed packages and save you up some disk space. In my case it was 1GB.

sudo apt-get autoremove
sudo apt-get autoclean

Or simply put, easily switch between versions of NodeJS on any Linux based system. There are two most popular Node version managers. One, my personal favourite is n package, the other one is nvm.

n

For me the easiest way is to use n package. Just install whatever Node version your official distribution ships with.

sudo yum install nodejs

or, depending on what Linux you're using.

sudo apt-get install nodejs

Then install n as a global package.

sudo npm install -g n

/usr/local/bin/n -> /usr/local/lib/node_modules/n/bin/n
+ n@6.5.1
added 1 package from 4 contributors in 0.201s

Done, it was that easy. Now install the version of node you want to use:

sudo n lts <--- latest LTS official release
sudo n latest <--- latest official release
sudo n stable <--- stable official release
sudo n 10.16.0 <--- specific version

Execute n on its own to view your downloaded versions, and install the selected one.

n

    node/8.11.2
    node/10.14.2
    node/10.15.0
    node/10.16.0
  ο node/12.18.1

Use up/down arrow keys to select a version, return key to install, d to delete, q to quit

nvm

Run the official install script by executing one of below commands:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

Rerun Profile script to start NVM

source ~/.bashrc

Now nvm should be running and you can confirm it by running below

nvm

Node Version Manager (v0.35.3)

If everything went fine, make nvm use your currently installed Node version

nvm use system

Now using system version of node: v8.11.2 (npm v6.9.0)

List available versions using

nvm ls-remote

Install the latest release of node

nvm install node <--- latest version
nvm install 10.16.0 <--- specific version

If after exiting console and logging in again nvm is not a recognised command, you'll need to add source ~/.bashrc to your .profile or .bash_profile file to make sure it's automatically run on every login. A good explanation of what's going on, can be found here.

I couldn't find a clear explanation of how to pass both data and methods from parent component to a child component in VueJS.
Remember, there's always more that one way of doing almost anything. Below is just one of those ways. More detailed, albeint no so clear, explanation and all the other ways of passing props can be found in official documentation.

Parent component

Let's assume you have a child component called Childcomponent. Passing properties down to the child component is as simple as adding :prop="value" multiple times.
You can pass a single value, array :ids="[324, 12, 434]" or an object :name="{ first: 'AAA', last: 'BBB' }". What was a very nice surprise for me, you can pass methods in exactly the same way. Then you can run methods from within your child component that are defined in your parent component. Super handy.

<div id="components-demo">
  <Childcomponent
    :first-name="firstName"
    :status="whatever.path.status"
    :some-method="someMethod"
    :submit="submitForm" />
</div>


<script>
import Childcomponent from '~/components/Childcomponent.vue'

export default {
  components: {
    Childcomponent
  },
  data() {
    return {
      firstName: 'whatever',
      whatever: {
        path: {
          status: true
        }
      }
    }
  },
  methods: {
    someMethod() {
      // do something
    },
    submitForm() {
      // do something else
    }
  }
}
</script>

Child component

In child component, you need to define passed properties. Notice, in parent component prop names should use kebab case first-name, but when defining them in child component, use camel case firstName. Also methods passed from parent need to be defined in the child as a type Function.
Then, you can use your data and methods (from parent) in the child component just as you'd do it normally.

<template>
  <div>
    <div class="col">
      <img :src="loadImage(status)" alt="alt text">
    </div>
    <button
      class="btn btn-sm btn-outline-light"
      @click="submit">
      Submit
    </button>
  </div>
</template>

<script>
export default {
  name: 'Childcomponent',
  props: {
    firstName: {
      type: String,
      default() {
        return 'My name'
      }
    },
    status: {
      type: Boolean,
      default() {
        return false
      }
    },
    loadImage: {
      type: Function,
      default() {
        return {}
      }
    },
    submit: {
      type: Function,
      default() {
        return {}
      }
    }
  }
}
</script>

NuxtJS is a fantastic framework for creating VueJS applications. It comes bundled with Vue Router, Vuex, Vue Server Renderer and many more. All configured for you out of the box.
The problem I have with it, it comes with linting options set to force 2 spaces as indentation. I'm a "tab" guy, so making me use spaces for indentation drove me crazy. It took me a while to make eslint understand I want different rules in my project. Below is a version of .eslintrc.js file that worked for me.

Obviously, I assume you've selected eslint while installing NuxtJS, so you have all the necessary modules installed. Below config has been tested with (at the time of writing this post) latest version of NuxtJS 2.8.1

module.exports = {
	root: true,
	env: {
		browser: true,
		node: true
	},
	parserOptions: {
		parser: 'babel-eslint'
	},
	extends: [
		'@nuxtjs',
		'plugin:nuxt/recommended'
	],
	// add your custom rules here
	rules: {
		'nuxt/no-cjs-in-config': 'off',
		'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
		'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
		'vue/html-indent': ['error', 'tab'],
		'vue/html-closing-bracket-newline': 'off',
		'indent': [2, 'tab'],
		'no-tabs': 'off'
	}
}

Go to official eslint VueJS plugin page for documentation on other rules that might suite your taste.

Have you noticed other sites hotlinking to your images or other assets? Are they eating up your bandtwitch? Or you just want to proactively prevent that? If so, there's a very easy way to do so with a simple configuration on nginx.
Open up nginx config file for your site and add another location block like this:

server {
    # your normal site configuration is here

    location ~* \.(gif|png|jpe?g)$ {
        valid_referers none blocked server_names ~\.google\. ~\.bing\. ~\.yahoo\. ~\.facebook\. ~\.yoursite.com;
        if ($invalid_referer) {
            return 403;
        }
    }
}

With above, we're sending 403 Forbidden error status code whenver an image is requested from a referer that is not in our approved list.
valid_referers lists sites which we want to allow hotlinking our images. Remember to change ~\.yoursite.com to your actual site domain.
If you want to block other file types, just add an extra pipe "|" and file extension, like this (gif|png|jpe?g|bmp|tiff|pdf)

Going one step further, you can serve one specific image every time a not approved sites tries to hotlink to your assets. To do that add below config:

server {
    # your normal site configuration is here

    location ~* \.(gif|png|jpe?g)$ {
        valid_referers none blocked server_names ~\.google\. ~\.bing\. ~\.yahoo\. ~\.facebook\. ~\.yoursite.com;
        if ($invalid_referer) {
            rewrite (.*) /path/to/image/hotlinking-denied.jpg redirect;
        }
    }
    # prevent redirect loop
    location = /path/to/image/hotlinking-denied.jpg { }
}

Having your site configured on nginx with

server_name example.com www.example.com;

is a good thing as it'll allow your visitors to access your site on both example.com and www.example.com, but they'll stay on the version of the domain they used to access your site in the first place. In your analytics, you may start seeing traffic separated into example.com and www.example.com which definitely does not help you get a clear view of your visitors. It's good practice to decide on one version of the domain and stick to it. I prefer the non-www version, but it's entirely up to you.

Redirect www to non-www

To redirect all traffic from www.example.com to just plain example.com, add another server {} block to your nginx config file with just two lines:

# new block
server {
    server_name www.example.com;
    return 301 $scheme://example.com$request_uri;
}
# your normal config
server {
    ...
    server_name example.com; # notice, this has just the non-www version
    ...
}

Restart nginx to apply above changes

sudo systemctl restart nginx

Redirect non-www to www

To redirect your users from non-www to a www version of your domain add below:

# new block
server {
    server_name example.com;
    return 301 $scheme://www.example.com$request_uri;
}
# your normal config
server {
    ...
    server_name www.example.com;
    ...
}

Restart nginx to apply above changes

sudo systemctl restart nginx

Conclusion

That's it. Your users will now be able to access your site on both www and non-www versions and will be permanently redirected to one version you chose.

Mailgun is a fantastic, free service which allows you to send, receive and track emails effortlessly. It's dead easy to integrate with your self hosted Ghost blog.

Mailgun configuration

1. Log in to your Mailgun account.
2. Go to "Domains" section.
3. Click on "Add New Domain" and add a subdomain you want to send emails from.
4. Follow on page instructions to add all the DNS entries.
5. Once DNS changes propagate, verify your domain within Mailgun.

Ghost configuration

1. SSH to your server and edit config.production.json file in your Ghost root directory.
   Your "mail" section should look like this:

     "mail": {
       "transport": "SMTP",
       "options": {
         "service": "Mailgun",
         "host": "smtp.eu.mailgun.org",
         "auth": {
           "user": "postmaster@your_domain.com",
           "pass": "1234567890"
         }
       }
     }
   

   Notice host entry within options. Official Ghost documentation does not mention it. If your Mailgun domain is set up in the US region, you don't need that line. However, if you've set up your domain in the EU region, you'll need to add it in. Otherwise you'll get an error that your username and password were not recognised.
2. Save changes and restart Ghost.

   ghost restart
   

3. Log in to your Ghost admin.
4. Go to "Labs".
5. Click "Send" in "Test email configuration" section.
   The "Send" button should turn green and you should receive a test email confirming your configuration works.

It's highly recommended to update your Raspbian as often as possible to make sure you always have the latest security patches and updates.

Manual update

Open Pi's console and update package list by running the following command:

sudo apt update

Then upgrade your packages to their latest versions with below command:

sudo apt full-upgrade

This should keep you up to date and away from trouble.

Automatic updates

If you don't like to this this manually, or simply forget about it, I suggest you set up an automatic update and never have to think about it again.
There's a number of ways you can do that. There are programs that take care of that for you and have lots of options and configurations. I'll focus here on the easiest and most basic option, which is a simple cron job.
Switch to root and open crontab:

sudo su
crontab -e

If this is the first time you run crontab as root, you'll be asked to choose your preffered editor.

root@raspberrypi:/home/pi# crontab -e
no crontab for root - using an empty one

Select an editor.  To change later, run 'select-editor'.
  1. /bin/ed
  2. /bin/nano
  3. /usr/bin/mcedit
  4. /usr/bin/vim.tiny  <---- my favourite

Choose 1-4 [4]:

Once you choose your editor, enter below line at the bottom of your crontab:

0 4 * * 1 apt update && apt -y full-upgrade

Above will run update every Monday at 4am. If you prefer a different time but don't know how cron settings work, here's a very helpful site.

I wanted to write a simple script that would convert multiple files from one encoding to another. I didn't want anything big or running in the browser. Command line script seemed like the right approach. Coming from a web developer background my first thought was a script written in PHP and converted to a command line app. Just saying that sounds awful. After a bit of googling, it turned out NodeJS is surprisingly easy and straightforward to write command line apps.

Initiate the app

Running npm init will ask you a few basic questions about your app and result in creating package.json file.

$ npm init

name: cldemo
version: 0.0.1
description: Simple command line script
entry point: index.js
test command:
git repository:
keywords:
author: SixBytesUnder
license: (ISC)

Edit the newly created package.json and add "bin" section. The property key will be the command you'll type in to run your app. In our case cldemo. The value is a relative path to the entry point file. That's the file our code will reside in.

...
"author": "SixBytesUnder",
"license": "ISC",
"bin": {
  "cldemo": "./index.js"
}

Next, create index.js file or any other file you have provided as an "entry point" above. Paste example code show below.

#!/usr/bin/env node
'use strict';

// your whole code goes here
console.log('Hello World!')

The most basic command line script is done.

Register your script

Next command will register your app as a shell command. Note, on Windows you need to open command prompt as an admin, navigate to the home directory of your app and run below.

$ npm install -g

That's it, it's a simple as that. Now you should be able to run your script from command line globally.

$ cldemo
Hello World!

If you make any changes to your source files, remember to register your app again, so that latest version is copied to the global path.

To uninstall your script just type:

$ npm uninstall -g cldemo

Google's reCAPTCHA is great for getting rid of those pesky bots spamming your contact forms. Implementing reCAPTCHA on your site is very easy, albeit somewhat confusing if you try to follow official documentation.
Below example assumes you're using NodeJS with ExpressJS for back-end and Pug (formerly Jade) templating engine on the front-end. General principle is the same regardless of languages used.
I'll assume you've already set up your reCAPTCHA API keys. If you haven't just go to https://www.google.com/recaptcha/ and follow onscreen instructions.

Template files

Open up your template file where you want to use reCAPTCHA, in my case index.pug. Add reference to reCAPTCHA JavaScript file as mentioned in official documentation.

script(src='https://www.google.com/recaptcha/api.js')

Then copy the submit button code from official docs and paste it in your template, or in case of Pug, make it similar to below.

button.btn.btn-default.g-recaptcha(data-sitekey="your_site_key", data-callback="contactSubmit") Submit

Remember to change your_site_key to your actual Site Key. If you're copying and pasting code from reCAPTCHA website, it should have your key already filled in.

JavaScript to submit the form

Notice data-callback="contactSubmit" in the above code for the button. Copying code for the button directly from documentation may have a different callback function name. I called mine contactSubmit.
All you need to do is create a function in your JS file to handle form submission, making sure you pass the token value to it as an agrument and then pass it down the line to the server. Below is a pretty standard AJAX form submission example. I kept it to minimum to illustrate just the reCAPTCHA variable.

function contactSubmit(token) {
	var name = $('#contactForm #name'),
		email = $('#contactForm #email'),
		message = $('#contactForm #message');
	
	// check if the form fields are not empty
	if (name.val() !== '' && email.val() !== '' && message.val() !== '') {
		$.ajax({
			type: 'POST',
			url: '/handlecontact',
			data: {
				name: name.val(),
				email: email.val(),
				message: message.val(),
				recaptcha: token
			},
			dataType: 'json',
			error: function (data) {
				$('#contactForm #formFeedback')
                    .removeClass()
                    .addClass('alert alert-danger')
                    .html('Something went wrong, please try again')
                    .fadeIn('slow')
                    .delay(10000)
                    .fadeOut('slow');
				return false;
			},
			success : function (data, res) {
				if (data.success === true) {
					$('#contactForm #formFeedback')
                        .removeClass()
                        .addClass('alert alert-success')
                        .html(data.msg)
                        .fadeIn('slow')
                        .delay(5000)
                        .fadeOut('slow');
					// clean up form fields
					name.val('');
					email.val('');
					message.val('');
					return true;
				} else {
					$('#contactForm #formFeedback')
                        .removeClass()
                        .addClass('alert alert-danger')
                        .html(data.msg)
                        .fadeIn('slow')
                        .delay(10000)
                        .fadeOut('slow');
					return false;
				}
			}
		});
	} else {
		$('#contactForm #formFeedback')
            .removeClass()
            .addClass('alert alert-warning')
            .html('Please fill in all fields')
            .fadeIn('slow')
            .delay(10000)
            .fadeOut('slow');
		return false;
	}
}

ExpressJS - server side

Open ExpressJS file in which you handle your form data on the server side. In my case it's index.js, and add https module at the top to handle captcha verification request.

var https = require('https');

Then in the method handling your form data verify if user has passed captcha verification.
All you really need to do is send the reCAPTCHA token back to Google for verification. That's what we need https module for.

app.post('/handlecontact', function (req, res) {
	// verify recaptcha
	if (req.body.recaptcha === undefined || req.body.recaptcha === '' || req.body.recaptcha === null) {
		res.send({success: false, msg: 'Please select captcha first'});
		return;
	}
	const secretKey = 'your_secret_key';
	const verificationURL = `https://www.google.com/recaptcha/api/siteverify?secret=${secretKey}&response=${req.body.recaptcha}&remoteip=${req.connection.remoteAddress}`;
	
	https.get(verificationURL, (resG) => {
		let rawData = '';
		resG.on('data', (chunk) => { rawData += chunk })
		resG.on('end', function() {
			try {
				var parsedData = JSON.parse(rawData);
				if (parsedData.success === true) {
					// All good, send contact email or perform other actions that required successful validation
					res.send({success: true, msg: 'Your message has been sent. Thank you.'});
					return;
				} else {
					res.send({success: false, msg: 'Failed captcha verification'});
					return;
				}
			} catch (e) {
				res.send({success: false, msg: 'Failed captcha verification from Google'});
				return;
			}
		});
	});
});

When testing reCAPTCHA make sure you refresh the page between "submit" button clicks. Otherwise Google may think you're a bot for clicking too many times and not submit the form at all.

If you don't have an extra monitor or keyboard, you can still set up your Raspberry Pi without them. SSH is not enabled by default on Raspbian, but with just a few steps we can fix that.

• Follow official guide to install Raspbian on an SD card,
• Eject the card and put it back into the card reader,
• Access boot partition on the card,
• Create an empty file named ssh in the root directory of said boot partition,
• Eject the card and insert it into your Raspberry Pi,
• Connect Raspberry and your home router with an ethernet cable (you only need to do it once),
• Boot up your Raspberry by plugging power in,
• Find Raspberry's IP address. There's plenty of ways to do that. If you have access to your home router, you can see it on your device list, otherwise just Google it,
• Once you know the IP address, open console. For Windows users, I highly recommend cmder and type in:

  ssh pi@192.168.1.99
  

  Change the 192.168.1.99 part to whatever the IP address of your RPi is.
  When asked for password enter: raspberry.
• Done, you're in.

End notes
It's highly recommended to change pi user's password as your first action. You can do that by issuing command passwd while logged in as pi user and providing a more secure one.

Depending on your project, you might want to set up WiFi to not have to keep your Raspberry cabled in to the router or enable VNC server to have nice graphical interface to play with.

Kohana framework displays really nice and descriptive error messages, for a development environment that is. For production, obviously no error reports should be shown to the user. Instead we should display a pretty "404 Not Found" page, or some other error page.
Creating those custom error pages in Kohana v3.x can be a real pain in the bum. I’m hoping that below guide will help you get this done in just few minutes.

Create HTML of your custom pages

Start with creating a 404.php file here:

/application/views/error/404.php

Add content you want, for example

<h1>My custom 404 error page!</h1>

Repeat the same for a 500 error page
File: /application/views/error/500.php
Code: <h1>My custom 500 error page!</h1>

Following the same pattern, you can create custom pages for all error codes. If you want one error page for all just create it and later point all requests to that view.

Create template if you need it

You can use the same template you’re using for your normal pages. If so, feel free to omit this step.

File: /application/views/error.php
Code: <?php echo $content; ?>

Extend Kohana exception class

Create directory and file as per below and copy code into the file.

File: /application/classes/kohana/exception.php
Code:

<?php defined('SYSPATH') or die('No direct script access.');

class Kohana_Exception extends Kohana_Kohana_Exception {
  public static function handler(Exception $e) {
    if (Kohana :: $environment === Kohana :: DEVELOPMENT) {
      // In development show normal Kohana errors
      parent :: handler($e);
    } else {
      // In production show custom error page
      try {
        Kohana :: $log->add(Log :: ERROR, parent :: text($e));
        $attributes = array (
          'action' => 500,
          'message' => rawurlencode($e->getMessage())
        );
        if ($e instanceof HTTP_Exception) {
          $attributes['action'] = $e->getCode();
        }
        // Error sub-request.
        echo Request::factory(Route::get('error')->uri($attributes))->execute()->send_headers()->body();
      } catch (Exception $e) {
        // Clean the output buffer if one exists ob_get_level() and ob_clean();
        // Display the exception text
        echo parent :: text($e);
        // Exit with an error status exit (1);
      }
    }
  }
}

Add route for error pages

File: /application/bootstrap.php
Code:

Route::set('error', 'error/<action>/(<message>)', array('action' => '[0-9]++', 'message' => '.+'))
  ->defaults(array( 'controller' => 'error', 'action' => '404' ));

Finally, create controller for error pages

File: /application/controller/error.php

<?php defined('SYSPATH') or die('No direct script access.');

class Controller_Error extends Controller_Template {
  // if you've created your custom error template. If not use your standard template here.
  public $template = 'error';
  public function before() {
    parent :: before();
  }
  /** * Serves HTTP 404 error page */
  public function action_404() {
    $this->template->content = View :: factory('error/404');
  }
  /** * Serves HTTP 500 error page */
  public function action_500() {
    $this->template->content = View :: factory('error/500');
  }
}

That’s it. Try to access a page on your site that doesn’t exist and you should see your custom 404 error page. Remember, when working in development standard Kohana errors will be shown and only on production our pretty error pages will shine. Line 6 in exception.php controls this behaviour.

Above is simplified and slightly modified version of Lysender post.