• DecomRradio

    Com DecomRradio você pode ouvir diversas estações de rádio diretamente de seu computador, Tablets e Smartphone.

  • Dav7 QR Code

    Você pode reduzir ou Gerar e Scan códigos QR, digitalizar a partir do seu celular, compartilhar anunciar facilmente.

  • GdooLink Url Short

    Com GdooLink Você pode reduzir os URLs para facilitar o compartilhamento usando o nosso encurtador de URL.

  • DJ DBPE PLAY

    Dj Dbpe play é um Aplicativo de Media Player de Musica Totalmente na Web Nuvem..

  • DxconFont Icons

    Obtenha ícones vetoriais e logotipos sociais em seu site com o DxconFont Icons, o conjunto de ícones e ferramentas Gereciador de Font Incons.

Mostrando postagens com marcador Cursos-Tutorial. Mostrar todas as postagens
Mostrando postagens com marcador Cursos-Tutorial. Mostrar todas as postagens

terça-feira, 16 de janeiro de 2024

COMO CRIAR APLICATIVO GOOGLE MAPS NATIVO EM HTML5 CSS JS .(davidsonbpe)

Para criar um aplicativo que utiliza o Google Maps nativo usando HTML5, CSS e JavaScript, você pode seguir os passos básicos abaixo. Certifique-se de ter uma chave de API válida do Google Maps para autenticação. Se você ainda não tiver uma, pode obtê-la no Console de APIs do Google.

  1. Obtenha uma chave da API do Google Maps:

    • Acesse o Console de APIs do Google.
    • Crie um novo projeto ou selecione um projeto existente.
    • Ative a API do Google Maps JavaScript.
    • Crie uma chave da API e configure as restrições, se necessário.
  2. Crie a estrutura HTML básica:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Google Maps App</title>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        <div id="map"></div>
        <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
        <script src="app.js"></script>
    </body>
    </html>
    
  3. Estilize o mapa com CSS (opcional):

    body, html {
        height: 100%;
        margin: 0;
        padding: 0;
    }
    
    #map {
        height: 100%;
    }
    
  4. Crie o script JavaScript (app.js):

    function initMap() {
        // Coordenadas iniciais
        var myLatLng = { lat: -34.397, lng: 150.644 };
    
        // Opções do mapa
        var mapOptions = {
            center: myLatLng,
            zoom: 8,
        };
    
        // Crie o mapa
        var map = new google.maps.Map(document.getElementById("map"), mapOptions);
    
        // Adicione um marcador
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            title: "Hello World!",
        });
    }
    
  5. Substitua YOUR_API_KEY pela sua chave de API do Google Maps.

  6. Teste o aplicativo:

    • Abra o arquivo HTML em um navegador.

Este é um exemplo básico para começar. Você pode personalizar o mapa adicionando marcadores, linhas, polígonos e interatividade conforme necessário para atender aos requisitos do seu aplicativo. Consulte a documentação do Google Maps JavaScript API para mais informações e funcionalidades avançadas.

FONTE : YOUTUBE

CRIE IMAGENS INCRÍVEIS NO LEONARDO AI .(davidsonbpe)

CRIE IMAGENS INCRÍVEIS NO LEONARDO AI
Se você estiver se referindo ao mecanismo de inteligência artificial chamado "DALL-E" da OpenAI, que é conhecido por gerar imagens com base em descrições textuais, posso fornecer algumas informações gerais sobre como criar imagens incríveis com esse tipo de tecnologia.

Se "Leonardo AI" for uma ferramenta ou software específico que foi desenvolvido após a minha última atualização, recomendo verificar a documentação ou tutoriais fornecidos pela própria ferramenta para obter instruções detalhadas. Seja qual for a ferramenta, geralmente há um conjunto de etapas básicas que você pode seguir para criar imagens impressionantes:

  1. Acessar a Ferramenta:

    • Faça o login ou acesse a ferramenta "Leonardo AI" conforme as instruções fornecidas pelo desenvolvedor.
  2. Explorar Recursos:

    • Familiarize-se com os recursos oferecidos pela ferramenta. Isso pode incluir opções de manipulação de imagem, efeitos, filtros e outras funcionalidades.
  3. Carregar ou Descrever a Imagem Desejada:

    • Carregue uma imagem existente para edição ou descreva textualmente o que você deseja na imagem. Em algumas ferramentas, você pode fornecer instruções por meio de texto para gerar imagens.
  4. Ajustar Configurações:

    • Se a ferramenta permitir ajustes, experimente configurar diferentes parâmetros para obter o resultado desejado. Isso pode incluir ajustes de cor, contraste, brilho, entre outros.
  5. Experimentar com Recursos Criativos:

    • Explore os recursos criativos oferecidos pela ferramenta. Isso pode envolver a aplicação de efeitos especiais, sobreposição de camadas, manipulação de formas, entre outras opções.
  6. Salvar ou Exportar:

    • Após editar a imagem conforme desejado, salve ou exporte o resultado final para o seu dispositivo.

Lembre-se de que essas são instruções gerais, e a interface e os recursos específicos podem variar dependendo da ferramenta que você está usando. Se possível, consulte a documentação ou tutoriais específicos da ferramenta para obter informações mais detalhadas.
informações detalhadas e atualizadas: https://leonardo.ai/.

FONTE : YOUTUBE

VEJA COMO CRIAR APLICATIVO COM NW.JS .(davidsonbpe)

NW.js (anteriormente conhecido como Node-Webkit) é um framework que permite desenvolver aplicativos de desktop usando tecnologias web padrão, como HTML, CSS e JavaScript. Aqui estão os passos básicos para criar um aplicativo com NW.js:

  1. Instale o NW.js:

    • Faça o download do NW.js em https://nwjs.io/.
    • Extraia o arquivo zip para o local desejado em seu computador.
  2. Estrutura do Projeto:

    • Crie uma pasta para o seu projeto.
    • Dentro dessa pasta, crie um arquivo package.json. Este arquivo contém informações sobre o seu aplicativo.

    Exemplo de package.json:

    {
      "name": "MeuApp",
      "version": "1.0.0",
      "main": "index.html",
      "scripts": {
        "start": "nw ."
      },
      "node-remote": "http://*"
    }
    
    • Crie um arquivo HTML principal (por exemplo, index.html) que será carregado pelo NW.js.
  3. Desenvolvimento:

    • Desenvolva seu aplicativo usando HTML, CSS e JavaScript, como faria para uma aplicação web padrão.
    • Você pode acessar recursos do sistema operacional usando APIs específicas do NW.js.
  4. Recursos do NW.js:

    • NW.js fornece APIs para interagir com o sistema de arquivos, abrir janelas de navegação, acessar o sistema de arquivos, etc. Consulte a documentação do NW.js para mais detalhes: https://docs.nwjs.io/.
  5. Executar o Aplicativo:

    • Execute o aplicativo usando o comando especificado no arquivo package.json. No exemplo acima, o comando seria nw ..
  6. Empacotar o Aplicativo:

    • Quando seu aplicativo estiver pronto, você pode empacotá-lo para distribuição. O NW.js permite empacotar seu aplicativo para diferentes plataformas (Windows, macOS, Linux). Consulte a documentação para obter detalhes sobre como empacotar seu aplicativo.

Lembre-se de verificar a documentação oficial do NW.js para obter informações detalhadas e atualizadas: https://docs.nwjs.io/.

FONTE : YOUTUBE

COMO CRIAR APLICATIVOS EM PWA PROGRESSIVE WEB APP .(davidsonbpe)


Criar aplicativos em Progressive Web App (PWA) envolve o uso de tecnologias da web padrão, como HTML, CSS e JavaScript, juntamente com alguns conceitos específicos para PWAs. Aqui estão os passos básicos para criar um PWA:

  1. Estrutura do Projeto:

    • Crie a estrutura básica do seu projeto com arquivos HTML, CSS e JavaScript.
    • Certifique-se de ter uma estrutura que permita fácil navegação e interação, como faria em um site tradicional.
  2. Manifesto do Aplicativo (manifest.json):

    • Crie um arquivo manifest.json para descrever seu aplicativo.
    • Inclua informações como nome, ícone, tema de cores, etc.
    • Isso ajuda a tornar seu aplicativo instalável e fornece uma experiência mais "nativa".

    Exemplo de um manifesto básico:

    {
      "name": "Meu PWA",
      "short_name": "PWA",
      "description": "Um Progressive Web App de exemplo",
      "start_url": "/index.html",
      "display": "standalone",
      "background_color": "#ffffff",
      "theme_color": "#000000",
      "icons": [
        {
          "src": "/icon.png",
          "sizes": "192x192",
          "type": "image/png"
        }
      ]
    }
    
  3. Service Worker:

    • Crie um Service Worker para gerenciar a funcionalidade offline e melhorar o desempenho.
    • O Service Worker é um script JavaScript que é executado em segundo plano e pode interceptar solicitações de rede, cache de recursos e fornecer funcionalidades offline.

    Exemplo de um Service Worker básico:

    // service-worker.js
    self.addEventListener('install', (event) => {
      event.waitUntil(
        caches.open('my-cache').then((cache) => {
          return cache.addAll([
            '/',
            '/index.html',
            '/styles.css',
            '/script.js'
          ]);
        })
      );
    });
    
    self.addEventListener('fetch', (event) => {
      event.respondWith(
        caches.match(event.request).then((response) => {
          return response || fetch(event.request);
        })
      );
    });
    
  4. Registro do Service Worker:

    • Registre o Service Worker no seu arquivo HTML principal.

    Exemplo de registro do Service Worker:

    <!-- index.html -->
    <script>
      if ('serviceWorker' in navigator) {
        navigator.serviceWorker.register('/service-worker.js')
          .then((registration) => {
            console.log('Service Worker registrado com sucesso:', registration);
          })
          .catch((error) => {
            console.log('Erro no registro do Service Worker:', error);
          });
      }
    </script>
    
  5. Requisitos HTTPS:

    • PWAs exigem conexão segura (HTTPS) para garantir a integridade e segurança.
  6. Adicionar à Tela Inicial:

    • Incentive os usuários a adicionar seu PWA à tela inicial do dispositivo.
    <!-- Adicione o seguinte à sua página -->
    <link rel="manifest" href="/manifest.json">
    

    Isso permite que os usuários instalem o aplicativo diretamente da web.

  7. Teste e Ajuste:

    • Teste seu PWA em diferentes navegadores e dispositivos.
    • Ajuste o código conforme necessário para garantir uma experiência consistente.
  8. Atualizações Automáticas:

    • Implemente uma lógica no Service Worker para gerenciar atualizações automáticas do aplicativo.

Lembre-se de que este é um guia básico, e há muitos recursos e práticas avançadas para melhorar ainda mais a experiência do usuário em PWAs. Certifique-se de consultar a documentação oficial do PWA e manter-se atualizado com as melhores práticas.

FONTE : YOUTUBE

terça-feira, 24 de outubro de 2023

COM ESTE TUTORIAL VAMOS APRENDER A CRIAR MENU LATERAL SIDEBAR RESPONSIVO.(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR MENU LATERAL SIDEBAR RESPONSIVO NO BOOTSTRAP 5.


COMPONENTES:

See the Pen PLAY CODE by @davidsonbpe.

LINK BOOTSTRAP 5 : GETBOOTSTRAP.COM

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

BOOTSTRAP 5 COMO CRIAR MENU LATERAL SIDEBAR RESPONSIVO OFF-CANVAS .(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR MENU LATERAL SIDEBAR RESPONSIVO OFF-CANVAS BOOTSTRAP 5.


COMPONENTES:

See the Pen bootstrap 5 responsive sidebar by Davidson Bpe (@davidsonbpe) on CodePen.

LINK BOOTSTRAP 5 : GETBOOTSTRAP.COM

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

COMO CRIAR MENU LATERAL SIDEBAR RESPONSIVO COM PLUGIN OFFCANVAS NO BOOTSTRAP 5.(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR MENU LATERAL SIDEBAR RESPONSIVO COM PLUGIN OFFCANVAS NO BOOTSTRAP 5.

BYtxhJ4P43M

COMPONENTES:

zYdjabR

LINK BOOTSTRAP 5 : GETBOOTSTRAP.COM

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

quarta-feira, 2 de agosto de 2023

VEJA COMO CRIAR APLICATIVOS DESKTOP MULTI PLATAFORMA EM JAVASCRIPT, HTML E CSS COM ELECTRON.ATOM.IO (davidsonbpe)


COMO CRIAR APLICATIVOS DESKTOP MULTI PLATAFORMA EM JAVASCRIPT, HTML E CSS COM ELECTRON.ATOM.IO VEJA O VÍDEO ...


COMPONENTES:

LINK DO ELECTRON : ELECTRONJS.ORG

LINK DO PROJETOS : ELECTRON-QUICK-START

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/KVGREnZq

FONTE : YOUTUBE

TRANSFORME SEUS APLICATIVOS WEB APP EM PWA (PROGRESSIVE WEB APPS) (davidsonbpe)


COM ESTE TUTORIAL VAMOS TRANSFORMAR SEUS APLICATIVOS WEB APP EM PWA (PROGRESSIVE WEB APPS).


COMPONENTES:

LINK NETLIFY : NETLIFY.COM

LINK CÓDIGO GITHUB : DOWNLOADS

LINK VISUAL STUDIO CODE : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

quinta-feira, 16 de fevereiro de 2023

VEJA COMO FÁCIL ENCURTAR URL E COMPARTILHAR COM (GDOOLINK URL SHORT) (davidsonbpe)


VOCÊ PODE REDUZIR OS URLS PARA FACILITAR O COMPARTILHAMENTO USANDO O NOSSO ENCURTADOR DE URL...

COMPONENTES:

GDOOLINK URL SHORT : GDOOLINK.VERCEL.APP

STREAMING HD : FOXSOLUCOES.COM

CRIE SEU : https://db.tt/KVGREnZq

FONTE : YOUTUBE

COMO CRIAR APLICATIVO DE ALARM DESPERTADOR PARA SMARTPHONE NO APP INVENTOR (davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR APLICATIVO DE ALARM DESPERTADOR PARA SMARTPHONE NO APP INVENTOR.


COMPONENTES:

LINK APP INVENTOR : APPINVENTOR.MIT.EDU

LINK CÓDIGO E APK : DOWNLOADS

STREAMING HD : WWW.FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE


COMO CONVERTE SEUS PROJETOS WEB EM APLICATIVOS NATIVOS PARA SMARTPHONE COM VOLTBUILDER.(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR E CONVERTE SEUS PROJETOS WEB EM APLICATIVOS NATIVOS PARA SMARTPHONE COM VOLTBUILDER.


COMPONENTES:

LINK VOLTBUILDER : DOWNLOADS

CORDOVA-PACKAGE : DOWNLOADS

LINK VSC : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

sábado, 12 de fevereiro de 2022

COMO CRIAR APLICATIVOS NO PWABUILDER PARA SMARTPHONE EM MULTIPLATAFORMAS .(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR APLICATIVOS NO PWABUILDER PARA SMARTPHONE EM MULTIPLATAFORMAS.


COMPONENTES:

LINK PWABUILDER : DOWNLOADS

LINK CÓDIGO : DOWNLOADS

LINK NETLIFY : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

CONVERTA SEU SITE E GAME EM UM APLICATIVO NATIVO COM GONATIVE .(davidsonbpe)


ACEITAÇÃO GARANTIDA PELA APPLE APP STORE E GOOGLE PLAY STORE. DIGITE QUALQUER URL DO SITE PARA CRIAR UM APLICATIVO MÓVEL NATIVO PARA IOS E ANDROID...


O GONATIVE TEM SIDO USADO PARA CONSTRUIR MILHARES DE APLICATIVOS, INCLUINDO SALLEPLEYEL. VEJA MAIS EXEMPLOS...

COMPONENTES:

GONATIVE : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

CRIE SEU : https://db.tt/KVGREnZq

FONTE : YOUTUBE

COMO ESPELHAR A TELA DE SMARTPHONE E NOTEBOOK NA TVS SMART E BOX (davidsonbpe)


AIRSCREEN É O RECEPTOR DE STREAMING SEM FIO MAIS AVANÇADO PARA AIRPLAY, CAST, MIRACAST * E DLNA. ELE PODE PERMITIR QUE SEU DISPOSITIVO RECEBA ESPELHAMENTO DE TELA, FOTOS, MÚSICAS, VÍDEOS E OUTRAS MÍDIAS DE TELEFONES, TABLETS, LAPTOPS E MUITO MAIS VIA WI-FI OU ETHERNET, PERMITINDO QUE VOCÊ EXPERIMENTE A ALEGRIA DE COMPARTILHAR QUASE TUDO COM SUA FAMÍLIA E AMIGOS EM UM GRANDE TELA...


COMPONENTES:

LINK AIRSCREEN : DOWNLOADS

LINK GOOGLE HOME : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE


WEBSITE 2 APK VEJA COMO É SIMPLES TRANSFORMAR SEU HTML5 EM APK NATIVOS PARA ANDROID (davidsonbpe)


COM ESTE VÍDEO TUTORIAL VAMOS APRENDER A TRANSFORMAR SEU HTML5 EM APK NATIVOS PARA ANDROID COM WEBSITE 2 APK...


COMPONENTES:

Website 2 APK : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

CÓDIGO E APK : DOWNLOADS

LINK CRIE SEU : https://db.tt/KVGREnZq

FONTE : YOUTUBE

terça-feira, 8 de fevereiro de 2022

COMO CRIAR MENU LATERAL SIDEBAR RESPONSIVO EM BOOTSTRAP 5 (davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR UM MENU LATERAL SIDEBAR RESPONSIVO EM BOOTSTRAP 5.


COMPONENTES:

See the Pen Menu lateral Sidebar - Bootstrap 5 by Davidson Bpe (@davidsonbpe) on CodePen.

LINK BOOTSTRAP 5 : GETBOOTSTRAP.COM

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE


COMO CRIAR UM SERVIDOR HTTP LOCAL EM PYTHON SERVER.PY (davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR UM SERVIDOR HTTP LOCAL EM PYTHON SERVER.PY.


COMPONENTES:

BAIXAR PYTHON : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE

COMO CRIAR MENU LATERAL NAVBAR REVEAL LEFT EM BOOTSTRAP 5 .(davidsonbpe)

 

COM ESTE TUTORIAL VAMOS CRIAR MENU LATERAL NAVBAR REVEAL LEFT EM BOOTSTRAP 5...


COMPONENTES:


LINK BOOTSTRAP 5 : BOOTSTRAP.COM

STREAMING HD : FOXSOLUCOES.COM

LINK CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE


domingo, 6 de fevereiro de 2022

COMO CRIAR SUA PRÓPRIA NUVEM NEXTCLOUD EM DOCKER NO GOOGLE CLOUD SHELL.(davidsonbpe)


COM ESTE TUTORIAL VAMOS APRENDER A CRIAR SUA PRÓPRIA NUVEM NEXTCLOUD EM DOCKER NO GOOGLE CLOUD SHELL...


COMPONENTES:

LINK CLOUD SHELL : CLOUD.GOOGLE.COM

LINK NEXTCLOUD : DOWNLOADS

LINK HUB.DOCKER : DOWNLOADS

STREAMING HD : FOXSOLUCOES.COM

CRIE SEU : https://db.tt/IS1CEnZF

FONTE : YOUTUBE