Felipe Genuino felipegenuino

Gulp guide for designers

Gulp is a Task / Build runner. It's easy to use, has a simple api, and is efficient. Gulp.js makes use of pipes for streaming data that needs to be processed.

But as designer you don't actually need to know any of that. What you do need to know is that Gulp will make your life much easier.

This tutorial will setup Gulp to do 3 things:

Compress js
Compile less

	// ------------------------------------------- IMPORTANT -------------------------------------------
	// This is a development file to be minified using https://javascript-minifier.com/ and inlined in
	// the index.html file. This file is not compiled or processed by webpack so it should be treated as
	// low-level precompiled es5-compatible javascript. The code here is not meant to be clean, it's
	// meant to be as light and fast as possible since it runs in the head tag.

	// HACK: This file a hack to ensure that home-screen apps on mobile devices gets refreshed when they
	// start. It works by forcing a load of the service-worker.js file and use the precache-manifest
	// file name as an application version, just like a desktop browser like chrome would do. When
	// when it detects a change in the application version, it reloads the page and bypass the browser's

	# LOOP
	Uma das principais diferenças entre o WP_Query e o get_post(), é que no primeiro precisamos fazer um loop básico para buscar as informações que queremos de um determinado post. Com o get_post() não precisamos fazer loop, ele vai direto onde queremos.
	Para o get_post() não importa se o que queremos é uma página ou um post, basta passar o ID e pronto, ele busca as informações necessárias. Já o WP_Query() precisa saber o que estamos buscando.

	Quando usamos o WP_Query(), nós rodamos por default 4 queries no banco.
	Uma query pega os dados da tabela de posts, outra pega os custom fields de uma meta table, a terceira query pega os dados do author da tabela de usuário e a quarta query pega os comentários relacionados ao post. Isso pode ser eficiente, mas só se você for usar todas essas informações. Nesse caso, elas já estarão prontas para serem consumidas.

	Com o get_post(), usamos apenas uma query no banco. Ela geralmente usa a função setup_postdata() que permite usar templates tags como the_title(), isso

	input {
	height: 34px;
	width: 100%;
	border-radius: 3px;
	border: 1px solid transparent;
	border-top: none;
	border-bottom: 1px solid #DDD;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.39), 0 -1px 1px #FFF, 0 1px 0 #FFF;
	}

	git branch -m old_branch new_branch # Rename branch locally
	git push origin :old_branch # Delete the old branch
	git push --set-upstream origin new_branch # Push the new branch, set local branch to track the new remote