tomhicks

/*
Copy this into the console of any web page that is interactive and doesn't
do hard reloads. You will hear your DOM changes as different pitches of
audio.

I have found this interesting for debugging, but also fun to hear web pages
render like UIs do in movies.
*/

const audioCtx = new (window.AudioContext || window.webkitAudioContext)()

ryanbaumann

Problem

Tippecanoe is an open source command line tool for creating Mapbox Vector Tiles. It runs only on unix environments like MacOS and Linux - so if you need to make maps with large vector data from geojson, shapefiles, or similar - you're hosed if you're on Windows.

Goals

1. Create vector tiles of massive vector data on a Windows 10 machine

Requirements

abhaywawale

<template>
  <v-container fluid>
    <v-layout align-start justify-center>
      <v-flex xs4 class="elevation-2 ma-2">
        <v-tabs v-model="model" color="cyan" dark slider-color="yellow">
          <draggable v-model="tabs" class="v-tabs__container" @update="tabUpdate">
            <v-tab v-for="(tab, index) in tabs" :key="index" :href="`#tab-${index}`">
              {{ tab.name }}
            </v-tab>
          </draggable>

gaearon

Note:

When this guide is more complete, the plan is to move it into Prepack documentation.
For now I put it out as a gist to gather initial feedback.

A Gentle Introduction to Prepack (Part 1)

If you're building JavaScript apps, you might already be familiar with some tools that compile JavaScript code to equivalent JavaScript code:

• Babel lets you use newer JavaScript language features, and outputs equivalent code that targets older JavaScript engines.

rauschma

Strings

String.prototype.*

None of the string methods modify this – they always return fresh strings.

• charAt(pos: number): string ^ES1

  Returns the character at index pos, as a string (JavaScript does not have a datatype for characters). str[i] is equivalent to str.charAt(i) and more concise (caveat: may not work on old engines).

ndabAP

<template>
  <div>
    <p>I got {{ amount }} {{ 'cookie' | pluralize(amount) }}</p>
    <button @click="decrement">Decrement</button>
  </div>
</template>

<script>
  export default {
    data: () => ({

twmbx

// The polling function
function poll(fn, timeout, interval) {
    var endTime = Number(new Date()) + (timeout || 2000);
    interval = interval || 100;

    var checkCondition = function(resolve, reject) { 
        var ajax = fn();
        // dive into the ajax promise
        ajax.then( function(response){
            // If the condition is met, we're done!

laracasts

let webpack = require('webpack');
let path = require('path');

module.exports = {
    entry: {
        app: './resources/assets/js/app.js',
        vendor: ['vue', 'axios']
    },

    output: {

JacobBennett

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({

chikamichi

Hi!

About Lodash's forEach function, and Lodash in general…

I told you that it "abstracts away from you the chore (and complexity) of looping", so that you can focus on what really matters for your application: the collection you want to iterate through, and the piece of logic you wish to be applied for each item.

You use forEach like this:

// You first define "the collection you want to iterate through":