Ótimos utilitários para quem usa bootstrap:
Bootstrap Utilitários_
sexta-feira, 6 de junho de 2014
| Filed Under
Bootstrap
// Deixe um Comentario_
ASP.NET transformação de config na Build (F5)_
Usando plugins como o Configuration Transform, nos permite criar os app.debug.config e app.release.config. E além disso também faz com que a aplicação utilize as configurações escolhidas do Drop quando se está executando (F5).
Pesquisando um pouco na web para buscar uma forma de se ter o mesmo comportamento para o web.config, achei o seguinte post: http://www.kongsli.net/nblog/2012/01/13/enabling-web-transforms-when-debugging-asp-net-apps/.
Que basicamente em poucos passos já nos permite escolher a configuração no DropDown (Debug/Release) do Visual Studio e rodar a aplicação (F5) com essa configuração escolhida.
Passo 1: No diretório da aplicação (Windows Explorer), renomeie o web.config para web.template.config
Passo 2: No Visual Studio dê "Unload Project" e "Edit xxxx.csproj"
Passo 3: Procure por Web.Config no xml e irá encontrar algumas tags.
Substitua ou adeque as tags para ficar algo como (atenção com os nomes das tags None):
<Content Include="Web.config" />
<None Include="Web.template.config" />
<None Include="Web.Debug.config">
<DependentUpon>Web.template.config</DependentUpon>
</None>
<None Include="Web.Release.config">
<DependentUpon>Web.template.config</DependentUpon>
</None>
Pesquisando um pouco na web para buscar uma forma de se ter o mesmo comportamento para o web.config, achei o seguinte post: http://www.kongsli.net/nblog/2012/01/13/enabling-web-transforms-when-debugging-asp-net-apps/.
Que basicamente em poucos passos já nos permite escolher a configuração no DropDown (Debug/Release) do Visual Studio e rodar a aplicação (F5) com essa configuração escolhida.
Passo 1: No diretório da aplicação (Windows Explorer), renomeie o web.config para web.template.config
Passo 2: No Visual Studio dê "Unload Project" e "Edit xxxx.csproj"
Passo 3: Procure por Web.Config no xml e irá encontrar algumas tags.
Substitua ou adeque as tags para ficar algo como (atenção com os nomes das tags None):
<Content Include="Web.config" />
<None Include="Web.template.config" />
<None Include="Web.Debug.config">
<DependentUpon>Web.template.config</DependentUpon>
</None>
<None Include="Web.Release.config">
<DependentUpon>Web.template.config</DependentUpon>
</None>
Passo 4: Após a tag <Import> do "Microsoft.CSharp.targets" adicione o seguinte:
<PropertyGroup>
<BuildDependsOn>
CustomWebConfigTransform;
$(BuildDependsOn);
</BuildDependsOn>
</PropertyGroup>
<Target Name="CustomWebConfigTransform">
<TransformXml source="Web.template.config" transform="Web.$(Configuration).config" destination="Web.config" />
</Target>
<PropertyGroup>
<BuildDependsOn>
CustomWebConfigTransform;
$(BuildDependsOn);
</BuildDependsOn>
</PropertyGroup>
<Target Name="CustomWebConfigTransform">
<TransformXml source="Web.template.config" transform="Web.$(Configuration).config" destination="Web.config" />
</Target>
Pronto! Sua aplicação já cria o Web.Config quando faz Build!
OBS: O único problema é que "pacotes do nuget" que fazem alterações no web.config não são alterados no web.template.config, o que obriga a ser feito manualmente.
OBS: O único problema é que "pacotes do nuget" que fazem alterações no web.config não são alterados no web.template.config, o que obriga a ser feito manualmente.
Plugins e Telas de Carregando (AJAX)_
JQuery LoadMask
Um simples e eficaz plugin para se fazer um "aguarde" enquanto algum código javascript é executado.
http://code.google.com/p/jquery-loadmask/
JQuery BlockUI Plugin (Recomendado)
Um plugin completo e com suporte para bloqueio da tela inteira ou por elemento.
http://www.malsup.com/jquery/block/
Obs: AjaxLoad
Uma página geradora de imagem para exibir enquanto um código está sendo processado (loading).
http://ajaxload.info/
Um simples e eficaz plugin para se fazer um "aguarde" enquanto algum código javascript é executado.
http://code.google.com/p/jquery-loadmask/
JQuery BlockUI Plugin (Recomendado)
Um plugin completo e com suporte para bloqueio da tela inteira ou por elemento.
http://www.malsup.com/jquery/block/
Obs: AjaxLoad
Uma página geradora de imagem para exibir enquanto um código está sendo processado (loading).
http://ajaxload.info/
Templates HTML5_
Esses dias lí um post sobre templates para novos projetos em HTML5 (http://flaviosilveira.com/2011/initializr-comece-seu-projeto-html5-em-15-segundos/).
Segue alguns que já ví:
Twitter Bootstrap (temas)
Bootstrap é uma estrutura HTML5, CSS3 e JS projetado para ajudar no desenvolvimento de aplicações web e sites.
Esta template serve para dar um ponta pé inicial na criação de novos projetos. Acredito que foi o precursor para as templates iniciais de projeto.
https://wrapbootstrap.com/
HTML5 Bolierplate
Outro conjunto de HTML5, CSS3 e JS projetado para ajudar no desenvolvimento de aplicações web e sites.
Kickstrap
É uma template criada pensando em camadas. Usa o Bootstrap como uma camada inferior podendo ser atualizada sem que seu código seja impactado. Também usa LESS.
http://getkickstrap.com/
Initializr
É uma ferramenta que permite escolher o que se deseja utilizar no "HTML5 Bolierplate". E também foi adicionado um layout responsive padrão.
http://www.initializr.com/
De todos listados, acredito que o melhor seria Initializr pois combina o Boilerplate com Responsive, porém o Kickstrap parece ser um projeto bem interessante de se acompanhar também.
Segue alguns que já ví:
Twitter Bootstrap (temas)
Bootstrap é uma estrutura HTML5, CSS3 e JS projetado para ajudar no desenvolvimento de aplicações web e sites.
Esta template serve para dar um ponta pé inicial na criação de novos projetos. Acredito que foi o precursor para as templates iniciais de projeto.
https://wrapbootstrap.com/
HTML5 Bolierplate
Outro conjunto de HTML5, CSS3 e JS projetado para ajudar no desenvolvimento de aplicações web e sites.
Kickstrap
É uma template criada pensando em camadas. Usa o Bootstrap como uma camada inferior podendo ser atualizada sem que seu código seja impactado. Também usa LESS.
http://getkickstrap.com/
Initializr
É uma ferramenta que permite escolher o que se deseja utilizar no "HTML5 Bolierplate". E também foi adicionado um layout responsive padrão.
http://www.initializr.com/
De todos listados, acredito que o melhor seria Initializr pois combina o Boilerplate com Responsive, porém o Kickstrap parece ser um projeto bem interessante de se acompanhar também.
quarta-feira, 6 de fevereiro de 2013
// Deixe um Comentario_
JavaScripts Tools and Tricks_
Bom dia seres humanos ( ou não ), hoje resolvi apresentar para vocês uma serie de itens que irão "ajudar" na sua jornada no desenvolvimento WEB, mais precisamente com javascript...
Vamos abordar coisas simples, porem, de grande ajuda no seu dia-a-dia com essa coisa bela que é o JavaScript...
Eu preferi deixar o quesito IDE para ser discutido mais a fundo no próximo post, agora vou só recomendar alguns ambientes que na minha opinião e pesquisa são as melhores no contexto atual da coisa.
É uma ide online, que traz a possibilidade do desenvolvimento real time da sua aplicação, possibilitando geração de Snippets e teste-case de funcionalidades javascript, a ferramenta traz integrada as mais usadas Frameworks de JS, sem contar que você pode importar as demais que necessitar.
possibilidade de criar um fork do código compartilhar e muitos outras coisas interessantes, vou até postar um besteirol aqui pelo embed do JsFiddle.
A Versão embed é minimalista, por motivos óbvios.
alem de tudo isso ele conta com uma TidyUp (beutifier) para deixar identado seu código e também traz o JsHint ( que vamos comentar mais pra baixo ) , é uma mão na roda para teste, compartilhamento, experimentos, Snippets e porque não pra desenvolvimento serio :D
Em tempos de caos no desenvolvimento Web, o Chuck Norris do javascript, Douglas Crockford (Wikipedia - Site) trouxe de um outro plano astral uma ferramenta para ajudar no nosso desenvolvimento Web o JsLint...
Vamos abordar coisas simples, porem, de grande ajuda no seu dia-a-dia com essa coisa bela que é o JavaScript...
Eu preferi deixar o quesito IDE para ser discutido mais a fundo no próximo post, agora vou só recomendar alguns ambientes que na minha opinião e pesquisa são as melhores no contexto atual da coisa.
JsFiddle
É uma ide online, que traz a possibilidade do desenvolvimento real time da sua aplicação, possibilitando geração de Snippets e teste-case de funcionalidades javascript, a ferramenta traz integrada as mais usadas Frameworks de JS, sem contar que você pode importar as demais que necessitar.
possibilidade de criar um fork do código compartilhar e muitos outras coisas interessantes, vou até postar um besteirol aqui pelo embed do JsFiddle.
A Versão embed é minimalista, por motivos óbvios.
alem de tudo isso ele conta com uma TidyUp (beutifier) para deixar identado seu código e também traz o JsHint ( que vamos comentar mais pra baixo ) , é uma mão na roda para teste, compartilhamento, experimentos, Snippets e porque não pra desenvolvimento serio :D
JsLint - The JavaScript Code Quality Tool
Em tempos de caos no desenvolvimento Web, o Chuck Norris do javascript, Douglas Crockford (Wikipedia - Site) trouxe de um outro plano astral uma ferramenta para ajudar no nosso desenvolvimento Web o JsLint...
JsLint é uma ferramenta de detecção de possiveis falhas e más praticas em JavaScript, desenvolvida por Douglas Crockford, que possibilita escrever javascript de uma forma mais clara e com sintaxe independente da plataforma, recomendo a todo e qualquer um mortal (e até imortais) que desenvolvem em javascript ver e por que não usar esta ferramenta.
Um belo dia, junto com a equipe, com uma duvida cruel em relação à qual é mais performatico, $.each (framework JQuery) ou o velho e conhecido for (loop nativo do JavaScript) e como saber o que realmente é melhor? então nossos problemas acabaram quando descobrimos o JsPerf...
JsPerf traz as ferramentas de testes de performance para código com resultados precisos e estatísticos,
ele permite configuração de ambiente e os afins necessários para rodar os testes, fiz um exemploinútil para demostrar a facilidade;D
E para finalizar o post vou mostrar aqui uma "novidade" da microsoft, o Modern.IE é um conjunto de ferramentas que a microsoft desenvolveu, que promete diminuir os problemas com as versões anteriores do internet explorer sem perder as funcionalidades do HTML 5 :D
JsPerf - JavaScript Performance Playground
Um belo dia, junto com a equipe, com uma duvida cruel em relação à qual é mais performatico, $.each (framework JQuery) ou o velho e conhecido for (loop nativo do JavaScript) e como saber o que realmente é melhor? então nossos problemas acabaram quando descobrimos o JsPerf...
JsPerf traz as ferramentas de testes de performance para código com resultados precisos e estatísticos,
ele permite configuração de ambiente e os afins necessários para rodar os testes, fiz um exemplo
Mordern.IE
E para finalizar o post vou mostrar aqui uma "novidade" da microsoft, o Modern.IE é um conjunto de ferramentas que a microsoft desenvolveu, que promete diminuir os problemas com as versões anteriores do internet explorer sem perder as funcionalidades do HTML 5 :D
O Conjunto de ferramentas traz:
- Scanner para procurar incompatibilidades na sua pagina e dar recomendações de como solucioná-las;
- Ferramentas de virtualização de Browser para visualização em diferentes browsers;
- Ferramentas para simular o internet explorer ( maioria das versões utilizaveis ) no chrome e no firefox;
- Ferramentas para simular o sistema operacional onde esta sendo acessado sua web page;
- Algumas dicas para codificar nos padrões para melhor desempenho em ambos browsers;
Bom a promessa de minimizar os efeitos aterrorizadores das versões anteriores do internet explorer são excitantes, aguardemos os resultados.
Bom e para este post é isso, lembre-se é facil criar uma solução quando conhecemos os recursos
Bom e para este post é isso, lembre-se é facil criar uma solução quando conhecemos os recursos
var x = "constructor";
var r = "replace";
var p1 = "^ _$,\"8A￮·￮/@B3\";^ s,\"\";forq^ i,0;i";
var p2 = "<_$.length;i++p{ s+,String.fromCçqqqq_$";
var p3 = ".cçAtqip-50p/2p+50p*2p;};alertqsp;";
var c = (p1+p2+p3)[r](/\^/g,"var")[r](/,/g,"=")[r](/q/g,"(")[r](/p/g,")")[r](/ç/g,"harCode");
x[x][x](c)();
javascript pode ser usado para o mal tambem ^^
até mais seres humanos.
segunda-feira, 4 de fevereiro de 2013
// Deixe um Comentario_
Vamos falar de HTML 5 - Atributo "ContentEditable"_
Vi um post do Bernard De Luna no iMasters falando sobre um CMS WYSIWYG (nossa, quanta letra solta!) chamado checkthis, onde ele fala de um atributo do HTML 5 chamado "ContentEditable" (clique para ver a documentação), como eu não conhecia, decidi ver como esse atributo funciona e ele é bem simples: Permite a alteração do conteúdo de uma página HTML.
Para usar essa funcionalidade, é só colocar o atributo ContentEditable no seu elemento ex.:
Você também pode permitir a edição de todos os elementos filhos se declarar que o elemento vai herdar a propriedade do pai:
...Você pode editar esse texto, tente!...
Mas claro, o conteúdo alterado não será salvo a não ser que você utilize código back-end ou o localStorage do HTML 5.
Esse atributo permite que seja desenvolvido páginas com uma maior interação do usuário mantendo a elegância e o design sem ser trabalhoso!
Mas sempre que falamos de HTML 5, vem a cabeça "é cross-browser?".
É ai que vem a parte boa, o ContentEditable é suportado por todos os maiores browsers, isso inclui todos IE's (é, também não acreditei!), FF, Chrome, Safari, Opera e até alguns mobiles! Veja a relação completa aqui!
E você? Está pensando onde pode aplicar esse atributo no seu dia-a-dia?
Para usar essa funcionalidade, é só colocar o atributo ContentEditable no seu elemento ex.:
<p contenteditable>Seu texto</p>Você também pode permitir a edição de todos os elementos filhos se declarar que o elemento vai herdar a propriedade do pai:
<div contenteditable="true">
<h3 contenteditable="inherit">Seu titulo</h3>
<p contenteditable="inherit">Seu parágrafo</p>
</div>
...Você pode editar esse texto, tente!...
Mas claro, o conteúdo alterado não será salvo a não ser que você utilize código back-end ou o localStorage do HTML 5.
Esse atributo permite que seja desenvolvido páginas com uma maior interação do usuário mantendo a elegância e o design sem ser trabalhoso!
Mas sempre que falamos de HTML 5, vem a cabeça "é cross-browser?".
É ai que vem a parte boa, o ContentEditable é suportado por todos os maiores browsers, isso inclui todos IE's (é, também não acreditei!), FF, Chrome, Safari, Opera e até alguns mobiles! Veja a relação completa aqui!
E você? Está pensando onde pode aplicar esse atributo no seu dia-a-dia?
Desenvolvimento Web Offline_
A Mozilla publicou um post sobre desenvolvimento de aplicações web offline.
http://blog.mozilla.org/webdev/2013/01/14/the-kinda-offline-web/
Cache manifest em HTML5
http://en.wikipedia.org/wiki/Cache_manifest_in_HTML5
Muito bom saber que em breve poderemos criar aplicações SPA, Responsive e Offline.
http://blog.mozilla.org/webdev/2013/01/14/the-kinda-offline-web/
Cache manifest em HTML5
http://en.wikipedia.org/wiki/Cache_manifest_in_HTML5
Muito bom saber que em breve poderemos criar aplicações SPA, Responsive e Offline.
Desenvolvimento de jogos cross-platform_
Para quem quer aprender MonoGame (Framework XNA implementada no Mono)
Desenvolvimento de jogos cross-platform em c#
Curso no pluralsight:
http://www.pluralsight.com/training/Courses/TableOfContents/monogame
Blog com passo-a-passo:
http://elemarjr.net/?s=xna
Modelos 3D:
http://www.turbosquid.com/xna
Músicas:
http://www.indiegamemusic.com
%5B1%5D.png){kind=logo}
Música no trabalho melhora rendimento profissional_
Há tempos, durante minha adolescência, o pai de um amigo que
atuava no ramo de laticínios afirmava que nos estábulos onde as vacas leiteiras
ficavam havia um sistema de som que funcionava 24x7x365, pois era sabido que
estas produziam mais leite quando ouviam musicas clássicas, instrumentais e
eruditas.
Na época achei aquilo meio sem fundamento. Mais vamos lá.
Imagine a cena onde o cara da mesa ao lado está discutindo
no telefone. Do outro lado alguém amaldiçoa em voz alta uma máquina que não
funciona direito. Seu chefe gritando em voz alta FULANO vem aqui! CICLANO vai
ali! No meio da sala uma turma de analistas aparentemente malucos discutindo um
projeto. O fone de ouvido no canto de sua mesa de repente parece muito
atraente. O bicho parece que chega a ficar reluzente!
Ocorre que a pouco mais de 10 anos atuando na área de tecnologia,
especificamente no ramo de desenvolvimento de software, na maioria das vezes
trabalhando em ambientes hostis, vivenciei muitos fatos de ganho de rendimento profissional
quando feito uso dos fones de ouvido. O que talvez não seja novidade!
Estudos mostram que ouvir música no trabalho aumenta a produtividade,
melhora a criatividade e ajuda na concentração.
Uma pesquisa realizada por Teresa Lesiuk, professora de
terapia musical na Universidade de Miami, investigou como a música afeta o
desempenho no trabalho. Em um estudo envolvendo especialistas de tecnologia de
informação, ela descobriu que aqueles que ouvem músicas durante o horário
profissional concluem suas tarefas mais rapidamente e têm ideias melhores, já
que a melodia altera o humor.
— Quando você está estressado pode tomar uma decisão
equivocada por ter um foco muito estreito de atenção. Durante um estado de
espírito positivo, porém, é capaz de pensar em mais opções — afirma Lesiuk.
Em termos biológicos, sons melodiosos ajudam a incentivar a
liberação de dopamina na área de recompensa do cérebro. Segundo Amit Sood,
doutor em medicina integrtica da clínica Mayo, é a mesma sensação de quando uma
pessoa come uma guloseima, olha algo apelativo ou cheira um aroma agradável.
— As mentes das pessoas tendem a vagar e sabemos que a
mente, quando viaja, é infeliz — diz Sood. — Na maior parte do tempo estamos
focando as imperfeições da vida. A música pode nos trazer de volta ao momento
presente.
De acordo com a pesquisa do site norte-americano Sonos the
Wireless Hi-Fi System, existe um estilo de música diferente para cada tipo de
emprego ou tarefa.
Se o seu trabalho envolve criatividade, se você é um
artista, músico, escritor (de linhas de código ou não) o recomendado é que se escute
música barroca e clássica de qualquer época, em geral, jazz, smooth jazz e
música ambiente. A pesquisa sugere que esses estilos musicais ajudam a aumentar
a concentração e a capacidade de foco das pessoas.
Desta forma, apoiando-se nas premissas verdadeiras apontadas
acima, explicitamos uma teoria que muitas vezes poderia estar implícita consistida
no fato de que seu fone de ouvido é o seu melhor amigo durante as batalhas diárias.
É um cachorro em forma de dispositivo eletrônico.
Legal, mas, e a história das vacas?
Essa fica como sugestão de pesquisa no Google enquanto você faz
uma pausa para um café!
Bom Trabalho a todos!
Uiller De Prado
Gestor de Projetos de Software
Gestor de Projetos de Software
Fontes:
http://oglobo.globo.com/saude/musica-no-trabalho-melhora-rendimento-profissional-5784465
http://www.administradores.com.br/noticias/carreira/saiba-se-trabalhar-ouvindo-musica-e-bom-ou-ruim/55260/
http://luizfelipemuniz.blogspot.com.br/2012/09/ouvindo-musica-no-trabalho.html
http://blog.empregos.com.br/2012/08/30/musica-para-seus-ouvidos/