brianyang + github   3911

rpc-websockets: JSON-RPC 2.0 implementation over WebSockets for Node.js
Github repo
Name: rpc-websockets
Tagline: JSON-RPC 2.0 implementation over WebSockets for Node.js
Languages:
JavaScript = 75496 bytes

<div align="center">
<a href="https://github.com/elpheria/rpc-websockets">
<img src="http://i.imgur.com/5drhsqV.png">
</a>
<br>
<p>
WebSockets for <a href="http://nodejs.org">node</a> with JSON RPC 2.0 support on top.
</p>
<br>
<a href="https://github.com/elpheria/rpc-websockets/blob/master/LICENSE">
<img src="https://img.shields.io/github/license/mashape/apistatus.svg">
</a>
<a href="https://travis-ci.org/elpheria/rpc-websockets">
<img src="https://travis-ci.org/elpheria/rpc-websockets.svg?branch=master">
</a>
<a href="https://coveralls.io/github/elpheria/rpc-websockets?branch=master">
<img src="https://coveralls.io/repos/github/elpheria/rpc-websockets/badge.svg?branch=master">
</a>
<a href="https://www.npmjs.com/package/rpc-websockets">
<img src="https://img.shields.io/npm/dm/rpc-websockets.svg?maxAge=2592000">
</a>
<br>
<a href="https://nodei.co/npm/rpc-websockets">
<img src="https://nodei.co/npm/rpc-websockets.png?downloads=true&downloadRank=true&stars=true">
</a>
</div>

## Installation

```
npm install rpc-websockets
```

## Examples

```js
var WebSocket = require('rpc-websockets').Client
var WebSocketServer = require('rpc-websockets').Server

// instantiate Server and start listening for requests
var server = new WebSocketServer({
port: 8080,
host: 'localhost'
})

// register an RPC method
server.register('sum', function(params) {
return params[0] + params[1]
})

// create an event
server.event('feedUpdated')

// get events
console.log(server.eventList())

// emit an event to subscribers
server.emit('feedUpdated')

// close the server
server.close()

// instantiate Client and connect to an RPC server
var ws = new WebSocket('ws://localhost:8080')

ws.on('open', function() {
// call an RPC method with parameters
ws.call('sum', [5, 3]).then(function(result) {
require('assert').equal(result, 8)
})

// send a notification to an RPC server
ws.notify('openedNewsModule')

// subscribe to receive an event
ws.subscribe('feedUpdated')

ws.on('feedUpdated', function() {
updateLogic()
})

// unsubscribe from an event
ws.unsubscribe('feedUpdated')

// close a websocket connection
ws.close()
})
```

## Migrating to 3.x/4.x

Departing from version 2.x, there's been some minor API changes. A breaking change is a server.eventList method, which is not a getter method anymore, because of the inclusion of a namespaces system throughout the library. Other methods will work seamlessly.

## Client

```js
var WebSocket = require('rpc-websockets').Client
var ws = new WebSocket('ws://localhost:8080')
```

### new WebSocket(address[,...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
slim.js: Fast & Robust Front-End Micro-framework based on modern standards
Github repo
Name: slim.js
Tagline: Fast & Robust Front-End Micro-framework based on modern standards
Homepage: http://slimjs.com
Languages:
JavaScript = 78195 bytes
HTML = 14141 bytes

![hello, slim.js](./docs/slim2.png)

[![Build Status](https://semaphoreci.com/api/v1/eavichay/slim-js/branches/master/badge.svg)](https://semaphoreci.com/eavichay/slim-js)

[Chat on gitter](https://gitter.im/slim-js/Lobby?utm_source=share-link&utm_medium=link&utm_campaign=share-link)

# Hello, slim.js

Official website [here](http://slimjs.com)
Documentation [here](https://github.com/slimjs/slim.js/wiki)

## Slim is ultra fast, native and elegant library for web components development
Slim.js is a lightning fast library for development of native web-components and custom-elements based modern applications. No black magic involved.
It uses es6+DOM native API and boosts up HTML elements with superpowers.

### Is this another framework
No! It's a slim code layer that adds superpowers to HTML elements, using the browser native capabilities.
But... wait! there's more:
- It has data binding
- It can be extended
- It feels like a framework (but in a good way)
- It's as small as 5302 GzBytes!
- Single file, good to go.
- No tools required, everything is based on native browser API. Choose your own tools.

## Standards compilant
- es6
- web-components V1
- no transpiling or compilation required

## Tools free
- add Slim.js to your project and your'e good to go

# Documentation
- [Developer's Guide](http://slimjs.com)

The documentation site is built with Slim.js. Check out the source code, it's easy.

### Contibutors are welcome.

*USE THE PLATFORM*

[![Support slim.js](https://liberapay.com/assets/widgets/donate.svg)](https://liberapay.com/eavichay/donate)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
framework7-react-app-template: framework7-react-app-template
Github repo
Name: framework7-react-app-template
Tagline: framework7-react-app-template
Languages:
JavaScript = 15430 bytes
HTML = 1297 bytes
CSS = 53 bytes

# Framework7 React App Template

To get started, clone this repo as whatever you want to name your app:

```
git clone https://github.com/framework7io/framework7-react-app-template/ my-app
```

Running the app:

```
npm install
npm start
```

To build your app for deployment, run:

```
npm run build
```

The build folder will then contain all of your app's files, optimized and ready for deployment.

This template was created with [Create React App](https://github.com/facebookincubator/create-react-app). It is suggested that you read more about Create React App to understand the full capabilities of the toolset.

### Issues

Please log any issues to the main [Framework7 repo](https://github.com/framework7io/framework7/issues).
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
animatescroll.js: A Simple jQuery Plugin for Animating Scroll
Github repo
Name: animatescroll.js
Tagline: A Simple jQuery Plugin for Animating Scroll
Homepage: http://plugins.compzets.com/animatescroll
Languages:
HTML = 14752 bytes
JavaScript = 9566 bytes
CSS = 3767 bytes

AnimateScroll
=============

A Simple jQuery Plugin for Animating the Scroll

Demo can be seen at http://plugins.compzets.com/animatescroll

What is it exactly?
-------------------

AnimateScroll is a jQuery plugin which enables you to scroll to any part of the page in style by just calling the `animatescroll()` function with the `id` or `classname` of the element where you want to scroll to.

It gives power to the user with its various options to customize the style of scrolling, scroll speed and many more. Supports more than 30 unique Scrolling Styles.

Usage
------

You need two things for this plugin to work, one is "jQuery library" and the other `animatescroll.js` file.

Just include the `animatescroll.js` file after the "jQuery library" as shown in the code snippet below and you're done.

NOTE: The only dependency for this plugin to work is jQuery library.

```html
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="animatescroll.js">
</head>
<body>
<div id="section-1">This is the element where you want to scroll to<div>

/*
* You may call the function like this
* (but better attach an event listener)
*/
<a onclick="$('[jquery selector]').animatescroll([options]);">Go to Element</a>
</body>
</html>
```

**You can either download the files or install from Bower (package manager):**
```javascript
bower install animatescroll
```
NOTE: There are two js files, if you do not want the various easing effects, you can use the `animatescroll.noeasing.js`

Options
-------

AnimateScroll has 6 options:

1. [easing](#easing)
2. [scrollSpeed](#scrollSpeed)
3. [padding](#padding)
4. [element](#element)
5. [onScrollStart](#onScrollStart)
6. [onScrollEnd](#onScrollEnd)

#### easing (*default*: ```easing```)

This option defines the scrolling style. The various easing effects supported can be seen at www.easings.net (Accepts string only)

#### scrollSpeed (*default*: ```400```)

Controls the scrolling speed, higher is the number slower is the scroll speed (Accepts only number)

#### padding (*default*: ```0```)

Adjusts little ups and downs in scrolling. Suppose a small amount of padding is applied to a particular element due to which the scroll didn't end at the right position, so this option helps you to rectify (Accepts numbers only, can be negative)

#### element (*default*: ```html, body```)

**Added in v1.0.5**.
The element in which you want this plugin to work. Default is "body". (Accepts any jQuery/CSS selector)

#### onScrollStart

**Added in v1.0.7**.
A function to be called before scrolling starts

#### onScrollEnd

**Added in v1.0.7**.
A function to be called after the scrolling ends completely with animations

To add an...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
docsify: 🃏 A magical documentation site generator.
Github repo
Name: docsify
Tagline: 🃏 A magical documentation site generator.
Homepage: https://docsify.js.org
Languages:
JavaScript = 254310 bytes
CSS = 21560 bytes
HTML = 1551 bytes
Shell = 994 bytes

<p align="center">
<a href="https://docsify.js.org">
<img alt="docsify" src="./docs/_media/icon.svg">
</a>
</p>

<p align="center">
A magical documentation site generator.
</p>

<p align="center">
<a href="#backers"><img alt="Backers on Open Collective" src="https://opencollective.com/docsify/backers/badge.svg?style=flat-square"></a>
<a href="#sponsors"><img alt="Sponsors on Open Collective" src="https://opencollective.com/docsify/sponsors/badge.svg?style=flat-square"></a>
<a href="https://travis-ci.org/QingWei-Li/docsify"><img alt="Travis Status" src="https://img.shields.io/travis/QingWei-Li/docsify/master.svg?style=flat-square"></a>
<a href="https://www.npmjs.com/package/docsify"><img alt="npm" src="https://img.shields.io/npm/v/docsify.svg?style=flat-square"></a>
<a href="https://github.com/QingWei-Li/donate"><img alt="donate" src="https://img.shields.io/badge/%24-donate-ff69b4.svg?style=flat-square"></a>
</p>

<p align="center">Glod Sponsor via <a href="https://opencollective.com/docsify">Open Collective</a></p>

<p align="center">
<a href="https://opencollective.com/docsify/tiers/gold-sponsor/website">
<img src="https://opencollective.com/docsify/tiers/gold-sponsor.svg?avatarHeight=36">
</a>
</p>

## Links

* [Documentation](https://docsify.js.org)
* [CLI](https://github.com/QingWei-Li/docsify-cli)
* CDN: [UNPKG](https://unpkg.com/docsify/) | [jsDelivr](https://cdn.jsdelivr.net/npm/docsify/) | [cdnjs](https://cdnjs.com/libraries/docsify)
* [Awesome docsify](https://github.com/QingWei-Li/awesome-docsify)

## Features

* No statically built html files
* Simple and lightweight (~19kB gzipped)
* Smart full-text search plugin
* Multiple themes
* Useful plugin API
* Compatible with IE10+
* Support SSR ([example](https://github.com/QingWei-Li/docsify-ssr-demo))
* Support embedded files

## Quick start

Look at [this tutorial](https://docsify.js.org/#/quickstart) or [online demo](https://jsfiddle.net/7ztb8qsr/1/).

## Showcase

These projects are using docsify to generate their sites. Pull requests welcome :blush:

Move to [awesome-docsify](https://github.com/QingWei-Li/awesome-docsify)

## Similar projects

| Project | Description |
| ------------------------------------------------ | ---------------------------------------- |
| [docute](https://github.com/egoist/docute) | 📜 Effortlessly documentation done right |
| [docpress](https://github.com/docpress/docpress) | Documentation website generator |

## Contributing

* Fork it!
* Create your feature branch: `git...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
OLD-insight-api-OLD
Github repo
Name: OLD-insight-api-OLD
Tagline:
Languages:
JavaScript = 208932 bytes

<h1 align="center">Insight-api</h1>

<div align="center">
<strong>A Dash blockchain REST and WebSocket API Service</strong>
</div>
<br />
<div align="center">
<!-- Stability -->
<a href="https://nodejs.org/api/documentation.html#documentation_stability_index">
<img src="https://img.shields.io/badge/stability-stable-green.svg?style=flat-square"
alt="API stability" />
</a>
<!-- Build Status -->
<a href="https://travis-ci.org/dashevo/insight-api">
<img src="https://img.shields.io/travis/dashevo/insight-api/master.svg?style=flat-square" alt="Build Status" />
</a>
<!-- NPM version -->
<a href="https://npmjs.org/package/@dashevo/insight-api">
<img src="https://img.shields.io/npm/v/@dashevo/insight-api.svg?style=flat-square" alt="NPM version" />
</a>
</div>

This is a backend-only service. If you're looking for the web frontend application, take a look at https://github.com/dashevo/insight-ui.

## Table of Content
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Query Rate Limit](#query-rate-limit)
- [API HTTP Endpoints](#api-http-endpoints)
- [Block](#block)
- [Block Index](#block-index)
- [Raw Block](#raw-block)
- [Block Summaries](#block-summaries)
- [Transaction](#transaction)
- [Address](#address)
- [Address Properties](#address-properties)
- [Unspent Outputs](#unspent-outputs)
- [Unspent Outputs for Multiple Addresses](#unspent-outputs-for-multiple-addresses)
- [InstantSend Transactions](#instantsend-transactions)
- [Transactions by Block](#transactions-by-block)
- [Transactions by Address](#transactions-by-address)
- [Transactions for Multiple Addresses](#transactions-for-multiple-addresses)
- [Transaction Broadcasting](#transaction-broadcasting)
- [Sporks List](#sporks-list)
- [Proposals Informations](#proposals-informations)
- [Proposals Count](#proposals-count)
- [Budget Proposal List](#budget-proposal-list)
- [Budget Triggers List](#budget-triggers-list)
- [Budget Proposal Detail](#budget-proposal-detail)
- [Proposal Check](#proposal-check)
- [Proposal Deserialization](#proposal-deserialization)
- [Proposal Current Votes](#proposal-current-votes)
- [Governance Budget](#governance-budget)
- [Masternodes List](#masternodes-list)
- [Historic Blockchain Data Sync Status](#historic-blockchain-data-sync-status)
- [Live Network P2P Data Sync Status](#live-network-p2p-data-sync-status)
- [Status of the Bitcoin Network](#status-of-the-bitcoin-network)
- [Utility Methods](#utility-methods)
- [Web Socket Api](#web-socket-api)
- [Example Usage](#example-usage)
- [Notes on Upgrading from v0.3](#notes-on-upgrading-from-v03)
- [Notes on Upgrading from v0.2](#notes-on-upgrading-from-v02)
- [Resources](#resources)
-...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-icons: svg react icons of popular icon packs
Github repo
Name: react-icons
Tagline: svg react icons of popular icon packs
Homepage: http://react-icons.github.io/react-icons/
Languages:
JavaScript = 1695831 bytes
Shell = 227 bytes

<img src="https://rawgit.com/gorangajic/react-icons/master/react-icons.svg" width="120" alt="React Icons">

## [React Icons](http://react-icons.github.io/react-icons/index.html)

[![npm][npm-image]][npm-url]

[npm-image]: https://img.shields.io/npm/v/react-icons.svg?style=flat-square
[npm-url]: https://www.npmjs.com/package/react-icons

Include popular icons in your React projects easly with ```react-icons```, which utilizes ES6 imports that allows you to include only the icons that your project is using.

### Installation

npm install react-icons --save

### Usage

```jsx
import FaBeer from 'react-icons/lib/fa/beer';

class Question extends React.Component {
render() {
return <h3> Lets go for a <FaBeer />? </h3>
}
}
```

If you are not using an ES6 compiler like [Babel](https://babeljs.io/) or [Rollup](http://rollupjs.org/), you can include icons from the compiled folder `./lib`.
Babel by [default](http://babeljs.io/docs/usage/require/#usage) will ignore `node_modules` so if you don't want to change the settings you will need to use files from `./lib`.

```jsx
var FaBeer = require('react-icons/lib/fa/beer');

var Question = React.createClass({
render: function() {
return React.createElement('h3', null,
' Lets go for a ', React.createElement(FaBeer, null), '? '
);
}
});

```

You can include icons directly from `react-icons` using `import FaBeer from 'react-icons'`, but you should use a builder that uses dead code elimination like Webpack 2+, based on ES6 imports.

Also it's possible to import an entire icon pack:

```jsx
import * as FontAwesome from 'react-icons/lib/fa'

class Question extends React.Component {
render() {
return <h3> Lets go for a <FontAwesome.FaBeer />? </h3>
}
}
```

or import multiple icons from the same pack

```jsx
import {MdCancel, MdChat, MdCheck} from 'react-icons/md';
```

Each icon pack is in its own folder:

* Material Design Icons => `./md`
* FontAwesome => `./fa`
* Typicons => `./ti`
* Github Octicons => `./go`
* Ionicons => `./io`

To view them all, visit the [docs](http://gorangajic.github.io/react-icons/)

Also, to view and search for the necessary icons you can use [Icon Viewer](https://andy-pro.github.io/icon-viewer).

### Icons

Currently supported icons are:
* Material Design Icons by Google https://www.google.com/design/icons/ (licence: [CC-BY 4.0](https://github.com/google/material-design-icons/blob/master/LICENSE))
* Font Awesome by Dave Gandy - http://fontawesome.io (licence: [SIL OFL 1.1](http://scripts.sil.org/OFL))
* Typicons by Stephen Hutchings - http://typicons.com (licence: [CC BY-SA](http://creativecommons.org/licenses/by-sa/3.0/))
* Github Octicons icons by Github...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
hue: Hue will help you to print awesomely in terminals.
Github repo
Name: hue
Tagline: Hue will help you to print awesomely in terminals.
Languages:
Python = 1185 bytes

# Hue

![Hue Logo](https://i.imgur.com/Pxe9la8.png)

Hue provides a minimal and powerful interface to print colored text and labels in the terminal.\
It works with Python 2 as well as Python 3.

What makes hue better than other coloring libraries? [Here's a comparison.](#why-hue)

## Supported Stuff

Following styles are supported

![Hue Styles](https://i.imgur.com/899ZtQy.png)

Following colors are supported

![Hue Colors](https://i.imgur.com/9tWvPkD.png)

Following labels are supported

![Hue Labels](https://i.imgur.com/8qBq0Zd.png)

### Installation
You can install `hue` with **pip** as follows:
```
pip install huepy
```
or with **easy_install**:
```
easy_install huepy
```

### Usage
First of all, import everything that Hue has to offer as follows:

```python
from huepy import *
```

Printing colored text is as simple as doing

```python
print red('This string is red')
```

Easy right?
But what if you want to print italic text?
You can simply do this

```python
print italic('This string is in italic')
```

You can also combine styles and colors

```python
print bold(red('This string is bold and red'))
```

Output:
![Output Examples](https://i.imgur.com/Lo7ZyHq.png)

And what is the use of those labels?\
I have been using these labels in projects as a minimal output schema.\
If some error occured in your program or something else bad happened you don't need to print the whole line in red. With hue, you can simply do this

```python
print bad('An error occured.')
```

Take a look at the output of all the labels
![Label Examples](https://i.imgur.com/b4Kj5Ym.png)

#### List of all colors

```python
white, grey, black, green, lightgreen, cyan, lightcyan, red, lightred,
blue, lightblue, purple, light purple, orange, yellow
```

#### List of all styles

```python
bold, bg, under, strike, italic
```

#### List of all labels

```python
info, que, run, bad, good
```

**Note:** Windows versions below windows 10 do not support ANSI escape sequences so the colors will not be printed in command prompt.

### Why hue

Because its awesome!
Lets print a red colored string in popular coloring libraries:

- Colorama
```python
from colorama import Fore
print Fore.RED + 'This string is red'
```
- Termcolor
```python
import sys
from termcolor import colored, cprint
print colored('This string is red', 'red')
```
- Hue
```python
from hue import *
print red('This string is red')
```
Here's comparison table:

||Hue|Colorama|Termcolor|
|---|---|--------|---------|
|Compatibility|Unix & Windows 10|Unix & Windows|Unix|
|Ease of use|10/10|4/10|5/10|
|Bright Colors|Yes|No|No|

**Note:** Colorama and Termcolor print bold styled strings when asked for bright colored strings. On the other hand, Hue supports both bright and bold strings. Also the *Ease to use* ratings are a result of my own experience and may differ for others.

###...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
hexo-theme-apollo: a clean and delicate hexo theme
Github repo
Name: hexo-theme-apollo
Tagline: a clean and delicate hexo theme
Homepage: http://pinggod.com/
Languages:
CSS = 9593 bytes
HTML = 6448 bytes
JavaScript = 509 bytes

![hexo-theme-apollo](https://cloud.githubusercontent.com/assets/9530963/13026956/08e76eca-d277-11e5-8bfc-2e80cea20a0d.png)

## 文档

- [中文文档](https://github.com/pinggod/hexo-theme-apollo/blob/master/doc%2Fdoc-zh.md)
- [Document](https://github.com/pinggod/hexo-theme-apollo/blob/master/doc%2Fdoc-en.md)

## 贡献

该项目不再接受添加新特性、功能的 pull request,所有创造性的想法请 fork 该项目之后自由发挥。

## 安装

[![asciicast](https://asciinema.org/a/emrvroa9054hz6k8ise0uxh2u.png)](https://asciinema.org/a/emrvroa9054hz6k8ise0uxh2u)

``` bash
hexo init Blog
cd Blog
npm install
npm install --save hexo-renderer-jade hexo-generator-feed hexo-generator-sitemap hexo-browsersync hexo-generator-archive
git clone https://github.com/pinggod/hexo-theme-apollo.git themes/apollo
```

## 启用

修改 `_config.yml` 的 `theme` 配置项为 `apollo`:

```yaml
theme: apollo

# 在归档页面显示所有文章
# 需要上面安装的 hexo-generator-archive 插件支持
archive_generator:
per_page: 0
yearly: false
monthly: false
daily: false
```

## 更新

``` bash
cd themes/apollo
git pull
```

## License

MIT
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
battlecry: A simple and customizable scaffolding tool for all languages and frameworks
Github repo
Name: battlecry
Tagline: A simple and customizable scaffolding tool for all languages and frameworks
Languages:
JavaScript = 39750 bytes

# 🥁 battlecry

> A simple and customizable scaffolding tool for all languages and frameworks

[![npm version](https://img.shields.io/npm/v/battlecry.svg)](https://www.npmjs.org/package/battlecry)
[![Build Status](https://travis-ci.org/pedsmoreira/battlecry.svg?branch=master)](https://travis-ci.org/pedsmoreira/battlecry)
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
[![Maintainability](https://api.codeclimate.com/v1/badges/a2c3f76f8d99cfe9ef1c/maintainability)](https://codeclimate.com/github/pedsmoreira/battlecry/maintainability)
[![Test Coverage](https://api.codeclimate.com/v1/badges/a2c3f76f8d99cfe9ef1c/test_coverage)](https://codeclimate.com/github/pedsmoreira/battlecry/test_coverage)

## What is Battlecry?

Battlecry is a cross-platform tool for automating repetitive software development tasks.

Designed to boost developers' performance, Battlecry provides an interface for creating simple and customizable commands that can perform any type of action. Since most of the time developers need to `create`, `copy`, `move`, `edit` or `delete` text files, Battlecry already comes with file helpers that make templating a breeze.

<p align="center">
<img src="./docs/screencast.gif" />
</p>

_Note: Battlecry got renamed from Samba to avoid confusions with the Samba Linux software_

## Why Battlecry?

* ✅ Perfect for creating new modules, components and even new projects
* ✅ Easy to share with your team through your favorite version control system
* ✅ Use it with all languages and frameworks
* ✅ Plug'n play customizable generators
* ✅ Simple & Powerful API
* ✅ Next generation naming with [casex](https://github.com/pedsmoreira/casex)

### Why not just use [Yeoman](http://yeoman.io/)?

Yeoman is a great tool for creating new projects, but when it comes to updating ongoing projects, I think there's a lot of room for improvement. If you want to use a framework with a strict set of libraries and requirements you can probably find a Yeoman generator that suits you, but you won't be able to customize these generators with ease.

In my experience, the farther you go on a project, the more you'll need to shape your generators to fit it. Each project has it's own requirements and it's only fair that it get it's own generators. With Battlecry you can create your own or download generators to give you a nice quickstart, and when you need to customize them, it's very easy to do so and you can share the changes with your whole team.

## Examples

Each example can be downloaded with `cry download generator examples/example_name_here`.

1. [args](./examples/args): Working with arguments
2. [options](./examples/options): Working with options
3. [multiple-templates](./examples/multiple-files): Working with multiple template files
4. [aliases](./examples/aliases): Creating your own method aliases
5. [helpers](./examples/helpers): Using helpers to share methods across generators
6. ...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
deyarn: A command-line tool for converting projects that use Yarn to npm.
Github repo
Name: deyarn
Tagline: A command-line tool for converting projects that use Yarn to npm.
Languages:
JavaScript = 3179 bytes

# `deyarn`

A command-line tool for converting projects that use `yarn` to `npm`.

The follow-up to [`npm2yarn`](https://github.com/mixmaxhq/npm2yarn). See https://mixmax.com/blog/to-yarn-and-back-again-npm for motivation.

## Procedure

`deyarn`:

1. Checks out the `master` branch
2. Pulls the latest changes
3. Checks out a new branch, `deyarnify`, overwriting any existing `deyarnify` branch
4. Removes `yarn.lock` if it exists
5. Removes `node_modules` to avoid any installation conflicts
6. Installs your project dependencies using `npm`, generating a `package-lock.json` file
7. Runs `npm test` as a sanity check
8. Stages the changes made
9. Logs a list of manual steps to be taken to complete the transition

This conversion will likely involve the upgrading of some/many of your transitive dependencies, so make sure to test thoroughly! :)

## Installation

```sh
$ npm install -g deyarn
```
or
```sh
$ yarn global add deyarn
```

## Usage

(in the directory of the project to convert, which must be a Git repository)
```
$ deyarn
```

## Contributing

We welcome your pull requests! Please lint your code.

## Changelog

* 1.0.0 Add initial code
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
fixer: A foreign exchange rates and currency conversion API
Github repo
Name: fixer
Tagline: A foreign exchange rates and currency conversion API
Homepage: http://fixer.io
Languages:
Ruby = 20958 bytes
Shell = 3651 bytes

![alt text](https://github.com/fixerAPI/fixer/blob/master/warning.png?raw=true)

# Fixer - Important Announcement

We are happy to announce the complete relaunch of fixer.io into a more stable, more secure, and much more advanced currency & exchange rate conversion API platform. While the core structure of our API remains unchanged, all users of the legacy Fixer API will be required to sign up for a free API access key and perform a few simple changes to their integration. To learn more about the changes that are required, please jump to the „Required Changes“ section below.

**Required Changes to Legacy Integrations (api.fixer.io)**

As of March 6th 2018, the legacy Fixer API (api.fixer.io) is deprecated and a completely re-engineered API is now accessible at https://data.fixer.io/api/ The core structure of the old API has remained unchanged, and you will only need to perform a few simple changes to your integration.

**1. Get a Free Fixer Access Token**

Go to fixer.io and create an account. After signup, you will receive an access token immediately. If you plan on using less than 1000 requests per month, your account will be completely free. If you need more or want to use some of our new features, you’ll need to choose one of the paid options.

**2. Replace API URL and add Access Key**

The new API comes with a new endpoint and now requires an access key in the GET URL. Please change your API URL from api.fixer.io to https://data.fixer.io/api and attach your newly generated access key to the URL as a GET parameter named „access_key“.

**Example**

If your old API Call was https://api.fixer.io/latest then your new integration should point to: https://data.fixer.io/api/latest?access_key=YOUR_ACCESS_KEY

**New Features**

Although the core structure of the fixer API remains unchanged, we added a whole lot of improvements, 100+ more currencies, and many more features to the new Fixer API. You can read more about all new features on the new fixer.io website. Here’s a list of the most important ones:

- **Fixer is still free!**
Although we now offer a set of premium plans for more advanced users, the basic API features (e.g. getting the latest and historical exchange rates) remain completely free of charge. Minor limitations include our new 1000 requests/month limit and EUR being the only available base currency for customers using a free account. If you need more than 1000 requests per month or want to use all 170 available base currencies, you’ll need to choose one of the paid plans starting at only $10 per month.

- **Over 100 Additional Currencies**
The new Fixer API now supports over 100 additional currencies, bumping the total available currencies for conversion to 170.

- **More Reliable Data Sources & Updates every minute**
The old Fixer API was limited to currency data from the European Central Bank, which updates only once every day. The new API comes with 16+ connected data sources and data updates every hour, 10-minutes, or even every minute - depending on which subscription plan you choose.

- **More Endpoints**
The new fixer API has over 3 new endpoints, including a Direct Conversion endpoint, Time-Series conversion endpoint, and allows you to see the fluctuation of a specfic currency using our new...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
calendar-demo-frontend
Github repo
Name: calendar-demo-frontend
Tagline:
Languages:
Vue = 45558 bytes
JavaScript = 24083 bytes
CSS = 18760 bytes

# calendar-demo-frontend

> Nuxt.js + Vuetify.js project

## Build Setup

``` bash
# install dependencies
$ npm install # Or yarn install

# serve with hot reload at localhost:3000
$ npm run dev

# build for production and launch server
$ npm run build
$ npm start

# generate static project
$ npm run generate
```

For detailed explanation on how things work, check out the [Nuxt.js](https://github.com/nuxt/nuxt.js) and [Vuetify.js](https://vuetifyjs.com/) documentation.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
remeal: Reveal.js remote control
Github repo
Name: remeal
Tagline: Reveal.js remote control
Languages:
JavaScript = 43456 bytes
CSS = 547 bytes
HTML = 456 bytes

# Remeal
[![Build Status](https://travis-ci.org/dmitry-korolev/remeal.svg?branch=master)](https://travis-ci.org/dmitry-korolev/remeal) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) [![Greenkeeper badge](https://badges.greenkeeper.io/dmitry-korolev/remeal.svg)](https://greenkeeper.io/)
[![Twitter URL](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](http://twitter.com/share?text=Remeal:%20simple%20control%20panel%20for%20HTML%20presentations&url=https://github.com/dmitry-korolev/remeal&hashtags=remeal,revealjs,presentations)

Simple remote control panel for [reveal.js](https://revealjs.com/) presentations based on socket.io.

Features:

1. Title of the talk. For busy people!
2. Timer. Click on it to restart.
3. Beautiful connection indicator.
4. Displays the current slide. Tap and hold the slide to turn the pointer on (can be disabled at the customization panel).
5. Displays speaker notes for the current slide.
6. Controls available:
1. next slide
2. previous slide
3. toggle pause mode
4. toggle overview mode
7. Customizable panel! Choose where to place the current slide, speaker notes and controls, or disable them at all!
8. Light and dark theme included. Sometimes you just don't want to make your listeners blind.
9. Control panel vibrates on receiving events from the presentation so that you don't have to look back on the main screen to be sure that everything works (can be disabled at the customization panel).

See it in action:

[![Remeal demonstration](https://img.youtube.com/vi/aAibnF0HJtY/0.jpg)](https://www.youtube.com/watch?v=aAibnF0HJtY)

## Usage
The installation process includes two simple steps:

1. Clone this repo and deploy anywhere. Don't forget to `npm run build&& npm run start` it (hint: `now` will do it automatically).
2. Connect your presentation to the control panel. There are two ways to do that:
1. Visit remeal deployment and drag the huge `Remeal` link to the bookmarks panel. Then open your presentation and press the bookmarklet. The presentation will be connected to the control panel automatically. This method is preferable. Obviously.
2. OR, if you feel *adventurous*, build remeal locally (`npm run build`), copy `plugin/remeal.js` to your presentation and add it as a dependency:
```js
Reveal.initialize({
...otherConfigOptions,
dependencies: [
...otherDependencies,
{ src: REMEAL_PLUGIN_URL_GOES_HERE, async: true, callback: () => initRemeal() }
]
})
```
Then open your presentation and press `r` to connect to the remote control panel.
3. Tapping on the gear in the header opens the configuration panel, where you can:
1. Switch theme
2. Rearrange or disable control panel blocks
3. Turn vibrations on and off
4. Enable and disable the pointer feature.

## Screenshots
### Dark theme
![Dark theme](/screenshots/dark.png?raw=true "Dark theme")

### Light theme
![Light...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
Flutter-SearchView: A Flutter SearchView Application
Github repo
Name: Flutter-SearchView
Tagline: A Flutter SearchView Application
Languages:
Dart = 5813 bytes
Objective-C = 1291 bytes
Java = 946 bytes

# Flutter-SearchView
A Flutter SearchView Application

![Preview](app.gif)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
nextgram: A sample Next.js app for showing off its capabilities
Github repo
Name: nextgram
Tagline: A sample Next.js app for showing off its capabilities
Homepage: https://next-gram.now.sh
Languages:
JavaScript = 5002 bytes

# NextGram

Sample [next](https://github.com/zeit/next.js) app that takes advantage of the
routing capabilities. In particular, notice that the photo route can be attached to _two distinct_ components: in one case rendered as a modal, and in another case rendered independently.

![NextGram](https://i.imgur.com/KF0KExk.gif)

# Installation

$ npm install

# Running the app

$ npm run dev
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
armin: Declarative state machines for React!
Github repo
Name: armin
Tagline: Declarative state machines for React!
Languages:
JavaScript = 21818 bytes
HTML = 531 bytes

<p align="center">

<img src="https://github.com/imbhargav5/armin/blob/master/.github/armin_logo.png"/>
</p>

<p align="center"> Declarative state machines for React! </p>

<hr/>
<p align="center">
React Component state is a powerful way of managing state within a component, but can we do more? Can we create and maintain state which is more readable and self-explantory and powerful at the same time?
</p>
<hr/>

## Quick Example

```javascript
import {createMachine} from "armin"

const ViewToggler = createMachine({
allStates: ["visible", "hidden"],
state : "visible",
reducers : {
hide : {
from : ["visible"],
setState : () => "hidden"
},
show : {
from : ["hidden"],
setState : () => "visible"
}
}
})

// In your component's render method

<ViewToggler.Provider>
...
<ViewToggler.Consumer>
{toggler => <>
<button disabled={toggler.is.visible} onClick={toggler.show} > Show </button>
<button disabled={toggler.is.hidden} onClick={toggler.hide} > Hide </button>
</>}
</ViewToggler.Consumer>
...
</ViewToggler.Provider>

```

So what is going on there?

The configuration for a state machine like above means that,

- All your states have names
- Reducers describe how state can be updated using `from` and `setState` keywords.
- `allStates` defines all the valid states your state machine can take.
- When you create a state machine you get a `Provider` and `Consumer` and the `Consumer` is able to expose a `controller` which is capable of performing actions and manipulate state of your machine. You can create as many consumers as you like and they all talk to each other through the `Provider`.

Is that all `Armin` can do? Nope. Let's take a slightly larger example.

### Single State Machine -> An async counter example with armin

1. Create a machine

```javascript
import {createMachine} from "armin"

const { Provider, Consumer } = createMachine({
allStates: ["ready", "running", "stopped"],
state: "ready",
value: 0,
reducers: {
increment: {
setValue: ({ value, state }, payload = 1) => value + payload,
setState: () => "running"
},
decrement: {
from: ["running"],
setValue: ({ value, state }, payload = 1) => value - payload,
setState: (opts, setValue) =>
setValue <= 0 ? "stopped" : "running"
// setState function has access to the newValue that was generated in setValue as the second argument. Opts
// contains current value and current state.
},
stop: {
from: ["ready", "running"],
setValue: ({ value }) => value,
setState: () => "stopped"
}
},
effects: {
async incrementAsync() {
console.log("waiting");
await new Promise(resolve =>
setTimeout(() => {
...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
nextjs-with-aws-appsync: Demo of a working Next.js with AWS AppSync example
Github repo
Name: nextjs-with-aws-appsync
Tagline: Demo of a working Next.js with AWS AppSync example
Languages:
JavaScript = 3147057 bytes

# Next.js with AWS AppSync
Check out [this](https://medium.com/@dabit3/ssr-graphql-apps-with-next-js-aws-appsync-eaf7fbeb1bde) post for a full walk-through.

## Getting started

1. Create your AppSync.js configuration

2. Install dependencies

```bash
yarn
```

3. Start the app

```bash
npm run dev
```
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
tfjs-examples: Examples built with TensorFlow.js
Github repo
Name: tfjs-examples
Tagline: Examples built with TensorFlow.js
Homepage: https://js.tensorflow.org/
Languages:
JavaScript = 220556 bytes
Python = 54874 bytes
HTML = 41267 bytes
TypeScript = 28216 bytes
Shell = 18840 bytes
CSS = 6830 bytes
Vue = 2324 bytes

# TensorFlow.js Examples

This repository contains a set of examples implemented in
[TensorFlow.js](http://js.tensorflow.org).

Each example directory is standalone so the directory can be copied
to another project.

# Dependencies

Except for `getting_started`, all the examples require the following dependencies to be installed.

- Node.js version 8.9 or higher
- [NPM cli](https://docs.npmjs.com/cli/npm) OR [Yarn](https://yarnpkg.com/en/)

## How to build an example
`cd` into the directory

If you are using `yarn`:

```sh
cd mnist-core
yarn
yarn watch
```

If you are using `npm`:
```sh
cd mnist-core
npm install
npm run watch
```

### Details

The convention is that each example contains two scripts:

- `yarn watch` or `npm run watch`: starts a local development HTTP server which watches the
filesystem for changes so you can edit the code (JS or HTML) and see changes when you refresh the page immediately.

- `yarn build` or `npm run build`: generates a `dist/` folder which contains the build artifacts and
can be used for deployment.

## Contributing

If you want to contribute an example, please reach out to us on
[Github issues](https://github.com/tensorflow/tfjs-examples/issues)
before sending us a pull request as we are trying to keep this set of examples
small and highly curated.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
eslint-config-codingitwrong: An ESLint config that doesn't get in the way of refactoring.
Github repo
Name: eslint-config-codingitwrong
Tagline: An ESLint config that doesn't get in the way of refactoring.
Languages:
JavaScript = 1892 bytes

# eslint-config-codingitwrong

The goal of this ESLint config is to enforce safety and a consistent style, while not getting in the way of refactoring. In particular:

- Unused variables (and thus imports) are allowed, so that if you are temporarily not using a variable you don't have to comment it out elsewhere.
- Arrow parens and body style are not restricted, so you can add or remove parameters, or switch it between a block and expression without needing to change the style.
- Quote style is not enforced so you won't need to change backticks to another type of quote if you temporarily remove all template expressions.
- Constant conditions are allowed so you can do `if (true)` or `if (false)` to temporarily get a branch to always pass.
- `console.log()`, `alert()`, and `debugger` are allowed. How else are you going to get anything done??
- Unreachable code is allowed so you can put an early `return` in a block for experimentation.

However, curlies are required; it's just too risky to allow leaving them out.

## Usage

Install the package:

`npm install --save-dev eslint-config-codingitwrong`

Then set it in your ESLint config file. This package doesn't extend `eslint:recommended` itself, but it's _recommended_ that you do so:

```javascript
module.exports = {
"extends": [
"eslint:recommended",
"codingitwrong",
],
};
```

## License

Apache
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
wired-elements: Collection of elements that appear hand drawn. Great for wireframes.
Github repo
Name: wired-elements
Tagline: Collection of elements that appear hand drawn. Great for wireframes.
Homepage: https://wiredjs.com
Languages:
JavaScript = 65855 bytes

# wired-elements 👉 [wiredjs.com](https://wiredjs.com)
Wired Elements is a series of basic UI Elements that have a hand drawn look. These can be used for wireframes, mockups, or just the fun hand-drawn look.

![alt Preview](https://i.imgur.com/qttPllg.png)

The elements are drawn with enough randomness that no two renderings will be exactly the same - just like two separate hand drawn shapes.

## Try now
Play with wired-elements live on StackBlitz playground:

[Wired Elements](https://stackblitz.com/edit/wired-elements?file=index.html)

[Wired Elements in React](https://stackblitz.com/edit/wired-elements-react?file=index.js)

## Install

The package (wired-elements) exports all components in the **_wired_** category. List of all wired elements can be found [here](https://github.com/wiredjs/wired-elements/tree/master/packages).

Add wired-elements to your project:
```
npm i wired-elements
```
or individual controls
```
npm i wired-button
```

## Usage

Import into your module script:
```javascript
import { WiredButton, WiredInput } from "wired-elements"
```

Alternatively, load a bundled version from the [dist folder](https://github.com/wiredjs/wired-elements/tree/master/packages/all/dist) or from CDN:

```html
<script src="https://unpkg.com/wired-elements@latest/dist/wired-elements.bundled.min.js"></script>
```

#### Use it in your web page:
```html
<wired-input placeholder="Enter name"></wired-input>
<wired-button>Click Me</wired-button>
```

Learn about web components [here](https://www.webcomponents.org/introduction).

### Demo

Demo of all components is available at [wiredjs.com](https://wiredjs.com/showcase.html).

## Dev Environment

View the [Dev environment page](https://github.com/wiredjs/wired-elements/wiki/Dev-Environment) for instructions.

## License
[MIT License](https://github.com/wiredjs/wired-elements/blob/master/LICENSE) (c) [Preet Shihn](https://twitter.com/preetster)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
simplecrawler: Flexible event driven crawler for node.
Github repo
Name: simplecrawler
Tagline: Flexible event driven crawler for node.
Languages:
JavaScript = 215958 bytes

# Simple web crawler for node.js

[![NPM version](https://img.shields.io/npm/v/simplecrawler.svg)](https://www.npmjs.com/package/simplecrawler)
[![Linux Build Status](https://img.shields.io/travis/cgiffard/node-simplecrawler/master.svg)](https://travis-ci.org/cgiffard/node-simplecrawler)
[![Windows Build Status](https://img.shields.io/appveyor/ci/cgiffard/node-simplecrawler/master.svg?label=Windows%20build)](https://ci.appveyor.com/project/cgiffard/node-simplecrawler/branch/master)
[![Dependency Status](https://img.shields.io/david/cgiffard/node-simplecrawler.svg)](https://david-dm.org/cgiffard/node-simplecrawler)
[![devDependency Status](https://img.shields.io/david/dev/cgiffard/node-simplecrawler.svg)](https://david-dm.org/cgiffard/node-simplecrawler#info=devDependencies)

simplecrawler is designed to provide a basic, flexible and robust API for
crawling websites. It was written to archive, analyse, and search some
very large websites and has happily chewed through hundreds of thousands of
pages and written tens of gigabytes to disk without issue.

## What does simplecrawler do?

* Provides a very simple event driven API using `EventEmitter`
* Extremely configurable base for writing your own crawler
* Provides some simple logic for auto-detecting linked resources - which you can
replace or augment
* Automatically respects any robots.txt rules
* Has a flexible queue system which can be frozen to disk and defrosted
* Provides basic statistics on network performance
* Uses buffers for fetching and managing data, preserving binary data (except
when discovering links)

## Documentation

- [Installation](#installation)
- [Getting started](#getting-started)
- [Events](#events)
- [A note about HTTP error conditions](#a-note-about-http-error-conditions)
- [Waiting for asynchronous event listeners](#waiting-for-asynchronous-event-listeners)
- [Configuration](#configuration)
- [Fetch conditions](#fetch-conditions)
- [Download conditions](#download-conditions)
- [The queue](#the-queue)
- [Manually adding to the queue](#manually-adding-to-the-queue)
- [Queue items](#queue-items)
- [Queue statistics and reporting](#queue-statistics-and-reporting)
- [Saving and reloading the queue (freeze/defrost)](#saving-and-reloading-the-queue-freezedefrost)
- [Cookies](#cookies)
- [Cookie events](#cookie-events)
- [Link Discovery](#link-discovery)
- [FAQ/Troubleshooting](#faqtroubleshooting)
- [Node Support Policy](#node-support-policy)
- [Current Maintainers](#current-maintainers)
- [Contributing](#contributing)
- [Contributors](#contributors)
- [License](#license)

## Installation

```sh
npm install --save simplecrawler
```

## Getting Started

Initializing simplecrawler is a simple process. First, you require the module
and instantiate it with a single argument. You then configure the properties you
like (eg. the request interval), register a few event listeners, and call the
start method. Let's walk through the process!

After requiring the crawler, we...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
deno: A secure TypeScript runtime on V8
Github repo
Name: deno
Tagline: A secure TypeScript runtime on V8
Languages:
JavaScript = 86670 bytes
TypeScript = 46809 bytes
Go = 27022 bytes
C++ = 22310 bytes
Python = 5733 bytes
Makefile = 1421 bytes
C = 1386 bytes
Shell = 390 bytes

# deno

[![Build Status](https://travis-ci.com/ry/deno.svg?branch=master)](https://travis-ci.com/ry/deno)

## A secure TypeScript runtime built on V8

* Supports TypeScript 2.8 out of the box. Uses V8 6.8.275.3. That is, it's
very modern JavaScript.

* No `package.json`. No npm. Not explicitly compatible with Node.

* Imports reference source code URLs only.
```
import { test } from "https://unpkg.com/deno_testing@0.0.5/testing.ts"
import { log } from "./util.ts"
```
Remote code is fetched and cached on first execution, and never updated until
the code is run with the `--reload` flag. (So, this will still work on an
airplane. See `~/.deno/src` for details on the cache.)

* File system and network access can be controlled in order to run sandboxed
code. Defaults to read-only file system access and no network access.
Access between V8 (unprivileged) and Golang (privileged) is only done via
serialized messages defined in this
[protobuf](https://github.com/ry/deno/blob/master/msg.proto). This makes it
easy to audit.
To enable write access explicitly use `--allow-write` and `--allow-net` for
network access.

* Single executable:
```
> ls -lh deno
-rwxrwxr-x 1 ryan ryan 55M May 28 23:46 deno
> ldd deno
linux-vdso.so.1 => (0x00007ffc6797a000)
libpthread.so.0 => /lib/x86_64-linux-gnu/libpthread.so.0 (0x00007f104fa47000)
libstdc++.so.6 => /usr/lib/x86_64-linux-gnu/libstdc++.so.6 (0x00007f104f6c5000)
libm.so.6 => /lib/x86_64-linux-gnu/libm.so.6 (0x00007f104f3bc000)
libgcc_s.so.1 => /lib/x86_64-linux-gnu/libgcc_s.so.1 (0x00007f104f1a6000)
libc.so.6 => /lib/x86_64-linux-gnu/libc.so.6 (0x00007f104eddc000)
/lib64/ld-linux-x86-64.so.2 (0x00007f104fc64000)
```

* Always dies on uncaught errors.

* Supports top-level `await`.

* Aims to be browser compatible.

* Can be used as a library to easily build your own JavaScript runtime.
https://github.com/ry/deno/blob/master/cmd/main.go

## Status

Segfaulty.

No docs yet. For some of the public API see: [deno.d.ts](https://github.com/ry/deno/blob/master/deno.d.ts).

And examples are around here: [testdata/004_set_timeout.ts](https://github.com/ry/deno/blob/master/testdata/004_set_timeout.ts).

Roadmap is [here](https://github.com/ry/deno/blob/master/TODO.txt).

Also see this presentation: http://tinyclouds.org/jsconf2018.pdf

### Github Noise

I am excited about all the interest in this project. However, do understand that this
is very much a non-functional prototype. There's a huge amount of heavy lifting to do.
Unless you are participating in that, please maintain radio silence on github. This
includes submitting trivial PRs (like improving README build instructions).

## Compile instructions

I will release binaries at some point, but for now you have to build it
yourself.

You will need [Go](https://golang.org) with `$GOPATH` defined and
`$GOPATH/bin` in your...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
30-seconds-of-interviews: A curated collection of common interview questions to help you prepare for your next interview.
Github repo
Name: 30-seconds-of-interviews
Tagline: A curated collection of common interview questions to help you prepare for your next interview.
Homepage: https://30secondsofinterviews.org
Languages:
JavaScript = 20333 bytes
CSS = 12799 bytes
Shell = 2293 bytes
HTML = 971 bytes

<a href="https://30secondsofinterviews.org"><img src="logo.jpg" alt="30 Seconds of Interviews logo"></a>

<h1 align="center">
30 Seconds of Interviews
</h1>

<h4 align="center">A curated collection of common interview questions to help you prepare for your next interview.</h4>

<br>

<p align="center">
<a href="https://gitter.im/30-seconds-of-interviews/Lobby"><img src="https://img.shields.io/badge/gitter-join%20chat%20%E2%86%92-brightgreen.svg" alt="gitter"></a>
<a href="https://github.com/fejes713/30-seconds-of-interviews/blob/master/CONTRIBUTING.md"><img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome"></a>
<a href="https://travis-ci.com/fejes713/30-seconds-of-interviews"><img src="https://travis-ci.com/fejes713/30-seconds-of-interviews.svg?token=uZrzJhwCxqfwx7TdXzc4&branch=master" alt="travis"></a>
<a href="https://www.producthunt.com/posts/30-seconds-of-interviews"><img src="https://img.shields.io/badge/Product%20Hunt-vote-orange.svg" alt="producthunt"></a>
<a href="https://github.com/fejes713/30-seconds-of-interviews/blob/master/LICENSE"><img src="https://img.shields.io/badge/licence-MIT-blue.svg" alt="licence"></a>
</p>

<br>

## Foreword

Interviews are daunting and can make even the most seasoned expert forget things under pressure. Review and learn what questions are commonly encountered in interviews curated by the community that's answered them and go prepared for anything they'll ask. By bringing together experience and real-world examples, you can go from being nervous to being prepared for that next big opportunity.

## [View online](https://30secondsofinterviews.org/)

<a href="https://30secondsofinterviews.org"><img src="promo.jpg" alt="30 Seconds of Interviews promo"></a>

<br>

## Contributing

> 30 seconds of interviews is a community effort, so feel free to contribute in any way you can. Every contribution helps!

Do you have an excellent idea or know some cool questions that aren't on the list? Read the [contribution guidelines](https://github.com/fejes713/30-seconds-of-interviews/blob/master/CONTRIBUTING.md) and submit a pull request.

Join our [Gitter channel](https://gitter.im/30-seconds-of-interviews/Lobby) to help with the development of the project.

## Table of Contents

### JavaScript

<details>
<summary>View contents</summary>

* [Create a function `batches` that returns the maximum number of whole batches that can be cooked from a recipe.](#create-a-function-batches-that-returns-the-maximum-number-of-whole-batches-that-can-be-cooked-from-a-recipe)
* [What is Big O Notation?](#what-is-big-o-notation)
* [Create a standalone function `bind` that is functionally equivalent to the method...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
newsbuzz: News App created in Flutter using News API for fetching realtime data and Firebase as the backend and authenticator.
Github repo
Name: newsbuzz
Tagline: News App created in Flutter using News API for fetching realtime data and Firebase as the backend and authenticator.
Languages:
Dart = 67135 bytes
Ruby = 1002 bytes
Objective-C = 750 bytes
Java = 366 bytes

# News Buzz

News App created in Flutter using News API for fetching realtime data and Firebase as the backend and authenticator.

## Features

* Custom news feed based on selected sources
* Saving articles
* Explore news based on categories
* Search for topics
* Sharing articles

## Preview

![ios-demo](./screenshots/NewsBuzz.gif)

## Dependencies

* [Flutter](https://flutter.io/)
* [Firebase](https://github.com/flutter/plugins/blob/master/FlutterFire.md)
* [Google Sign In](https://github.com/flutter/plugins/tree/master/packages/google_sign_in)
* [Flutter Webview Plugin](https://github.com/dart-flitter/flutter_webview_plugin)
* [News API](https://newsapi.org/)

## Getting Started

#### 1. [Setup Flutter](https://flutter.io/setup/)

#### 2. Clone the repo

```sh
$ git clone https://github.com/theankurkedia/newsbuzz.git
$ cd newsbuzz/
```

#### 3. Setup firebase app

1. You'll need to create a Firebase instance. Follow the instructions at https://console.firebase.google.com.
2. Once your Firebase instance is created, you'll need to enable anonymous authentication.

* Go to the Firebase Console for your new instance.
* Click "Authentication" in the left-hand menu
* Click the "sign-in method" tab
* Click "Google" and enable it

3. (skip if not running on Android)

* Create an app within your Firebase instance for Android, with package name com.yourcompany.news
* Run the following command to get your SHA-1 key:

```
keytool -exportcert -list -v \
-alias androiddebugkey -keystore ~/.android/debug.keystore
```

* In the Firebase console, in the settings of your Android app, add your SHA-1 key by clicking "Add Fingerprint".
* Follow instructions to download google-services.json
* place `google-services.json` into `newsbuzz/android/app/`.

4. (skip if not running on iOS)

* Create an app within your Firebase instance for iOS, with package name com.yourcompany.news
* Follow instructions to download GoogleService-Info.plist, and place it into newsbuzz/ios/Runner in XCode
* Open newsbuzz/ios/Runner/Info.plist. Locate the CFBundleURLSchemes key. The second item in the array value of this key is specific to the Firebase instance. Replace it with the value for REVERSED_CLIENT_ID from GoogleService-Info.plist

#### 4. Run the app

```sh
$ flutter run
```

## License
Licensed under the [MIT license](https://opensource.org/licenses/MIT).
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
maid: Markdown driven task runner.
Github repo
Name: maid
Tagline: Markdown driven task runner.
Languages:
JavaScript = 13126 bytes

# maid

[![NPM version](https://img.shields.io/npm/v/maid.svg?style=flat)](https://npmjs.com/package/maid) [![NPM downloads](https://img.shields.io/npm/dm/maid.svg?style=flat)](https://npmjs.com/package/maid) [![CircleCI](https://circleci.com/gh/egoist/maid/tree/master.svg?style=shield)](https://circleci.com/gh/egoist/maid/tree/master) [![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat)](https://github.com/egoist/donate) [![chat](https://img.shields.io/badge/chat-on%20discord-7289DA.svg?style=flat)](https://chat.egoist.moe)

> Markdown driven task runner.

## Table of Contents

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Install](#install)
- [What is a maidfile?](#what-is-a-maidfile)
- [Run tasks before/after a task](#run-tasks-beforeafter-a-task)
- [Task hooks](#task-hooks)
- [Advanced](#advanced)
- [Code block languages](#code-block-languages)
- [bash/sh](#bashsh)
- [Read command line arguments](#read-command-line-arguments)
- [js/javascript](#jsjavascript)
- [Asynchronous task](#asynchronous-task)
- [py/python](#pypython)
- [Use a custom maidfile](#use-a-custom-maidfile)
- [Development](#development)
- [lint](#lint)
- [test](#test)
- [toc](#toc)
- [Contributing](#contributing)
- [Author](#author)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Install

You can install Maid globally:

```bash
# For npm users
npm i -g maid
# For Yarn users
yarn global add maid
```

Or if you want to ensure that your teammates are using the same version as you, it's recommended to install Maid locally:

```bash
# For npm users
npm i -D maid
# For Yarn users
yarn add maid --dev
```

<small>**PRO TIP**: you can use `npx` or `yarn` command to run any locally installed executable that is inside `node_modules/.bin/`, e.g. use `yarn maid` to run the locally installed maid command.</small>

## What is a maidfile?

A maidfile is where you define tasks, in Markdown!

📝 **maidfile.md**:

````markdown
## lint

It uses ESLint to ensure code quality.

```bash
eslint --fix
```

## build

Build our main app

<!-- Following line is a maid command for running task -->

Run task `build:demo` after this

```bash
# note that you can directly call binaries inside node_modules/.bin
# just like how `npm scripts` works
babel src -d lib
```

## build:demo

You can use JavaScript to write to task script too!

```js
const webpack = require('webpack')

// Async task should return a Promise
module.exports = () =>
new Promise((resolve, reject) => {
const compiler = webpack(require('./webpack.config'))
compiler.run((err, stats)...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
devdocs-desktop: 🗂 A full-featured desktop app for DevDocs.io.
Github repo
Name: devdocs-desktop
Tagline: 🗂 A full-featured desktop app for DevDocs.io.
Homepage: https://devdocs.egoist.rocks
Languages:
JavaScript = 21295 bytes
CSS = 2884 bytes
HTML = 792 bytes

# DevDocs Desktop

日本語説明ページは[こちら](https://github.com/egoist/devdocs-desktop/blob/master/README-ja.md)

[![version](https://img.shields.io/github/release/egoist/devdocs-desktop.svg?style=flat-square)](https://github.com/egoist/devdocs-desktop/releases)
[![downloads](https://img.shields.io/github/downloads/egoist/devdocs-desktop/total.svg?style=flat-square)](https://github.com/egoist/devdocs-desktop/releases)
[![downloads latest](https://img.shields.io/github/downloads/egoist/devdocs-desktop/latest/total.svg?style=flat-square)](https://github.com/egoist/devdocs-desktop/releases/latest)
[![travis](https://img.shields.io/travis/egoist/devdocs-desktop.svg?style=flat-square)](https://travis-ci.org/egoist/devdocs-desktop)
[![appveyor](https://img.shields.io/appveyor/ci/egoist/devdocs-desktop.svg?style=flat-square)](https://ci.appveyor.com/project/egoist/devdocs-desktop) [![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat-square)](https://github.com/egoist/donate) [![chat](https://img.shields.io/badge/chat-on%20discord-7289DA.svg?style=flat-square)](https://chat.egoist.moe)

[DevDocs.io](https://devdocs.io/) combines multiple API documentations in a fast, organized, and searchable interface. This is an unoffcial desktop app for it.

![devdocs-preview](https://user-images.githubusercontent.com/8784712/27121730-11676ba8-511b-11e7-8c01-00444ee8501a.png)

## Features

### Background behavior

When closing the window, the app will continue running in the background, in the dock on macOS and the tray on Linux/Windows. Right-click the dock/tray icon and choose Quit to completely quit the app. On macOS, click the dock icon to show the window. On Linux, right-click the tray icon and choose Toggle to toggle the window. On Windows, click the tray icon to toggle the window.

### Build-in shortcuts

`devdocs` the website itself has great built-in shortcuts support, just check the `help` page in the app.

<img src="https://ooo.0o0.ooo/2017/06/14/59402442301b8.png" alt="help" width="300" />

### Global shortcut

Use <kbd>Ctrl+Shift+D</kbd> (or <kbd>Command+Shift+D</kbd> on macOS) to toggle the app.

## Download

You can manually download the latest release [here](https://github.com/egoist/devdocs-desktop/releases).

## Development

It's really easy to develop this app, no build tools like Webpack needed here, checkout [./app](/app) to get more:

```bash
npm install

npm run app
# edit files, save, refresh and it's done.
```

## Distribute

```bash
npm run dist
```

## License

MIT &copy; [EGOIST](https://github.com/egoist)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
router
Github repo
Name: router
Tagline:
Homepage: https://reach.tech/router
Languages:
JavaScript = 65451 bytes
HTML = 3896 bytes

<p align="center">
<a href="https://reach.tech/router/">
<img alt="Reach Router" src="./logo-horizontal.png" width="400">
</a>
</p>

<p align="center">
Next Generation Routing for <a href="https://facebook.github.io/react">React</a>
</p>

<p align="center">
<a href="https://www.npmjs.com/package/@reach/router"><img src="https://img.shields.io/npm/v/@reach/router.svg?style=flat-square"></a>
<a href="https://www.npmjs.com/package/@reach/router"><img src="https://img.shields.io/npm/dm/@reach/router.svg?style=flat-square"></a>
<a href="https://travis-ci.org/reach/router"><img src="https://img.shields.io/travis/reach/router/master.svg?style=flat-square"></a>
</p>

## Documentation

[Documentation Site](https://reach.tech/router)

You can also find the docs in the [website directory](./website/src/markdown).

## Community

[Join us on Spectrum](https://spectrum.chat/reach)

## Legal

MIT License
Copyright (c) 2018-present, Ryan Florence
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
resumebot: resumebot using aws and static files
Github repo
Name: resumebot
Tagline: resumebot using aws and static files
Languages:
HTML = 5972 bytes
JavaScript = 5850 bytes
CSS = 1358 bytes
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
comlink: Comlink makes WebWorkers enjoyable.
Github repo
Name: comlink
Tagline: Comlink makes WebWorkers enjoyable.
Languages:
JavaScript = 19817 bytes
TypeScript = 16964 bytes
HTML = 2970 bytes

# Comlink

Comlink’s goal is to make [WebWorkers][webworker] enjoyable. Comlink removes the mental barrier of thinking about `postMessage` and hides the fact that you are working with workers.

> Note: Comlink’s goal is to be a building-block for higher-level abstraction libraries. For example, take a look at [Clooney].

```js
// main.js
const MyClass = Comlink.proxy(new Worker('worker.js'));
// `instance` is an instance of `MyClass` that lives in the worker!
const instance = await new MyClass();
await instance.logSomething(); // logs “myValue = 42”
```

```js
// worker.js
const myValue = 42;
class MyClass {
logSomething() {
console.log(`myValue = ${myValue}`);
}
}
Comlink.expose(MyClass, self);
```

## Browsers support & bundle size

![Chrome 56+](https://img.shields.io/badge/Chrome-56+-green.svg?style=flat-square)
![Edge 15+](https://img.shields.io/badge/Edge-15+-green.svg?style=flat-square)
![Firefox 52+](https://img.shields.io/badge/Firefox-52+-green.svg?style=flat-square)
![Opera 43+](https://img.shields.io/badge/Opera-43+-green.svg?style=flat-square)
![Safari 10.1+](https://img.shields.io/badge/Safari-10.1+-green.svg?style=flat-square)
![Samsung Internet 6.0+](https://img.shields.io/badge/Samsung_Internet-6.0+-green.svg?style=flat-square)

Browsers without [ES6 Proxy] support can use the [proxy-polyfill].

**Size**: ~3.9k, ~1.6k gzip’d

## Introduction

WebWorkers are a web API that allow you to run code in a separate thread. To communicate with another thread, WebWorkers offer the `postMessage` API. You can send messages in form of [transferable] JavaScript objects using `myWorker.postMessage(someObject)`, triggering a `message` event inside the worker.

Comlink turns this messaged-based API into a something more developer-friendly: Values from one thread can be used within the other thread (and vice versa) just like local values.

Comlink can be used with anything that offers `postMessage` like windows, iframes and ServiceWorkers.

## Download

You can download Comlink from the [dist folder][dist]. Alternatively, you can
install it via npm

```
$ npm install --save comlinkjs
```

or use a CDN like [delivrjs]:

```
https://cdn.jsdelivr.net/npm/comlinkjs@3.0.1/umd/comlink.js
```

## Examples

There’s a collection of examples in the [examples directory][examples].

## API

The Comlink module exports 3 functions:

### `Comlink.proxy(endpoint)`

> Returns the value that is exposed on the other side of `endpoint`.

`proxy` creates an ES6 proxy and sends all operations performed on that proxy through `endpoint`. `endpoint` can be a `Window`, a `Worker` or a `MessagePort`.\* The other endpoint of the channel should be passed to `Comlink.expose`.

If you invoke function, all parameters will be structurally cloned or transferred if they are [transferable]. If you want to pass a function as a parameters (e.g. callbacks), make sure to use `proxyValue` (see...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
redux-remember: Saves and loads your redux state from a key-value store of your choice
Github repo
Name: redux-remember
Tagline: Saves and loads your redux state from a key-value store of your choice
Languages:
JavaScript = 16582 bytes
HTML = 1469 bytes

![Logo](https://raw.githubusercontent.com/zewish/redux-remember/master/logo.png)

Redux Remember saves and loads your redux state from a key-value store of your choice

__Works with any of the following:__
- AsyncStorage (react-native)
- LocalStorage (web)
- SessionStorage (web)
- Your own custom storage driver that implements `setItem(key, value)` and `getItem(key)`

__Status:__
- Considered mostly stable (manually tested for now), used in production environment apps.
- Still missing proper test coverage and advanced documentation.

[__See demo!__](https://rawgit.com/zewish/redux-remember/master/demo-web/index.html)

Installation
------------
```bash
$ npm install --save redux-remember
# or
$ yarn add redux-remember
```

Usage - web
-----------

```js
import { applyMiddleware } from 'redux';
import reduxRemember from 'redux-remember';

const remembered = (state = '', { type, payload }) => {
switch (type) {
case 'SET_TEXT1':
return payload;

default:
return state;
}
};

const forgotten = (state = '', { type, payload }) => {
switch (type) {
case 'SET_TEXT2':
return payload;

default:
return state;
}
}

const reducers = {
persistable: {
myStateIsRemembered: remembered
},
forgettable: {
myStateIsForgotten: forgotten
}
};

const { createStore, combineReducers } = reduxRemember(
window.localStorage // or window.sessionStorage, or your own custom storage
);

const store = createStore(
combineReducers(
reducers.persistable,
reducers.forgettable
),
applyMiddleware(
// ...
)
);

// Continue using the redux store as usual...
```

Usage - react native
--------------------

```js
import { AsyncStorage } from 'react-native';
import { applyMiddleware } from 'redux';
import reduxRemember from './redux-remember';

const remembered = (state = '', { type, payload }) => {
switch (type) {
case 'SET_TEXT1':
return payload;

default:
return state;
}
};

const forgotten = (state = '', { type, payload }) => {
switch (type) {
case 'SET_TEXT2':
return payload;

default:
return state;
}
}

const reducers = {
persistable: {
myStateIsRemembered: remembered
},
forgettable: {
myStateIsForgotten: forgotten
}
};

const { createStore, combineReducers } = reduxRemember(
AsyncStorage // or your own custom storage
);

const store = createStore(
combineReducers(
reducers.persistable,
reducers.forgettable
),
applyMiddleware(
// ...
)
);

// Continue using the redux store as usual...
```

Usage - inside a...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
jeelizFaceFilter: Javascript/WebGL lightweight face tracking library designed for augmented reality webcam filters. Features : multiple faces detection, rotation, mouth opening. Various integration examples are provided (Three.js, Babylon.js, FaceSwap,...
Github repo
Name: jeelizFaceFilter
Tagline: Javascript/WebGL lightweight face tracking library designed for augmented reality webcam filters. Features : multiple faces detection, rotation, mouth opening. Various integration examples are provided (Three.js, Babylon.js, FaceSwap, Canvas2D, CSS3D...).
Homepage: https://jeeliz.com
Languages:
JavaScript = 12102149 bytes
CSS = 5117 bytes
Python = 279 bytes

# JavaScript/WebGL lightweight and robust face tracking library designed for augmented reality face filters

This JavaScript library detects and tracks the face in real time from the webcam video feed captured with WebRTC. Then it is possible to overlay 3D content for augmented reality applications. We provide various demonstrations using main WebGL 3D engines. We have included in this repository the release versions of the 3D engines to work with a determined version (they are in `/libs/<name of the engine>/`).

This library is lightweight and it does not include any 3D engine or third party library. We want to keep it framework agnostic so the outputs of the library are raw: if the a face is detected or not, the position and the scale of the detected face and the rotation Euler angles. But thanks to the featured helpers, examples and boilerplates, you can quickly deal with a higher level context (for motion head tracking, for face filter or face replacement...). We continuously add new demontrations, so stay tuned ! Also, feel free to open an issue if you have any question or suggestion.

## Table of contents

* [Features](#features)
* [Architecture](#architecture)
* [Demonstrations](#demonstrations)
* [Specifications](#specifications)
* [Get started](#get-started)
* [Optionnal init arguments](#optionnal-init-arguments)
* [Error codes](#error-codes)
* [The returned objects](#the-returned-objects)
* [Miscellaneous methods](#miscellaneous-methods)
* [Multiple faces](#multiple-faces)
* [Optimization](#optimization)
* [Changing the 3D Engine](#changing-the-3d-engine)
* [Hosting](#hosting)
* [The development server](#the-development-server)
* [Hosting optimization](#hosting-optimization)
* [About the tech](#about-the-tech)
* [Under the hood](#under-the-hood)
* [Compatibility](#compatibility)
* [Articles and tutorials](#articles-and-tutorials)
* [License](#license)
* [See also](#see-also)
* [References](#references)

<p align="center">
<img src='https://user-images.githubusercontent.com/11960872/37533324-cfa3e516-2941-11e8-99a9-96a1e20c80a3.jpg' />
</p>

## Features

Here are the main features of the library :

* face detection,
* face tracking,
* face rotation detection,
* mouth opening detection,
* multiple faces detection and tracking,
* very robust for all lighting conditions,
* video acquisition with HD video ability,
* mobile friendly,
* interfaced with 3D engines like THREE.JS, BABYLON.JS, A-FRAME,
* interfaced with more accessible APIs like CANVAS, CSS3D.

## Architecture

* `/demos/`: source code of demonstrations, sorted...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
recursive-recipes: Visualize the recursive nature of recipes :cake: :cookie:
Github repo
Name: recursive-recipes
Tagline: Visualize the recursive nature of recipes :cake: :cookie:
Homepage: https://recursive.recipes
Languages:
Go = 30159 bytes
HTML = 8119 bytes

# recursive-reicipes

This is an attempt to visualize the recursive nature of recipes. You can view the time it takes and the cost needed to make different recipes, even when you subtitute the ingredients by recipes themselves.

Try it out at https://recursive.recipes, or run it yourself.

## Run yourself

**Requirements:**

- [ ] Node + Yarn
- [ ] Go
- [ ] Graphviz

**Build:**

```
$ go get -u github.com/schollz/recursive-recipe
$ cd $GOPATH/src/github.com/schollz/recursive-recipes/scratch/app
$ yarn install
$ yarn build
```

**Run:**

```
$ cd $GOPATH/src/github.com/schollz/recursive-recipes
$ go build -v
$ ./recursive-recipes
```

Now open up `localhost:8031`.

## Recipes

The recipes themselves are in the [recipes.toml](https://github.com/schollz/recursive-recipes/blob/master/recipes.toml) file. You can add/delete/edit recipes here, and then the app will automatically update.

# License

MIT
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
conditional-wrap: A simple React component for wrapping children based on a condition
Github repo
Name: conditional-wrap
Tagline: A simple React component for wrapping children based on a condition
Languages:
JavaScript = 665 bytes

# conditional-wrap
A simple React component for wrapping children based on a condition.
Made by [Kitze](https://twitter.com/thekitze).

### Install
```
yarn add conditional-wrap
```

### Example
[Open demo on CodeSandbox](https://codesandbox.io/s/2wmr700nwp)

```js
import React from 'react';
import { render } from 'react-dom';
import { Tooltip } from 'react-tippy';

import ConditionalWrap from 'conditional-wrap';

const Button = ({ tooltip, children }) => (
<ConditionalWrap
condition={!!tooltip}
wrap={children => (
<Tooltip position="bottom" title={tooltip}>
{children}
</Tooltip>
)}
>
<button>{children}</button>
</ConditionalWrap>
);

const Demo = () => (
<div>
<Button> Normal button </Button>
<Button tooltip="Hi there!"> Button with a tooltip! </Button>
</div>
);

render(<Demo />, document.getElementById('root'));
```
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
jest-extended: Additional Jest matchers 🃏💪
Github repo
Name: jest-extended
Tagline: Additional Jest matchers 🃏💪
Homepage: https://www.npmjs.com/package/jest-extended
Languages:
JavaScript = 126415 bytes

<div align="center">
<h1>jest-extended</h1>

🃏💪

Additional Jest matchers
</div>

<hr />

[![Build Status](https://img.shields.io/travis/jest-community/jest-extended.svg?style=flat-square)](https://travis-ci.org/jest-community/jest-extended)
[![Code Coverage](https://img.shields.io/codecov/c/github/jest-community/jest-extended.svg?style=flat-square)](https://codecov.io/github/jest-community/jest-extended)
[![version](https://img.shields.io/npm/v/jest-extended.svg?style=flat-square)](https://www.npmjs.com/package/jest-extended)
[![downloads](https://img.shields.io/npm/dm/jest-extended.svg?style=flat-square)](http://npm-stat.com/charts.html?package=jest-extended&from=2017-09-14)
[![MIT License](https://img.shields.io/npm/l/jest-extended.svg?style=flat-square)](https://github.com/jest-community/jest-extended/blob/master/LICENSE)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![Roadmap](https://img.shields.io/badge/%F0%9F%93%94-roadmap-CD9523.svg?style=flat-square)](https://github.com/jest-community/jest-extended/blob/master/docs/ROADMAP.md)
[![Examples](https://img.shields.io/badge/%F0%9F%92%A1-examples-ff615b.svg?style=flat-square)](https://github.com/jest-community/jest-extended/blob/master/docs/EXAMPLES.md)

## Problem

Jest is an amazing test runner and has some awesome assertion APIs built in by default. However there are times when
having more specific matchers (assertions) would be far more convenient.

## Solution

jest-extended aims to add additional matchers to Jest's default ones making it easy to test everything 🙌

## Contributing

If you've come here to help contribute - Thanks! Take a look at the [contributing](/CONTRIBUTING.md) docs as a way of getting started.

---

- [Problem](#problem)
- [Solution](#solution)
- [Contributing](#contributing)
- [Installation](#installation)
- [Setup](#setup)
- [API](#api)
- [.pass(message)](#passmessage)
- [.fail(message)](#failmessage)
- [.toBeEmpty()](#tobeempty)
- [.toBeOneOf([members])](#tobeoneofmembers)
- [.toBeNil()](#tobenil)
- [.toSatisfy(predicate)](#tosatisfypredicate)
- [Array](#array)
- [.toBeArray()](#tobearray)
- [.toBeArrayOfSize()](#tobearrayofsize)
- [.toIncludeAllMembers([members])](#toincludeallmembersmembers)
- [.toIncludeAnyMembers([members])](#toincludeanymembersmembers)
- [.toSatisfyAll(predicate)](#tosatisfyallpredicate)
- [Boolean](#boolean)
- [.toBeBoolean()](#tobeboolean)
- [.toBeTrue()](#tobetrue)
- [.toBeFalse()](#tobefalse)
- [~~Date~~](#date)
- [.toBeDate()](#tobedate)
-...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
sshfs: A network filesystem client to connect to SSH servers
Github repo
Name: sshfs
Tagline: A network filesystem client to connect to SSH servers
Languages:
C = 133622 bytes
Python = 19478 bytes
Shell = 3163 bytes
Meson = 2862 bytes
Emacs Lisp = 733 bytes

SSHFS
=====

About
-----

SSHFS allows you to mount a remote filesystem using SFTP. Most SSH
servers support and enable this SFTP access by default, so SSHFS is
very simple to use - there's nothing to do on the server-side.

How to use
----------

Once sshfs is installed (see next section) running it is very simple::

sshfs [user@]hostname:[directory] mountpoint

It is recommended to run SSHFS as regular user (not as root). For
this to work the mountpoint must be owned by the user. If username is
omitted SSHFS will use the local username. If the directory is
omitted, SSHFS will mount the (remote) home directory. If you need to
enter a password sshfs will ask for it (actually it just runs ssh
which ask for the password if needed).

Also many ssh options can be specified (see the manual pages for
*sftp(1)* and *ssh_config(5)*), including the remote port number
(``-oport=PORT``)

To unmount the filesystem::

fusermount -u mountpoint

On BSD and OS-X, to unmount the filesystem::

umount mountpoint

Installation
------------

First, download the latest SSHFS release from
https://github.com/libfuse/sshfs/releases. On Linux and BSD, you will
also need to install libfuse_ 3.1.0 or newer. On OS-X, you need
OSXFUSE_ instead. Finally, you need the Glib_ library with development
headers (which should be available from your operating system's
package manager).

To build and install, we recommend to use Meson_ (version 0.38 or
newer) and Ninja_. After extracting the sshfs tarball, create a
(temporary) build directory and run Meson::

$ mkdir build; cd build
$ meson ..

Normally, the default build options will work fine. If you
nevertheless want to adjust them, you can do so with the *mesonconf*
command::

$ mesonconf # list options
$ mesonconf -D strip=true # set an option

To build, test and install SSHFS, you then use Ninja (running the
tests requires the `py.test`_ Python module)::

$ ninja
$ python3 -m pytest test/ # optional, but recommended
$ sudo ninja install

.. _libfuse: http://github.com/libfuse/libfuse
.. _OSXFUSE: https://osxfuse.github.io/
.. _Glib: https://developer.gnome.org/glib/stable/
.. _Meson: http://mesonbuild.com/
.. _Ninja: https://ninja-build.org/
.. _`py.test`: http://www.pytest.org/

Getting Help
------------

If you need help, please ask on the <fuse-sshfs@lists.sourceforge.net>
mailing list (subscribe at
https://lists.sourceforge.net/lists/listinfo/fuse-sshfs).

Please report any bugs on the GitHub issue tracker at
https://github.com/libfuse/libfuse/issues.

Professional Support
--------------------

Professional support is offered via `Rath Consulting`_.

.. _`Rath Consulting`: http://www.rath-consulting.biz
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
did-i-do-that: A debug tool based on JavaScript Proxy to track surprising/unwanted mutation of objects.
Github repo
Name: did-i-do-that
Tagline: A debug tool based on JavaScript Proxy to track surprising/unwanted mutation of objects.
Languages:
JavaScript = 4498 bytes

# Did I do that?

A debug tool based on JavaScript Proxy to track surprising/unwanted mutation of objects.

![Did I do that?](https://media.giphy.com/media/BxWTWalKTUAdq/giphy-downsized.gif)

_(Property of CBS/ABC – Family Matters)_

In large applications there might be cases where there are some changes to objects you don't expect. These can be hard to track. Not only can the source be in your code, but also external dependencies. For instance something unexpectedly changing the prototype.

**Note** Full disclosure. This package is useful in a handful cases. It requires you to be able to override/shadow the object you want to inspect, and doesn't work on objects with readonly property descriptors (like prototype). I used this technique to trace what was adding `filter`, `map` et.al. as static functions to the `Array` object (Turns out it's earlier versions of babel).

**Note 2** Unpublished for now. Work in progress/proof of concept.

```js
import didt, { stats } from 'did-i-do-that';

Object = didt(Object);
Object.is = () => true;

// PRINTS:
//
// Warning: Mutation detected.
// Path: is
// Change: function is() { [native code] } → () => true
// -------------------------
// Best guess for location:
// file:///exp/did-i-do-that/demo.mjs:5:11

console.log(stats(Object));
```

And the `stats` outputs structured info"

```js
[
{
path: ['is'],
key: 'is',
loc: {
file: 'file:///exp/did-i-do-that/demo.mjs',
line: '5',
char: '11'
}
}
];
```

## Debug

You can also trigger a breakpoint in the debugger (have to step up the stack trace manually):

```js
import didt from 'did-i-do-that';

Object = didt(Object, { debug: true });
Object.is = () => true;
```

## Only listen for specific changes

```js
import didt from 'did-i-do-that';

let obj = didt({ a: 1, b: { c: 2, d: 3 } }, { filter: 'b.d' });
obj.b.d = 42;
```

## Options and default

```js
// Options & default
let options = {
filter = '*', // String to match for logging/debugging. Default wildcard (everything)
filterFn = (readablePathString, pathArray) => false, // Function predicate for filtering similar to filter string above
debug = false, // Trigger debug breakpoint?
print = true // Print output?
};
```

## TODO

* More tests
* Better errors on readonly (e.g. prototype) properties.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
flow: Name UI states, navigate between them, remember where you've been.
Github repo
Name: flow
Tagline: Name UI states, navigate between them, remember where you've been.
Languages:
Java = 183000 bytes
Shell = 933 bytes

# Flow

_"Name-giving will be the foundation of our science."_ &mdash; Linnaeus

_"The winds and waves are always on the side of the ablest navigators."_ &mdash; Gibbon

_"Memory is the treasury and guardian of all things._" &mdash; Cicero

**Flow gives names to your Activity's UI states, navigates between them, and remembers where it's been.**

## Features

Navigate between UI states. Support the back button easily without confusing your users with surprising results.

Remember the UI state, and its history, as you navigate and across configuration changes and process death.

Manage resources with set-up/tear-down hooks invoked for each UI state. UI states can easily share resources, and they'll be disposed when no longer needed.

Manage all types of UIs-- complex master-detail views, multiple layers, and window-based dialogs are all simple to manage.

## Using Flow

Gradle:

```groovy
compile 'com.squareup.flow:flow:1.0.0-alpha3'
```

Install Flow into your Activity:

```java
public class MainActivity {
@Override protected void attachBaseContext(Context baseContext) {
baseContext = Flow.configure(baseContext, this).install();
super.attachBaseContext(baseContext);
}
}
```

By default, Flow will take over your Activity's content view. When you start your Activity, you should see a "Hello world" screen. Of course you'll want to change this-- that's covered under [Controlling UI](#controlling-ui) below.

### Defining UI states with key objects

Your Activity's UI states are represented in Flow by Objects, which Flow refers to as "keys". Keys are typically [value objects][valueobject] with just enough information to identify a discrete UI state.

Flow relies on a key's [equals][equals] and [hashCode][hashcode] methods for its identity. Keys should be immutable-- that is, their `equals` and `hashCode` methods should always behave the same.

To give an idea of what keys might look like, here are some examples:

```java
public enum TabKey {
TIMELINE,
NOTIFICATIONS,
PROFILE
}

public final class HomeKey extends flow.ClassKey {
}

public final class ArticleKey {
public final String articleId;

public ArticleKey(String articleId) {
this.articleId = articleId;
}

public boolean equals(Object o) {
return o instanceof ArticleKey
&& articleId.equals(((ArticleKey) o).articleId);
}

public int hashCode() {
return articleId.hashCode();
}
}
```

See the [Sample Projects](#sample-projects) below for more example keys.

### Navigation and History
Flow offers simple commands for navigating within your app.

`Flow#goBack()` -- Goes back to the previous [key][keys]. Think "back button".

`Flow#set(key)` -- Goes to the requested key. Goes back or forward depending on whether the key is already in the History.

Flow also lets you rewrite history safely and easily.

`Flow#setHistory(history, direction)` -- Change history to whatever you want.

See the [Flow][Flow.java] class for other convenient operators.

As you navigate the app, Flow keeps track of where you've been. And Flow makes...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
apollo-codegen: :pencil2: Generate API code or type annotations based on a GraphQL schema and query documents
Github repo
Name: apollo-codegen
Tagline: :pencil2: Generate API code or type annotations based on a GraphQL schema and query documents
Languages:
TypeScript = 285879 bytes
JavaScript = 96302 bytes

# Apollo GraphQL code generator

[![GitHub license](https://img.shields.io/badge/license-MIT-lightgrey.svg?maxAge=2592000)](https://raw.githubusercontent.com/apollographql/apollo-ios/master/LICENSE) [![npm](https://img.shields.io/npm/v/apollo-codegen.svg)](https://www.npmjs.com/package/apollo-codegen) [![Get on Slack](https://img.shields.io/badge/slack-join-orange.svg)](http://www.apollostack.com/#slack)

This is a tool to generate API code or type annotations based on a GraphQL schema and query documents.

It currently generates Swift code, TypeScript annotations, Flow annotations, and Scala code, we hope to add support for other targets in the future.

See [Apollo iOS](https://github.com/apollographql/apollo-ios) for details on the mapping from GraphQL results to Swift types, as well as runtime support for executing queries and mutations. For Scala, see [React Apollo Scala.js](https://github.com/apollographql/react-apollo-scalajs) for details on how to use generated Scala code in a Scala.js app with Apollo Client.

## Usage

If you want to experiment with the tool, you can install the `apollo-codegen` command globally:

```sh
npm install -g apollo-codegen
```

### `introspect-schema`

The purpose of this command is to create a JSON introspection dump file for a given graphql schema. The input schema can be fetched from a remote graphql server or from a local file. The resulting JSON introspection dump file is needed as input to the [generate](#generate) command.

To download a GraphQL schema by sending an introspection query to a server:

```sh
apollo-codegen introspect-schema http://localhost:8080/graphql --output schema.json
```

You can use the `header` option to add additional HTTP headers to the request. For example, to include an authentication token, use `--header "Authorization: Bearer <token>"`.

You can use the `insecure` option to ignore any SSL errors (for example if the server is running with self-signed certificate).

**Note:** The command for downloading an introspection query was named `download-schema` but it was renamed to `introspect-schema` in order to have a single command for introspecting local or remote schemas. The old name `download-schema` is still available is an alias for backward compatibility.

To generate a GraphQL schema introspection JSON from a local GraphQL schema:

```sh
apollo-codegen introspect-schema schema.graphql --output schema.json
```

### `generate`

The purpose of this command is to generate types for query and mutation operations made against the schema (it will not generate types for the schema itself).

This tool will generate Swift code by default from a set of query definitions in `.graphql` files:

```sh
apollo-codegen generate **/*.graphql --schema schema.json --output API.swift
```

You can also generate type annotations for TypeScript, Flow, or Scala using the `--target` option:

```sh
# TypeScript
apollo-codegen generate **/*.graphql --schema schema.json --target typescript --output operation-result-types.ts
#...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
rebranch: React context-based, conditional rendering components for A/B experiments
Github repo
Name: rebranch
Tagline: React context-based, conditional rendering components for A/B experiments
Languages:
JavaScript = 2979 bytes

# Rebranch

React context-based, conditional rendering components for A/B experiments

[![Build Status][build-badge]][build-status]

**Requires React v16.3.0 and up**

[build-badge]: https://img.shields.io/travis/jxnblk/rebranch/master.svg?style=flat-square
[build-status]: https://travis-ci.org/jxnblk/rebranch

```sh
npm i rebranch
```

```jsx
// example App.js
import React from 'react'
import { BranchProvider } from 'rebranch'

// initialize the provider with the current session's
// A/B experimentation state
// This should be an object of experiment names,
// with...
import experimentsState from './experiments'
import Home from './Home'

/* example experimentsState object
{
HOME_SIGN_UP: 'VARIANT',
FOOTER_SIGN_UP: 'DEFAULT'
}
*/

export default class App extends React.Component {
render () {
return (
<BranchProvider value={experimentsState}>
<Home />
</BranchProvider>
)
}
}
```

```jsx
// example Home.js
import React from 'react'
import { BranchConsumer } from 'rebranch'
import SignUpForm from './SignUpForm'

// duplicated SignUpForm component, optimized for code deletion
import VARIANT_SignUpForm from './experiments/VARIANT_SignUpForm'

export default class Home extends React.Component {
render () {
return (
<BranchConsumer name='HOME_SIGN_UP'>
{state => {
switch (state) {
case 'VARIANT':
return <VARIANT_SignUpForm />
case 'DEFAULT':
default:
return <SignUpForm />
}
}}
</BranchConsumer>
)
}
}
```

## Alternative Branch Component API

```jsx
// example Home.js
import React from 'react'
import { Branch } from 'rebranch'
import SignUpForm from './SignUpForm'
import VARIANT_SignUpForm from './experiments/VARIANT_SignUpForm'

// for true A/B tests (not multivariant)
// the first child will render when the experiment state is 'DEFAULT'
// the second child will render when the experiment state is *not* `'DEFAULT'`
export default class Home extends React.Component {
render () {
return (
<Branch name='HOME_SIGN_UP'>
<SignUpForm />
<VARIANT_SignUpForm />
</Branch>
)
}
}
```

## Demo

[View the example](examples) for a basic demo

[MIT License](LICENSE.md)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
jest-watch-typeahead: Jest watch plugin for filtering test by file name or test name
Github repo
Name: jest-watch-typeahead
Tagline: Jest watch plugin for filtering test by file name or test name
Languages:
JavaScript = 14537 bytes

[![Build Status](https://travis-ci.org/jest-community/jest-watch-typeahead.svg?branch=master)](https://travis-ci.org/jest-community/jest-watch-typeahead) [![npm version](https://badge.fury.io/js/jest-watch-typeahead.svg)](https://badge.fury.io/js/jest-watch-typeahead)

<div align="center">
<!-- replace with accurate logo e.g from https://worldvectorlogo.com/ -->
<a href="https://facebook.github.io/jest/">
<img width="150" height="150" vspace="" hspace="25" src="https://cdn.worldvectorlogo.com/logos/jest.svg">
</a>
<h1>jest-watch-typeahead</h1>
<p>Filter your tests by file name or test name</p>
</div>

![watch](https://user-images.githubusercontent.com/574806/40672937-25dab91a-6325-11e8-965d-4e55ef23e135.gif)

## Usage

### Install

Install `jest`_(it needs Jest 23+)_ and `jest-watch-typeahead`

```bash
yarn add --dev jest jest-watch-typeahead

# or with NPM

npm install --save-dev jest jest-watch-typeahead
```

### Add it to your Jest config

In your `package.json`

```json
{
"jest": {
"watchPlugins": [
"jest-watch-typeahead/filename",
"jest-watch-typeahead/testname"
]
}
}
```

Or in `jest.config.js`

```js
module.exports = {
watchPlugins: [
'jest-watch-typeahead/filename',
'jest-watch-typeahead/testname',
],
};
```

### Run Jest in watch mode

```bash
yarn jest --watch
```
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-native-reanimated: React Native's Animated library reimplemented
Github repo
Name: react-native-reanimated
Tagline: React Native's Animated library reimplemented
Languages:
JavaScript = 101429 bytes
Java = 53144 bytes
Objective-C = 51821 bytes
Ruby = 751 bytes
Python = 152 bytes

# react-native-reanimated

React Native's Animated library reimplemented.

It provides a more comprehensive, low level abstraction for the Animated library API to be built on top of and hence allow for much greater flexibility especially when it comes to gesture based interactions.

![](/assets/meme.png)

## OMG, why would you build this? (motivation)

Animated library has several limitations that become troubling when it comes to gesture based interactions.
I started this project initially to resolve the issue of pan interaction when the object can be dragged along the screen and when released it should snap to some place on the screen.
The problem there was that even though using `Animated.event` we could map gesture state to the position of the box and make this whole interaction run on UI thread with `useNativeDriver` flag, we still had to call back into JS at the end of the gesture for us to start "snap" animation.
It is because `Animated.spring({}).start()` cannot be used in a "declarative" manner, that is when it gets executed it has a "side effect" of starting a process (an animation) that updates the value for some time.
Adding "side effect" nodes into the current Animated implementation turned out to be a pretty difficult task as the execution model of the Animated API is that it runs all the dependent nodes each frame for the views that needs to update.
We don't want to run "side effects" more often than necessary as it would, for example, result in the animation starting multiple times.

Another reason why I started rethinking how the internals of Animated can be redesigned was my recent work on porting "Animated Tracking" functionality to the native driver.
Apparently even so the native driver is out for quite a while it still does not support all the things non-native Animated lib can do.
Obviously, it is far more difficult to build three versions of each feature (JS, Android and iOS) instead of one, and the same applies for fixing bugs.
One of the goals of reanimated lib was to provide a more generic building block for the API, that would allow for building more complex features only in JS and make the native codebase as minimal as possible.
Let's take "diffClamp" node as an example, it is currently implemented in three different places in Animated core and even though it is pretty useful it actually only has one use case (collapsible scrollview header).

On a similar topic, I come across React Native's PR [#18029](https://github.com/facebook/react-native/pull/18029) and even though it provides a legitimate use case I understand the maintainers being hesitant on merging it. The Animated API shouldn't block people from building things like this and the goal of reanimated API is to provide lower level access that would allow for implementing that and many more features with no necessary changes to the core of the library.

You can watch my [React Europe talk](https://www.youtube.com/watch?v=kdq4z2708VM) where I explain the motivation.

The goals:
- More generic primitive node types leads to more code reuse for the library internals and hence makes it easier to add new features and fix bugs.
- The new set of base nodes can be used to implement Animated compatible API including things like:
- Complex nodes such as...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
engine-docs: Documentation for Apollo Engine
Github repo
Name: engine-docs
Tagline: Documentation for Apollo Engine
Homepage: https://www.apollographql.com/docs/engine/
Languages:
CSS = 93051 bytes
JavaScript = 5899 bytes
Shell = 140 bytes

# Engine Docs

This is the documentation for [Apollo Engine](https://www.apollographql.com/engine/), a GraphQL gateway that adds features like performance tracing, error tracking, caching, and more to your GraphQL server.

[Read the docs here.](https://www.apollographql.com/docs/engine/)

[Sign into engine here.](https://engine.apollographql.com/)

## Running the docs locally

First, clone the repository. Then:

```
npm install
npm start
```

We use a git submodule to load the documentation theme, which is why you need one extra step.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-ideal-image: 🖼️ An Almost Ideal React Image Component
Github repo
Name: react-ideal-image
Tagline: 🖼️ An Almost Ideal React Image Component
Homepage: https://github.com/stereobooster/react-ideal-image/blob/master/introduction.md
Languages:
JavaScript = 30434 bytes
CSS = 429 bytes

<div align="center">
<h1>react-ideal-image</h1>

<p>Adaptive image component</p>
</div>

<hr />

[![Build Status][build-badge]][build]
[![Code Coverage][coverage-badge]][coverage]
[![version][version-badge]][package]
[![downloads][downloads-badge]][npmtrends]
[![MIT License][license-badge]][license]

[![All Contributors](https://img.shields.io/badge/all_contributors-4-orange.svg?style=flat-square)](#contributors)
[![PRs Welcome][prs-badge]][prs]
[![Code of Conduct][coc-badge]][coc]

[![Watch on GitHub][github-watch-badge]][github-watch]
[![Star on GitHub][github-star-badge]][github-star]
[![Tweet][twitter-badge]][twitter]

## The problem

I need React component to asynchronously load images, which will adapt based on network, which will allow a user to control, which image to load.

## This solution

Read the [introduction](introduction.md).

## Table of Contents

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

- [Installation](#installation)
- [Usage](#usage)
- [Other Solutions](#other-solutions)
- [Contributors](#contributors)
- [LICENSE](#license)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Installation

This module is distributed via [npm][npm] which is bundled with [node][node] and
should be installed as one of your project's `devDependencies`:

```
npm install react-ideal-image react-waypoint --save
```

## Usage

Example for create-react-app (you need v2 for macros) based project

```js
import React from 'react'
import lqip from 'lqip.macro'
import IdealImage from 'react-ideal-image'

import image from './images/doggo.jpg'
const lqip = lqip('./images/doggo.jpg')

const App = () => (
<IdealImage
placeholder={{lqip}}
srcSet={[{src: image, width: 3500}]}
alt="doggo"
width={3500}
height={2095}
/>
)
```

## Other Solutions

- [react-progressive-image](https://github.com/FormidableLabs/react-progressive-image)
- [react-lazyload](https://github.com/jasonslyvia/react-lazyload)
- [react-lazy-image](https://github.com/sergiodxa/react-lazy-image)
- [react-image](https://github.com/mbrevda/react-image)
- [react-lazy-load](https://github.com/loktar00/react-lazy-load)
- [react-graceful-image](https://github.com/linasmnew/react-graceful-image)
- [react-worker-image](https://github.com/nitish24p/react-worker-image)
- [lazy-image](https://github.com/notwaldorf/lazy-image)
- [react-simple-image](https://github.com/bitjourney/react-simple-image)
-...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
massive-js: A data mapper for Node.js and PostgreSQL.
Github repo
Name: massive-js
Tagline: A data mapper for Node.js and PostgreSQL.
Languages:
JavaScript = 282330 bytes
PLpgSQL = 6943 bytes
SQLPL = 4853 bytes
PLSQL = 2148 bytes
Shell = 1075 bytes

# Massive.js: A Postgres-centric Data Access Tool

[![node](https://img.shields.io/node/v/massive.svg)](https://npmjs.org/package/massive)
[![Build Status](https://travis-ci.org/dmfay/massive-js.svg?branch=master)](https://travis-ci.org/dmfay/massive-js)
[![Coverage Status](https://coveralls.io/repos/github/dmfay/massive-js/badge.svg)](https://coveralls.io/github/dmfay/massive-js)
[![Greenkeeper badge](https://badges.greenkeeper.io/dmfay/massive-js.svg)](https://greenkeeper.io/)
[![npm](https://img.shields.io/npm/dw/massive.svg)](https://npmjs.org/package/massive)

Massive.js is a data mapper for Node.js that goes all in on PostgreSQL and fully embraces the power and flexibility of the SQL language and relational metaphors. Providing minimal abstractions for the interfaces and tools you already use, its goal is to do just enough to make working with your data as easy and intuitive as possible, then get out of your way.

Massive is _not_ an object-relational mapper (ORM)! It doesn't use models, it doesn't track state, and it doesn't limit you to a single entity-based metaphor for accessing and persisting data. Massive connects to your database and introspects its schemas to build an API for the data model you already have: your tables, views, functions, and easily-modified SQL scripts.

Here are some of the high points:

* **Dynamic query generation**: Massive's versatile query builder supports a wide variety of operators, all generated from a simple criteria object.
* **Low overhead**: An API built from your schema means no model classes to maintain, super-simple bulk operations, and direct access to your tables without any need to create or load entity instances beforehand.
* **Document storage**: PostgreSQL's JSONB storage type makes it possible to blend relational and document strategies. Massive offers a robust API to simplify working with documents: objects in, objects out, with document metadata managed for you.
* **Relational awareness**: Massive does not traverse relationships or build model graphs, but [deep inserts](https://dmfay.github.io/massive-js/persistence.html#deep-insert) can create related entities and junctions transactionally, and the [`decompose` option](https://dmfay.github.io/massive-js/decomposition.html) allows you to map the results of complex views and scripts to nested object trees.
* **Transactions**: New in v5, use `db.withTransaction` to execute a callback with full Massive API support in a transaction scope, getting a promise which fulfills if it commits or rejects if it rolls back.
* **Postgres everything**: Commitment to a single RDBMS lets us use it to its full potential. Massive supports array fields and operations, regular expression matching, foreign tables, materialized views, and more features found in PostgreSQL but not in other databases.

## Full Documentation

[Full documentation including API docs is available on GitHub Pages.](https://dmfay.github.io/massive-js/)

## Contributing

[See CONTRIBUTING.md](https://github.com/dmfay/massive-js/blob/master/CONTRIBUTING.md).

## Table of...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-height-transition: 📏 Animate height when children mount/unmount
Github repo
Name: react-height-transition
Tagline: 📏 Animate height when children mount/unmount
Homepage: https://jossmac.github.io/react-height-transition
Languages:
JavaScript = 3261 bytes

# React Height Transition

Animate height when children mount/unmount.

https://jossmac.github.io/react-height-transition

```jsx
import HeightTransition from 'react-height-transition';

const AnimatedAlert = ({ isOpen, ...rest }) => (
<HeightTransition initial={0}>
{isOpen ? <Alert {...rest} /> : null}
</HeightTransition>
);
```

## Alternatives

This component is intentionally simple. For more sophisticated alternatives that react to changing content height, checkout:

- https://github.com/souporserious/react-fluid-container
- https://github.com/Stanko/react-animate-height
- https://github.com/nkbt/react-collapse
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
glamorous: 💄 Maintainable CSS with React
Github repo
Name: glamorous
Tagline: 💄 Maintainable CSS with React
Homepage: https://glamorous.rocks
Languages:
JavaScript = 92702 bytes
TypeScript = 37253 bytes

# STATUS: UNMAINTAINED

**For details on the unmaintained status (and to help people with an automated migration to [emotion](https://emotion.sh)), see [#419](https://github.com/paypal/glamorous/issues/419).**

<h1 align="center">
<img src="https://github.com/paypal/glamorous/raw/master/other/logo/full.png" alt="glamorous" title="glamorous" width="200">
<br>
glamorous 💄
 <br>
</h1>
<p align="center" style="font-size: 1.2rem;">Maintainable CSS with React</p>

> Read [the intro blogpost][intro-blogpost] and [the v4 announcement blog post][v4-announcement-blogpost]

[![Build Status][build-badge]][build]
[![Code Coverage][coverage-badge]][coverage]
[![version][version-badge]][package]
[![downloads][downloads-badge]][npmcharts]
[![MIT License][license-badge]][license]

[![All Contributors](https://img.shields.io/badge/all_contributors-67-orange.svg?style=flat-square)](#contributors)
[![PRs Welcome][prs-badge]][prs]
[![Chat][chat-badge]][chat]
[![Code of Conduct][coc-badge]][coc]

[![gzip size][gzip-badge]][unpkg-dist]
[![size][size-badge]][unpkg-dist]
[![module formats: umd, cjs, and es][module-formats-badge]][unpkg-dist]
[![Watch on GitHub][github-watch-badge]][github-watch]
[![Star on GitHub][github-star-badge]][github-star]
[![Tweet][twitter-badge]][twitter]

## Table of Contents

<!-- START doctoc generated TOC please keep comment here to allow auto update -->

<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->

* [
glamorous.rocks
](#glamorousrocks)
* [Installation](#installation)
* [Usage](#usage)
* [Documentation](#documentation)
* [Related projects](#related-projects)
* [Using glamorous with react-sketchapp](#using-glamorous-with-react-sketchapp)
* [Usage with Stylus](#usage-with-stylus)
* [Users](#users)
* [Inspiration](#inspiration)
* [Other Solutions](#other-solutions)
* [Support](#support)
* [Got Questions?](#got-questions)
* [Swag 👕](#swag-)
* [Contributors](#contributors)
* [LICENSE](#license)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## Installation

You will find instructions to install glamorous [here](https://glamorous.rocks/basics/#installation).

## Usage

You will find a getting started guide [here](https://glamorous.rocks/getting-started/).

## Documentation

You will find [tutorials](https://glamorous.rocks/getting-started/),
[examples](https://glamorous.rocks/examples/),
[API documentation](https://glamorous.rocks/api), and more at the glamorous
website:

<h3 align="center">
<a href="https://glamorous.rocks">glamorous.rocks</a>
</h3>

## Related projects

*...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
gulliver: A PWA directory, focusing on collecting PWA best practices and examples.
Github repo
Name: gulliver
Tagline: A PWA directory, focusing on collecting PWA best practices and examples.
Homepage: https://pwa-directory.appspot.com/
Languages:
JavaScript = 271952 bytes
HTML = 23520 bytes
CSS = 17038 bytes
Shell = 2724 bytes

# Gulliver

[Gulliver](https://pwa-directory.appspot.com/) is a directory of [Progressive Web Apps](https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/).

## Contents

In Gulliver's landing page you can browse the set of currently registered PWAs as depicted in the following landing page snapshot:

![Screenshot](img/gulliver-landing-page.png)

If you click on a particular PWA, Gulliver takes you to a detail page showing the results of an evaluation done on that specific PWA using the [Lighthouse PWA Analyzer](https://www.youtube.com/watch?v=KiV2p46rWjU) tool (Details page #1), and a view of the associated [web app manifest](https://developer.mozilla.org/en-US/docs/Web/Manifest) file for the application (Details Page #2):

Details Page #1 | Details Page #2
:-------------------------:|:-------------------------:
![](img/gulliver-details-one.png) | ![](img/gulliver-details-two.png)

Gulliver itself has been implemented as a PWA; therefore it is designed to work well on any kind of device, including desktop web browsers (see landing page), and on mobile devices (see details page).

## FAQ

[Visit our FAQ Page](https://github.com/GoogleChrome/gulliver/blob/master/FAQ.md)

## Requirements

Gulliver was built using the [ExpressJS](https://expressjs.com/) web framework for Node.js, and uses the [Google Cloud Platform](https://cloud.google.com/) (GCP) for computing and storage services.

The following components are required to run the project (tested on macOS):

1. [NodeJS](https://nodejs.org/) (LTS version ~6.11.0). A JavaScript runtime built on Chrome's V8 JavaScript engine. (How to verify? Run `node --version`.) If you have a later version, install the LTS version with `nvm`.

1. [Google Cloud SDK](https://cloud.google.com/sdk/). A set of tools for the Google Cloud Platform (GCP) that you can use to access the Google Compute Engine and the Google Cloud Storage, which are two components of GCP used by Gulliver. (How to verify? Run `gcloud --version`.)

1. [Memcached](https://memcached.org/). A distributed memory object caching system. (How to verify? Run `memcached` (the command should appear to hang), and then `telnet localhost 11211` in a separate terminal. In the `telnet` window, typing `version` it should report the `memcached` version. If you don't have it, see [these instructions](https://cloud.google.com/appengine/docs/flexible/nodejs/using-redislabs-memcache#testing_memcached_locally) to install memcached.)

In addition, you will need to set up a GCP project, and configure OAuth:

1. Create a [Google Cloud Platform](https://console.cloud.google.com/) project. A GCP project forms the basis of accessing the GCP. Then, run `gcloud init` to configure `gcloud` locally, if you get the error "Could not load the default credentials" run `gcloud auth login`.

1. Get the OAuth *client id* and *client secret* associated with this project. (How to verify? There's...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
git-ssb-intro: :wrench: Learn git-ssb: a decentralized GitHub alternative.
Github repo
Name: git-ssb-intro
Tagline: :wrench: Learn git-ssb: a decentralized GitHub alternative.
Languages:

Read this on SSB for best results:
http://git-ssb.celehner.com/%25RPKzL382v2fAia5HuDNHD5kkFdlP7bGvXQApSXqOBwc%3D.sha256

---

# From GitHub to git-ssb
### A guide to hacking *together* on the distributed web

If you're curious about the distributed web, and the prospect of using git
collaboratively without a central, closed-source point of origin, you came to
the right place!

git-ssb is a great fit for just this. This guide tries to act as a transition
aide for GitHub users into the world of git-ssb. It assumes rudimentary
knowledge of GitHub. It will walk through:

1. understanding what "SSB" is.
2. installing scuttlebot -- the SSB peer server -- and joining the network.
3. installing the `git-ssb` command and the `git-ssb-web` web interface.
4. a walkthrough of using git-ssb to do common GitHub workflows (creating repos,
making pull requests, merging pull requests, issues, etc).

![git-ssb web activity](git_ssb_activity.png)

_A view of recent activity among my friends on git-ssb_

## What is SSB?

SSB stands for [secure scuttlebutt](https://github.com/ssbc/secure-scuttlebutt)
the database/ protocol that powers the *peer-to-peer log store*,
[scuttlebutt](http://scuttlebot.io). There is a great deal of information to be
found by reading these sites, if you're so inclined.

If you're familiar with bitcoin or blockchains, SSB is kind of like having your
own personal blockchain: you can append messages of any kind, with any data
you'd like. Unlike bitcoin, there's no money involved: it's just a data
structure on your local machine.

Your personal log can only be appended to, and is cryptographically secure: each
message references the hash of the message that came before it. The whole thing
is then also signed by your public key, making it both tamper-proof, and
appendable only to the private key holder (you).

The final piece of SSB that makes it all work is the gossip protocol: when you
run scuttlebot, you become a peer in a network of other scuttlebot users. You
can choose to 'follow' other people's personal logs. As a result, whenever you
see that user (or any user that follows that user too) online, you can retrieve
their latest log entries from them. All without any central server or central
authentication.

[git-ssb](http://git.scuttlebot.io/%25n92DiQh7ietE%2BR%2BX%2FI403LQoyf2DtR3WQfCkDKlheQU%3D.sha256)
builds on top of this: things like commits, branches, issues, and pull requests
are encoded into log entries on each participant's personal log, while the gossip
protocol runs in the background and propagates new content to everyone involved
in the git repository.

## Setup

If you're already up and running on Patchwork (or another client), you can skip to step 3.

### 1. Install node + npm

To install node and npm, we recommend using [nvm](https://github.com/creationix/nvm)

### 2. Install a scuttlebot

The [scuttlebot](http://www.github.com/SSBC/scuttlebot) (or sbot) is an ssb server which will manage replicating data with other peers. The easiest way to get set up is to [install Patchwork](https://www.scuttlebutt.nz/), it runs an sbot for you, and is an interface into the social side of data replicated on ssb.

**NOTE** - Make sure you follow...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-native-nike-running: 🏃 UI & UX Prototype of redesigned Nike+ Running for React Native 📱+ React Native DOM (Web) 🌏
Github repo
Name: react-native-nike-running
Tagline: 🏃 UI & UX Prototype of redesigned Nike+ Running for React Native 📱+ React Native DOM (Web) 🌏
Homepage: http://nikerunning.sonnylab.com/
Languages:
JavaScript = 71245 bytes
Objective-C = 3912 bytes
Ruby = 1978 bytes
Python = 1732 bytes
Java = 1507 bytes
HTML = 536 bytes

# Nike+ Running - React Native & React Native DOM (Web)

UI & UX Prototype of redesigned Nike+ Running App and now support website 🎉 thanks to [React Native DOM](https://github.com/vincentriemer/react-native-dom)

![proto](./assets/nikerunningwebsite.gif)

![gif](http://i.giphy.com/l3vR7vOmGZYEZwUbC.gif)

![proto](./assets/dribnike.gif)

Inspiration: https://dribbble.com/shots/2764470-Rethinking-Nike-Running

## Motivation

I recently watched the [talk](https://youtu.be/aOWIJ4Mgb2k) from [@vincentriemer](https://twitter.com/vincentriemer) about [react native dom](https://github.com/vincentriemer/react-native-dom) and I amazed that we can port directly our current react native app into website. Then, I started this experiment and see the performance and the gesture in the web.

The result is fascinating. I can reuse almost all of the components except the map and linear gradient, so I make a quick hack for the LinearGradient Component.

## Demo

Website: http://nikerunning.sonnylab.com/

Expo Snack: https://snack.expo.io/@sonnylazuardi/nike-running-redesign

## Installation & Running

```
npm i
react-native run-ios
react-native run-android
```

for the web:

```
react-native start
```

open `http://localhost:8081/dom`

## Features

- FadedZoom Transition
This will add forFadedZoom transition to react-navigation (you can use it on another project)

```
transitionConfig: () => ({
screenInterpolator: sceneProps => {
return forFadedZoom(sceneProps);
}
})
```

- Swipeable Card
The card can be swiped up-down to toggle hide and left-right to change current card view. Pan responder works smooth on the web 💪

- Geolocation & Animated Marker
The homescreen will show your current location with animated marker. For map the web now still fallback to image, need to work on the map component for RND.

- Box Shadow & Gradient
(iOS only) There will be shadow around the button and cards. I do some tricky part to achieve the linear gradient. I use gradient image and use similar LinearGradient props:

```
if (Platform.OS != "dom") {
var LinearGradient = require("react-native-linear-gradient").default;
} else {
var LinearGradient = require("../components/LinearGradient").default;
}
```

© 2018 Sonny Lazuardi
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
graphql-api-koa: GraphQL API Koa middleware.
Github repo
Name: graphql-api-koa
Tagline: GraphQL API Koa middleware.
Languages:
JavaScript = 36933 bytes

# graphql-api-koa

[![Build status](https://travis-ci.org/jaydenseric/graphql-api-koa.svg)](https://travis-ci.org/jaydenseric/graphql-api-koa) [![npm version](https://img.shields.io/npm/v/graphql-api-koa.svg)](https://npm.im/graphql-api-koa)

GraphQL API Koa middleware.

## Setup

To install [`graphql-api-koa`](https://npm.im/graphql-api-koa) and [`graphql`](https://npm.im/graphql) from [npm](https://npmjs.com) run:

```sh
npm install graphql-api-koa graphql
```

See the [execute middleware](#execute) examples to get started.

## API

<!-- Generated by documentation.js. Update this documentation by updating the source code. -->

#### Table of Contents

- [errorHandler](#errorhandler)
- [Examples](#examples)
- [execute](#execute)
- [Parameters](#parameters)
- [Examples](#examples-1)
- [Types](#types)
- [ExecuteOptions](#executeoptions)
- [Properties](#properties)
- [Examples](#examples-2)
- [MiddlewareOptionsOverride](#middlewareoptionsoverride)
- [Parameters](#parameters-1)
- [Examples](#examples-3)

### errorHandler

Creates Koa middleware to handle errors. Use this as the first to catch all errors for [a correctly formated GraphQL response](http://facebook.github.io/graphql/October2016/#sec-Errors). When intentionally throwing an error, create it with `status` and `expose` properties using [http-errors](https://npm.im/http-errors) or the response will be a generic 500 error for security.

#### Examples

_How to throw an error determining the response._

```javascript
import Koa from 'koa'
import bodyParser from 'koa-bodyparser'
import { errorHandler, execute } from 'graphql-api-koa'
import createError from 'http-errors'
import schema from './schema'

const app = new Koa()
.use(errorHandler())
.use(async (ctx, next) => {
if (
// It’s Saturday.
new Date().getDay() === 6
)
throw createError(503, 'No work on the sabbath.', { expose: true })

await next()
})
.use(bodyParser())
.use(execute({ schema }))
```

Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Koa middleware.

### execute

Creates Koa middleware to execute GraphQL. Use after the [errorHandler](#errorhandler) and [body parser](https://npm.im/koa-bodyparser) middleware.

#### Parameters

- `options` **[ExecuteOptions](#executeoptions)** Options.

#### Examples

_A basic GraphQL API._

```javascript
import Koa from 'koa'
import bodyParser from 'koa-bodyparser'
import { errorHandler, execute } from 'graphql-api-koa'
import schema from './schema'

const app = new Koa()
.use(errorHandler())
.use(bodyParser())
.use(execute({ schema }))
```

Returns **[Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)** Koa middleware.

###...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
kubeless: Kubernetes Native Serverless Framework
Github repo
Name: kubeless
Tagline: Kubernetes Native Serverless Framework
Homepage: https://kubeless.io
Languages:
Go = 620679 bytes
Shell = 78915 bytes
C# = 35700 bytes
Java = 9919 bytes
Makefile = 7048 bytes
JavaScript = 6873 bytes
Python = 6116 bytes
Ballerina = 4425 bytes
PHP = 4393 bytes
Ruby = 2451 bytes
Roff = 2266 bytes

# <img src="https://cloud.githubusercontent.com/assets/4056725/25480209/1d5bf83c-2b48-11e7-8db8-bcd650f31297.png" alt="Kubeless logo" width="400">

[![CircleCI](https://circleci.com/gh/kubeless/kubeless.svg?style=svg)](https://circleci.com/gh/kubeless/kubeless)
[![Slack](https://img.shields.io/badge/slack-join%20chat%20%E2%86%92-e01563.svg)](http://slack.k8s.io)

`kubeless` is a Kubernetes-native serverless framework that lets you deploy small bits of code without having to worry about the underlying infrastructure plumbing. It leverages Kubernetes resources to provide auto-scaling, API routing, monitoring, troubleshooting and more.

Kubeless stands out as we use a [Custom Resource Definition](https://kubernetes.io/docs/tasks/access-kubernetes-api/extend-api-custom-resource-definitions/) to be able to create functions as custom kubernetes resources. We then run an in-cluster controller that watches these custom resources and launches _runtimes_ on-demand. The controller dynamically injects the functions code into the runtimes and make them available over HTTP or via a PubSub mechanism.

Kubeless is purely open-source and non-affiliated to any commercial organization. Chime in at anytime, we would love the help and feedback !

## Screencasts

Click on the picture below to see a screencast demonstrating event based function triggers with kubeless.

[![screencast](https://img.youtube.com/vi/AxZuQIJUX4s/0.jpg)](https://www.youtube.com/watch?v=AxZuQIJUX4s)

Click on this next picture to see a screencast demonstrating our [serverless](https://serverless.com/framework/docs/providers/kubeless/) plugin:

[![serverless](https://img.youtube.com/vi/ROA7Ig7tD5s/0.jpg)](https://www.youtube.com/watch?v=ROA7Ig7tD5s)

## Tools

* A [UI](https://github.com/kubeless/kubeless-ui) available. It can run locally or in-cluster.
* A [serverless framework plugin](https://github.com/serverless/serverless-kubeless) is available.

## Quick start

Check out the instructions for quickly set up Kubeless [here](http://kubeless.io/docs/quick-start).

## Building

Consult the [developer's guide](docs/dev-guide.md) for a complete set of instruction
to build kubeless.

## Comparison

There are other solutions, like [fission](http://fission.io) and [funktion](https://github.com/fabric8io/funktion). There is also an incubating project at the ASF: [OpenWhisk](https://github.com/openwhisk/openwhisk). We believe however, that Kubeless is the most Kubernetes native of all.

Kubeless uses k8s primitives, there is no additional API server or API router/gateway. Kubernetes users will quickly understand how it works and be able to leverage their existing logging and monitoring setup as well as their troubleshooting skills.

## Compatibility Matrix with Kubernetes

Kubeless fully supports two major versions of Kubernetes (1.8 and 1.9) at the moment. For other versions some of the features in...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
pollyjs: Record, Replay, and Stub HTTP Interactions.
Github repo
Name: pollyjs
Tagline: Record, Replay, and Stub HTTP Interactions.
Homepage: https://netflix.github.io/pollyjs
Languages:
JavaScript = 127270 bytes
HTML = 2513 bytes

<p align="center">
<img alt="Polly.JS" width="400px" src="https://netflix.github.io/pollyjs/assets/images/wordmark-logo-alt.png" />
</p>
<h2 align="center">Record, Replay, and Stub HTTP Interactions</h2>

[![Build Status](https://travis-ci.org/Netflix/pollyjs.svg?branch=master)](https://travis-ci.org/Netflix/pollyjs)
[![license](https://img.shields.io/github/license/Netflix/pollyjs.svg)](http://www.apache.org/licenses/LICENSE-2.0)

Polly.JS is a standalone, framework-agnostic JavaScript library that enables
recording, replaying, and stubbing HTTP interactions.

Polly taps into native browser APIs to mock requests and responses with little to no
configuration while giving you the ability to take full control of each request with
a simple, powerful, and intuitive API.

> Interested in contributing or just seeing Polly in action? Head over to [CONTRIBUTING.md](CONTRIBUTING.md) to learn how to spin up the project!

## Why Polly?

Keeping fixtures and factories in parity with your APIs can be a time consuming process.
Polly alleviates this by recording and maintaining actual server responses without foregoing flexibility.

- Record your test suite's HTTP interactions and replay them during future test runs for fast, deterministic, accurate tests.
- Use Polly's client-side server to modify or intercept requests and responses to simulate different application states (e.g. loading, error, etc.).

## Features

- 🚀 Fetch & XHR Support
- ⚡️️ Simple, Powerful, & Intuitive API
- 💎 First Class Mocha & QUnit Test Helpers
- 🔥 Intercept, Pass-Through, and Attach Events
- 📼 Record to Disk or Local Storage
- ⏱ Slow Down or Speed Up Time

## Getting Started

Check out the [Quick Start](https://netflix.github.io/pollyjs/#/quick-start) documentation to get started.

## Usage

Let's take a look at what an example test case would look like using Polly.

```js
import { Polly } from '@pollyjs/core';

describe('Netflix Homepage', function() {
it('should be able to sign in', async function() {
/*
Create a new polly instance.

By default, Polly will connect to both fetch and XHR browser APIs and
will record any requests that it hasn't yet seen while replaying ones it
has already recorded.
*/
const polly = new Polly('Sign In');
const { server } = polly;

/* Intercept all Google Analytic requests and respond with a 200 */
server
.get('/google-analytics/*path')
.intercept((req, res) => res.sendStatus(200));

/* Pass-through all GET requests to /coverage */
server.get('/coverage').passthrough();

/* start: pseudo test code */
await visit('/login');
await fillIn('email', 'polly@netflix.com');
await fillIn('password', '@pollyjs');
await submit();
/* end: pseudo test code */

expect(location.pathname).to.equal('/browse');

/*
Calling `stop` will persist...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
downshift-examples: Created with CodeSandbox
Github repo
Name: downshift-examples
Tagline: Created with CodeSandbox
Homepage: https://codesandbox.io/s/github/kentcdodds/downshift-examples
Languages:
JavaScript = 31286 bytes
HTML = 1871 bytes
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-testing-library-examples: Created with CodeSandbox
Github repo
Name: react-testing-library-examples
Tagline: Created with CodeSandbox
Homepage: https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples
Languages:
HTML = 1544 bytes
JavaScript = 1137 bytes
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
ram: :atom_symbol: React Application Manager: create and run React (and other) applications – no command line or build setup required
Github repo
Name: ram
Tagline: :atom_symbol: React Application Manager: create and run React (and other) applications – no command line or build setup required
Languages:
JavaScript = 36810 bytes
HTML = 366 bytes

# RAM: React App Manager

**BETA**

Create and run React applications – no command line or build setup required.
Powered by [Electron][electron] & [Create React App][cra]

<img src='docs/ram.gif' />

## Getting started

RAM requires Node.js v6 and npm v5.2 or later to be installed on your computer.
Install the latest version of Node.js (which includes npm) here:

- [Install Node.js][node]

Download for MacOS:

- [Download][download]

[download]: https://github.com/jxnblk/ram/releases/latest

RAM includes support for the following app types:

- [Create React App][cra]
- [Next.js][nextjs]
- [Gatsby][gatsby]
- [Razzle][razzle]
- [Vue.js][vuejs]
- [Preact][preact]

To add support for another app, please [open a pull request](#contributing).

## Motivation

I'm a firm believer in code literacy,
and I've worked with many people throughout my career who have strong development skills with languages like HTML and CSS,
but who might face barriers to entry with modern front-end development tools.
When I think about the potential barriers to entry, a few things come to mind:

1. Scaffolding a full React (or similar) application requires a bit of setup
2. The terminal and command line interfaces can be intimidating at first
3. Node.js and npm can be foreign concepts to people new to front-end development

For the most part, [Create React App][cra] has solved #1 for people who already know #2 and #3.
It's an excellent tool and that's why RAM makes use of it.

RAM is aimed at abstracting away the terminal and npm aspects for beginners.
If you're a professional front-end developer, I'd recommend using the command line tools directly instead of an application like this,
as it's a very valuable and powerful skillset to utilize.
If you do make use of this app, hopefully it can serve as a learning tool and can make some of these things less intimidating as you progress.

Remember: **GUIs will never be as efficient or powerful as CLIs**

## How it works

All the magic comes from the underlying command line interfaces: [npm][npm] and [create-react-app][cra].
This application uses [Electron][electron] to spawn child processes that run the commands to power these tools.
The logs from stdio are passed back to the application for display.
See the [`renderer/spawn.js`](renderer/spawn.js) and [`renderer/CreateForm.js`](renderer/CreateForm.js) modules for an example of how this works.

### Alternative approaches

Some alternatives to this particular Electron setup include:

- Server running directly in electron
- Using [zeit/pkg][pkg] with a web interface

## Caveats

- Requires Node.js v6+ and npm v5.2+
- Built in a few hours
- No tests
- Not tested on Linux or Windows

## Alternatives

- [Compositor Iso][iso] is a similar project aimed at solving a similar problem
- Use [Create React App][cra] directly
- [CodeSandbox][sandbox] is great for quick prototypes and demos with shareable URLs
- Unreleased *Guppy* project by [Josh...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
tusk: 🐘 Refined Evernote desktop app
Github repo
Name: tusk
Tagline: 🐘 Refined Evernote desktop app
Homepage: https://klauscfhq.github.io/tusk
Languages:
JavaScript = 68779 bytes
CSS = 39242 bytes

<h1 align="center">
<img src="https://cdn.rawgit.com/klauscfhq/tusk/33f2eae5/media/logo.png" width="19%"><br/>Tusk
</h1>

<h4 align="center">
🐘 Refined Evernote desktop app
</h4>

<div align="center">
<a href="https://github.com/klauscfhq/tusk">
<img src="https://cdn.rawgit.com/klauscfhq/tusk/33f2eae5/media/note-navigation.gif" alt="Tusk" width="100%">
</a>
</div>

<p align="center">
<a href="https://travis-ci.org/klauscfhq/tusk">
<img alt="Build Status" src="https://travis-ci.org/klauscfhq/tusk.svg?branch=master">
</a>
<a href="https://ci.appveyor.com/project/klauscfhq/tusk">
<img alt="Build Status" src="https://ci.appveyor.com/api/projects/status/kdpb85rhfkw8iif7?svg=true">
</a>
<a href="https://github.com/sindresorhus/awesome-electron">
<img alt="Awesome" src="https://awesome.re/mentioned-badge.svg">
</a>
</p>

## Description

Tusk is an unofficial, featureful, open source, community-driven, free Evernote app used by people in more than [130 countries](https://snapcraft.io/tusk).

Come over to [Gitter](https://gitter.im/klauscfhq/tusk) or [Twitter](https://twitter.com/klauscfhq) to share your thoughts on the project.

You can find more desktop apps [here](#related-apps).

## Highlights

- [Black](#black-theme), [Dark](#dark-theme), [Sepia](#sepia-theme) & [Vibrant](#vibrant-themes) Themes
- [Focus](#focus-mode), [Compact](#compact-mode) & [Auto-Night](#auto-night-mode) Modes
- [Local](#local-shortcut-keys) & [Global](#global-shortcut-keys) Keyboard Shortcuts
- [Customizable Keyboard Shortcuts](#custom-shortcut-keys)
- Export Notes as [PDF](#export-notes-as-pdf) & [Markdown](#export-notes-as-markdown) files
- [Note Printing](#note-printing)
- [Scalable Interface](#scalable-interface)
- [Note Navigation](#note-navigation)
- [Yinxiang Support](#yinxiang-support)
- Cross Platform
- Automatic Updates 🐘
- RTL Support
- Deep OS Integration
- Drag and Drop Files

<sup>🐘 Windows & Linux only atm</sup>

## Contents

- [Description](#description)
- [Highlights](#highlights)
- [Install](#install)
- [Features](#features)
- [Keyboard Shortcuts](#keyboard-shortcuts)
- [Development](#development)
- [Related Apps](#related-apps)
- [Team](#team)
- [Disclaimer](#disclaimer)
- [License](#license)

## Install

#### Github Releases

Head to the [releases](https://github.com/klauscfhq/tusk/releases/latest) page and download the appropriate installer for your system.

#### Snap

Ubuntu Linux users can directly install through [Snap](https://snapcraft.io/tusk) `snap install tusk`

#### Homebrew

Macos users can directly install through [Homebrew...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
personality-insights-twitter: An application that gives personality details based on a given Twitter handle using IBM Watson Personality Insights.
Github repo
Name: personality-insights-twitter
Tagline: An application that gives personality details based on a given Twitter handle using IBM Watson Personality Insights.
Languages:
JavaScript = 3133 bytes

# personality-insights-twitter
An application that gives personality details based on a given Twitter handle using IBM Watson Personality Insights.

## Getting Started

1. You need to have Node.js installed. You can download and install Node.js [here](http://nodejs.org/)

2. You need to create a Twitter application to generate credentials to consume Twitter API. You can do so [here](http://dev.twitter.com/apps)

3. You need to create a Personality Insights service instance on IBM Cloud to generate credentials to use the Watson Personality Insights API. There's a short tutorial [here](https://medium.com/ibm-watson-tutorials/getting-started-with-ibm-watson-95b10ca145f6)

4. Clone this repository.

5. Create a `.env` file in the root directory. The `.env` file will look something like the following:

```none
TWITTER_CONSUMER_KEY = <Twitter Consumer Key>
TWITTER_CONSUMER_SECRET = <Twitter Consumer Secret>
TWITTER_ACCESS_TOKEN = <Twitter Access Token>
TWITTER_ACCESS_TOKEN_SECRET = <Twitter Access Token Secret>
PERSONALITY_INSIGHTS_USERNAME = <Service credential>
PERSONALITY_INSIGHTS_PASSWORD = <Service credential>
PERSONALITY_INSIGHTS_VERSION_DATE = <Check service documentation for most recent date>
```

6. Install the dependencies your application needs:

```none
npm install
```
7. Start the application locally:

```none
node personalityInsights
```
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
jss: JSS is an authoring tool for CSS which uses JavaScript as a host language.
Github repo
Name: jss
Tagline: JSS is an authoring tool for CSS which uses JavaScript as a host language.
Homepage: http://cssinjs.org
Languages:
JavaScript = 167323 bytes
HTML = 655 bytes

# JSS

[![Gitter](https://badges.gitter.im/JoinChat.svg)](https://gitter.im/cssinjs/lobby)
[![Build Status](https://travis-ci.org/cssinjs/jss.svg?branch=master)](https://travis-ci.org/cssinjs/jss)
[![codecov](https://codecov.io/gh/cssinjs/jss/branch/master/graph/badge.svg)](https://codecov.io/gh/cssinjs/jss)
[![bitHound Score](https://www.bithound.io/cssinjs/jss/badges/score.svg)](https://www.bithound.io/cssinjs/jss)
[![OpenCollective](https://opencollective.com/jss/backers/badge.svg)](#backers)
[![OpenCollective](https://opencollective.com/jss/sponsors/badge.svg)](#sponsors)

[JSS is a more powerful abstraction](https://medium.com/@oleg008/jss-is-css-d7d41400b635) over CSS. It uses JavaScript as a language to describe styles in a declarative and maintainable way. It is a [high performance](https://github.com/cssinjs/jss/blob/master/docs/performance.md) JS to CSS compiler which works at runtime and server-side. This core library is low level and framework agnostic. It is about 6KB (minified and gzipped) and is extensible via [plugins](./docs/plugins.md) API.

Feel free to ask any JSS related questions on twitter by using hashtag `#cssinjs` and mentioning [@oleg008](https://twitter.com/oleg008), [watch my latest talk](https://www.youtube.com/watch?v=i3TIrcnMIng) about "Unique Value Proposition of CSSinJS" and try it on a [playground](https://codesandbox.io/s/z21lpmvv33).

If you are a Sass (SCSS) user, this course will show how to express popular Sass language features using latest JavaScript features: [Convert SCSS (Sass) to CSS-in-JS](https://egghead.io/courses/convert-scss-sass-to-css-in-js).

## Key features

- Framework agnostic
- [Scoped selectors by default](./docs/json-api.md#regular-rule-without-plugins)
- [Function values and rules](./docs/json-api.md#function-values)
- [Observables](./docs/json-api.md#observable-values)
- [SSR](./docs/ssr.md)
- [Plugins support](./docs/plugins.md)
- [Global CSS](https://github.com/cssinjs/jss-global)
- [Expanded syntax](https://github.com/cssinjs/jss-expand)
- [Composition syntax](https://github.com/cssinjs/jss-compose)
- [Template strings syntax](https://github.com/cssinjs/jss-template)
- [Isolation](https://github.com/cssinjs/jss-isolate)

## Integrations

- [React-JSS](https://github.com/cssinjs/react-jss) - HOC interface for React with theming, try it on [playground](https://codesandbox.io/s/j3l06yyqpw).
- [Styled-JSS](https://github.com/cssinjs/styled-jss) - styled components interface for React, try it on [playground](https://codesandbox.io/s/xl89zx8zz4).
- [Aphrodite-JSS](https://github.com/cssinjs/aphrodite-jss) - aphrodite like API.

## TOC

1. [Live examples](https://github.com/cssinjs/examples)
1. [Benefits](./docs/benefits.md)
1. [Setup](./docs/setup.md)
1. [JSON API (JSS...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-styleguidist: Isolated React component development environment with a living style guide
Github repo
Name: react-styleguidist
Tagline: Isolated React component development environment with a living style guide
Homepage: https://react-styleguidist.js.org/
Languages:
JavaScript = 346469 bytes

<div align="center" markdown="1">

<img src="https://d3vv6lp55qjaqc.cloudfront.net/items/061f0A2n1B0H3p0T1p1f/react-styleguidist-logo.png" alt="React Styleguidist" width="400">

**Isolated React component development environment with a living style guide**

[![Build Status](https://travis-ci.org/styleguidist/react-styleguidist.svg)](https://travis-ci.org/styleguidist/react-styleguidist) [![npm](https://img.shields.io/npm/v/react-styleguidist.svg)](https://www.npmjs.com/package/react-styleguidist) [![Join the chat at https://gitter.im/styleguidist/styleguidist](https://badges.gitter.im/styleguidist/styleguidist.svg)](https://gitter.im/styleguidist/styleguidist?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) [![Codecov](https://codecov.io/gh/styleguidist/react-styleguidist/branch/master/graph/badge.svg)](https://codecov.io/gh/styleguidist/react-styleguidist) [![Open Source Helpers](https://www.codetriage.com/styleguidist/react-styleguidist/badges/users.svg)](https://www.codetriage.com/styleguidist/react-styleguidist)

</div>

React Styleguidist is a component development environment with hot reloaded dev server and a living style guide that you can share with your team. It lists component `propTypes` and shows live, editable usage examples based on Markdown files. Check out [**the demo style guide**](https://react-styleguidist.js.org/examples/basic/).

![](https://d3vv6lp55qjaqc.cloudfront.net/items/271B372x102S0c052i3F/react-styleguidist7.gif)

## Usage

* **[Getting Started](https://react-styleguidist.js.org/docs/getting-started.html): install and run Styleguidist**
* [Documenting components](https://react-styleguidist.js.org/docs/documenting.html): how to write documentation
* [Locating components](https://react-styleguidist.js.org/docs/components.html): point Styleguidist to your React components
* [Configuring webpack](https://react-styleguidist.js.org/docs/webpack.html): tell Styleguidist how to load your code
* [Cookbook](https://react-styleguidist.js.org/docs/cookbook.html): how to solve common tasks with Styleguidist

## Advanced documentation

* [Configuration](https://react-styleguidist.js.org/docs/configuration.html)
* [CLI commands and options](https://react-styleguidist.js.org/docs/cli.html)
* [Node.js API](https://react-styleguidist.js.org/docs/api.html)

## Examples

* [Basic style guide](https://react-styleguidist.js.org/examples/basic/), [source](./examples/basic)
* Style guide with sections, [source](./examples/sections)
* Style guide with customized styles, [source](./examples/customised)
* Style guide with custom express endpoints, [source](./examples/express)
* Create React App integration, [source](./examples/cra)

## Showcase

Real projects using React Styleguidist:

* [Rumble...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-apollo-client-example: A minimal React application which is powered by Apollo Client and GitHub's GraphQL API.
Github repo
Name: react-apollo-client-example
Tagline: A minimal React application which is powered by Apollo Client and GitHub's GraphQL API.
Homepage: https://www.robinwieruch.de/react-apollo-link-state-tutorial
Languages:
JavaScript = 8167 bytes
HTML = 1590 bytes
CSS = 235 bytes

# react-apollo-client-example

A minimal React application using Apollo Client with GitHub's GraphQL API. On the side, React's local state is still used for local data whereas Apollo Client with its queries and mutations is used for remote data. [Read more about it here](https://www.robinwieruch.de/react-apollo-link-state-tutorial) without including the Apollo Link State sections.

## Installation

* `git clone git@github.com:rwieruch/react-apollo-client-example.git`
* cd react-apollo-client-example
* npm install
* [add your own REACT_APP_GITHUB_PERSONAL_ACCESS_TOKEN in .env file](https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/)
* scopes/permissions you need to check: admin:org, repo, user, notifications
* npm start
* visit `http://localhost:3000`

## Want to learn more about React + GraphQL + Apollo?

* Don't miss [upcoming Tutorials and Courses](https://www.getrevue.co/profile/rwieruch)
* Check out current [React Courses](https://roadtoreact.com)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
proppy: Functional props composition for UI components (supporting React.js & Vue.js)
Github repo
Name: proppy
Tagline: Functional props composition for UI components (supporting React.js & Vue.js)
Homepage: https://proppyjs.com
Languages:
TypeScript = 47253 bytes
JavaScript = 23272 bytes
CSS = 8772 bytes
HTML = 8416 bytes
Makefile = 2042 bytes

![ProppyJS](./site/assets/img/banner.png)

<div align="center">
<strong>Functional props composition for components</strong>
</div>

<div align="center">
A <code>1.5kB</code> library integrating with your favourite UI framework
</div>

<br />

<div align="center">
<!-- NPM version -->
<a href="https://npmjs.org/package/proppy">
<img src="https://img.shields.io/npm/v/proppy.svg?style=flat-square"
alt="NPM version" />
</a>
<!-- Build Status -->
<a href="https://travis-ci.org/fahad19/proppy">
<img src="https://img.shields.io/travis/fahad19/proppy/master.svg?style=flat-square"
alt="Build Status" />
</a>
<!-- Gitter -->
<a href="https://gitter.im/proppyjs/proppy">
<img src="https://img.shields.io/badge/gitter-join%20chat-brightgreen.svg?style=flat-square" alt="Gitter" />
</a>
</div>

<div align="center">
<h3>
<a href="https://proppyjs.com">
Website
</a>
<span> | </span>
<a href="https://proppyjs.com/docs/introduction">
Documentation
</a>
<span> | </span>
<a href="https://proppyjs.com/docs/introduction#packages">
Packages
</a>
<span> | </span>
<a href="http://proppyjs.com/docs/contributing/">
Contributing
</a>
</h3>
</div>

<div align="center">
<sub>Built with ❤︎ by
<a href="https://twitter.com/fahad19">@fahad19</a> and
<a href="https://github.com/fahad19/proppy/graphs/contributors">
contributors
</a>
</div>

# What is ProppyJS?

ProppyJS is a tiny `1.5kB` JavaScript library for composing props (object that components receive to render themselves).

It comes with various integration packages giving you the freedom to use it popular rendering libraries.

# What does it do?

[![ProppyJS flow of props](./site/assets/img/proppy-flow.gif)](https://proppyjs.com)

The idea is you express the behaviour of your Component as props first, and then connect it to your Component (which can be either React, Vue.js or Preact) using the same API of Proppy.

The API gives you access to other application-wide dependencies too (like a store using Redux) for convenience anywhere in the components tree.

# Packages

| Package | Status | Size | Description |
|----------------------|------------------------------------------------------------|---------|---------------------------|
| [proppy] | [![proppy-status]][proppy-package] | `1.5K` | Core package |
| [proppy-react] | [![proppy-react-status]][proppy-react-package] | `1.0K` | React...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
table_radar: a demo app for IoT in JavaScript
Github repo
Name: table_radar
Tagline: a demo app for IoT in JavaScript
Languages:
JavaScript = 8664 bytes
HTML = 679 bytes

# neonious one table radar

This is the table radar, an example project for the neonious one Technology Preview microcontroller board.

It implements an radar for your table, which detects items in short range. You can view the radar through your web browser.

A video of the table radar in action: https://drive.google.com/file/d/1G6cykg5DXdzrsAG8MDHQRWeSNzXArNSn/view

## Why did I create this project?

LED strips, home automation, R/C cars, robotics... We are JavaScript fans and believe its asyncronous nature makes it a great language not only for web sites and servers, but also for IoT. Traditional microcontroller programming just gets difficult when Internet comes into play, or when multiple things are done in parallel (FreeRTOS multithreading: love it or hate it...).

Because of this we designed neonious one: A microcontroller board, programmable and debuggable with a full debugging interface out of box in an on-board web-based IDE, combining JavaScript ES 6, TypeScript, Node.JS API and modules with Internet (Ethernet + Wifi) directly on the board.

This project is a show case to highlight how development with neonious one can be fun and produce unique results :-)

## Hardware setup

The hardware consists of

- a neonious one Technology Preview microcontroller board serving the website and controlling motor + sensor. More information about the neonious one board: http://www.neonious.com/Kickstarter

- a servo motor (a motor which you can position at any angle)
- a distance sensor mounted onto the servo motor with glue
- a 5 V power supply

The servo motor is just one I picked of the shelf. You can take any one, as the protocol is standarized (one pulse of about 1 ms to position the servo).

The distance sensor is the Pololu Carrier with Sharp GP2Y0A60SZLF Analog Distance Sensor 10-150cm, 3V. It gives out an analog signal which we can read out easily with the ADC (analog to digital converter) of the board. There are cheaper options, but I had one left from an older project.

The servo motor is connected to the board via pin 6. The distance sensor is connected via pin 8 (which supports ADC).

## Authors

* **Thomas Rogg** - *Initial work*

## License

This project is public domain. Do whatever you like with it.

## Support our Kickstarter!

Really, if you like the project, support us! Post about us on social media, spread the word or just take part in the Kickstarter
yourself.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
hiper: 🚀 A statistical analysis tool for performance testing
Github repo
Name: hiper
Tagline: 🚀 A statistical analysis tool for performance testing
Languages:
JavaScript = 20489 bytes

**English** | [中文](./README.zh-CN.md)

<p align="center"><img src="http://7xt9n8.com2.z0.glb.clouddn.com/hiper-logo-512.png" alt="Hiper" width="175"></p>

<p align="center">🚀 A statistical analysis tool for performance testing</p>

<p align="center">
<img src="https://img.shields.io/circleci/project/vuejs/vue/dev.svg" alt="">
<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="">
<img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="">
</p>

## Hiper

The name is short for **Hi** **per**formance <del>Or **Hi**gh **per**formance</del>

## Important

Hi guys, Please present your issue in English

请使用英语提issue

## Install

``` bash
npm install hiper -g

# or use yarn:
# yarn global add hiper
```

## The output

Notice: `It takes period (m)s to load ...`. the `period` means **This test takes time**. So -n go up and the period go up. not a bug

![Hiper](http://7xt9n8.com2.z0.glb.clouddn.com/hiper9.png)

## PerformanceTiming

![timing](http://7xt9n8.com2.z0.glb.clouddn.com/PerformanceTiming.png)

| Key | Value |
| :----------------------------- | :------------------------------------------- |
| DNS lookup time | domainLookupEnd - domainLookupStart |
| TCP connect time | connectEnd - connectStart |
| TTFB | responseStart - requestStart |
| Download time of the page | responseEnd - responseStart |
| After DOM Ready download time | domComplete - domInteractive |
| White screen time | domInteractive - navigationStart |
| DOM Ready time | domContentLoadedEventEnd - navigationStart |
| Load time | loadEventEnd - navigationStart |

https://developer.mozilla.org/en-US/docs/Web/API/PerformanceTiming

## Usage

```bash
hiper --help

Usage: hiper [options] [url]

🚀 A statistical analysis tool for performance testing

Options:

-v, --version output the version number
-n, --count <n> specified loading times (default: 20)
-c, --config <path> load the configuration file
-u, --useragent <ua> to set the useragent
-H, --headless [b] whether to use headless mode (default: true)
-e, --executablePath <path> use the specified chrome browser
--no-cache disable cache (default: false)
--no-javascript disable javascript (default: false)
--no-online disable network (defalut: false)
-h, --help output usage information
```

For instance

```bash
# We can omit the protocol header if has omited, the protocol header will be `https://`

# The simplest usage
hiper baidu.com

# if the url has...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
next-apollo-appsync: A fork of Next Apollo by Adam Soffer to work with AWS AppSync
Github repo
Name: next-apollo-appsync
Tagline: A fork of Next Apollo by Adam Soffer to work with AWS AppSync
Languages:
JavaScript = 3787 bytes

# Next Apollo AppSync
A fork of [next-apollo](https://github.com/adamsoffer/next-apollo) to work with AWS AppSync for SSR React Applications

![](https://s3.amazonaws.com/aws-mobile-hub-images/nextjs.jpg)

## Installation

```bash
yarn add next-apollo-appsync
```

## Documentation
Create an Apollo configuration object (check out the Apollo Client API for more configuration options). Pass the configuration object to the withAppSyncData higher-order component and export the returned component.

```js
// withData.js

import { withAppSyncData } from 'next-apollo-appsync'

const config = {
url: "https://<YOURAPI>.us-east-2.amazonaws.com/graphql",
region: "us-east-2", // or whatever your region is
auth: {
type: "API_KEY",
apiKey: "<YOURAPIKEY>",

// Other auth use cases
// Amazon Cognito Federated Identities using AWS Amplify
//credentials: () => Auth.currentCredentials(),

// Amazon Cognito user pools using AWS Amplify
// type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
// jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken(),
},
}

export default withAppSyncData(config)
```

Inside your Next.js page, wrap your component with your exported higher order component.

```js
import gql from 'graphql-tag'
import { graphql } from 'react-apollo'
import withData from '../withData'

const query = gql`
query listTodos {
listTodos {
items {
id
name
completed
}
}
}
`

class Todos extends React.Component {
render() {
return <div>
<p>Hello World</p>
</div>
}
}

const TodosWithData = graphql(query, {
options: {
fetchPolicy: 'cache-and-network'
},
props: props => ({ todos: props.data.listTodos ? props.data.listTodos.items : [] })
})(Todos)

export default withData(TodosWithData)
```

## License

MIT
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
codesandboxer: Deploy any component directly to codesandbox from anywhere
Github repo
Name: codesandboxer
Tagline: Deploy any component directly to codesandbox from anywhere
Languages:
JavaScript = 65111 bytes
CSS = 3760 bytes
HTML = 2742 bytes

# Codesandboxer

Codesandboxer is a tool to allow you to deploy to go from an 'entry' file, and deploy that file and all related files to codesandbox. Its goal is to allow you to do this from any component written anywhere, from code you are viewing on github through to code running locally on your machine, as well as build making this easy into your own websites.

To allow its use in multiple contexts, it has been split into a monorepo.

The major use-case for codesandboxer is to allow you to easily share examples with others, or to link to editable versions of examples from a documentation website.

## Cool Stuff

With an entry file, we work to only upload the files you need, and the dependencies you use from your project, making lighter sandbox uploads.

Since we wrap the file we are given, codesandboxer can allow you to quickly open any react component in codesandbox, even if you are not set up to start editing it immediately.

## Core Bits

The core packages, [codesandboxer](/packages/codesandboxer) allows you to fetch files from github or bitbucket, given a git entry file.

[codesandboxer-fs](/packages/codesandboxer-fs) allows you to do the same kinds of actions from your terminal, and can be installed as a CLI. See its documentation for how to use it.

## Other packages

* [react-codesandboxer](/packages/react-codesandboxer) is a react wrapper around `codesandboxer` allowing you to easily render a button to open an example in codesandbox.
* [vs-codesandboxer](/packages/vs-codesandboxer) is a visual studio code extension to allow you to take an open file in vs-code and deploy it to codesandboxer.
* [atom-codesandboxer](https://github.com/noviny/atom-codesandboxer) is an atom extension to allow you to take an open file in atom and deploy it to codesandboxer (IN DEVELOPMENT).
* [bitbucket-codesandboxer](/packages/bitbucket-codesandboxer)

## Desired future packages

Extend codesandboxer to support non-react sandboxes.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
tf-electron: Tensorflow.js examples with Electron
Github repo
Name: tf-electron
Tagline: Tensorflow.js examples with Electron
Languages:
JavaScript = 1719 bytes
HTML = 1114 bytes

# Tensorflow.js w/ Electron

This repository contains several Tensorflow.js examples bundled as an Electron app.

## Getting Started

```bash
# clone the repo
git clone https://github.com/brangerbriz/tf-electron
cd tf-electron

# install dependencies
npm install

# run the electron app
npm start
```
You should now see an Electron window pop up with a list of several examples. Several of these examples are taken from [tfjs-examples](https://github.com/tensorflow/tfjs-examples) and modified slightly to work with Node.js/Electron out-of-the-box. I've also annotated the source code so that it is more readable for beginners.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
rich-markdown-editor: The open source React and Slate based markdown editor that powers Outline wiki.
Github repo
Name: rich-markdown-editor
Tagline: The open source React and Slate based markdown editor that powers Outline wiki.
Homepage: https://getoutline.com
Languages:
JavaScript = 76398 bytes

[![npm version](https://badge.fury.io/js/rich-markdown-editor.svg)](https://badge.fury.io/js/rich-markdown-editor) [![CircleCI](https://img.shields.io/circleci/project/github/outline/rich-markdown-editor.svg)](https://circleci.com/gh/outline/rich-markdown-editor) [![Join the community on Spectrum](https://withspectrum.github.io/badge/badge.svg)](https://spectrum.chat/outline) [![Formatted with Prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat)](https://github.com/prettier/prettier)

# rich-markdown-editor

A React and [Slate](https://github.com/ianstormtaylor/slate) based editor that powers the [Outline wiki](http://getoutline.com) and can also be used for displaying content in a read-only fashion.
The editor is WYSIWYG and includes many formatting tools whilst retaining the ability to write markdown
shortcuts inline and output Markdown.

## Usage

```javascript
import Editor from "rich-markdown-editor";

<Editor
defaultValue="Title\n\nBody"
/>
```

See a working example in the [example directory](/example).

### Props

#### `defaultValue`

A markdown string that represents the initial value of the editor. Use this to prop to restore
previously saved content for the user to continue editing.

#### `titlePlaceholder`

Allows overriding of the placeholder text displayed where a title would be. The default is "Your title".

#### `bodyPlaceholder`

Allows overriding of the placeholder text displayed in the main body content. The default is "Write something nice…".

#### `pretitle`

An optional pretitle that will be prepended to the title. This allows the main title text to
remain aligned with the body content.

#### `readOnly`

With `readOnly` set to `false` the editor is optimized for composition. When `true` the editor can be used to display previously written content – headings gain anchors, a table of contents displays and links become clickable.

#### `toc`

With `toc` set to `true` the editor will display a table of contents for headings in the document. This is particularly useful for larger documents and allows quick jumping to key sections.

#### `plugins`

Allows additional [Slate plugins](https://github.com/ianstormtaylor/slate/blob/master/docs/general/plugins.md) to be passed to the underlying Slate editor.

#### `schema`

Allows additional Slate schema to be passed to the underlying Slate editor.

#### `theme`

Allows overriding the inbuilt theme to brand the editor, for example use your own font face and brand colors to have the editor fit within your application. See the [inbuilt theme](/src/theme.js) for an example of the keys that should be provided.

### Callbacks

#### `uploadImage`

If you want the editor to support images then this callback must be provided. The callback should accept a single `File` object and return a promise the resolves to a url when the image has been uploaded to a storage location, for example S3....
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
sapper: A lightweight web framework built on hyper, implemented in Rust language.
Github repo
Name: sapper
Tagline: A lightweight web framework built on hyper, implemented in Rust language.
Languages:
Rust = 47397 bytes

# Sapper

![](https://travis-ci.org/sappworks/sapper.svg?branch=master)

Sapper, a lightweight web framework, written in Rust.

Sapper focuses on ergonomic usage and rapid development. It can work with **stable** Rust.

Sapper now is based on hyper 0.10.13.

## Tutorial

Look into [json demo](https://github.com/sappworks/sapper_examples/tree/master/json_example), you can learn how to parse http parameters, and return json;

Look into [mvc diesel demo](https://github.com/sappworks/sapper_examples/tree/master/mvc_example), you can learn how to use database, how to render template, and how to redirect.

[English Tutorial](https://github.com/sappworks/sapper/blob/master/docs/Tutorial-en.md)

[中文教程](https://github.com/sappworks/sapper/blob/master/docs/Tutorial-cn.md)

## Import

In Cargo.toml,

```
[dependencies]
sapper = "0.1"
```

## Basic Example

Now, you can boot the example server with:

```
cd examples/basic/
cargo build
cargo run
```

and open the browser, visit

`http://localhost:1337/`

or

`http://localhost:1337/test`

or any other url to test it.

## Other Examples

1. [tiny](https://github.com/sappworks/sapper/tree/master/examples/tiny)
2. [init_global](https://github.com/sappworks/sapper/tree/master/examples/init_global)
3. [query params](https://github.com/sappworks/sapper_query/tree/master/examples/basic)
4. [body params](https://github.com/sappworks/sapper_body/tree/master/examples/basic)
5. [session](https://github.com/sappworks/sapper_session/tree/master/examples/basic)
6. [template rendering](https://github.com/sappworks/sapper_tmpl/tree/master/examples/basic)
7. [simple logger](https://github.com/sappworks/sapper_logger/tree/master/examples/basic)
8. [response json](https://github.com/sappworks/sapper_examples/tree/master/json_example)
10. [mvc diesel demo](https://github.com/sappworks/sapper_examples/tree/master/mvc_example)

11. more continued...

## Basic Benchmark

```
mike@mike-Vostro-3653:~/works2/wrk$ uname -a
Linux mike-Vostro-3653 4.10.0-21-generic #23-Ubuntu SMP Fri Apr 28 16:14:22 UTC 2017 x86_64 x86_64 x86_64 GNU/Linux

mike@mike-Vostro-3653:~/works2/wrk$ cat /proc/cpuinfo
processor : 0
vendor_id : GenuineIntel
cpu family : 6
model : 94
model name : Intel(R) Core(TM) i3-6100 CPU @ 3.70GHz
cpu MHz : 832.183
cache size : 3072 KB
bogomips : 7392.00
...

mike@mike-Vostro-3653:~/works2/sapper/examples/tiny$ cargo run --release
Finished release [optimized] target(s) in 36.27 secs
Running `target/release/tiny`
Listening on http://127.0.0.1:1337

output: hello, world!

mike@mike-Vostro-3653:~/works2/wrk$ ./wrk -t2 -c100 -d30s http://127.0.0.1:1337
Running 30s test @ http://127.0.0.1:1337
2 threads and 100 connections
Thread Stats Avg Stdev Max +/- Stdev
Latency ...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
gsheets: Get public Google Sheets as plain JavaScript/JSON
Github repo
Name: gsheets
Tagline: Get public Google Sheets as plain JavaScript/JSON
Languages:
JavaScript = 7385 bytes
Shell = 827 bytes
HTML = 376 bytes

# gsheets

Get public Google Sheets as plain JavaScript/JSON.

:point_right: [Try gsheets in your browser](https://runkit.com/npm/gsheets)

## Usage

### Node.js

Node.js >= 4 is required.

```
npm install gsheets
```

```js
require('isomorphic-fetch');
const gsheets = require('gsheets');

gsheets.getWorksheet('1iOqNjB-mI15ZLly_9lqn1hCa6MinqPc_71RoKVyCFZs', 'foobar')
.then(res => console.log(res), err => console.error(err));
```

### In the browser

```html
<script src="https://unpkg.com/gsheets@next/gsheets.polyfill.min.js"></script>
<script>
gsheets.getWorksheet('1iOqNjB-mI15ZLly_9lqn1hCa6MinqPc_71RoKVyCFZs', 'foobar')
.then(res => console.log(res), err => console.error(err));

</script>
```

### On the Command Line

```
npm install gsheets -g
```

```sh
gsheets --key=1iOqNjB-mI15ZLly_9lqn1hCa6MinqPc_71RoKVyCFZs --title=foobar --pretty
```

### Compatibility Note

gsheets uses the [Fetch API](https://developer.mozilla.org/en/docs/Web/API/Fetch_API) and [Promises](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise). Depending on your environment, you'll need to polyfill those. Recommendations:

- [isomorphic-fetch](https://github.com/matthew-andrews/isomorphic-fetch)
- [es6-promise](https://github.com/stefanpenner/es6-promise)

For direct usage in the browser, there's a pre-built version of gsheets which the polyfills at [gsheets.polyfill.js](https://unpkg.com/gsheets@next/gsheets.polyfill.js) and [gsheets.polyfill.min.js](https://unpkg.com/gsheets@next/gsheets.polyfill.min.js).

## Features

* Plain JS/JSON data. No 'models'. Just use `.map`, `.filter` etc.
* Correct handling of numeric cells (no formatted strings for numbers!)
* Empty cells are converted to `null`
* A bit of metadata (i.e. when a spreadsheet was updated)
* Empty rows are omitted
* Correct handling of empty worksheets

## Non-features

* Authorization (only works with [published spreadsheets](https://support.google.com/docs/answer/37579?hl=en&ref_topic=2818999))
* Querying, ordering, updating
* Caching. Use a reverse proxy or implement your own caching strategy. I recommend this strongly since Google's API isn't the fastest and you don't want to hit rate limits.

## Caveats

* Beware of cells formatted as dates! Their values will be returned as Excel-style [DATEVALUE](http://office.microsoft.com/en-001/excel-help/datevalue-function-HP010062284.aspx) numbers (i.e. based on the number of *days* since January 1, 1900)

## Why not use another library?

There are a few libraries around which allow you to access Google Spreadsheets, most notably [Tabletop](https://github.com/jsoma/tabletop). However, they all have one or several drawbacks:

* They wrap the output in classes or models with a custom API, whereas all we really need is an array of JS objects
* Tabletop just logs errors to the console which makes proper error handling...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
tabletop: Tabletop.js gives spreadsheets legs
Github repo
Name: tabletop
Tagline: Tabletop.js gives spreadsheets legs
Languages:
JavaScript = 27018 bytes
Python = 961 bytes
Ruby = 942 bytes

# **Tabletop.js** (gives spreadsheets legs)

**Tabletop.js** takes a Google Spreadsheet and makes it easily accessible through JavaScript. With zero dependencies! If you've ever wanted to get JSON from a Google Spreadsheet without jumping through a thousand hoops, welcome home.

Tabletop.js easily integrates Google Spreadsheets with templating systems and anything else that is hip and cool. It will also help you make new friends and play jazz piano.

[![Build Status](https://travis-ci.org/jsoma/tabletop.svg?branch=master)](https://travis-ci.org/jsoma/tabletop)

### Like how easy?

**Step One:** make a Google Spreadsheet and "Publish to Web."

**Step Two:** Write a page that invokes Tabletop with the published URL Google gives you.

function init() {
Tabletop.init( { key: 'https://docs.google.com/spreadsheets/d/0AmYzu_s7QHsmdDNZUzRlYldnWTZCLXdrMXlYQzVxSFE/pubhtml',
callback: function(data, tabletop) {
console.log(data)
},
simpleSheet: true } )
}
window.addEventListener('DOMContentLoaded', init)

**Step Three:** Enjoy your data!

[ { name: "Carrot", category: "Vegetable", healthiness: "Adequate" },
{ name: "Pork Shoulder", category: "Meat", healthiness: "Questionable" },
{ name: "Bubblegum", category: "Candy", healthiness: "Super High"} ]

Yes, it's that easy.

**NOTE:** If your share URL has a `/d/e` in it, try refreshing the page to see if it goes away. If it doesn't, [try this](#if-your-publish-to-web-url-doesnt-work).

# Getting Started

### 1) Publishing your Google Sheet

_The first step is to get your data out into a form Tabletop can digest_

Make a [Google Spreadsheet](http://drive.google.com). Give it some column headers, give it some content.

Name Category Healthiness
Carrot Vegetable Adequate
Pork Shoulder Meat Questionable
Bubblegum Candy Super High

Now go up to the `File` menu and pick `Publish to the web`. Fiddle with the options, then click `Start publishing`. A URL will appear, something like `https://docs.google.com/spreadsheets/d/e/2PACX-1vQ2qq5UByYNkhsujdrWlDXtpSUhh7ovl0Ak6pyY3sWZqEaWS2lJ0iuqcag8iDLsoTuZ4XTiaEBtbbi0/pubhtml` .

**IGNORE THIS URL!** You used to be able to use it, you can't anymore (you still need to do this step, though).

Now that you've published your sheet, you now need to share it, too.

1. Click the **Share** link in the upper right-hand corner
2. Click the very pale **Advanced** button
3. **Change...** access to "On - Anyone with a link"
4. Make sure **Access: Anyone** says **Can view**, since you don't want strangers editing your data
5. Click **Save**

Copy the **Link to Share**. Your URL should look something like `https://docs.google.com/spreadsheets/d/1Io6W5XitNvifEXER9ECTsbHhAjXsQLq6VEz7kSPDPiQ/edit?usp=sharing`. It should **not** have a `/d/e` in it.

### 2) Setting up Tabletop

_Now you're going to feed your spreadsheet into...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
libmoji: 📚 A tiny library for making Bitmoji images
Github repo
Name: libmoji
Tagline: 📚 A tiny library for making Bitmoji images
Languages:
JavaScript = 4365 bytes

# Libmoji
This is a tiny library for making fun, and unique [Bitmoji](https://www.bitmoji.com/) avatars! This library utilizes the Bitmoji avatar-building API to render previews of avatars with specified traits. Libmoji provides functions that allow you to build the image URL for an avatar with random or specific characteristics pulled from the Bitmoji [asset database](https://api.bitmoji.com/avatar-builder-v3/assets). Comics are pulled from the [templates database](https://api.bitmoji.com/content/templates).

Libmoji makes it easy for you to integrate Bitmoji avatars into your project without the need for having a Bitmoji or Snapchat account. Libmoji works without the use of access tokens when generating avatars, and therefore can only render character previews by default. In order to create comic strips, you will need to have a Bitmoji or Snapchat account, and have the [chrome extension](https://chrome.google.com/webstore/detail/bitmoji/bfgdeiadkckfbkeigkoncpdieiiefpig).

Many different types of Bitmoji styles can be created. Libmoji allows you to make `Bitmoji Deluxe`, `Bitmoji Classic`, and `Bitstrips` avatar styles. Each style can be rendered in either gender with tons of different traits and outfits! There are an infinte amount of possibilities! See the article [Bitmoji Styles](https://github.com/matthewnau/libmoji/wiki/Bitmoji-Styles) for examples of what each style looks like.

<p align="center">
<img height="250px" src="https://preview.bitmoji.com/avatar-builder-v3/preview/head?scale=3&gender=1&style=5&rotation=0&beard=2212&brow=1555&cheek_details=1356&ear=1423&eye=1614&eyelash=-1&eye_details=1352&face_lines=1366&glasses=2465&hair=1723&hat=2495&jaw=1400&mouth=2338&nose=1482&beard_tone=8678208&blush_tone=16754088&brow_tone=6772090&eyeshadow_tone=-1&hair_tone=8637550&hair_treatment_tone=10513945&lipstick_tone=16740668&pupil_tone=5793385&skin_tone=9657655&body=1&face_proportion=13&eye_spacing=0&eye_size=2&outfit=990491"/>
<img height="250px" src="https://preview.bitmoji.com/avatar-builder-v3/preview/head?scale=3&gender=2&style=5&rotation=0&brow=1588&cheek_details=-1&ear=1433&eye=1621&eyelash=2281&eye_details=1347&face_lines=1366&glasses=1370&hair=1337&hat=1376&jaw=1422&mouth=2342&nose=1532&blush_tone=16754890&brow_tone=95815&eyeshadow_tone=16749408&hair_tone=15656911&hair_treatment_tone=7903395&lipstick_tone=8716354&pupil_tone=11119494&skin_tone=12159077&body=7&breast=0&face_proportion=4&eye_spacing=2&eye_size=0&outfit=1017984" />
<img height="250px" src="https://preview.bitmoji.com/avatar-builder-v3/preview/head?scale=3&gender=1&style=5&rotation=0&beard=2321&brow=1555&cheek_details=1353&ear=1425&eye=1613&eyelash=2279&eye_details=1351&face_lines=-1&glasses=2478&hair=1301&hat=2525&jaw=1397&mouth=2339&nose=1455&beard_tone=2837035&blush_tone=14381385&brow_tone=2837035&eyeshadow_tone=14401699&hair_tone=15896242&hair_treatment_tone=8146223&lipstick_tone=16693913&pupil_tone=8404014&skin_tone=16301209&body=0&face_proportion=16&eye_spacing=1&eye_size=0&outfit=1018212" />
<img...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-text-style: react text editor only focus on style change
Github repo
Name: react-text-style
Tagline: react text editor only focus on style change
Homepage: https://ctxhou.github.io/react-text-style/
Languages:
JavaScript = 20637 bytes
CSS = 3870 bytes

# react-text-style

> A simple but customizable react text style editor

[![version](https://img.shields.io/npm/v/react-text-style.svg)](https://www.npmjs.com/package/react-text-style/)

### [Demo](https://ctxhou.github.io/react-text-style/)

## When to use this component?

If you only want to get the text style, doesn't care about the text content, this component can meet your requirement.<br/>
All the toolbars, text content is customizable. It means that you can change in any use case.

## Features

* **Pure text style editor** — Support most of the text toolbar
* **Highly customizable** — all the styles and buttons are customizable
* **Pluggable toolbar button** — Extra toolbar button to meet your specific usage

## Table of Contents

<!-- toc -->

- [Get started](#get-started)
* [Required Webpack configuration](#required-webpack-configuration)
- [Usage](#usage)
* [Minimal setup](#minimal-setup)
* [Customized example](#customized-example)
- [Props](#props)
* [Custom config](#custom-config)
- [References](#references)
- [Todo](#todo)
- [License](#license)

<!-- tocstop -->

## Get started

Install it with yarn or npm.

```js
$ yarn add react-text-style
```

### Required Webpack configuration

Currently, this component import css in the component. You need to use webpack `css-loader` to bundle the file. Or it will fail.

The example webpack setting:

```js
{
test: /\.css$/,
loaders: [
'style-loader',
'css-loader?modules'
]
}
```

## Usage

### Minimal setup

```js
import React, {Component} from 'react';
import TextStyle from 'react-text-style';

class Basic extends Component {
handleChange(style) {
// do something when style change
}

render() {
return (
<TextStyle onChange={this.handleChange}/>
)
}
}
```

### Customized example

You can control display which button, the style when user click the button and add extra toolbar button (seems like plugin).

```js
import React, {Component} from 'react';
import TextStyle from 'react-text-style';
import ButtonGroup from 'react-text-style/lib/ui/ButtonGroup';
import IconButton from 'react-text-style/lib/ui/IconButton';

class Plugin extends React.Component {
render() {
return (
{/* Use react-text-style/lib component to make sure buttons are same style */}
<ButtonGroup>
<IconButton iconClassName="icon-extra" {/* define the icon class in your css file */}
onMouseDown={() => alert('this is a pluggable button')}/>
</ButtonGroup>
)
}
}

class Customized extends Component {
handleChange(style) {
// do something when style changes
}

render() {
return (
<TextStyle onChange={this.handleChange}
...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
hone: Convert CSV to automatically nested JSON.
Github repo
Name: hone
Tagline: Convert CSV to automatically nested JSON.
Languages:
Python = 14144 bytes

# :knife: hone
[![PyPI version](https://badge.fury.io/py/hone.svg)](https://badge.fury.io/py/hone)
[![PyPI license](https://img.shields.io/pypi/l/hone.svg)](https://pypi.python.org/pypi/hone/)

Convert CSV to automatically nested JSON.

## Table of Contents
<!--ts-->
+ [Installation](#installation)
+ [Getting Started](#getting-started)
+ [Installation](#installation)
+ [Usage: Command Line](#usage-command-line)
+ [Usage: Python Module](#usage-python-module)
+ [Delimiters](#delimiters)
+ [Examples](#examples)
+ [License](#license)
<!--te-->

## Getting Started
Available as both a [Python module](#usage-python-module) and a [command line tool](#usage-command-line).

### Installation
```
pip install hone
```

### Usage: Command Line
To convert a CSV file located at `path/to/input.csv` to JSON (written to new file at `path/to/output.json`):

```
hone "path/to/input.csv" "path/to/output.json"
```

### Usage: Python Module
```
import hone

Hone = hone.Hone()
schema = Hone.get_schema('path/to/input.csv') # returns nested JSON schema for input.csv
result = Hone.convert('path/to/input.csv') # returns converted JSON as Python dictionary
```
### Delimiters
The delimiters that are used to generate the nested structure are commas, underscores, and spaces.

## Examples

You can view all examples of conversions in the [examples](/examples) directory.
### CSV
| name | birth day | birth month | birth year | reference | reference name |
|-------|-----------|-------------|------------|-----------|----------------|
| Bob | 7 | May | 1985 | TRUE | Smith |
| Julia | 21 | January | 1997 | FALSE | N/A |
| Rick | 12 | June | 1996 | TRUE | Clara |
### Generated JSON
```
[
{
"birth": {
"day": "7",
"month": "May",
"year": "1985"
},
"name": "Bob",
"reference": "TRUE",
"reference name": "Smith"
},
{
"birth": {
"day": "21",
"month": "January",
"year": "1997"
},
"name": "Julia",
"reference": "FALSE",
"reference name": "N/A"
},
{
"birth": {
"day": "12",
"month": "June",
"year": "1996"
},
"name": "Rick",
"reference": "TRUE",
"reference name": "Clara"
}
]
```
# License
Hone is licensed under the [MIT license](LICENSE).
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
datasheets: Read data from, write data to, and modify the formatting of Google Sheets
Github repo
Name: datasheets
Tagline: Read data from, write data to, and modify the formatting of Google Sheets
Homepage: https://datasheets.readthedocs.io/en/latest/
Languages:
Python = 134964 bytes
Jupyter Notebook = 10948 bytes
Makefile = 655 bytes

datasheets
==========
|pip_versions| |travis_ci| |coveralls|

.. |pip_versions| image:: https://img.shields.io/pypi/pyversions/datasheets.svg
:target: https://pypi.python.org/pypi/datasheets

.. |travis_ci| image:: https://travis-ci.org/Squarespace/datasheets.svg?branch=master
:target: https://travis-ci.org/Squarespace/datasheets

.. |coveralls| image:: https://coveralls.io/repos/github/Squarespace/datasheets/badge.svg?branch=master
:target: https://coveralls.io/github/Squarespace/datasheets?branch=master

datasheets is a library for interfacing with Google Sheets, including reading data from, writing
data to, and modifying the formatting of Google Sheets. It is built on top of Google's
`google-api-python-client`_ and `oauth2client`_ libraries using the `Google Drive v3`_ and
`Google Sheets v4`_ REST APIs.

.. _google-api-python-client: https://github.com/google/google-api-python-client
.. _oauth2client: https://github.com/google/oauth2client
.. _Google Drive v3: https://developers.google.com/drive/v3/reference/
.. _Google Sheets v4: https://developers.google.com/sheets/reference/rest/

It can be installed with pip via ``pip install datasheets``.

Detailed information can be found in the `documentation`_.

.. _documentation: https://datasheets.readthedocs.io/en/latest/

Basic Usage
-----------
Get the necessary OAuth credentials from the Google Developer Console as described
in `Getting OAuth Credentials`_.

.. _Getting OAuth Credentials: https://datasheets.readthedocs.io/en/latest/getting_oauth_credentials.html

After that, using datasheets looks like:

.. code-block:: python

import datasheets

# Create a data set to upload
import pandas as pd
df = pd.DataFrame([('a', 1.3), ('b', 2.7), ('c', 3.9)], columns=['letter', 'number'])

client = datasheets.Client()
workbook = client.create_workbook('my_new_workbook')
tab = workbook.create_tab('my_new_tab')

# Upload a data set
tab.insert_data(df, index=False)

# Fetch the data again
df_again = tab.fetch_data()

# Show workbooks you have access to; this may be slow if you are shared on many workbooks
client.fetch_workbooks_info()

# Show tabs within a given workbook
workbook.fetch_tab_names()

For further information, see the `documentation`_.

License
-------
Copyright 2018 Squarespace, INC.

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in
compliance with the License. You may obtain a copy of the License at:

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is
distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied. See the License for the specific language governing permissions and limitations under the
License.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
react-dashboard: React Dashboard - isomorphic admin dashboard template (React.js, Bootstrap, Node.js, GraphQL, React Router, Babel, Webpack, Browsersync)
Github repo
Name: react-dashboard
Tagline: React Dashboard - isomorphic admin dashboard template (React.js, Bootstrap, Node.js, GraphQL, React Router, Babel, Webpack, Browsersync)
Homepage: https://flatlogic-react-dashboard.herokuapp.com/
Languages:
JavaScript = 339065 bytes
CSS = 21914 bytes

## React Dashboard — "[isomorphic](http://nerds.airbnb.com/isomorphic-javascript-future-web-apps/)" admin dashboard template
built with [React](https://facebook.github.io/react/), [Bootstrap](http://getbootstrap.com/), [React Router](https://reacttraining.com/react-router/) (with **Server Side Rendering**!),
[Redux](http://redux.js.org/) and [GraphQL](http://graphql.org/) based on
[React Starter Kit](https://www.reactstarterkit.com) and latest industry best practices.

[Demo](https://flatlogic-react-dashboard.herokuapp.com/). Use following credentials: user/password.

[![react-dashboard](https://flatlogic.com/uploads/react-dashboard.png)](https://flatlogic-react-dashboard.herokuapp.com/)

This seed project is a sort of a free version of a template that may be found on
[Themeforest](https://themeforest.net/category/site-templates/admin-templates)
or [Wrapbootstrap](https://wrapbootstrap.com/themes/admin) with working backend integration.
You may use it to bootstrap the development of your next web app.

## Features
* React
* Server Side Rendering
* Mobile friendly layout (responsive)
* React Router
* Bootstrap3
* GraphQL
* Nodejs backend inegration
* Sass styles
* Webpack build
* Stylish, clean, responsive layout
* Lots of utility css classes for rapid development (flatlogic css set)
* Authentication
* CRUD operations examples
* Browsersync for the ease of development

## Quick Start

#### 1. Get the latest version

You can start by cloning the latest version of React Dashboard on your
local machine by running:

```shell
$ git clone -o react-dashboard -b master --single-branch \
https://github.com/flatlogic/react-dashboard.git MyApp
$ cd MyApp
```

#### 2. Run `yarn install`

This will install both run-time project dependencies and developer tools listed
in [package.json](../package.json) file.

#### 3. Run `yarn start`

This command will build the app from the source files (`/src`) into the output
`/build` folder. As soon as the initial build completes, it will start the
Node.js server (`node build/server.js`) and [Browsersync](https://browsersync.io/)
with [HMR](https://webpack.github.io/docs/hot-module-replacement) on top of it.

> [http://localhost:3000/](http://localhost:3000/) — Node.js server (`build/server.js`)<br>
> [http://localhost:3000/graphql](http://localhost:3000/graphql) — GraphQL server and IDE<br>
> [http://localhost:3001/](http://localhost:3001/) — BrowserSync proxy with HMR, React Hot Transform<br>
> [http://localhost:3002/](http://localhost:3002/) — BrowserSync control panel (UI)

Now you can open your web app in a browser, on mobile devices...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
angular-dashboard-seed: Angular dashboard sample application with nodejs REST backend integration
Github repo
Name: angular-dashboard-seed
Tagline: Angular dashboard sample application with nodejs REST backend integration
Homepage: http://angular-dashboard-seed.flatlogic.com/
Languages:
JavaScript = 45114 bytes
HTML = 29186 bytes
CSS = 12355 bytes

# angular-dashboard-seed
Angular dashboard sample application with nodejs REST backend integration built using latest angular best practices.

This seed is a sort of free version of a template that may be found [here](http://bootstrapbay.com/) or [here](http://themeforest.net/category/site-templates/admin-templates) with **working backend integration**.
You may use it to bootstrap the development of your next web app. Ok, so basically, this project is a hack ;)

Check out the [Live Demo](http://angular-dashboard-seed.flatlogic.com). Use following credentials: <b>user1</b>/<b>user1pass</b>.

## Features
* AngularJS
* Angular UI Router
* Bootstrap3
* Nodejs backend inegration
* Sass styles
* Gulp build
* Stylish, clean, responsive layout
* Lots of utility css classes for rapid development (flatlogic css set)
* Authentication and authorization
* CRUD operations examples
* Browsersync for the ease of development
* Toastr notifications

## Setup

### Required tools
* [Node and npm](http://nodejs.org)
* [Bower](http://bower.io)
* [Gulp](http://gulpjs.com)
* [Ruby Sass] (http://sass-lang.com/install)

### Installation
0. Clone project `git clone https://github.com/flatlogic/angular-dashboard-seed.git`
1. Install node and bower dependencies: `npm install`
2. Run the application: `gulp serve`
3. go to [http://localhost:3000](http://localhost:3000)
4. Enter username: user1, password: user1pass

## Project structure
Project structure based on [this yeoman generator](https://github.com/Swiip/generator-gulp-angular). If you have any questions about the build or project structure please check out their documentation.

## Support
For any additional information please refer to [Flatlogic homepage](http://flatlogic.com).

## Community
- [Tweet about it](https://twitter.com/intent/tweet?text=Amazing%20dashboard%20built%20with%20NodeJS,%20Angular%20and%20Bootstrap!&url=https://github.com/flatlogic/angular-dashboard-seed&via=flatlogicinc) to support revolution in classic paid templates market.
- Follow [@flatlogicinc on Twitter](https://twitter.com/flatlogicinc).
- Subscribe to Flatlogic newsletter at [flatlogic.com](http://flatlogic.com/)
- Let's discuss: [![Join the chat at https://gitter.im/flatlogic/angular-dashboard-seed](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/flatlogic/angular-dashboard-seed)

## License

[MIT](https://github.com/flatlogic/angular-dashboard-seed/blob/master/LICENSE), hell yeah.
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
angular-material-dashboard: Angular admin dashboard with material design
Github repo
Name: angular-material-dashboard
Tagline: Angular admin dashboard with material design
Homepage: http://flatlogic.github.io/angular-material-dashboard/
Languages:
JavaScript = 50382 bytes
HTML = 20929 bytes
CSS = 7214 bytes

# Angular Material Dashboard

[![Join the chat at https://gitter.im/flatlogic/angular-material-dashboard](https://badges.gitter.im/flatlogic/angular-material-dashboard.svg)](https://gitter.im/flatlogic/angular-material-dashboard?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

Responsive Angular admin dashboard with material design based on
[Angular Material](https://github.com/angular/material).

![promo-amd](src/assets/images/promo-amd.png)

Check out [DEMO](http://flatlogic.github.io/angular-material-dashboard/)

## Getting started

Clone project:

$ git clone https://github.com/flatlogic/angular-material-dashboard.git

Install dependencies:

$ cd angular-material-dashboard
$ npm install

Run development web-server:

$ gulp serve

## Features

* AngularJS
* Angular UI Router
* Angular Material
* Sass styles
* Gulp build
* Stylish, clean, responsive layout with original design
* BrowserSync for the ease of development

## Project structure and credits

Project structure based on [gulp-angular yeoman generator](https://github.com/Swiip/generator-gulp-angular).
If you have any questions about the build or project structure please check out their documentation.

UI components built with [Angular Material](https://material.angularjs.org/).

Design by [flatlogic.com](http://flatlogic.com/)

## Deploy to Github pages

$ gulp build
$ gulp deploy

## Community
- [Tweet about it](https://twitter.com/intent/tweet?text=Angular%20Material%20Dashboard%20https://github.com/flatlogic/angular-material-dashboard%20via%20@flatlogicinc) to support revolution in classic paid templates market.
- Follow [@flatlogicinc on Twitter](https://twitter.com/flatlogicinc).
- Subscribe to Flatlogic newsletter at [flatlogic.com](http://flatlogic.com/)
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
sing-app: Free and open-source admin dashboard template built with Bootstrap 4
Github repo
Name: sing-app
Tagline: Free and open-source admin dashboard template built with Bootstrap 4
Homepage: https://flatlogic.github.io/sing-app/
Languages:
HTML = 287465 bytes
CSS = 122098 bytes
JavaScript = 75643 bytes
PHP = 3405 bytes

# Sing App Lite - free and open source admin dashboard template
Including responsive layout and high quality UI built with Bootstrap 4.

[View Demo](https://flatlogic.github.io/sing-app/) | [Download](https://github.com/flatlogic/sing-app/archive/master.zip) | [Available versions](https://demo.flatlogic.com/sing-app/) | [More templates](https://www.flatlogic.com/templates)

[![header_illustration_fb](https://user-images.githubusercontent.com/36201579/40110692-554a4650-5909-11e8-8cde-30a0dd1f65ad.jpg)](https://flatlogic.github.io/sing-app/)

This repository contains a limited free version of [Sing App](https://demo.flatlogic.com/sing-app/). [Full bootstrap 4](https://demo.flatlogic.com/sing-app/html-bs4), [React](https://sing-app.herokuapp.com/app/main/dashboard) with backend, [Angular](https://demo.flatlogic.com/sing-app/angular) and [Angular JS](https://demo.flatlogic.com/sing-app/angularjs) versions are also available and are shipped in a full package.

## Features

Using this template you will be able to leverage lots of built-in components and thus focus on building features that set you apart from competitors rather than bulding everything from scratch. Lite version of a Sing-app includes following features and pages:
* Bootstrap 4+ & SCSS
* Responsive layout
* Styled Bootstrap components like buttons, modals, etc
* Dasboard sample
* Typography
* Tables
* Notifications
* Base charts
* Icons
* Maps
* Hover sidebar

All other features like themining, login, additional pages, etc are available in [full version](https://demo.flatlogic.com/sing-app/).

[![full-version](https://user-images.githubusercontent.com/36201579/40107708-aa2939d6-5901-11e8-8fc1-b31ad46326b7.png)](https://demo.flatlogic.com/sing-app/)

Building a project from scratch means that there is a lot of things to keep track of all at once: analytics, dynamic forms data, UI and UX elements, and much more. This simple admin template is well suited for web apps or any other website or project that requires admin dashboard. This template will serve as a solid foundation for your upcoming project and will save you a lot of time and, hence, money.

## Quick Start

#### 1. Get the latest version

You can start by cloning the latest version of Sing App Lite on your local machine by running:

```shell
$ git clone -o sing-app-lite -b master --single-branch \
https://github.com/flatlogic/sing-app.git MyApp
$ cd MyApp
```

#### 2. Run `npm install && bower install`

This will install both run-time project dependencies and developer tools listed
in [package.json](../package.json) file. We are moving all dependencies to npm, so there will be no bower dependencies soon.

#### 3. Run `gulp build`

This command will build the app from the source files (`/src`) into the output
`/dist` folder. Then open `dist/index.html` in your browser.

Now you can open your web app in a browser, on mobile devices and start
hacking. The page must be served from a web...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
ssr-with-prepack-hackathon: ReactDOMServer + experimental Prepack (React) compiler
Github repo
Name: ssr-with-prepack-hackathon
Tagline: ReactDOMServer + experimental Prepack (React) compiler
Languages:
JavaScript = 12589 bytes

# Hackathon Project: Rendering React to HTML at build time with Prepack

_Note: Prepack is still experimental and not ready for production use_

Around two weeks ago, as part of a 2 day hackathon, I wanted to see if it was possible to build on top of our work on [Prepack](https://github.com/facebook/prepack) and ahead-of-time compile a React app, optimized for server-side rendering only. My goal was to see if it was possible to eliminate React completely from the bundle and generate a simple JS file with the minimal logic necessary to render the HTML.

To keep my scope for this hackathon small, I aimed solely to get on getting our existing Hacker News benchmark, written in React, to have 100% the same HTML output the non-compiled version generates.

To build this project, I copy and pasted parts of the current React implementation of ReactDOMServer, modifying the code to work with Prepack's internal object/value model – in particular, with the concept of values being "abstract" and unknown at build time. I used the existing React compiler rendering logic we built in Prepack, and added to it: we already have a “firstRender” mode that strips event handlers and update logic from components; I had Prepack feed that result into my renderer when detecting a "ReactDOMServer.renderToString" method call.

When an abstract/unknown value needs to appears in the output (either as props on a HTML element or as an HTML child), I decided to have Prepack inject runtime helpers – specifically a "escapeHTML" helper function to embed strings safely safe. Furthermore, the Hacker News benchmark I was using has a loop for a collection of items in the list that it has to render – so I also made a helper to deal with array collections (we have logic that adds in <!— --> comments between adjacent text nodes to ensure we can hydrate from the server-renderer content correctly).

## Results

After around two days, and after adding many TODO comments and invariants into the renderer (implementing the bare minimum needed to get the benchmark working), the output from the compiled version 100% matched that out of the non-compiled version. In this example, **React and ReactDOMServer are completely compiled away** leaving simple HTML strings with holes for the dynamic data. There's no virtual DOM, components, or other React abstractions.

![Rendered output with Prepack](https://raw.githubusercontent.com/trueadm/server-render-hn/master/example.jpg)

- Full benchmark source: https://github.com/facebook/prepack/blob/master/test/react/server-rendering/hacker-news.js
- Compiled output with these optimizations: https://gist.github.com/trueadm/f1692ff635fb666876dcd3f9879a5e1e
- Prepack settings used in this experiment: https://github.com/facebook/prepack/blob/master/scripts/debug-fb-www.js#L53-L81

All of this was made possible by the progress we've made with Prepack and how much it's capable of handling now. We still have a lot of work to go and this experimental ReactDOMServer renderer in Prepack is by no means usable (it's full of TODOs and hasn't been tested on anything other than this benchmark!).

## Performance

Even though I made zero attempt on optimizing the output, I thought I'd run a bunch of benchmarks on the output using NodeJS to see how well...
github  programming  github-starred-to-pinboard 
5 days ago by brianyang
« earlier      
per page:    204080120160

Copy this bookmark:



description:


tags: