Java, C/C++, Python, C#, LISP, AutoLisp, AutoCAD e VBA
PHP, Python, C#, JavaScript, Laravel, Google Ads e SEO

React.js ::: Dicas & Truques ::: Passos Iniciais

Aprenda a desenvolver aplicações React diretamente no HTML, sem usar a ferramenta create-react-app

Quantidade de visualizações: 1700 vezes
Embora seja recomendável usar a ferramenta create-react-app para criar suas aplicações React, às vezes gostaríamos de testar algumas idéias diretamente no código HTML, ou seja, sem precisar passar pelo processo "npx create-react-app" -> "npm start" -> "npm run build".

Tudo que temos que fazer é incluir três scripts, a saber, react.production.min.js, react-dom.production.min.js e babel.min.js. Estes scripts estão disponíveis para inclusão via CDN (o mais recomendado) ou você pode baixá-los para uso local, o que, com certeza, vai deixar o processo de desenvolvimento ainda mais rápido. Para obter os CDS ou fazer o download individual dos mesmos, basta pesquisá-los no Google por seus nomes.

Nesta dica eu optei por baixar os scripts e rodá-los a partir da minha máquina de desenvolvimento. Os dois primeiros scripts nos permitem escrever código React em nossos códigos JavaScript, e o terceiro, babel.min.js, nos permite usar a síntáxe JSX (JavaScript XML) e também dar suporte ao JavaScript ES6 para os navegadores mais antigos.

Então, vamos escrever código? Veja a listagem a seguir:

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<title>Estudos React</title>
  
<script src="js/react.production.min.js"></script>
<script src="js/react-dom.production.min.js"></script>
<script src="js/babel.min.js"></script> 
 
</head>
<body>

<h1>Primeira aplicação React direto no HTML</h1>
  
<div id="minha_app"></div>

<script type="text/babel">
  // vmaos criar um novo compomente React
  class Mensagem extends React.Component{
    render() {
      return <h1>Olá, bem-vindo(a) ao React!</h1>
    }
  };
 
  // vamos exibir o componente Mensagem na div minha_app
  ReactDOM.render(<Mensagem />, document.getElementById('minha_app'));
</script>

</body>
</html>

Ao abrir esta página no navegador teremos o seguinte resultado:

Primeira aplicação React direto no HTML
Olá, bem-vindo(a) ao React!

Pronto! Agora você pode testar idéias no React de forma bem rápida e fácil. Mas, lembre-se, em aplicações mais complexas, o uso da ferramenta create-react-app continua sendo o mais recomendado.


Delphi ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como usar arrays (vetores e matrizes) em Delphi

Quantidade de visualizações: 74227 vezes
Em programação de computadores, um array, também conhecido como vector (para arrays uni-dimensionais) ou matriz (para arrays bi-dimensionais), é uma das mais simples estruturas de dados. Os arrays mantêm uma série de elementos de dados, geralmente do mesmo tamanho e tipo de dados. Elementos individuais são acessados por sua posição no array. A posição é dada por um índice, também chamado de subscrição. O índice geralmente utiliza uma seqüência de números inteiros, (ao contrário de um array associativo) mas o índex pode ter qualquer valor ordinal. Alguns arrays são multi-dimensionais, significando que eles são indexados por um número fixo de números inteiros, por exemplo, por um seqüência (ou sucessão) finita de quatro números inteiros. Geralmente, arrays uni- e bi-dimensionais são os mais comuns.

Os arrays podem ser considerados como as estruturas de dado mais simples que é possível imaginar. Têm a vantagem de que os seus elementos são acessíveis de forma rápida, mas têm uma notável limitação: são de tamanho fixo, mas podem ser incrementados ou diminuídos com determinados algoritmos, geralmente envolvendo a cópia de elementos de um array para outro e reinicializando o original com a nova dimensão. Os vetores podem ser implementados desta forma.

Em Delphi um array é declarado da seguinte forma:

var
  valores: array[1..10] of Integer;

Aqui nós temos um array chamado valores que contém 10 elementos do tipo Integer. Estes elementos podem ser acessados por índices que variarão de 1 a 10, ou seja, podemos acessar o 5º elemento da seguinte forma:

procedure TForm1.Button1Click(Sender: TObject);
var
  valores: array[1..10] of Integer;
begin
  valores[5] := 20;
end;

Este tipo de array que ora criamos é chamado de array estático, em contraposição aos arrays dinâmicos, os quais podem ter seus tamanhos redimensionados durante a execução do programa.

A forma mais prática de se trabalhar com arrays em Delphi é usando laços. Veja:

procedure TForm1.Button1Click(Sender: TObject);
var
  valores: array[1..5] of Integer;
  i, soma: Integer;
begin
  // vamos preencher o array com os valores de 1 a 5
  for i := 1 to 5 do
    begin
      valores[i] := i;
    end;

  // vamos percorrer o array novamente e obter a soma dos
  // valores de seus elementos
  soma := 0;
  for i := 1 to 5 do
    begin
      soma := soma + valores[i];
    end;

  // vamos exibir o resultado
  ShowMessage('A soma dos valores é: ' + IntToStr(soma));
end;

Aqui nós declaramos um array de 5 elementos do tipo Integer e inicializamos seus elementos com os valores de 1 a 5. Em seguida percorremos todo o array novamente para obter a soma dos valores dos elementos.

É possível também declarar e já inicializar um array. Veja:

procedure TForm1.Button1Click(Sender: TObject);
const
  valores: array[1..5] of Integer = (3, 2, 6, 12, 9);
var
  i, soma: Integer;
begin
  // vamos percorrer o array novamente e obter a soma dos
  // valores de seus elementos
  soma := 0;
  for i := 1 to 5 do
    begin
      soma := soma + valores[i];
    end;

  // vamos exibir o resultado
  ShowMessage('A soma dos valores é: ' + IntToStr(soma));
end;

Note que aqui eu declarei o array como uma constante. Isso aconteceu porque o Delphi não permite que inicializemos variáveis locais ([DCC Error] Unit1.pas(32): E2195 Cannot initialize local variables). Caso você realmente precise do array como variável e não constante, e deseje inicializá-lo juntamente com a declaração, mova-o para a seção interface do formulário ou classe.

Para finalizar, veja que é possível criar arrays de todos os tipos em Delphi. Veja no trecho de código abaixo como usamos um array de Char para guardar uma palavra e exibí-la normal e depois invertida:

procedure TForm1.Button1Click(Sender: TObject);
const
  letras: array[1..5] of Char = ('O', 's', 'm', 'a', 'r');
var
  i: Integer;
  resultado: String;
begin
  resultado := '';

  // vamos exibir a palavra na forma normal
  for i := 1 to 5 do
    resultado := resultado + letras[i];

  // exibe o resultado
  ShowMessage(resultado);

  // vamos exibir a palavra invertida
  resultado := '';
  for i := 5 downto 1 do
    resultado := resultado + letras[i];

  // exibe o resultado
  ShowMessage(resultado);
end;

Para fins de compatibilidade, esta dica foi escrita usando Delphi 2009.


Java ::: Java para Engenharia ::: Unidades de Medida

Como converter Centímetros Cúbicos em Metros Cúbicos em Java - Java para Física e Engenharia

Quantidade de visualizações: 541 vezes
Em muitas situações nós temos uma medida de volume em cm3 e queremos transformá-la em m3, que é a medida de volume do Sistema Internacional (SI). Para isso só precisamos dividir os centímetros cúbicos por 1.000.000. Veja a fórmula:

\[\text{Metros Cúbicos} = \frac{\text{Centímetros Cúbidos}}{1.000.000} \]

Agora veja o código Java que pede para o usuário informar a medida de volume em centímetros cúbicos e a converte para metros cúbicos. Note que mostrei como exibir o resultado em notação científica e sem notação científica:

package estudos;

import java.util.Scanner;

public class Estudos {
  public static void main(String[] args) {
    // para ler a entrada do usuário
    Scanner entrada = new Scanner(System.in);
    
    // vamos ler a medida em centímetros cúbicos
    System.out.print("Informe os centímetros cúbicos: ");
    double cent_cubicos = Double.parseDouble(entrada.nextLine());
    
    // agora calculamos os metros cúbicos
    double met_cubicos = cent_cubicos / 1000000.00;
    
    // e mostramos o resultado
    System.out.println("Você informou " + cent_cubicos +
      " centímetros cúbicos.");
    System.out.println("Isso equivale a " + met_cubicos +
      " metros cúbicos.");
    System.out.printf("Sem notação científica: %f\n",
      met_cubicos);
  }
}

Ao executar este código Java nós teremos o seguinte resultado:

Informe os centímetros cúbicos: 35
Você informou 35.0 centímetros cúbicos.
Isso equivale a 3.5E-5 metros cúbicos.
Sem notação científica: 0,000035


JavaScript ::: Dicas & Truques ::: Formatação de datas, strings e números

Como exibir apenas dois dígitos após o ponto decimal em JavaScript usando a função toFixed() do objeto Number

Quantidade de visualizações: 13157 vezes
Nesta dica mostrarei como podemos usar a função toFixed() do objeto Number da linguagem JavaScript para convertermos um valor de ponto flutuante em uma string (em texto). Durante a conversão nós vamos especificar que queremos apenas dois dígitos depois do ponto decimal.

Veja o código JavaScript completo para o exemplo:

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
  charset=iso-8859-1" />
<title>Estudos JavaScript</title>
</head>
<body>
  
<script type="text/javascript">
  // vamos obter o valor de 
  // PI 3.141592653589793
  var valor = Math.PI;
  document.write("PI: " + valor);
  
  // agora vamos converter o valor de PI para
  // string e arredondar para o número de
  // decimais desejados
  var res = valor.toFixed(2);
  document.write("<br>Resultado: " + res);
</script>
   
</body>
</html>

Ao executar este código JavaScript nós teremos o seguinte resultado:

PI: 3.141592653589793
Resultado: 3.14


Nossas 20 dicas & truques de programação mais populares

Você também poderá gostar das dicas e truques de programação abaixo

Nossas 20 dicas & truques de programação mais recentes

Últimos Projetos e Códigos Fonte Liberados Para Apoiadores do Site

Últimos Exercícios Resolvidos

E-Books em PDF

E-Book 650 Dicas, Truques e Exercícios Resolvidos de Python - PDF com 1.200 páginas
Domine lógica de programação e a linguagem Python com o nosso E-Book 650 Dicas, Truques e Exercícios Exercícios de Python, para você estudar onde e quando quiser.

Este e-book contém dicas, truques e exercícios resolvidos abrangendo os tópicos: Python básico, matemática e estatística, banco de dados, programação dinâmica, strings e caracteres, entrada e saída, estruturas condicionais, vetores e matrizes, funções, laços, recursividade, internet, arquivos e diretórios, programação orientada a objetos e muito mais.
Ver Conteúdo do E-book
E-Book 350 Exercícios Resolvidos de Java - PDF com 500 páginas
Domine lógica de programação e a linguagem Java com o nosso E-Book 350 Exercícios Exercícios de Java, para você estudar onde e quando quiser.

Este e-book contém exercícios resolvidos abrangendo os tópicos: Java básico, matemática e estatística, programação dinâmica, strings e caracteres, entrada e saída, estruturas condicionais, vetores e matrizes, funções, laços, recursividade, internet, arquivos e diretórios, programação orientada a objetos e muito mais.
Ver Conteúdo do E-book

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: C
6º lugar: Delphi
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby


E-Book 350 Exercícios Resolvidos de Java - PDF com 500 páginas
Domine lógica de programação e a linguagem Java com o nosso E-Book 350 Exercícios Exercícios de Java, para você estudar onde e quando quiser. Este e-book contém exercícios resolvidos abrangendo os tópicos: Java básico, matemática e estatística, programação dinâmica, strings e caracteres, entrada e saída, estruturas condicionais, vetores e matrizes, funções, laços, recursividade, internet, arquivos e diretórios, programação orientada a objetos e muito mais.
Ver Conteúdo do E-book Apenas R$ 19,90


© 2025 Arquivo de Códigos - Todos os direitos reservados
Neste momento há 65 usuários muito felizes estudando em nosso site.