Artigos sobre desenvolvimento de sistema

Bootstrap 4, guia de referência com os elementos mais utilizados

Wed, 06 May 2020 15:59:04 +0000

Bootstrap é um framework web com código-fonte aberto para desenvolvimento de componentes de interface e front-end para sites e aplicações web usando HTML, CSS e JavaScript, baseado em modelos de design para a tipografia, melhorando a experiência do usuário em um site amigável e responsivo. O projeto foi originalmente desenvolvido pelo Twitter, pelos programadores Mark Otto e Jacó Thornton. A utilização do Bootstrap torna mais simples a tarefa de construir sites responsivos e com código mais facilmente legível, tornando a manutenção evolutiva e corretiva mais rápida. Para começar a usar o Bootstrap, tudo o que é necessário fazer é importar os arquivos CSSs e JSs para o seu projeto. Adicione a referência abaixo no cabeçalho do seu documento HTML: Insira também os arquivos JSs (Javascript), ao final do código, antes do fechamento do <body> Feito isso, sua página já está pronta para receber os primeiros códigos Bootstrap. Mas antes de partir para os exemplos e referências, é importante salientar que o Bootstrap possui um sistema de resoluções de tela. São eles: sm = 576 pxmd = 768 pxlg = 992 pxxl = 1200 px Confira a lista de recursos mais utilizados: 1 Margin & Padding2 Text Alignment3 Text Transforms4 Font Weight & Italics5 Fancy Heading Text6 Fancy Paragraph Text7 Text Colors8 Background Colors9 Display Properties10 Border-Radius11 Box Shadow12 Width & Height13 Buttons14 Cards & Cards Groups15 Carousel16 Collapse Content17 DropDown Content18 Forms19 Jumbotron20 Nav21 NavBar22 Grid System Margin & Padding Margin on all sides – .m .m-1 (margin: 4px;) .m-2 (margin: 8px;) .m-3 (margin: 16px;) .m-4 (margin: 24px;) .m-5 (margin: 48px;) Margin left – .ml .ml-1 (margin-left: 4px;) .ml-2 (margin-left: 8px;) .ml-3 (margin-left: 16px;) .ml-4 (margin-left: 24px;) .ml-5 (margin-left: 48px;) Margin right – .mr .mr-1 (margin-right: 4px;) .mr-2 (margin-right: 8px;) .mr-3 (margin-right: 16px;) .mr-4 (margin-right: 24px;) .mr-5 (margin-right: 48px;) Margin top – .mt .mt-1 (margin-top: 4px;) .mt-2 (margin-top: 8px;) .mt-3 (margin-top: 16px;) .mt-4 (margin-top: 24px;) .mt-5 (margin-top: 48px;) Margin bottom – .mb .mb-1 (margin-bottom: 4px;) .mb-2 (margin-bottom: 8px;) .mb-3 (margin-bottom: 16px;) .mb-4 (margin-bottom: 24px;) .mb-5 (margin-bottom: 48px;) Margin auto – .m-auto .m-auto (margin: auto;) Responsive Margin Example Screen sizes: extra small .ml-5 | small .ml-0 | medium .ml-5 | large .ml-0 | extra large .m-5 padding on all sides – .p .p-1 (padding: 4px;) .p-2 (padding: 8px;) .p-3 (padding: 16px;) .p-4 (padding: 24px;) .p-5 (padding: 48px;) padding left – .pl .pl-1 (padding-left: 4px;) .pl-2 (padding-left: 8px;) .pl-3 (padding-left: 16px;) .pl-4 (padding-left: 24px;) .pl-5 (padding-left: 48px;) padding right – .pr .pr-1 (padding-right: 4px;) .pr-2 (padding-right: 8px;) .pr-3 (padding-right: 16px;) .pr-4 (padding-right: 24px;) .pr-5 (padding-right: 48px;) padding top – .pt .pt-1 (padding-top: 4px;) .pt-2 (padding-top: 8px;) .pt-3 (padding-top: 16px;) .pt-4 (padding-top: 24px;) .pt-5 (padding-top: 48px;) padding bottom – .pb .pb-1 (padding-bottom: 4px;) .pb-2 (padding-bottom: 8px;) .pb-3 (padding-bottom: 16px;) .pb-4 (padding-bottom: 24px;) .pb-5 (padding-bottom: 48px;) Responsive padding Example Screen sizes: Extra small pl-5 | small pl-0 | medium pr-5 | large ml-0 | extra large p-5 Código de MARGIN & PADDING: Text Alignment .text-left (Left aligned text on all viewport sizes.) .text-center (Center aligned text on all viewport sizes.) .text-right (Right aligned text on all viewport sizes.) Responisve text alignment example .text-sm-left (Left aligned text on screens sized SM (small) or wider.) .text-md-right (Right aligned text on screens sized MD (medium) or wider.) .text-lg-right (Right aligned text on screens sized LG (large) or wider.) .text-xl-right (Right aligned text on screens sized XL (extra-large) or wider.) Código para Text Alignment Text transforms .text-lowercase (Lowercased text.) .text-uppercase (Uppercased text.) .text-capitalized (First letter of each word capitalized.) Código para TEXT TRANSFORMS Font weight & italics .font-weight-bold (Bold text.) .font-weight-normal (Normal weight text.) .font-weight-light (Light weight text.) .font-italic (Italic text.) Código para Font weight and italics Fancy heading text .display-1 .display-2 .display-3 .display-4 Código para Fancy Heading Text Fancy paragraph text normal paragraph – Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. .lead (Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor). Código para Fancy paragraph Text Text colors .text-primary .text-secondary .text-success .text-danger .text-warning .text-info .text-light .text-dark .text-body .text-muted .text-white .text-black-50 .text-white-50 Código para TEXT COLORS Background colors .bg-primary .bg-secondary .bg-success .bg-danger .bg-warning .bg-info .bg-light .bg-dark .bg-white .bg-transparent Código para BACKGROUND COLORS Display properties .d-inline .d-block .d-inline-block Responsive example – show extra small (default) – hide on small – show large – hide extra large .d-flex Flexbox – Direction .flex-row .flex-row .flex-row .flex-column .flex-column .flex-column Flexbox – Justify Content .justify-content-start .justify-content-end .justify-content-center .justify-content-between .justify-content-between .justify-content-around .justify-content-start Flexbox – Align Items .justify-content-start .justify-content-end .justify-content-center Learn more about other Flexbox Properties Código para Display property Border-radius .rounded-top (Border radius on top) .rounded-bottom (border radius on bottom) .rounded-left (radius left side) .rounded-right (border radius right side) .rounded (border radius all around) .rounded-cirlce Código para Border-radius Box Shadow .shadow-sm (Small shadow) .shadow (Regular shadow) .shadow-lg (Larger shadow) Código para Box Shadow Width & Height .w-25 (Width 25%) .w-50 (Width 50%) .w-75 (Width 75%) .w-100 (Width 100%) .w-auto (Width auto) .h-25 (Height 25%) .h-50 (Height 50%) .75 (Height 75%) .h-100 (Height 100%) .h-auto (Height auto) Código para width e Height Buttons .btn (default button styles) .btn .btn-link .btn .btn-outline-danger .btn .btn-sm (Large button) .btn .btn-lg (Large button) Button Groups .btn-group Left Middle Right Código para Buttons Cards & Card groups Card title This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer. Last updated 3 mins ago Card title This card has supporting text below as a natural lead-in to additional content. Last updated 3 mins ago Card title This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action. Last updated 3 mins ago Código para Cards Carousel Código para Carousel Collapse content Link with href Button with data-target Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Código para Collapse Dropdown content Dropdown link Action Another action Something else here Código para

O post Bootstrap 4, guia de referência com os elementos mais utilizados apareceu primeiro em Rotamáxima - Especialistas em resultados.

4 Maneiras básicas de melhorar o UX do seu site

Fri, 24 Apr 2020 17:05:15 +0000

O UX, User experience, que em português significa experiência do usuário, é o conjunto de elementos relativos à interação do usuário com um determinado produto, sistema ou serviço. Ainda hoje (2020) uma infinidade de sites, especialmente de pequenas empresas, pecam em problemas básicos e de fácil resolução. Com o objetivo de oferecer dicas de como melhorar a experiência do usuário em ambiente web, vamos sinalizar 4 oportunidades que podem estar passando despercebidas. Melhore a velocidade da página. Identifique os links clicáveis. Acabe com os error 404. Seja responsivo e amigável para dispositivos móveis. 1. Melhore a velocidade da página. Uma das experiências mais frustrantes para os usuários da web é esperar muito tempo para uma página carregar. Para testar a velocidade de uma página existem diversos recursos online, um deles é o Think With Google. O sistema analisa o desempenho completo do site imputado. Páginas com resposta menor do que 2 segundos de carregamento, são classificadas como bom desempenho. Outros sites de análise de velocidade como o Pingdom (https://tools.pingdom.com/), consideram 5 segundos como bom tempo de carregamento. Realize teste de velocidade para confirmar se o tempo de carregamento do seu site está atendendo a necessidade do seu usuário. Link para acesso ao teste do Think with Google : https://www.thinkwithgoogle.com/intl/pt-br/feature/testmysite/ 2. Identifique os links clicáveis. Quando você adiciona um link para qualquer página, a intenção é que o usuário interaja com ele. Certifique-se de que os links são facilmente identificáveis e que está clara a ação que o usuário deve tomar para acessar aquele conteúdo. Como exemplo para deixar essas ações claras ao usuário, é possível sublinhar o texto, alterar a cor do restante do conteúdo, colocar chamada de link ou colocar um botão. Quanto mais claro ao usuário qual ação deve fazer para obter o resultado esperado melhor será o desempenho do site. 3. Acabe com os erros 404s. O erro 404 condiz aos links de “página não encontrada”, esse erro também está na lista de grandes frustrações de um usuário. Quando um usuário clica em um link ou de uma imagem, ele espera que este link o leve para o próximo lugar que deseja ir. Ao lado do tempo de carregamento de página lenta, o erro 404s é outro evento altamente frustrante para um usuário e interrompe completamente sua jornada em todo o seu site. Para verificar existência de erros 404s, você pode configurar as ferramentas do Google Search Console (antigo Webmaster Tools) no site e verificar erros de rastreamento. 4. Seja responsivo e amigável para dispositivos móveis. As tecnologias avançam continuamente para atender às nossas necessidades de mobilidade. Sites também são uma parte significativa dessa evolução. É imprescindível que seu site seja amigável para dispositivos móveis e fácil de navegar, não importa o tipo de dispositivo que seus clientes estejam usando para acessá-lo. Recentesemente, o Google começou a penalizar sites que não são otimizados para dispositivos móveis, tornando a necessidade de resposta ainda mais crucial. Se você possui um site institucional básico e não sabe por onde começar a otimizá-lo, recomendamos olhar para esses 4 elementos em primeiro lugar.

O post 4 Maneiras básicas de melhorar o UX do seu site apareceu primeiro em Rotamáxima - Especialistas em resultados.

Universidade de Havard oferece curso de React gratuito

Wed, 22 Apr 2020 12:17:34 +0000

Harvard, uma das universidades mais importantes e conhecidas do mundo, está oferecendo curso de React gratuitamente. O React é uma biblioteca JavaScript de código aberto focado na interface do usuário, é utilizado em sites como Facebook, Netflix, Airbnb e vários outros. Muitas empresas vêm desenvolvendo aplicações web interativas com o React JS, devido aos seus recursos úteis e de fácil adaptabilidade. No relatório anual da Stack Overflow, site de recursos muito utilizado por desenvolvedores, o React aparece como uma das bibliotecas preferidas, sendo considerada a mais amada por 74,5%. Mapa das respostas do relatório Stack Overflow Linguagens mais utilizadas – O JavaScript aparece em destaque com 67,8% de adoção. O React contém javascript em sua “fórmula”. React.JS é o segundo Web “framework” mais utilizado, com 31,3% das respostas. React Native aparece como a 6ª biblioteca mais utilizada, com 10,5% das respostas. Dentre os desenvolvedores o React.JS é o web framework mais amado. Como indicado pelos gráficos acima, o React é muito popular, possui estrutura declarativa e é muito eficiente para construir interfaces para usuários de maneira flexível. Por que aprender React hoje? React JS tem sido usado extensivamente no Instagram, Netflix, PayPal, Apple, dentre outras plataformas importantes. Ele pode ser usado para produzir qualquer tipo de aplicações web, aplicativos móveis nativos e interfaces. React é uma das estruturas JavaScript mais populares, consolidando sua posição de liderança com rápido crescimento. É muito mais fácil aprender. Harvard O curso de Harvard sobre React está no site EDX. Esse curso sobre React é gratuito, caso queira o Certificado, é cobrada uma taxa no valor de $90 Dólares para a emissão. O curso é de nível intermediário e em inglês, focado no desenvolvimento para aplicações mobile em React Native. O que vai aprender neste curso : JavaScript ES6 React, JSX Components, Props, State, Style Components, Views, User Input Debugging Data Navigation Expo Components Redux Performance Shipping, Testing Não perca tempo e inscreva-se já na plataforma EDX. O link está logo abaixo: https://www.edx.org/course/cs50s-mobile-app-development-with-react-native

O post Universidade de Havard oferece curso de React gratuito apareceu primeiro em Rotamáxima - Especialistas em resultados.

3 frameworks para realizar testes automatizados para PHP

Mon, 20 Apr 2020 12:08:55 +0000

PHP é uma linguagem muito utilizada em desenvolvimento web e desenvolvimento de aplicativos web. Tanto no PHP quanto em demais linguagens são necessárias realizar testes para confirmar o funcionamento correto do seu sistema e aplicativo para que funcione perfeitamente com o seu usuários. Neste artigo vamos falar de sistemas para realizar os testes automatizados para seu sistema PHP. PHPUnit O PHPUnit é um ótimo framework de automação de testes para linguagem PHP. Assim como outras estruturas de automação de teste destinadas a testes unitários, o PHPUnit ajuda você no desenvolvimento de um bom código e de fácil manutenção, auxiliando na identificação de erros. Os problemas são detectados no início da fase de desenvolvimento, uma vez que os testes são realizados apenas por desenvolvedores. O teste unitário ajuda na detecção de problemas e na fixação do código em um determinado fragmento da aplicação, deixando assim outros fragmentos intactos e sem qualquer chance de quebra. A única desvantagem do PHPUnit é que, para testar múltiplas funções, o desenvolvedor é obrigado a adicionar anotações de cobertura. Caso altere o nome de um método ou função sem alterar as anotações de cobertura o teste será ignorado. Codeception O Codeception é um framework de testes automatizados com vários recursos além dos testes unitários mencionados no PHPUnit. A estrutura do Codeception é derivada do PHPUnit e tem capacidade de gerenciar testes funcionais, unitários e de aceitação para aplicativo web. Outra vantagem na utilização do Codeception são os casos de teste, é possível escrever os casos de teste facilmente e em linguagem php, reduzindo erros de sintaxe. Esse framework suporta várias estruturas sem que seja necessário instalar extensões ou realizar alterações no código, também é possível realizar buscas no banco de dados e limpar dados no módulo de testes DB. Você pode executar teste complexos usando localizadores XPath ou seletores CSS. Os serviços web REST e SOAP também podem ser testados com esse sistema. Como desvantagem esse sistema requer uma estrutura determinada para começar os testes e não é possível testar AJAX ou JavaScript. Selenium O sistema Selenium é a melhor estrutura para testes automatizados para navegadores, é um framework flexível e a versão mais recente do DriverWeb é executada em todos os principais navegadores perfeitamente. O framework suporta várias linguagens de programação, assim caso um dia seu sistema não seja mais em PHP ainda é possível utilizar esse framework para testes. O Selenium também possui a possibilidade de realizar vários testes paralelamente consumindo poucos recursos de hardware. Como desvantagem em comparação com os outros frameworks indicados o Selenium é mais complexo na criação dos casos de teste, levando mais tempo na elaboração e aprendizagem da ferramenta que os demais sistemas. Como é um sistema de código aberto não há suporte para problemas enfrentados no sistema. Existem diversos outros sistemas para realizar testes automatizados esses são alguns dos sistemas mais utilizados para testes para PHP.

O post 3 frameworks para realizar testes automatizados para PHP apareceu primeiro em Rotamáxima - Especialistas em resultados.

5 razões para desenvolver APPs com IONIC

Thu, 09 Apr 2020 16:04:30 +0000

Você está planejando desenvolver um aplicativo e está na dúvida entre fazê-lo nativo para Google, Apple ou em um sistema híbrido?Nesse artigo vamos falar um pouco sobre o framework IONIC, uma tecnologia híbrida de desenvolvimento que vai acelerar seus projetos. 1. Um código para todos Ionic é uma estrutura para desenvolver aplicativos multiplataforma para iOS, Android e Windows. Assim sendo, é possível projetar uma única programação principal para que o aplicativo rode em celulares com sistemas distintos. É naturalmente, uma grande vantagem (no que diz respeito a custos) em relação ao desenvolvimento de aplicativos nativos, onde se têm um projeto muito especializado para cada plataforma, necessitando programações individuais. Como por exemplo linguagem swift, utilizada no desenvolvimento de aplicação para IOS / Apple, dessa forma uma aplicação realizada em swift não opera em celulares com sistema Android. Comparado com Java ou Swift, o JavaScript, linguagem que é utilizada no IONIC, conhecida pela maioria dos desenvolvedores. 2. Fácil para iniciantes Se você já desenvolveu com JavaScript, você sabe que o desenvolvimento tende a sem bem rápido e fácil. O IONIC utiliza linguagem Javascript, além de poder contar com o HTML e outras linguagens. Ao contrário de Swift ou Java, não necessita de um construtor de interface especial dentro da IDE, com isso realizar os primeiros elementos e dar os primeiros passos de desenvolvimento é fácil. Depois de instalar o Ionic, você inicia um novo projeto baseado em um dos modelos iniciais iônicos e pode visualizar diretamente seu “aplicativo” dentro do seu navegador. 3. Componentes predefinidos O Ionic vem com estilo predefinido para diferentes componentes, de modo que os elementos que você pode usar vão parecer como nativos de outros sistemas como Android e IOS. Já possuir esses recursos predefinidos ajuda no desenvolvimento de um protótipo mais completo. 4. Linha de comando simples O Ionic vem com uma interface de linha de comando muito útil e de fácil utilização. Sempre que você precisar criar um novo projeto, criar pastas, compilar seu projeto para projetos nativos ou fazer outra alteração no seu projeto, você poderá realiza-lo pela CLI – linha de comando. 5. Redução nos custos do desenvolvimento do projeto do aplicativo Este é um argumento muito comum no debate sobre a utilização de frameworks híbridos. Em comparação com o desenvolvimento de 2 aplicativos separados para iOS e Android, sendo desenvolvidos, 2 repositórios, 2 resoluções de bugs e testes, ao utilizar um sistema híbrido como o IONIC é possível economizar tempo e problemas no desenvolvimento, sendo possível realizar todas as alterações em um único sistema, no mesmo código e na mesma linguagem. Com a utilização do sistema híbrido é possível analisar uma melhora em torno de 20 a 30% no tempo de desenvolvimento e implementação do aplicativo multi-plataforma.

O post 5 razões para desenvolver APPs com IONIC apareceu primeiro em Rotamáxima - Especialistas em resultados.

O que é e como funciona um sistema de split de pagamentos ?

Thu, 09 Apr 2020 15:28:34 +0000

Split de pagamento é o termo utilizado no mercado, especialmente em marketplaces, para a divisão de um único valor entre diferentes partes. Por exemplo, em um marketplace o cliente compra uma televisão da loja A, e um videogame da loja B. O marketplace deve então separar o valor a ser pago para cada uma das lojas, além de separar sua própria comissão. Tudo isso é feito de forma automática com base nas regras de negócios pré-definidas, dentro de uma única ordem de compra. Diversos estudos indicam que quanto mais opções de pagamento um comerciante oferecer, maior a probabilidade de ampliar as conversões em vendas, especialmente em ambiente online. Os sistemas de TI que lidam com transações financeiras processam essas transações como unidade atômica. Os sistemas financeiros concluem uma transação do começo ao fim; portanto, uma transação a seguir é um caso totalmente novo. A combinação das duas transações têm impacto nos custos, antifraude, obrigações de relatório e pode acabar com informações parciais armazenadas no sistema do comerciante. Veja abaixo algumas das principais empresas que oferecem soluções de Split de pagamentos: Pagar.mehttps://pagar.me Baseado na premissa de ser uma infraestrutura de pagamento, possuí um produto de Marketplace que é invisível para os sellers, sendo todo o gerenciamento feito pelo próprio Marketplace. O split do Pagar.me é feito na hora em que a transação é criada. Isso significa que são geradas n contas a pagar e n contas a receber na hora da criação da transação, onde parte do valor fica para o Marketplace e parte para o lojista. É possível determinar o percentual ou montante que é direcionado para cada um. Os pagamentos são feitos diretamente na conta do lojista, sem que o mesmo precise ter uma conta Pagar.me. Cada lojista será um recebedor distinto na sua conta, e receberá os pagamentos por este recebedor específico. PagSegurohttps://www.pagseguro.com.br O Split de pagamento está condicionado ao modelo de aplicações, ou seja, é necessário primeiro que seja criado uma aplicação na conta PagSeguro do primário, e que o seller autorize esta aplicação, todo o processo é detalhado na documentação do modelo de aplicações, a mesma pode ser acessada no link https://dev.pagseguro.uol.com.br/docs/modelo-de-aplicacoes. O split de pagamento também é condicionado a API de checkout transparente. PayPal https://www.paypal.com.br Para integrar o Marketplace com o PayPal é necessário utilizar duas APIs em sua integração: a API de Pagamento Direto (Direct Payment) e a API de Pagamento em Massa (Mass Payment). A primeira parte da integração é a API de pagamento direto, que é a forma padrão utilizada em sites que vendem pelo PayPal, que é o que faz com que o seu cliente selecione o PayPal como forma de pagamento e seja direcionado à nossa página de Ckeckout para finalizar o pedido. Para este tipo de integração é necessário utilizar o Express Checkout seguindo o guia através do link abaixo:https://www.paypal-brasil.com.br/desenvolvedores/tutorial/guia-de-integracao-rapida-usando-express-checko…

O post O que é e como funciona um sistema de split de pagamentos ? apareceu primeiro em Rotamáxima - Especialistas em resultados.

Top 5 razões para usar o framework LARAVEL PHP

Wed, 08 Apr 2020 18:19:07 +0000

A estrutura LARAVEL PHP vem ganhando muita popularidade entre os desenvolvedores, sendo destaque por diversas razões, aqui neste artigo vamos indicar top 5 razões para utilizar esse Framework. 1. Cuidado com o desenvolvedor Criadores do Laravel possuem uma filosofia muito forte na intenção de agradar e ajudar os desenvolvedores, tendo como premissa “Desenvolvedores Felizes fazem o melhor código”. A estrutura foi criada com a intenção de ser acessível e de fácil aprendizagem, mantendo-se flexível e capaz de executar as funções necessárias. 2. Segurança Entre os principais frameworks php o Laravel tem uma forte reputação de segurança. A estrutura já vem com muitas soluções de autenticação pré-configuradas com várias opções de configuração. As solicitações são protegidas por Tokens fáceis de implementar. 3. Motor de Template Blade Template é uma das partes mais apreciadas da estrutura Laravel. O motor leve permite que projetos e temas baseados em HTML sejam criados de forma eficiente e renderizados muito rápido. Ele comprime em código PHP simples que é armazenado em cache. Isso significa que ele basicamente não adiciona nenhuma sobrecarga ao sistema. 4. Popularidade Desde o lançamento Laravel vem crescendo em popularidade, sendo no repositório do Github o primeiro colocado, estando mais que o dobro de estrelas que o segundo colocado Symfony, no segmento de PHP. O alto nível de popularidade é um forte indício de qualidade da estrutura, mas também significa que há uma enorme quantidade de recursos de treinamento e apoio à comunidade. 5. Agilidade Poupar tempo e esforço é sempre uma proposta atraente aos desenvolvedores. A estrutura Laravel simplifica muitas tarefas comuns de projetos web, incluindo cache, roteamento, sessões e autenticação. A economia de tempo feita pode permitir que os desenvolvedores se concentrem nas partes mais intrigantes de um projeto e ajudem a alcançar o objetivo de tornar o processo de desenvolvimento mais eficiente.

O post Top 5 razões para usar o framework LARAVEL PHP apareceu primeiro em Rotamáxima - Especialistas em resultados.

Estrutura de controle no PHP: IF, Else, While, For, Foreach, Break, Continue, Switch, Require…

Wed, 08 Apr 2020 16:12:25 +0000

A linguagem PHP permite a implementação de diversas formas de controle de execução. É possível utilizar condicionais simples, como por exemplo. Se o valor de uma variavel for igual a verde, então execute um determinado bloco de código. <?php if ($cor == ‘verde’){ // execute parte do código; } ?> Veja abaixo as principais formas de controle do PHP. IF O que é: É um construtor responsável pela execução condicional de partes do código. Apenas se (if em inglês), determinada condição “for verdadeira” dentro de um contexto, o código será executado. exemplo: <?php // atribuindo o valor verde à variável cor$cor = ‘verde’; if ($cor == ‘verde’){echo ‘Condição verdadeira. A cor é verde’;}?> Else O que é: Utilizado em conjunto com o IF, indica a condição oposta da instrução. exemplo: <?php// atribuindo o valor verde à variável cor$cor = ‘verde‘; if ($cor == ‘verde‘){echo ‘Condição verdadeira. A cor é verde‘;}else{echo ‘Condição oposta ao if. A cor não é verde‘;}?> While O que é: Executa uma determinadas instruções “faz um laço”, enquanto a expressão for verdadeira. exemplo: <?php// atribuindo o valor à variável$i = 1; // enquanto a variável $i for menor do que 10, continue executando a instrução dentro do “laço”.while ($i < 10) { echo $i; // mostre o valor de $i; } O exemplo acima provavelmente travaria a aplicação, você sabe o motivo ? Observe que o laço é executando enquanto a variável $i for menor do que 10. Nesse exemplo, o laço sempre seria menor do que 10. Para resolver isso é necessário incrementar o valor de $i a cada vez que o código passa pelo laço. // enquanto a variável $i for menor do que 10, continue executando a instrução dentro do “laço”.while ($i < 10) { echo $i; // mostre o valor de $i; $i++; // ++ adiciona +1 ao valor da variável, dessa forma a cada passagem pelo laço o valor será incrementado.} ?> For O que é: São laços que utilizam 3 expressões, for (expr1; expr2; expr3). A primeira expressão é executada uma vez no início do laço. A expressão, de forma semelhando ao while, continua executando o bloco enquanto a condição for verdadeira. A expressão 3 é executada com parte final do laço, em geral representa um incremento. <?phpfor ($i = 1; $i <= 10; $i++) { echo $i;} ?> Foreach O que é: Funciona apenas para arrays e objetos. Exemplo: <?php foreach (array_expression as $value) statement foreach (array_expression as $key => $value) statement ?> Break O que é: Encerra a execução dos códigos for, foreach, while, do-while ou switch. Exemplo: <?phpfor ($i = 1; $i <= 10; $i++) { echo $i; if ($i == 2){ break; /// Neste exemplo o código será interrompido quando a valor de $i for igual a 2. }} ?> Continue O que é: Pula o restante da iteração atual a partir da linha em que estiver inserido, retorna ao inicio do laço. exemplo: <?phpfor ($i = 0; $i < 5; ++$i) { if ($i == 2) continue print “$i\n”;}?> Resultado experado: 0134 Switch O que é: Executa apenas o bloco que contiver equivalência à variável informada na condição. exemplo: <?php $i = 1 // Atribui o valor 1 à variável $i switch ($i) { case 0: echo “i é igual 0”; break; case 1: // executa esse trecho de código. echo “i é igual a 1”; break; case 2: echo “i é igual a 2”; break;} ?> Require O que é: Permite a inclusão de um bloco de código presente em outro arquivo. Funciona de forma semelhante ao Include, porém, exibe um erro fatal em tempo de execução. exemplo:<?phprequire(‘arquivoexterno.php’); ?>

O post Estrutura de controle no PHP: IF, Else, While, For, Foreach, Break, Continue, Switch, Require… apareceu primeiro em Rotamáxima - Especialistas em resultados.

Como desenvolver um aplicativo para celular?

Wed, 14 Aug 2019 18:51:11 +0000

Assim como tantas outras pessoas, você conta com aquela ideia de ouro para um de aplicativo em seu cérebro ? …mas você não tem ideia de como trazer isso tudo, assim como todo o potencial de lucro do seu app para a realidade ? Existem vários programas de criação de aplicativos pela internet que podem ajudá-lo a transformar sua visão em realidade. Com um bom planejamento e trabalho árduo de sua parte, o processo tem tudo para dar certo. Etapa 1: Defina uma meta. Afaste-se de qualquer forma de tecnologia, pegue uma caneta e papel e defina o objetivo principal do que você deseja realizar. A linha de partida quando se fala em desenvolvimento de aplicativos é nada mais nada menos do que caneta e papel. Não “mate” sua ideia já pensando em codificação e design complexos logo de cara. Faça as perguntas a si mesmo e então pense nas respostas: • O que exatamente você quer que seu aplicativo faça? • Como você vai apelar para os usuários aderirem ao seu app? • Que problema isso vai resolver? • Como isso simplificará a vida das pessoas? • Como você vai comercializar seu aplicativo (se for o caso)? Você não sobreviverá em nenhum negócio se não tiver metas bem definidas, ou melhor dizendo, claramente definidas! A falta de visão frustrará você e qualquer pessoa que você empregue para trabalhar em seu empreendimento. Antes de fazer qualquer coisa, crie uma imagem clara do que você quer fazer! Etapa 2: Crie painéis e desenhos de suas ideias. Não! Você ainda não consegue ligar o seu computador (kkk). Agora você precisa usar a caneta e o papel com as respostas às perguntas sobre o propósito de seus aplicativos para desenvolver um esboço de como será. Aqui você move suas ideias claramente expressas em representações visuais de seus pensamentos. Decida se você vai distribuir gratuitamente o seu aplicativo e oferecer anúncios para gerar dinheiro, ou oferecer como um download pago. Etapa 3: Pesquise, pesquise e pesquise ainda mais. Pesquisou? Pesquise mais um pouco. Agora você pode ligar seu computador, mas não para começar a criar seu aplicativo. O trabalho braçal está longe de ser feito. Você tem que cavar fundo e pesquisar a concorrência da sua ideia. Eu sei que você acha que tem uma ideia genuína, mas os números podem não estar a seu favor… é provável que alguém já tenha tentado algo semelhante. Caso alguém já tenha lançado “a sua ideia”, você pode ver isso de duas maneiras. Uma delas é considerar que não vale à pena e então desistir, ou dois, você pode examinar a concorrência e melhorar seu aplicativo. Eu prefiro o último, e se você está lendo até aqui, certamente também prefere. Leia os comentários da competição. O que as pessoas gostam / não gostam do aplicativo. Em seguida, use essa informação para sua linha de partida. Volte para a etapa da “caneta e do papel” e então ajuste suas ideia de acordo com os dados coletados. Veja bem, dessa forma, não estamos matando a sua ideia só por que já existe alguém que já lançou algo semelhante. Considere que se você já parte do pressuposto de que se já existe alguém rodando o que você tem em mente, sua ideia pode “morrer antes mesmo de ter nascido”. Depois de ler e modificar o seu esboço, sua pesquisa precisa mudar um pouco de foco. É hora de aproveitar o poder da Internet. Seu aplicativo é uma ideia realmente viável? Veja onde você examinará as restrições de direitos autorais e possíveis retenções técnicas. Este passo é crucial porque vai poupar dinheiro no longo prazo. Você não pode seguir em frente e gastar tempo com uma ideia que não vai funcionar. Descobrir todas as falhas e encontrar formas de contorná-las (observe que eu não disse desistir – “estamos falando apenas de uma dose de precaução”) para que você não precise voltar atrás. Em seguida, mude seu foco de pesquisa para vendas e marketing. Você precisa parar para pensar e refletir em cima de seu esboço sobre como você vai ganhar dinheiro com seu aplicativo. Você vai ficar com a sua ideia original ou vai mudá-la? Qual é o seu nicho? Você está fazendo marketing para adolescentes, pais, filhos, professores, viajantes, jogadores? Determine esse público-alvo imediatamente. Isso ajudará você a diminuir as ideias de design e facilitar as tomadas de decisão e foco. Depois de esgotar suas habilidades de previsão, você pode finalmente começar com as coisas divertidas. Comece a procurar ideias de design. Etapa 4: Wire o quê? Wireframe! No mundo da tecnologia, um wireframe é um storyboard glorificado. Aqui é onde você tira o seu esboço, sua ideia de design, e dá à sua imaginação um pouco mais de clareza e funcionalidade. Isso se tornará a base para o desenvolvimento de seus aplicativos. Há pilhas de sites de wireframes que você pode usar para ajudá-lo a levar seus esboços à vida digital com funcionalidades, como cliques e ícones. O truque é encontrar um que você goste e que seja fácil de usar.Se você não conhece nenhum site de wire, confira estas ferramentas de wireframing: • http://www.axure.com • https://balsamiq.com • http://pidoco.com/ • http://visio.microsoft.com/ • http://www.adobe.com/products/indesign.html • http://iplotz.com/ • https://evernote.com/penultimate/ • https://www.omnigroup.com/ • https://www.gliffy.com/ Etapa 5: Defina o back-end de seu aplicativo Nesse ponto do desenvolvimento você tem um “storyboard” de como o aplicativo deve funcionar. Agora é hora de usar esse “storyboard” para começar a examinar a funcionalidade. Serviços de back-end: • https://www.parse.com/ • http://www.applicasa.com/ • http://www.kinvey.com/ Etapa 6: Checando o Modelo (Não funcional) Aqui é onde você precisa aproveitar o feedback de seus amigos, colegas e contatos. Não perca tempo com pessoas que dirão: “Uau, isso é legal” (Portanto, isso pode excluir da sua pesquisa o seu pai e sua mãe certo ? Rs). Procure os sinceros e críticos. A honestidade brutal é crucial nesta fase. Não tenha medo de olhar por cima do ombro enquanto eles verificam sua demonstração para ver como eles navegam nas coisas. Se você

O post Como desenvolver um aplicativo para celular? apareceu primeiro em Rotamáxima - Especialistas em resultados.

O que é IONIC? Como desenvolver apps com IONIC?

Fri, 09 Aug 2019 13:56:59 +0000

Tradicionalmente, os aplicativos móveis são criados para duas plataformas principais – Android e iOS. Para criar aplicativos para a plataforma Android, um desenvolvedor de aplicativos precisa dominar a linguagem de programação chamada JAVA, conseguindo então criar aplicativos úteis com a ajuda do Android SDK. Já para a criação de aplicativos para a plataforma da Apple, iOS, é preciso que o desenvolvedor domine a linguagem de programação do Objective C e crie seu aplicativo com a ajuda do iOS SDK. O grande conflito da atualidade é que seus clientes dificilmente usarão telefones de apenas uma única plataforma. Certamente haverá um grupo dos que utilizam celular da plataforma Android e outro da plataforma iOS. Então, se você ou o seu negócio deseja atingir um público mais amplo, para cada aplicativo que você planeja desenvolver, você tem que essencialmente construir dois conjuntos de aplicativos – um em JAVA para Android e outro em Objective C para iOS. Esta é uma tarefa muito difícil e um tanto quanto trabalhosa, trata-se então de uma abordagem bastante ineficiente em relação ao desenvolvimento de aplicativos. Além disso, como sabemos as atualizações são sempre necessárias, e a cada vez que notar que algo não está rodando perfeitamente, você precisará fazer alterações em dois conjuntos diferentes de aplicativos. Você sentiu o dilema? Então você precisa conhecer o IONIC! O Ionic é um framework de desenvolvimento de software de código aberto (open source) desenvolvido para permitir a construção de aplicativos móveis híbridos. A estrutura iônica é construída com o AngularJS e o Apache Cordova. A estrutura fornece várias ferramentas e serviços que ajudam você a criar aplicativos móveis usando tecnologias populares da Web, como HTML5, CSS3 e Javascript. Como se não fosse o bastante e para aumentar ainda mais o poder do desenvolvimento de aplicativos, o Ionic incorpora o Typescript como a linguagem de programação base. Typescript é um super conjunto de javascript e, portanto, todos os códigos javascript podem ser usados confortavelmente no desenvolvimento de seu aplicativo híbrido com o kit Ionic. Se você trabalhou com qualquer linguagem de programação orientada a objetos, como PHP ou Java, você entenderá rapidamente o ambiente do Typescript e não será exigido um novo aprendizado da linguagem. A estrutura do Ionic permite que você crie interfaces de usuário móveis com aparência e comportamento nativos muito semelhantes aos aplicativos Android e iOS. O typescript permite que você escreva uma lógica complexa para processar dados do usuário para então fornecer uma boa experiência de usuário com muita interatividade. Além disso, o Ionic fornece todos os mecanismos para permitir que seu aplicativo se comunique com os principais sistemas em execução nos servidores da Internet. Você pode criar seus aplicativos para dispositivos móveis com as tecnologias acima e depois distribuí-los por meio das lojas de aplicativos do Google e da Apple. Além disso, ao precisar fazer uma atualização ou upgrade, você precisará trabalhar com um único código em uma única plataforma, nada de trabalho dobrado e ineficácia. O Conceito de Aplicativo Híbrido Um app híbrido é essencialmente como um site que é executado no shell do navegador dentro do aplicativo. Não confunda esse shell do navegador com navegadores padrão, como o Chrome ou o Safari, encontrados nos telefones celulars. Este shell do navegador é especial no sentido de que é construído para ter acesso à camada do sistema operacional (sistema operacional) nativo. É um shell de navegador de baixo nível, assim como o UIWebView (no iOS) ou o WebView (no Android), que é envolvido por uma tecnologia muito poderosa chamada Apache Cordova. O ambiente de desenvolvimento de aplicativos híbridos fornece suporte a múltiplas plataformas, já que ele lida com as nuances do SO subjacente específico – seja Android ou iOS. Como um desenvolvedor de aplicativos, você só grava as classes e códigos de nível superior que fazem chamadas para módulos incorporados de maneira genérica, sem se preocupar muito com o SO subjacente, seja ele Android ou iOS. A estrutura do Ionic, passará a partir de então, compilar seu aplicativo separadamente para as duas plataformas e incorporará automaticamente os códigos específicos da plataforma em seu aplicativo em desenvolvimento ou publicado. Desta maneira, a criação de aplicativos híbridos é uma abordagem muito mais eficiente sobre a criação de aplicativos nativos puros, acelerando, assim, a velocidade do desenvolvimento. Em termos de custo de desenvolvimento, também requer menos horas de trabalho (o que resulta em um menor custo) para construir um aplicativo híbrido vis-à-vis, criando dois aplicativos nativos separados (um para Android e outro para iOS). Observe também que um aplicativo do Ionic não é apenas um aplicativo de website responsivo. O Ionic fornece elementos e layouts de interface do usuário móvel de estilo nativo que você encontraria no SDK nativo no iOS ou Android. O wrapper subjacente que faz isso acontecer é chamado de Cordova. O resultado final é um aplicativo que ninguém pode dizer, apenas pela navegação, sem consultar diretamente o código, se foi construído de forma nativa ou sobre estrutura Ionic. Quando o projeto Ionic foi iniciado em 2013 (sim, 2013! Rs), seu único objetivo era fornecer uma maneira melhor para os desenvolvedores da Web capitalizarem seus conjuntos de habilidades existentes para a criação de aplicativos móveis. A jornada para o projeto Ionic foi bem-sucedida e, em um curto espaço de tempo (estamos falando de uma revolução em apenas 6 anos), o Ionic se tornou a estrutura de desenvolvimento de aplicativos mais popular do mundo. Milhares de desenvolvedores web foram atraídos para esta nova tecnologia e hoje o Ionic pode se orgulhar de mais de 1 milhão de aplicativos que foram construídos sobre esta plataforma. Como uma estrutura gratuita e de código aberto, o desenvolvimento pela plataforma Ionic conquistou os corações de desenvolvedores e empreendedores por causa de seu foco na funcionalidade. Aqui estão as principais razões pelas quais muitas pessoas preferem o Ionic em detrimento de outras: O desenvolvimento Ionic é baseado em flexibilidade! Escreva o código uma vez, execute em qualquer lugar… Desde o dia de sua chegada, Ionic teve o trabalho de desenvolver a

O post O que é IONIC? Como desenvolver apps com IONIC? apareceu primeiro em Rotamáxima - Especialistas em resultados.