mozilla

Revisão 330655 de Configurando seu ambiente de desenvolvimento

  • Slug da revisão: Apps/Tutorials/General/Configuring_your_development_environment
  • Título da revisão: Configurando seu ambiente de desenvolvimento
  • ID da revisão: 330655
  • Criado:
  • Criador: cstipkovic
  • É a revisão atual? Sim
  • Comentar

Conteúdo da revisão

Configurando seu ambiente de desenvolvimento

Antes de mergulhar na criação da sua aplicação web, você precisará certificar-se de que tem as ferramentas necessárias.

Editores de Texto

Um editor de texto solido é a ferramenta mais crucial. Existem vários editores de texto livres disponíveis, incluindo:

Multi-plataforma

Apenas Windows

Apenas Mac

Esta não é, evidentemente, uma lista completa.

Ferramentas do Desenvolvedor Web

Como seria de se esperar, teste e depuração da sua aplicação serão feitos através do navegador. Você vai querer adicionar algumas ferramentas de desenvolvimento úteis para o seu navegador. Estas ferramentas vão ajudar com tudo, desde a inspeção e estilos dos elementos visuais de seu aplicativo, até observar o tráfego de rede e depuração de JavaScript. Sugerimos que você encontre uma combinação de ferramentas que funcione para você, elas podem ser um salva-vidas.

Ferramentas para usuários do Firefox

O Firefox tem várias ferramentas para desenvolvedores embutidas; veja em Ferramentas->Web Developer submenu, aprenda mais sobre as ferramentas do Firefox para desenvolvedores, ou leia mais na página de Ferramentas no MDN. Aqui estão alguns add-ons úteis:

Ferramentas para usuários do Google Chrome

Recursos adicionais podem ser adicionados ao seu ambiente de desenvolvimento, conforme necessário, mas um editor de texto, navegador e ferramentas de desenvolvimento, poderão lhe ajudar durante a criação de uma aplicação web grande!

Fonte da revisão

<h2 id="Configurando_seu_ambiente_de_desenvolvimento">Configurando seu ambiente de desenvolvimento</h2>
<p>Antes de mergulhar na criação da sua aplicação web, você precisará certificar-se de que tem as ferramentas necessárias.</p>
<h3 id="Editores_de_Texto">Editores de Texto</h3>
<p>Um editor de texto solido é a ferramenta mais crucial. Existem vários editores de texto livres disponíveis, incluindo:</p>
<h4 id="Multi-plataforma">Multi-plataforma</h4>
<ul>
  <li><a class="external" href="http://jedit.org/">jEdit</a></li>
  <li><a class="external" href="http://www.gnu.org/software/emacs/" title="http://www.gnu.org/software/emacs/">Emacs</a></li>
  <li><a class="external" href="http://www.vim.org/" title="http://www.vim.org/">vim</a></li>
  <li><a class="external" href="http://www.activestate.com/komodo-edit" title="http://www.activestate.com/komodo-edit">Komodo Edit</a></li>
</ul>
<h4 id="Apenas_Windows">Apenas Windows</h4>
<ul>
  <li><a class="external" href="http://notepad-plus-plus.org/">Notepad++</a></li>
</ul>
<h4 id="Apenas_Mac">Apenas Mac</h4>
<ul>
  <li><a class="external" href="http://www.barebones.com/products/TextWrangler/" title="http://www.barebones.com/products/TextWrangler/">TextWrangler</a></li>
</ul>
<p>Esta não é, evidentemente, uma lista completa.</p>
<h3 id="Ferramentas_do_Desenvolvedor_Web">Ferramentas do Desenvolvedor Web</h3>
<p>Como seria de se esperar, teste e depuração da sua aplicação serão feitos através do navegador. Você vai querer adicionar algumas ferramentas de desenvolvimento úteis para o seu navegador. <span id="result_box" lang="pt"><span class="hps">Estas ferramentas vão</span> <span class="hps">ajudar com</span> <span class="hps">tudo, desde</span> <span class="hps">a inspeção e</span> <span class="hps">estilos dos elementos</span> <span class="hps">visuais de</span> <span class="hps">seu aplicativo</span><span>, até</span> <span class="hps">observar</span> <span class="hps">o tráfego de rede</span> <span class="hps">e depuração de</span> <span class="hps">JavaScript.</span></span> <span id="result_box" lang="pt"><span class="hps">Sugerimos que você</span> <span class="hps">encontre uma combinação de</span> <span class="hps">ferramentas que</span> <span class="hps">funcione para você,</span> elas <span class="hps">podem ser um</span> <span class="hps">salva-vidas</span></span>.</p>
<h4 id="Tools_for_Firefox_users">Ferramentas para usuários do Firefox</h4>
<p>O Firefox tem várias ferramentas para desenvolvedores embutidas; veja em Ferramentas-&gt;Web Developer submenu, aprenda mais sobre as <a class="external" href="http://www.mozilla.org/en-US/firefox/technology/#tools" title="http://www.mozilla.org/en-US/firefox/technology/#tools">ferramentas do Firefox para desenvolvedores</a>, ou leia mais na página de <a href="/en/Tools" title="https://developer.mozilla.org/en/Tools">Ferramentas</a> no MDN. <span id="result_box" lang="pt"><span class="hps">Aqui estão alguns</span> <span class="hps">add-ons úteis</span></span>:</p>
<ul>
  <li><a class="external" href="http://getfirebug.com/">Firebug</a></li>
  <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/collections/mozilla/webdeveloper/">Web Developer's Toolbox Collection</a></li>
  <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/web-developer/">Web Developer Toolbar</a></li>
  <li>Firepicker</li>
  <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/firecookie/">Firecookie</a></li>
  <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/user-agent-switcher/">User Agent Switcher</a></li>
  <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/colorzilla/">ColorZilla</a></li>
</ul>
<h4 id="Tools_for_Google_Chrome_users">Ferramentas para usuários do Google Chrome</h4>
<ul>
  <li>Web Inspector</li>
  <li><a class="link-https" href="https://chrome.google.com/webstore/detail/bfbameneiokkgbdmiekhjnmfkcnldhhm">Web Developer</a> Port oficial do plugin do Firefox</li>
  <li><a class="link-https" href="https://chrome.google.com/webstore/detail/gbkffbkamcejhkcaocmkdeiiccpmjfdi">Pendule</a></li>
</ul>
<p><span id="result_box" lang="pt"><span class="hps">Recursos adicionais podem ser</span> <span class="hps">adicionados ao seu</span> <span class="hps">ambiente de desenvolvimento</span><span>, conforme necessário</span><span>, mas</span> <span class="hps">um editor de texto</span><span>, navegador e</span> <span class="hps">ferramentas de desenvolvimento</span><span>, poderão lhe ajudar durante a </span><span class="hps">criação de</span> <span class="hps">uma aplicação web</span> <span class="hps">grande</span><span>!</span></span></p>
Reverter para esta revisão