codingfriend1

/**
 * Added for Server Side Rendering to work
 * Quasar Framework forces you to use Vuex if you want store hydration, but this hack will enable us to get the same effect but use our own store
 */

import Vue from 'vue'
import { reactive } from '@vue/composition-api'

export default function ({ ssrContext }) {

codingfriend1

const _ = require('lodash')
const feathers = require('./feathers.service')

/**
 * Returns a function that returns promise that when resolved sets either the object `err` or `result` property with the response. The overall method returns false if there was an err and result if it was successful.
 * @param {object} object Object to Set
 */
function setObject(object, name) {
  return promise => {
    return promise.then(value => {

codingfriend1

const sift = require('sift')
const _ = require('lodash')

var db = {
  __values: []
}

const to = function to(promise) {
  return promise.then(result => [null, result]).catch(err => [err, null])
}

codingfriend1

/**
 * Uses Socket.io to detect updates, deletions, and creations and updates a property on the store with the changes
 */
const feathers = require('./api/feathers.service')

// The id property to identify list items by
const idProperty = '_id'

// ### liveSyncWithServer(service, storeProperty, store)
/**

codingfriend1

// ### flatten(arr)
/**
 * Recursively flattens nested arrays into one array
 * @param {array} arr An arbitrary array with optionally nested arrays
 * @return {array} Returns the flattened array
 */
function flatten(arr) {
  return arr.reduce(function(prev, current) {
    return prev.concat(Array.isArray(current) ? flatten(current) : current);
  }, []);

codingfriend1

#### Question 1
Don't worry it's a common mistake. I've made it several times myself. If you were to log the `btnNum` (the iterator) you would notice that for all the buttons it's value is `3` instead of 0, 1, or 2. The problem is that the events are defined within the for loop which means whenever the button event is called it will fire with the latest updated iterator instead of the one you thought you were setting. This is because that variable is changing with each loop and only the final value is the one used. It can be easily fixed by defining the event with a copy of each iteration value or `btnNum` and using that copied version instead of the original one which is dynamically changing. We can create a copy by passing the variable into a new scope or simply put a function.

```html
    <button id="btn-0">Button 1!</button>
    <button id="btn-1">Button 2!</button>
    <button id="btn-2">Button 3!</button>

    <script type="text/javascript">

codingfriend1

#!/bin/bash

# Install build dependencies
yum install -y gcc libpng libjpeg libpng-devel libjpeg-devel ghostscript libtiff libtiff-devel freetype freetype-devel

# Get GraphicsMagick source
wget ftp://ftp.graphicsmagick.org/pub/GraphicsMagick/1.3/GraphicsMagick-1.3.9.tar.gz
tar zxvf GraphicsMagick-1.3.9.tar.gz

# Configure and compile

codingfriend1

doctype html
html
	head
		title
	body
		h1 Jade Template