Skip to content

Instantly share code, notes, and snippets.

View dannyrb's full-sized avatar
🕵️‍♀️
Looking for a good reason to use GH statuses

Danny Brown dannyrb

🕵️‍♀️
Looking for a good reason to use GH statuses
329 followers · 1.4k following
View GitHub Profile
@dannyrb
dannyrb / seo-meta-tags.html
Created November 9, 2015 00:33
Adding OpenGraph, Twitter Card, and Schema.org (Google) tags to a blog article.
<!-- Update your html tag to include the itemscope and itemtype attributes. -->
<html itemscope itemtype="http://schema.org/Article">
<!-- Place this data between the <head> tags of your website -->
<title>Page Title. Maximum length 60-70 characters</title>
<meta name="description" content="Page description. No longer than 155 characters." />
<!-- Schema.org markup for Google+ -->
<meta itemprop="name" content="The Name or Title Here">
<meta itemprop="description" content="This is the page description">
@dannyrb
dannyrb / animated-lock-opening-fixed.markdown
Created November 8, 2016 11:33
Animated Lock Opening - Fixed
@dannyrb
dannyrb / index.html
Last active November 8, 2016 11:44
Night Sky - Full Width
<div class="container">
<div class="night-sky"></div>
<div class="stars"></div>
<div class="stars2"></div>
<div class="stars3"></div>
<div class="mountains">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" preserveAspectRatio="xMaxYMin meet" viewbox="0 0 110 160">
<!-- Where the magic happens -->
<defs>
@dannyrb
dannyrb / OctopusDeploySlackNotification.ps1
Created December 13, 2016 13:37
Hook Octopus Deployment into Slack Notifications. Example with resources to assist modifying.
## Resources
## Original: https://library.octopusdeploy.com/step-templates/21a2ae12-e721-42c1-901d-d6ed08007ca7/actiontemplate-slack-notify-deployment
## Slack API JSON
## https://api.slack.com/docs/messages/builder
## Octopus Variables
## http://docs.octopusdeploy.com/display/OD/System+variables
@dannyrb
dannyrb / Abstract_Graduating-from-Bootstrap-with-help-from-Atomic-Design.md
Last active February 1, 2017 21:13
Graduating from Bootstrap with help from Atomic Design - That Conference 2017 - Call For Speakers Abstract

Graduating from Bootstrap with help from Atomic Design

Bootstrap defines itself as "... the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web." and it's not wrong. At 105,000 stars, and over 48,000 forks on GitHub, it comes in as the second most popular repository of all time. Bootstrap is an amazing tool, but it's not without it's problems. Have you ever found yourself overriding a default Bootstrap style? Including CSS or JS for components you don't use? Or maybe you're just tired of your website looking like everyone else's? We put up with this technical debt because of the wins Bootstrap provides, but what if we could keep the benefits without all of the headache? Enter Atomic Design.

In this discussion, we will start by exploring the problems Atomic design solves, how it promotes consistency/cohesion, easily traverses from abstract to concrete, and provides methodology for crafting an effective design system. Next we will get our hands dirty by diggi

@dannyrb
dannyrb / Abstract_Creating-Hybrid-Mobile-Apps-That-Dont-Stink.md
Last active February 1, 2017 21:15
Creating Hybrid Mobile Apps That Don't Stink - That Conference 2017 - Call For Speakers Abstract

Creating Hybrid Mobile Apps That Don't Stink

Level: 200 - Category: Web

Tags: Style, Design, UI

More Info

@dannyrb
dannyrb / blog.md
Created December 16, 2017 01:04 — forked from JacobBennett/blog.md
Clean up your Vue modules with ES6 Arrow Functions

Recently when refactoring a Vue 1.0 application, I utilized ES6 arrow functions to clean up the code and make things a bit more consistent before updating to Vue 2.0. Along the way I made a few mistakes and wanted to share the lessons I learned as well as offer a few conventions that I will be using in my Vue applications moving forward.

The best way to explain this is with an example so lets start there. I'm going to throw a rather large block of code at you here, but stick with me and we will move through it a piece at a time.

<script>

// require vue-resource...

new Vue({
@dannyrb
dannyrb / @ BroadcastChannel Polyfill.md
Created December 29, 2017 20:49
BroadcastChannel Polyfill

BroadcastChannel Polyfill

BroadcastChannel is a new communication API proposed in the HTML Standard but not yet widely implemented. It allows messages to be sent to all other BroadcastChannel instances sharing the same channel name within the same browsing context and origin.

var bc = new BroadcastChannel('name');

bc.postMessage(payload);
@dannyrb
dannyrb / getMediumFeed.js
Last active May 16, 2018 00:50
Quick way to retrieve a Medium.com RSS feed as JSON
import axios from "axios";
async function getMediumFeed() {
try {
const mediumRssFeed = "https://medium.com/feed/coffee-driven-dev";
const rssToJsonApi = "https://api.rss2json.com/v1/api.json";
const data = { params: { rss_url: mediumRssFeed } };
return await axios.get(rssToJsonApi, data);
} catch (error) {
console.error(error);
@dannyrb
dannyrb / v-cache-basic.vue
Last active May 27, 2018 03:07
Example: Basic v-cache configuration
<template><!-- Business as usual --></template>
<script>
export default {
name: 'BasicForm',
data() {
return {
// Default setup uses 'form' object in
// data as cache target and restore cache target
form: {