Hugo de Oliveira hugooliveirad

This is a proposal for a lightning talk at Reactive Conf. Please 🌟 this gist to push the proposal!

Combining snapshot testing and component library

Do you test presentational logic of your components? No? Yes, but you feel like you are writing a lot of dummy tests? You even probably use snapshot tests for that, but don't feel like you make enought value from them..

If so, click 🌟 button on that Gist!

I'll talk how our team is using snapshot testing to iterate faster,

This is a proposal for a lightning talk at the Reactive 2016 conference. If you like this, star the Gist.

Thinking metrics on React applications

In regular websites, it is common to send multiple events to track user clicks. Single Page Applications change the way you look at metrics. This is a talk about a simple pattern we created at Globo.com to manage a metrics layer for http://globoplay.globo.com. The talk will cover how to track user flow using Google Analytics and other services. We solved the challenge of tying metrics and components, keeping information across pages and having global data. Also some React, React Router and React Side Effects concepts like context, higher order components, history state will be covered.

A lot of people mentioned other immutable JS libraries after reading my post. I thought it would be good to make a list of available ones.

There are two types of immutable libraries: simple helpers for copying JavaScript objects, and actual persistent data structure implementations. My post generally analyzed the tradeoffs between both kinds of libraries and everything applies to the below libraries in either category.

Libraries are sorted by github popularity.

Persistent Data Structures w/structural sharing

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

git-useful

a collection of useful commands to use Git and GitHub.

Add

add files interactively

git add <file> --patch

# working example

NOTE: the list has moved to https://github.com/sketchplugins/plugin-directory

Sketch Plugins

A list of Sketch plugins hosted at GitHub, in no particular order.

brandonbeecroft/Lorem-Ipsum-Plugin-for-Sketch This is a plugin for quickly creating Lorem Ipsum text in Sketch
sebj/Sketch Templates and Plugins for Sketch by Bohemian Coding
FredericJacobs/crop_Artboard A script to export the Sketch App artboards to the clipboard
almonk/SketchGit A simple Git client built right into Sketch.

Teste para projetos responsivos

Problema

Testar/verificar a disposição dos elementos de uma determinada página em determinadas resoluções de tela.

Solução

Executar captura de telas de acordo com os viewports definidos em um script, com a ajuda do PhantomJS.

Necessário ter o NodeJS instalado.

tmux cheatsheet

As configured in my dotfiles.

start new:

tmux

start new with session name:

	// Normal fonts
	@mixin smooth-fonts {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	}

	// Thin fonts
	@mixin smooth-fonts-thin {
	-webkit-text-stroke: 1px;
	text-shadow: 1px 1px 1px black;