realph

dsd

realph

Getting started with interface design

Books

Designing Interfaces

Haven't read it before but it's often heralded as good entry point for designing interfaces.

realph

/* Github Profile Fetcher */
async function fetchProfile(u) {
  const res = await fetch(`https://api.github.com/users/${u}`);
  
  // 1. Check user exists
  if (!res) {
    alert('User does not exist!');
    return;
  }
  

realph

(function() {
  'use strict';

  var angular = require('angular');
  
  angular.module('zeroApp', [])
  .controller('MainController', ['$scope', function($scope) {
      $scope.message = "Hello Angular!";
  }]);
  

realph

gulp.task('js', function () {
  // define our sole entry point (source file)
  return browserify({entries: ['./src/js/app.js']})
    // bundle our js
    .bundle()
    // create a vinyl object
    .pipe(source('app.js'))
    // convert vinyl file to buffer
    .pipe(buffer())
    // create our source maps

realph

<a class="button-pri">Primary Button</a>
<a class="button-sec">Secondary Button</a>

realph

<a class="button-pri">Primary Button</a>
<a class="button-sec">Secondary Button</a>

realph

<a class="button-pri">Primary Button</a>
<a class="button-sec">Primary Button</a>

realph

Navigate to the root of your theme in Terminal.

1. Installing grunt globally

npm install -g grunt-cli

I ended up preceding this with sudo to get it working.

2. Move Gemfile, Gruntfile.js and package.json to your theme's root

realph

cd /wherever/sites/the-site
sudo chown -R _www wordpress-folder
sudo chmod -R g+w wordpress-folder