{"componentChunkName":"component---src-templates-blog-template-tsx","path":"/page/4","result":{"data":{"site":{"siteMetadata":{"description":"~apenas mais um programador é um blog de um desenvolvedor front-end, minimalista e especialista em WordPress. | Desenvolvedor Front-end em Curitiba | Desenvolvedor WordPress em Curitiba | Desenvolvedor Web em Curitiba | Programador em Curitiba","siteDesc":"~apenas mais um programador"}},"postsResults":{"edges":[{"node":{"id":"1661582d-c165-56d7-b929-64971cb704e4","html":"<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 1000px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 56.49183147033534%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAADCklEQVQoz0WS7U9bZRjGz0Zf6FrZS3nZgdP29Jz29JS2tD0r3c7KmBYoEJDJy9gwGzBBDOLWKA41RIPgZmL8YEK2D8Ztumxm6pb4yeBL0GVmxE9CJCZ2iYl/Ap8l1+VpjfFJfrmf53ry/HLfySM0hwIIB5oQ8jeyjLWnHpQYCwXYogUZ01Qk41HEdY2aEkAsLDOqBhAJ+hgKSIhYmepvor/xMBVfE4WjRhKtCZ1HUzGYRhztrUnkTQO97Vk8+8wxjBTaeLpwAkOdOZZ5Lm+iy0wyl44iE1UYaqzl3Nwr+PSz21heWYHQk8/i1o2P8UepxK2tLWxvb6NUeoLNzV+x8fgxFl+e5MxAHrPD3Zw61cHJgU4svDjBt2ansfT2IsbPDGFy8gKLr85jZmaWQld3JzZ+fgRa6/vv1nDvi8/54MFX3NnZKUe89s48Lo/28M3zgyiO9vHi2ABLv2yAu7vla/y2tQlVamCtxwVxfw0F0zTx6OFPFWF34Wkc2O+Ey23H+o/r5Qw3373MqxeG+N7M83xjfISXxgZ54/oq79+7yy/v3MZC8RKWlxa5vvY1FqbPWSP3FPDDt2sV4a2bn+D9q8v48IMr/OvPJ8Tu31h5vYipwX68NHYa54dPYbivF10ncjieMdiaTkKWJHx0ZYm/P/wGc+dGIHT3tjKTTKG/0ImJs6O8+MIEV1+bxmpxHPNT4zTMdvqbDaStx3pzFLIapqJFoGo69VgceizBjmwaxbP9ODPQB0E/eRJul4sNtV6qPgm6EmQqouF4qgVtGQNa4gikqMGIFoaqBCsEZfk/KIoifUoIasJAMBqH0Nt2DFU2O9xuN+q8Xor19RAb6tkkivA1ihCVKOrUBAOyJQrKFWT5XxRFwSGvF76gwiNmjslMlkK+Iw9hzx7u3VtFm91Bh8NZBtXVLlY7XawLhClGUrCEllT+n4BMRVF58JCXkqzAMHNoyWQhHJb89Hg8rLLZKtjs9orU6XTB4ajGPk8N9tUcoNuqZSpnz1PWT/CUa6UJUfKxOZlmJN7CfwDWPZnCpnoj3gAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/da9ea3a435708c70e5fc4bb2dbeed62b/bc904/meu-ambiente-de-trabalho-em-7-itens.webp 250w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/4be29/meu-ambiente-de-trabalho-em-7-itens.webp 500w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/03f31/meu-ambiente-de-trabalho-em-7-itens.webp 1000w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/93e23/meu-ambiente-de-trabalho-em-7-itens.webp 1163w\"\n          sizes=\"(max-width: 1000px) 100vw, 1000px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/da9ea3a435708c70e5fc4bb2dbeed62b/43fa5/meu-ambiente-de-trabalho-em-7-itens.png 250w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/c6e3d/meu-ambiente-de-trabalho-em-7-itens.png 500w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/da8b6/meu-ambiente-de-trabalho-em-7-itens.png 1000w,\n/static/da9ea3a435708c70e5fc4bb2dbeed62b/2f93d/meu-ambiente-de-trabalho-em-7-itens.png 1163w\"\n          sizes=\"(max-width: 1000px) 100vw, 1000px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/da9ea3a435708c70e5fc4bb2dbeed62b/da8b6/meu-ambiente-de-trabalho-em-7-itens.png\"\n          alt=\"Meu ambiente de trabalho em 7 itens\"\n          title=\"Meu ambiente de trabalho em 7 itens\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Meu ambiente de trabalho em 7 itens</figcaption>\n  </figure></p>\n<h3>1. Sistema Operacional - Hoje sou livre!</h3>\n<p>Aderi ao <strong>GNU linux</strong> como OS padrão no final de 2014, apesar de usá-lo desde 2009. Eu era amarrado ao Windows por causa do pacote Adobe, mas hoje sou livre.</p>\n<p>Uso <strong>Ubuntu 15.04</strong> com <strong>Gnome-shell 3.14</strong> pois acho ele muito bonito, elegante e rápido. Uso também uma máquina virtual com o <em>Windows 8.1</em> e <em>Windows 7</em> para testes em navegadores mais antigos (ie8) e as vezes abrir o Photoshop de vez em quando.</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 740px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 60.13513513513513%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAAAsSAAALEgHS3X78AAACC0lEQVQoz42SWWsTURTH5/MIZuYhFawTP4FPgl9BfCn2peAXsaBgX0oFaemTWqsZsqhRqClZHrLMksaZzJYFilkmi/fvPbedaDWKMD/O5Sz/e865IyVvrjPllgplXb2w6m0oazcgJxKQZRmJhIxUKsVUVWXXuS9BPo58FaYoCpLJJJPePnmMo60NdvRoE6+3NvDq4X0cP92GlsshnX7HSSObybBMJsveZ9LIc8hqWlrEYjRNI5jkFPKsc7CHzv4uc57v4PxwD/7JJ9ieB8e24TgOvnIbujbeVD3c3R9g53MAr+PA5jHnN6Q2LwxHY/jfhjj/DvAP/mCAZqMBwzRhGAaaugH3TMed3Q4eHNq4tu3hY9VE2zKg87jxEyYFvo9oMsZ4OMRkNMIsmiDwPZFgWRZMEuW4bRPPCh3cexFg86WPVqt1EedYl1Cu1O12MZ/PEUWRYDabIQiCpSBBxfV6XezuOFfAh3wWxS8nQkzXdUGc/1fBZrO5TKaxSJQE2meW2J3n+QjDUOSSdV333x02+A5JrFarcerC1rnPslqi2OO7Jxuf6UH+a2QalahWqyhXKkK4XC6jws8xFKPLxcjULomsEqQbSazGocJSqYRisYji6emVHf/xKIvFAtPpVIjRmS6JBWmXNKrokHdGHdI6KLZSkGbv9/vo9XoCOpPv1w7My/8x9i1/mRWiPwDJAS+qg8mjAQAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/d9b10febd866d6d027ab147305134af7/bc904/meu-ambiente-de-trabalho-detalhes-do-sistema.webp 250w,\n/static/d9b10febd866d6d027ab147305134af7/4be29/meu-ambiente-de-trabalho-detalhes-do-sistema.webp 500w,\n/static/d9b10febd866d6d027ab147305134af7/f3b6a/meu-ambiente-de-trabalho-detalhes-do-sistema.webp 740w\"\n          sizes=\"(max-width: 740px) 100vw, 740px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/d9b10febd866d6d027ab147305134af7/43fa5/meu-ambiente-de-trabalho-detalhes-do-sistema.png 250w,\n/static/d9b10febd866d6d027ab147305134af7/c6e3d/meu-ambiente-de-trabalho-detalhes-do-sistema.png 500w,\n/static/d9b10febd866d6d027ab147305134af7/a7269/meu-ambiente-de-trabalho-detalhes-do-sistema.png 740w\"\n          sizes=\"(max-width: 740px) 100vw, 740px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/d9b10febd866d6d027ab147305134af7/a7269/meu-ambiente-de-trabalho-detalhes-do-sistema.png\"\n          alt=\"Detalhes do sistema\"\n          title=\"Detalhes do sistema\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Detalhes do sistema</figcaption>\n  </figure></p>\n<hr>\n<h3>2. Editor de código</h3>\n<p>Uso o <a href=\"http://www.sublimetext.com/3\">Sublime text 3</a> como editor de código padrão, gratuito e indispensável para um desenvolvedor front-end</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 715px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 53.28671328671328%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAIAAADwazoUAAAACXBIWXMAAAsSAAALEgHS3X78AAABWUlEQVQoz42S64rcMAyF8xBlmBZ2nMQ32bJkx3Yy2ZnQdkvp+z9SncxSpj9a9nCQJfAnyeAuTDWk6jjn5fXt56/t+4/t21td71yWWK8Pp3lNdeV69ZwdT81ACVPteqx9qC++SheWWpddc86ZiGNMzLEdTMxHuSsmItq2+zS/Nrj0vggsyvpoDDpNwUQCJoiHmSyBYWcZLTpjpXRgbutalweM5YJFu4AOwFqtdH9IiH540jju8SJES7wDi9SZfGvW000BJudLCjH6Ocf7Na/zxOgDGPLgrPZtL2+NVq3v3ktDd9bxpPikogRPFjxY70xAoODQt9Jgm+Fsg6Qc+ye9jHKHP43hpONofE6REFtb8b73EYfhMWo4kj+6SNV9Nu/wYNq201KLHP+69C/t8PkJLlP6ut21UkKIj8FPazf4tl6Vkh+F+7B8gXw2kwRqvyEya63F46n/tVD6NwgiZdH6yDfoAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/53d195e2a6c31c8b981b88931b477119/bc904/meu-ambiente-sublime-text-3.webp 250w,\n/static/53d195e2a6c31c8b981b88931b477119/4be29/meu-ambiente-sublime-text-3.webp 500w,\n/static/53d195e2a6c31c8b981b88931b477119/4270b/meu-ambiente-sublime-text-3.webp 715w\"\n          sizes=\"(max-width: 715px) 100vw, 715px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/53d195e2a6c31c8b981b88931b477119/43fa5/meu-ambiente-sublime-text-3.png 250w,\n/static/53d195e2a6c31c8b981b88931b477119/c6e3d/meu-ambiente-sublime-text-3.png 500w,\n/static/53d195e2a6c31c8b981b88931b477119/9dfea/meu-ambiente-sublime-text-3.png 715w\"\n          sizes=\"(max-width: 715px) 100vw, 715px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/53d195e2a6c31c8b981b88931b477119/9dfea/meu-ambiente-sublime-text-3.png\"\n          alt=\"Sublime text 3\"\n          title=\"Sublime text 3\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Sublime text 3</figcaption>\n  </figure></p>\n<p>Eu costumo sempre que instalar meu <strong>Sublime Text</strong>, já sair instalando meus pacotes, segue a lista:</p>\n<ul>\n<li>Emmet</li>\n<li>Sass</li>\n<li>SASS Snippets</li>\n<li>Git</li>\n<li>GitGutter</li>\n<li>Wordpress</li>\n<li>Bootstrap 3 Snippets</li>\n<li>Placeholders</li>\n<li>Alignment</li>\n<li>Editorconfig</li>\n<li>jQuery</li>\n<li>Bracket Highlighter</li>\n<li>AdvancedNewFile</li>\n<li>TrailingSpaces</li>\n<li>SideBarEnhancements</li>\n<li>Comment Snippets</li>\n<li>AutoFileName</li>\n<li>All Autocomplete</li>\n<li>jekyll</li>\n<li>codeivate</li>\n<li>wakatime</li>\n<li>Theme - Cobalt2</li>\n</ul>\n<hr>\n<h3>3. Linha de comando</h3>\n<p>Usei por algums meses o <strong><a href=\"http://guake.org/\">Guake Terminal</a></strong> pelo simples fato de ser <em>dropdown</em>, logo migrei para o <strong><a href=\"http://gnometerminator.blogspot.com.br/p/introduction.html\">Terminator</a></strong> porque gostei da ideia de dividir a tela do terminal em múltiplas telinhas menores, mas ele não era <em>dropdown</em>, fiquei triste por algum tempo até encontrar o <strong><a href=\"http://kde-apps.org/content/show.php?content=29153\">Yakuake</a></strong>, um terminal que use o <em>dropdown</em> com o divisão de múltiplas telas.</p>\n<p>Hoje uso o <strong>Yakuake</strong> com muito prazer, e sou mais feliz por isso.</p>\n<p>Ah! Não poderia esquecer do <strong><a href=\"http://fishshell.com/\">Fish shell</a></strong>, com ele tudo fica mais fácil no terminal, sério, tudo.</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 715px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 53.28671328671328%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAYAAAB/Ca1DAAAACXBIWXMAAAsSAAALEgHS3X78AAACTElEQVQoz12S23KbMBCGVxInAZIAn40PSRxnTMbGPaRJk870/V+kaCXoG/iiwjSZTi++EaCdT7v8AjopjFdODA+EBoBfx9dzF94Xlm6FoQsfSQKa+KTp9xbLhVk/rVvIQLM5QzIimk4p0glFMiFYP9Ut0CU3bBRjwpJB+HbqwiqxpPRdIUPwoPkQbhdm9bxqYQvoHTxDb6hhe2bYHTNk5YSfe+GCozfmqJgahOdT66dcg8caoNThhOyvsHQdfnMdLgHZxglLimzL3CQUQYCuvzghWYZIcx8lGUauqspSMgj+Zz6f4+p72cEKkO6oIRuCV0qCMAM8vZ46CKcJ8jzBLFA68ILmsXq0POKN7/lN4AdNGIYNTyINDJr1dmVu3/adV3Lka2FCFeogDnSQDpy/nltIbqRJyhTjWYrpWKAcK50WQgslNHejr5Yl1j8/dUmV2bya2mxfGLlXRu6UETOBfV0apzqJE/3y/NKCShmOpIe5Wz0O+h3iwujHVELp+5eqhU1oyE1sYAS6DwqG/X/5dTweLZQ8wlsem2UQYcF8nTsyR8zY9Z8WWaH3bkzYgfE29BoAUVQT5a5M7lZJrvQH1CcXSiKZThOmQ3c1otAR0SYKaMOAXIMoVK4ffjy0Tohsx5Bu3L0rB0h2FX2EVte1hUTFNs1jK6fKyllmxVjYVHg2iJhxRTqTytyd979h5ltvyS0dM0tHrtPcpRy6hMFBXMoAeDgcOkilvKRKXoRSV/rn/ptwSIfKskueFxeRunehLrJf3xFDzTuj0fjyB0XS7Bgl47ZnAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/4482cfd6dc5a398b6fbbee19f3107265/bc904/meu-ambiente-linha-de-comando-yakuake-fish-shell.webp 250w,\n/static/4482cfd6dc5a398b6fbbee19f3107265/4be29/meu-ambiente-linha-de-comando-yakuake-fish-shell.webp 500w,\n/static/4482cfd6dc5a398b6fbbee19f3107265/4270b/meu-ambiente-linha-de-comando-yakuake-fish-shell.webp 715w\"\n          sizes=\"(max-width: 715px) 100vw, 715px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/4482cfd6dc5a398b6fbbee19f3107265/43fa5/meu-ambiente-linha-de-comando-yakuake-fish-shell.png 250w,\n/static/4482cfd6dc5a398b6fbbee19f3107265/c6e3d/meu-ambiente-linha-de-comando-yakuake-fish-shell.png 500w,\n/static/4482cfd6dc5a398b6fbbee19f3107265/9dfea/meu-ambiente-linha-de-comando-yakuake-fish-shell.png 715w\"\n          sizes=\"(max-width: 715px) 100vw, 715px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/4482cfd6dc5a398b6fbbee19f3107265/9dfea/meu-ambiente-linha-de-comando-yakuake-fish-shell.png\"\n          alt=\"Yakuake e fish shell\"\n          title=\"Yakuake e fish shell\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Yakuake e fish shell</figcaption>\n  </figure></p>\n<hr>\n<h3>4. Controle de versão</h3>\n<p>Mas é claro que é o <strong>Git</strong>, não precisaria nem discutir isso aqui pelo simples fato de que é o melhor controle de versão já desenvolvido.</p>\n<p>Uso <strong><a href=\"http://github.com/nandomoreirame\">Github</a></strong> para repositórios públicos e <strong><a href=\"https://bitbucket.org/\">Bitbucket</a></strong> para repositórios privados.</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 959px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 65.17205422314912%; position: relative; bottom: 0; left: 0; background-image: url('data:image/jpeg;base64,/9j/2wBDABALDA4MChAODQ4SERATGCgaGBYWGDEjJR0oOjM9PDkzODdASFxOQERXRTc4UG1RV19iZ2hnPk1xeXBkeFxlZ2P/2wBDARESEhgVGC8aGi9jQjhCY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2P/wgARCAANABQDASIAAhEBAxEB/8QAFwABAQEBAAAAAAAAAAAAAAAABAACBf/EABQBAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhADEAAAAe0ZRBtqP//EABoQAAEFAQAAAAAAAAAAAAAAAAIAAQMREjP/2gAIAQEAAQUCI6QHJYvppOY6c1//xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAEDAQE/AT//xAAUEQEAAAAAAAAAAAAAAAAAAAAQ/9oACAECAQE/AT//xAAbEAACAgMBAAAAAAAAAAAAAAAAEQECEDFRcf/aAAgBAQAGPwJFnMbXBklXZx5j/8QAGxABAQACAwEAAAAAAAAAAAAAAREAMRAhUfD/2gAIAQEAAT8htg8a63narDCfHIoEvubvhTGR3Fjw/9oADAMBAAIAAwAAABCDz//EABQRAQAAAAAAAAAAAAAAAAAAABD/2gAIAQMBAT8QP//EABQRAQAAAAAAAAAAAAAAAAAAABD/2gAIAQIBAT8QP//EAB0QAQACAgIDAAAAAAAAAAAAAAERIQBBEGExUZH/2gAIAQEAAT8QYwTYsQYN++sYZhFErpnR6swBQ0EJlBAqyEglj9wVMlA8hV8f/9k='); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/32c4decbcca4db2b7972d3c3389e5fa9/bc904/meu-ambiente-github.webp 250w,\n/static/32c4decbcca4db2b7972d3c3389e5fa9/4be29/meu-ambiente-github.webp 500w,\n/static/32c4decbcca4db2b7972d3c3389e5fa9/ace52/meu-ambiente-github.webp 959w\"\n          sizes=\"(max-width: 959px) 100vw, 959px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/32c4decbcca4db2b7972d3c3389e5fa9/0988f/meu-ambiente-github.jpg 250w,\n/static/32c4decbcca4db2b7972d3c3389e5fa9/d1f95/meu-ambiente-github.jpg 500w,\n/static/32c4decbcca4db2b7972d3c3389e5fa9/7d613/meu-ambiente-github.jpg 959w\"\n          sizes=\"(max-width: 959px) 100vw, 959px\"\n          type=\"image/jpeg\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/32c4decbcca4db2b7972d3c3389e5fa9/7d613/meu-ambiente-github.jpg\"\n          alt=\"Github\"\n          title=\"Github\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Github</figcaption>\n  </figure></p>\n<hr>\n<h3>5. Pré-processador</h3>\n<p>Todo front-end precisa usar um <strong><a href=\"https://goo.gl/G79yVN\">pré-processador</a></strong>, seja ele <strong>LESS</strong>, <strong>SASS(SCSS)</strong>, <strong>Stylus</strong> ou qualquer outro, isso não é uma opção, é um item necessário para um bom front-end.</p>\n<p>Eu uso <strong><a href=\"http://sass-lang.com/\">SASS/SCSS</a></strong>, apesar de ouvir falar muito bem do <strong>Stylus</strong> prefiro ficar com o <strong>SASS</strong>, ele tem tudo que preciso em um pré-processador e muito mais..</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 333px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 109.9099099099099%; position: relative; bottom: 0; left: 0; background-image: url('data:image/jpeg;base64,/9j/2wBDABALDA4MChAODQ4SERATGCgaGBYWGDEjJR0oOjM9PDkzODdASFxOQERXRTc4UG1RV19iZ2hnPk1xeXBkeFxlZ2P/2wBDARESEhgVGC8aGi9jQjhCY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2P/wgARCAAWABQDASIAAhEBAxEB/8QAGQABAAIDAAAAAAAAAAAAAAAAAAIFAQME/8QAFQEBAQAAAAAAAAAAAAAAAAAAAAH/2gAMAwEAAhADEAAAAbxDmtsGEkIBuB//xAAaEAEAAgMBAAAAAAAAAAAAAAABAhEAEBID/9oACAEBAAEFApNZFvXqWdSHGNvGv//EABYRAQEBAAAAAAAAAAAAAAAAAAERIP/aAAgBAwEBPwELj//EABYRAQEBAAAAAAAAAAAAAAAAAAERIP/aAAgBAgEBPwELj//EABoQAAICAwAAAAAAAAAAAAAAAAEQADICIDH/2gAIAQEABj8C04rES+S//8QAGxABAAIDAQEAAAAAAAAAAAAAAQARECExgeH/2gAIAQEAAT8hYFdWp6sLaFpC2N/cbri4Mv8AWHJ//9oADAMBAAIAAwAAABDExzz/xAAXEQEAAwAAAAAAAAAAAAAAAAAQAREx/9oACAEDAQE/EJcFn//EABYRAAMAAAAAAAAAAAAAAAAAAAEgMf/aAAgBAgEBPxAsJ//EAB4QAQACAQQDAAAAAAAAAAAAAAERIQAQMUFxYdHw/9oACAEBAAE/EIW0h4ywJAuHSQoDAF/VgYLK6EzymjgYEKR33l9RdPWCASsG7zn/2Q=='); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/262b327522222095e459fcca3e8ea342/bc904/meu-ambiente-sass-compass.webp 250w,\n/static/262b327522222095e459fcca3e8ea342/8d2e5/meu-ambiente-sass-compass.webp 333w\"\n          sizes=\"(max-width: 333px) 100vw, 333px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/262b327522222095e459fcca3e8ea342/0988f/meu-ambiente-sass-compass.jpg 250w,\n/static/262b327522222095e459fcca3e8ea342/570e8/meu-ambiente-sass-compass.jpg 333w\"\n          sizes=\"(max-width: 333px) 100vw, 333px\"\n          type=\"image/jpeg\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/262b327522222095e459fcca3e8ea342/570e8/meu-ambiente-sass-compass.jpg\"\n          alt=\"SASS e Compass\"\n          title=\"SASS e Compass\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">SASS e Compass</figcaption>\n  </figure></p>\n<hr>\n<h3>6. Automatizador de tarefas</h3>\n<p><strong>Gulp</strong>, mas por que? Porque sim.</p>\n<p>O <strong>Gulp</strong> é muito mais rápido que o <strong>Grunt</strong>, pois ele faz uso das streams do node para escrever arquivos diretamente para o disco, dispensando intermediários.</p>\n<p><img src=\"../../../assets/eu-ambiente-gulpjs.png\" alt=\"Gulpjs\"></p>\n<p>Junto com ele uso uma série de <em>packages</em>, que são indispensáveis em meu arsenal, são eles:</p>\n<ul>\n<li>browser-sync</li>\n<li>gulp</li>\n<li>gulp-autoprefixer</li>\n<li>gulp-bower-normalize</li>\n<li>gulp-cache</li>\n<li>gulp-compass</li>\n<li>gulp-concat</li>\n<li>gulp-imagemin</li>\n<li>gulp-jshint</li>\n<li>gulp-load-plugins</li>\n<li>gulp-minify-css</li>\n<li>gulp-rename</li>\n<li>gulp-shell</li>\n<li>gulp-size</li>\n<li>gulp-uglify</li>\n<li>run-sequence</li>\n<li>e outros..</li>\n</ul>\n<h3>7. Controle de tarefas</h3>\n<hr>\n<p>Nós usamos o <strong><a href=\"https://www.atlassian.com/software/jira\">Jira</a></strong> lá na <strong><a href=\"http://www.malapronta.com.br\">MalaPronta.com</a></strong> um software incrível da <strong>Atlassian</strong> a mesma empresa que criou o <strong>Bitbucket</strong>.</p>\n<p><figure class=\"gatsby-resp-image-figure\" style=\"\">\n    <span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto;  max-width: 614px;\"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 61.56351791530944%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAACXBIWXMAAAsSAAALEgHS3X78AAACvElEQVQoz01TTY/cRBT0v+RASEC5IHFHXEgWLlFO/AGiTaKI3OAEFy4kkTZaZQVoN4FlZ8djezz+7rbd/rZnqng9XGip1U+t9+rVq+p27jw4PXzx+CXvnTzF3Yen/PjBKT/99jnunjzjJ/bu5Jnsp7z/+Ed8+eQVPnr4gp8/esEffn4t+w2f/PSK9755jjtff8/Pvvru4Hh+wPV6Dc/zubq9ZZIkKCsDVVbQZU1dGeaqlLhiWmgWumRV1yy1Zhwnkp+iKArKtjV0lCQ3jeF+v8c0TsjSlFmh2A0jqrpBkuaom46lxEoamG7g4XDgOla2GVqpNU2Hth/kbODoqmRZCROloFTGaVlwOACtqTmOA8Zx5LLMnIdBmh4IgK2puFOGSZZj6HsuQkbyMIwzHTdbMQwT/n11iddnvzDOUihd4ey3Xxn4HvK8YCKsq+tr+v4Wt6sVL87esGsbKqXY9z3atmUURez6EU6qUyn0YbXIdIbdLmQQBBQgAcsRxzGiOKaKYm78kBbw8uKc/TDIRArzPOMo1zRBZBINi1KKIqZZRmNaaK2tyDDGoDaGSgQvS9F5XLgNtrBMwsDDIBLIPadppM2NowipTCMMExZiTCGjJqnPXrSY5gVhuKWOEphuFvYJjUqsRkdGY1Oz6zrrvJUEi+i+XxapneD4ypURI8ThFtfrC4TCIJbxr64uuX73B87/vMbZ23Nmmw9wveAox259cwSMlUGiO1RVRSuNfWaOX7j0vVCMUChX/zDa7ix11HlCleVihM9Yno5x1xKH2Gw2uPnw+38MTUclhogpkFdC03Z0AuWJyzGyXAy5eU+rRbiLYXRO2yRN0+PIpQB7ngfXdVGX+uhsI66afoJdlDXNexk5d7Fxfe52Ef/avBcwcfLWRRL64mJx/DkCKuCamRhnY2ucMDx+hv8tjvPCfwEIvm4jna7R/QAAAABJRU5ErkJggg=='); background-size: cover; display: block;\"\n  ></span>\n  <picture>\n        <source\n          srcset=\"/static/75b094adca49e2be2177ecfae91b20a4/bc904/meu-ambiente-jira.webp 250w,\n/static/75b094adca49e2be2177ecfae91b20a4/4be29/meu-ambiente-jira.webp 500w,\n/static/75b094adca49e2be2177ecfae91b20a4/3a3a7/meu-ambiente-jira.webp 614w\"\n          sizes=\"(max-width: 614px) 100vw, 614px\"\n          type=\"image/webp\"\n        />\n        <source\n          srcset=\"/static/75b094adca49e2be2177ecfae91b20a4/43fa5/meu-ambiente-jira.png 250w,\n/static/75b094adca49e2be2177ecfae91b20a4/c6e3d/meu-ambiente-jira.png 500w,\n/static/75b094adca49e2be2177ecfae91b20a4/328b5/meu-ambiente-jira.png 614w\"\n          sizes=\"(max-width: 614px) 100vw, 614px\"\n          type=\"image/png\"\n        />\n        <img\n          class=\"gatsby-resp-image-image\"\n          src=\"/static/75b094adca49e2be2177ecfae91b20a4/328b5/meu-ambiente-jira.png\"\n          alt=\"Jira Atlassian\"\n          title=\"Jira Atlassian\"\n          loading=\"lazy\"\n          style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        />\n      </picture>\n    </span>\n    <figcaption class=\"gatsby-resp-image-figcaption\">Jira Atlassian</figcaption>\n  </figure></p>\n<p>Pessoalmente eu sou meio desorganizado quanto a isso, preciso me gerenciar melhor. Eu uso o <strong><a href=\"https://keep.google.com/\">Google Keep</a></strong> para anotações rápidas, pelo fato de ter o sincronismo com todos os meus aparelhos rapidamente.</p>\n<hr>\n<h3>Conclusão</h3>\n<p>Espero que meu ambiente de trabalho inspire você como desenvolvedor front-end no mercado de trabalho, que vocẽ possa aperfeiçoar seu dia-a-dia como desenvolvedor e que algumas dessas ferramentas que citei aqui sirva para você também.</p>\n<p>Eu sempre digo para alguns amigos meus desenvolvedores para se inspirarem em alguém, espero que essas dicas sirvam de inspiração para você algum dia.</p>\n<p>E você, o que tem usado? Comenta ai vai.</p>\n<p>Obrigado.</p>","excerpt":"1. Sistema Operacional - Hoje sou livre! Aderi ao GNU linux como OS padrão no final de 2014, apesar de usá-lo desde 2009. Eu era amarrado ao Windows…","timeToRead":4,"frontmatter":{"category":["workspace"],"date":"há 11 anos","description":"Aderi ao GNU linux como OS padrão no final de 2014, apesar de usá-lo desde 2009.","path":"/meu-ambiente-de-trabalho-em-7-itens","tags":["workspace","ambiente","desenvolvimento"],"title":"Meu ambiente de trabalho em 7 itens","image":{"publicURL":"/static/meu-ambiente-de-trabalho-em-7-itens-da9ea3a435708c70e5fc4bb2dbeed62b.png","name":"meu-ambiente-de-trabalho-em-7-itens"}},"fields":{"readingTime":{"words":608}}}},{"node":{"id":"f6032903-56ae-5e13-85a7-fd29be2e4657","html":"<p>Muitos amigos e colegas de trabalho sempre me perguntam porque eu sou contra o uso de plugins no Wordpress.</p>\n<p>A resposta é simples, não tem porque pegar um elefante e tentar colocar dentro de um fusca, algum dia algum deles vai reclamar, ou o elefante com dores no corpo ou o fusca vai quebrar em algum ponto do trajeto.</p>\n<ul>\n<li><strong>O Elefante</strong>: o plugin de galeria.</li>\n<li><strong>O Fusca</strong>: Uma página simples de galeria.</li>\n</ul>\n<p>Vou explicar melhor, vem comigo.</p>\n<h2>Plugins</h2>\n<h4>História</h4>\n<p>O seu cliente, bem pomposo que é, quer uma página de galeria de imagens, e você, bem esperto vai no google procurar um plugin para criar tal página o mais rápido possível.</p>\n<p>Ai você encontra um plugin, lindo e maravilhoso, que tem um monte de funcionalidades, shemes de todas as cores e tamanhos, um monte de campos customizados bem legais… ai eu te pergunto: Precisa mesmo de tudo isso para criar uma página com fotos clicáveis que abrem em um lightbox?</p>\n<p>Por isso que a frase: “Tentar colocar um elefante dentro de um fusca” se encaixa perfeitamente nesse caso. Eu aposto que você não usou 20% do que o plugin tem desenvolvido. Porque não desenvolver algo sob medida para esse projeto? É fácil e simples usando o Wordpress.</p>\n<p>Outro ponto importante, se o cliente querer algo que não tem no plugin o que você vai fazer?</p>\n<ul>\n<li>( ) - Implementar essa funcionalidade dentro do plugin (Se o cliente resolver atualizar o plugin qualquer alteração que você fez irá pelo ralo)</li>\n<li>( ) - Remover o plugin e fazer na mão</li>\n<li>( x ) - Sentar e chorar, porque qualquer das opções acima te dará uma tremenda dor de cabeça e muito retrabalho.</li>\n</ul>\n<h4>DICA:</h4>\n<p>O que você deve fazer em cada projeto é:</p>\n<ul>\n<li>Analisar todos os módulos e páginas que seu cliente pediu,</li>\n<li>Verificar as possibilidades de usar ou não um plugin,</li>\n<li>Se você decidir usar, analisar cada um antes de adicionar ao projeto.</li>\n</ul>\n<p>Não vou dizer para você que eu não uso plugins em meus projetos, mas claro que uso, mas para funcionalidades bem específicas que provavelmente não poderei desenvolver dentro do projeto.\nO importante é quanto menos plugins o seu projeto tiver melhor, por favor não passe de 5, e eu ainda acho muito.</p>\n<h3>Funções</h3>\n<p>Se você é programador PHP intermediário ou avançado e usa plugins em todos os seus projetos para variadas funcionalidades, sinto muito te dizer mas você está fazendo isso errado.</p>\n<p>Você sabia que existe um arquivo chamado <code class=\"language-text\">functions.php</code> em todos os temas e a partir deste você pode incluir muitos outros arquivos?</p>\n<p>.. brincadeira viu.</p>\n<p>Se somar o seu conhecimento em PHP com Wordpress o céu é o limite, não fique acanhado, crie suas próprias funções, pesquise funções do Wordpress, implemente a tão sonhada galeria para seu cliente sob medida, sem tirar coisas úteis e nem colocar coisas inúteis. Vai por mim, é fácil!</p>\n<p>E no final todos ficam felizes.</p>\n<p>Existe um tema boilerplate criado pela cominidade <a href=\"https://github.com/wpbrasil\">WP Brasil</a> chamado <a href=\"http://wpod.in/\">Odin framework</a>, use à vontade esse cara, ele será seu melhor amigo.</p>\n<p>Depois que eu comecei a usar o Odin eu não uso mais plugins para:</p>\n<ul>\n<li><a href=\"/criando-formulario-de-contato-para-wordpress-com-odin-framework\">Criar formulários de contato</a>,</li>\n<li><a href=\"https://github.com/wpbrasil/odin/wiki/Classe-Odin_Metabox#image_plupload\">Galeria de fotos</a>,</li>\n<li><a href=\"https://github.com/wpbrasil/odin/wiki/Classe-Odin_Post_Type\">Criar Custom Post types</a>,</li>\n<li><a href=\"https://github.com/wpbrasil/odin/wiki/Classe-Odin_Taxonomy\">Criar Taxonomias</a> (tags e categorias),</li>\n<li><a href=\"https://github.com/wpbrasil/odin/wiki/Classe-Odin_Metabox\">Criar Meta Boxes</a>,</li>\n<li><a href=\"https://github.com/wpbrasil/odin/wiki/Classe-Odin_Theme_Options\">Opções do meu tema</a>.</li>\n</ul>\n<h4>Conclusão</h4>\n<p>Seja cuidadoso com cada projeto que você for criar, tudo isso agregará valor à você mesmo. Use apenas o necessário, comprima os assets, adicione apenas o necessário em seu projeto e não abuse na instalação de plugins.</p>\n<p>Abraço!</p>","excerpt":"Muitos amigos e colegas de trabalho sempre me perguntam porque eu sou contra o uso de plugins no Wordpress. A resposta é simples, não tem porque pegar…","timeToRead":3,"frontmatter":{"category":["wordpress"],"date":"há 11 anos","description":"Muitos amigos e colegas de trabalho sempre me perguntam porque eu sou contra o uso de plugins no Wordpress.","path":"/wordpress-plugins-x-functions-php","tags":["wordpress","dicas","php"],"title":"Wordpress - plugins x functions.php","image":{"publicURL":"/static/wordpress-plugins-x-functions-php-8d7ab4a2de629480d5653bb8a64baf98.jpg","name":"wordpress-plugins-x-functions-php"}},"fields":{"readingTime":{"words":601}}}}]}},"pageContext":{"limit":12,"skip":36,"numPages":4,"currentPage":4}}}