Skip to content

Instantly share code, notes, and snippets.

View Akryum's full-sized avatar
☮️
Meow

Guillaume Chau Akryum

☮️
Meow
View GitHub Profile
@Akryum
Akryum / designer.html
Last active August 29, 2015 14:06
designer
<link rel="import" href="../core-icon-button/core-icon-button.html">
<link rel="import" href="../core-toolbar/core-toolbar.html">
<link rel="import" href="../core-icons/core-icons.html">
<link rel="import" href="../paper-icon-button/paper-icon-button.html">
<link rel="import" href="../paper-tabs/paper-tabs.html">
<link rel="import" href="../paper-tabs/paper-tab.html">
<polymer-element name="my-element">
<template>
@Akryum
Akryum / main.js
Created September 21, 2016 18:12
vue-apollo configuration and app startup
import Vue from 'vue';
import App from './App.vue';
import ApolloClient, { createNetworkInterface, addTypename } from 'apollo-client';
import VueApollo from 'vue-apollo';
// Create the apollo client
const apolloClient = new ApolloClient({
networkInterface: createNetworkInterface({
uri: 'http://localhost:8080/graphql',
transportBatching: true,
@Akryum
Akryum / PostList.vue
Last active November 13, 2019 02:28
Example Vue component using Apollo and GraphQL
<script>
import gql from 'graphql-tag';
// GraphQL query
const postsQuery = gql`
query allPosts {
posts {
id
title
votes
@Akryum
Akryum / PostList.vue
Created September 21, 2016 18:24
Polling vue-apollo query
apollo: {
posts: {
query: postsQuery,
loadingKey: 'loading',
// Polling query
pollInterval: 300, // ms
},
},
@Akryum
Akryum / App.vue
Last active September 21, 2016 18:45
<script>
export default {
created() {
this.$apollo.watchQuery({
/* options */
}).then(data => {
console.log(data);
});
},
};
@Akryum
Akryum / PostUpvoter.vue
Created September 22, 2016 08:21
Apollo mutation example in a Vue component
<script>
import gql from 'graphql-tag';
// GraphQL Mutation with one parameter
const upvoteMutation = gql`
mutation upvotePost($postId: Int!) {
upvotePost(postId: $postId) {
id
votes
}
@Akryum
Akryum / PostList.vue
Last active November 1, 2016 12:32
Initialize data
// Local state
data: () => ({
// You can initialize the 'posts' data here
posts: [],
loading: 0,
}),
@Akryum
Akryum / subscriptions.js
Created November 1, 2016 14:46
GraphQL server subscriptions
import { PubSub, SubscriptionManager } from 'graphql-subscriptions';
import schema from './schema';
const pubsub = new PubSub();
const subscriptionManager = new SubscriptionManager({
schema,
pubsub,
setupFunctions: {
tagAdded: (options, args) => {
console.log(args);
const field = this._leaving ? 'leave' : 'enter'
const lastField = '_lastDuration_' + field
const duration = this.duration
const explicitDuration = parseDuration((
duration !== null &&
typeof duration === 'object' &&
duration[field]
) || duration)
const el = child.elm
@Akryum
Akryum / Demo.vue
Last active February 25, 2019 16:18
vue-responsive
<template>
<div>
<div v-if="$responsive.mobile">Mobile</div>
<div v-else-if="$responsive.tablet">Tablet</div>
<div v-else>Desktop</div>
</div>
</template>