mjgartendev

<div class="ui segments" id="app">
  <div id="app-header" class="ui segment layout">
    <i>AppHeader</i>
  </div>
  <div id="app-content" class="ui segment layout">
    <i>AppContent</i>
    <div id="nuxt" class="ui segment page">
      <i>VueStudio | VueFinder | Resources | Showcase</i>
      <div class="ui horizontal segments" id="components">
        <div class="ui segment">

mjgartendev

Flexbox Holy Grail Layout

Based on examples at https://philipwalton.github.io/solved-by-flexbox/

A Pen by Michael Garten on CodePen.

License.

mjgartendev

Flexbox App Layout

Forked from Hugo Giraudel's Pen Demo Flexbox 1.

A Pen by Michael Garten on CodePen.

License.

mjgartendev

<template>
    
</template>

<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
    
})
</script>

mjgartendev

<template>
<div>
    <!-- nuxt
        For Layouts:
        <nuxt> component is used only in layouts to display the page components. 
        Props:
            nuxtChildKey: string
                This prop will be set to <router-view/>, useful to make transitions inside a dynamic page and different route.
                Default: $route.fullPath
        Example (layouts/default.vue):-->

mjgartendev

<template>
    <div>
        <!-- nuxt-child
        For Nested Route Pages:
        This component is used for displaying the children components in a nested route.-->
        <div>
            <h1>I am the parent view</h1>
            <nuxt-child/>
        </div>

mjgartendev

module.exports = {
  /*
  Headers of the page
    - Nuxt.js uses vue-meta to update the headers and html attributes of your application.
    - Nuxt.js configures vue-meta with these options:
      {
        keyName: 'head', // the component option name that vue-meta looks for meta info on.
        attribute: 'data-n-head', // the attribute name vue-meta adds to the tags it observes
        ssrAttribute: 'data-n-head-ssr', // the attribute name that lets vue-meta know that meta info has already been server-rendered
        tagIDKeyName: 'hid' // the property name that vue-meta uses to determine whether to overwrite or append a tag

mjgartendev

<template>
  <div>

  </div>
</template>

<script>


export default {

mjgartendev

Cacher Add Snipper CLI Commands

USAGE

cacher snippets:add [FILENAME]

OPTIONS

mjgartendev

Google Firebase Hosting Steps

Install

Install Firebase tool globally

npm install -g firebase-tools