Cleaned up pages, added lambdas namespace and pages

Author: aeksco

pages/index.vue

@@ -111,16 +111,10 @@ export default {
 
 <style scoped lang="sass">
 p.wow
- // color: blue
  -ms-transform: rotate(-7deg)
  -webkit-transform: rotate(-7deg)
  transform: rotate(-7deg)
- // margin-left: 10%
- // position: absolute
- // left: 0
  font-size: 1.5rem
  margin-bottom: 0
  font-family: "Comic Sans MS", cursive, sans-serif
-// .header
-// transform: scale(1, 1.5) skew(10deg, 0deg)
 </style>

pages/items/index.vue

@@ -4,17 +4,14 @@
  <div class="col-lg-12">
  <h2 class="mb-0">Items</h2>
  <p class="text-muted">
- Instantly generate your next codebase using any of the following
- Collection
+ Pre-render dynamic pages from static data
  </p>
  </div>
 
  <b-col lg="12">
  <b-row>
  <b-col lg="12">
- <transition-group name="generator-list" tag="div">
- <Item v-for="m in collection" :key="m.id" :model="m" />
- </transition-group>
+ <Item v-for="m in collection" :key="m.id" :model="m" />
  </b-col>
  </b-row>
  </b-col>
@@ -49,21 +46,3 @@ export default {
  }
 }
 </script>
-
-<style type="text/css">
-.generator-list-item {
- transition: all 1s;
- display: inline-block;
- margin-right: 10px;
-}
-
-.generator-list-enter,
-.generator-list-leave-to {
- opacity: 0;
- transform: translateY(30px);
-}
-
-.generator-list-leave-active {
- position: absolute;
-}
-</style>

pages/lambdas/hello.vue

@@ -0,0 +1,72 @@
+<template>
+ <section class="container">
+ <div class="row mt-3 mb-5">
+ <div class="col-lg-12">
+ <h2 class="mb-0">Hello World Lambda</h2>
+ <p class="text-muted">
+ A very simple lambda function that returns some text
+ </p>
+ </div>
+
+ <b-col lg="12">
+ <div class="card card-body bg-dark text-light">
+ <b-row>
+ <b-col v-if="loading" lg="12" class="text-center">
+ <font-awesome-icon size="4x" icon="spinner" spin />
+ </b-col>
+ <b-col v-else lg="12">
+ <p>Response from Lambda: {{ response }}</p>
+ <p v-if="error">
+ <strong>Error {{ error.status }}</strong>
+ <br />
+ {{ error.data }}
+ </p>
+ </b-col>
+ </b-row>
+ </div>
+ </b-col>
+ </div>
+ </section>
+</template>
+
+<script>
+export default {
+ head() {
+ return {
+ title: 'Nuxt Netlify Lambda - Hello World',
+ meta: [
+ {
+ hid: 'description',
+ name: 'description',
+ content: 'Nuxt Netlify Lambda - Hello World Description'
+ }
+ ]
+ }
+ },
+ data() {
+ return {
+ response: '',
+ error: null,
+ loading: false
+ }
+ },
+ created() {
+ this.invokeLambda()
+ },
+ methods: {
+ async invokeLambda() {
+ this.loading = true
+ try {
+ const res = await this.$axios.$get('/.netlify/functions/hello')
+ this.response = res
+ this.error = null
+ this.loading = false
+ } catch (e) {
+ this.error = e.response
+ this.response = '—'
+ this.loading = false
+ }
+ }
+ }
+}
+</script>

pages/lambdas/index.vue

@@ -0,0 +1,37 @@
+<template>
+ <section class="container">
+ <div class="row mt-3 mb-5">
+ <div class="col-lg-12">
+ <h2 class="mb-0">Lambdas</h2>
+ <p class="text-muted">
+ A series of example Netlify Lambda functions
+ </p>
+ </div>
+
+ <b-col lg="12">
+ <b-row>
+ <b-col lg="12">
+ Lambdas go here
+ </b-col>
+ </b-row>
+ </b-col>
+ </div>
+ </section>
+</template>
+
+<script>
+export default {
+ head() {
+ return {
+ title: 'Nuxt Netlify Lambda Starter - Lambdas',
+ meta: [
+ {
+ hid: 'description',
+ name: 'description',
+ content: 'My custom description'
+ }
+ ]
+ }
+ }
+}
+</script>