am-digital

[am-digital]

Removing large files from git commits

Despite removing the file itself, once committed the file is stuck in history, here’s how to resolve it:

git filter-branch --force --index-filter 'git rm -r --cached --ignore-unmatch [path to file to remove]' --prune-empty --tag-name-filter cat -- --all

[am-digital]

Updating Drupal 8 core - and solving the errors

https://www.drupal.org/docs/8/update/update-core-via-composer

The above often produces errors - here’s some steps to get updated:

Step 1:

rename /vendor to /_vendor

rename /core to /_core

rename composer.lock to _composer.lock

- - available for easy rollback if problems occur

Step 2:

Edit composer.json with the following changes:

"drupal/core": "^8.4.0",

"drush/drush": "^9.0.0",

Step 3:

composer require drush/drush:^9.0.0

composer update drupal/core --with-dependencies

drush updb

drush cr

Step 4:

delete /_vendor

delete /_core

delete _composer.lock

Gotchas:

You may have to remove certain modules depending on circumstances. For instance I had to do the following on one site:

composer remove drupal/console drush/drush

much more info here about removing troublesome modules: https://www.isovera.com/blog/upgrading-drupal-840-and-drush-9-composer

All the info to do this was taken from the links below, with  thanks to websiteworkspace and Internet others at drupal.org and Benji Fisher isovera.com:

https://www.drupal.org/forum/support/upgrading-drupal/2017-10-06/update-to-84-with-composer#comment-12294335

https://www.isovera.com/blog/upgrading-drupal-840-and-drush-9-composer

[am-digital]

Radioactive Snake - p5.js

See the Pen p5.js perlin noise snake fade background green by amcc (@amcc) on CodePen.

[am-digital]

p5.js is a great tool for artists and designers to create with JavaScript.

check out these resource to start learning:

p5.js website:

https://p5js.org/

The Coding Train - one of the best channels on p5.js: https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw

A great book and website to learn p5:

http://www.generative-gestaltung.de/2/

General reference for JavaScript and the web:

https://www.w3schools.com/js/default.asp

Template/Boilerplate to start with p5 in codepen:

https://codepen.io/boilerplate/pen/pLzXNN

[am-digital]

the above link gives the main lowdown on installing various version of Drupal modules with composers. This page is also going to be a bit of help:

https://drupal.stackexchange.com/questions/236499/how-can-i-install-a-beta-version-of-a-module

[am-digital]

a terrifying snake - perlin noise experiment

See the Pen p5.js perlin noise snake by alistair mcclymont (@amcc) on CodePen.

[am-digital]

put non-drupal folders within your installation

When you want a folder to contain other bits and bobs within Drupal (6,7,8 whatever) you can put a .htaccess file into that folder to both allow access and prevent the standard 404 error.

Here’s what you need in the .htaccess file:

Options +Indexes DirectoryIndex index.html index.htm

[am-digital]

setting up a bootstrap responsive grid in Drupal with views the easy way

[am-digital]

How I like to set MAMP up

MAMP is a very handy server environment for web stuff, here’s what i do to set it up:

use my ‘Sites’ folder as document root - basically keep it out of the MAMP application so when i upgrade mamp or migrate my user folder it keeps my stuff

Change the apache port to 80 - that way my urls look normal and don’t have the colon/port number after them

read more about all that here:

https://www.mamp.info/en/documentation/

I like to make virtual hosts for all my development websites. I call them sitename.dev, rather than their online equivalent sitename.com for instance. This makes lots of things work better (i.e. the same document root for your code).

edit your hosts file here: /etc/hosts

I install the terminal command for TextMate and Sublime, so currently I type this in terminal to open that file:

sublime /etc/hosts

add a line to this file that looks like this:

127.0.0.1 yoursite.dev

The open this file within the MAMP application:

/Applications/MAMP/conf/apache/httpd.conf

Find this line (use the find tool - its around line 584 on mine, but this sort of thing changes):

# Virtual hosts #Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

remove the hash before ‘Include’ so it looks like this:

# Virtual hosts Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

Then go to this file:

/Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

There are various examples there, but the minimum you need (and i never use any more than this) is below. You must redefine ‘localhost’ to be the same folder you set up as the MAMP document root above. Then you can define as many virtual hosts as you like with the second bit:

<VirtualHost *:80>    DocumentRoot /Users/yourusername/Sites/    ServerName localhost </VirtualHost>

<VirtualHost *:80>    DocumentRoot "/Users/yourusername/Sites/sitefolder"    ServerName yoursite.dev </VirtualHost>

In the above example yourusername is your user folder, sitefolder is the folder you’ve got your site in, yoursite.dev is what you defined in the /etc/hosts file.

Now stop, then start the MAMP server and you should be able to go to yoursite.dev and it will work.

A hand trick to find the exact location of a file/folder in the way that MAMP and many other bits of software expect to see it is to grab the file and drag it into a terminal window - you can then copy this path, much quicker than typing it.

[am-digital]

this is sooo handy

[am-digital]

Getting Sass and Chrome to play together, using scout (other compilers will do)

Here’s a great guide to using Sass with Chrome in your project. It also details how to install sass in the terminal, i’ve worked like this for a long time, but have just started using Scout (http://scout-app.io/). While the terminal works fine, Scout is a free, open-source app that works well and gives you some very easy ways of moving between development and production modes, plus handles multiple sites very easily.

You can easily set up chrome to enable discovering/editing your sass using developer tools, here’s a fantastic article on the subject:

https://robots.thoughtbot.com/sass-source-maps-chrome-magic

One thing i’ve not got working yet is chrome auto reloading while doing this - if anyone has any hints let me know.

[am-digital]

This is the thing, it used to be less than obvious to get the anchor point centred, here’s how, now:

Layer > Transform > Center Anchor Point In Layer 

You can also Ctrl+double-click (Windows) or Command+double-click the Pan Behind (Anchor Point) tool to invoke this command.

Of course look at this plugin as its very useful too:

http://www.batchframe.com/extras/info/Move%20Anchor%20Point

[am-digital]

Installing Drupal 8 part 2: getting Drupal installed

To actually create the Drupal site keep following the installation instructions here:

https://github.com/drupal-composer/drupal-project

This gives you an installation with Drush included. So then i needed to do one more thing to do in terms of modifying my system...

... this didn’t crop up until I used Drush to run the drupal installation. The article below shows how to get Drush to use MAMP’s mySQL, it also shows how to get everything else up and running that i covered last time. It’s a little bit different from my version - you could use my instructions and simply add this line to the .bash_profile - that works too:

export PATH=/Applications/MAMP/Library/bin/:$PATH

To use Drush to automatically install Drupal into a database I ran this command:

cd drupal/web ../vendor/bin/drush site-install --db-url=mysql://{username}:{password}@localhost/{database}

This article provided a great bit of background info including the above:

https://www.lullabot.com/articles/goodbye-drush-make-hello-composer

a handy article on this subject:

https://www.drupal.org/node/2718229

[am-digital]

installing Drupal 8 part 1: installing Drush

Always worth making life a nightmare in order to make it easier later.

I’m using a mac - with a new system. This means that many of the tutorials you need to follow don’t quite work until you’ve done a bunch of googling and fixed things.

Here’s the install instructions for Drush:

http://docs.drush.org/en/master/install/

but before that will work you need to do a few things:

firstly there’s a folder you need to move Drush to in the installation process that wont exist on a fresh install of OSX, so you need to create it. Do it like this: sudo mkdir -p -m 775 /usr/local/bin

(courtesy of: http://stackoverflow.com/questions/25654731/usr-local-bin-no-such-file-or-directory)

then if you’re a MAMP user like me create a file called .bash_profile in you user folder (I used Sublime - it will mention something or other about a file beginning with a . (dot) - say ok). Put this in the file: export MAMP_PHP=/Applications/MAMP/bin/php/php7.0.10/bin export PATH="$MAMP_PHP:$PATH" export PATH=$PATH:/usr/local/bin

after that run the installation script and it should work out fine

more tutorials coming up...