Busca

Aprenda a utilizar Blazor e C# para consumir APIs e crie um termômetro CSS visualmente interessante Neste tutorial prático, você aprenderá a consumir uma API de temperatura (Weather API) utilizando Blazor com C# e criar um termômetro dinâmico usando CSS. Vamos explorar desde o consumo de dados de uma API até a implementação de um layout interativo **O que você vai aprender:** - Utilizar uma API Key no Weather API - Configuração inicial e criação de um projeto Blazor - Consumir informações da API utilizando HTTPClient - Manipulação de JSON e mapeamento de dados - Estruturação de um termômetro usando HTML e CSS - Como alterar dinamicamente a cidade de interesse e atualizar a interface ⚠️ ENTRE NA NOSSA COMUNIDADE DO DISCORD **Índice de Capítulos:** - [00:00:00] Apresentação do Blazor e a API Weather (API Explorer e os Endpoints) - [00:03:44] Criação do Projeto Blazor - [00:04:25] Seleção de Template (Workloads) e Estruturação do Projeto - [00:09:18] Compilação e Execução Inicial do Projeto - [00:13:00] Implementando o Consumo da API com HttpClient (OnInitializeAsync) - [00:16:04] Manipulando JSON e Utilizando Models / DTOs - [00:17:26] Transformando Dados em Informações Tipadas (JsonPropertyName) - [00:21:17] Binding e exibição de variáveis na página razor - [00:24:18] Trabalhando com Injeção de Dependência (DI) - [00:26:34] Trabalhando com CSS no Blazor (arquivo separado) - [00:32:46] Implementando Seleção Dinâmica de Cidade (HTML select, bind, onchange)

Neste tutorial, vamos dar continuidade ao projeto de lista de tarefas usando Blazor Server, perfeito para quem está iniciando na área de desenvolvimento web com tecnologias .NET. Abordaremos conceitos como Dependency Injection, Entity Framework, Migrations, Fluent API, páginas Razor, criação de componentes, e interação entre front e back-end de forma simples e prática. Curta o vídeo e inscreva-se no canal para não perder os próximos conteúdos! 00:00:00 - Introdução 00:04:20 - Configurando o Ambiente de Desenvolvimento 00:11:39 - Criação da Aplicação Blazor Server 00:21:11 - Extensões do VSCode para programar .Dotnet 00:22:58 - Explicação do Modelo de Dados (Models) 00:34:55 - Explicando namespaces 00:38:00 - Relacionamentos entre tabelas com Entity Framework 00:45:39 - Criando um Contexto com Entity Framework 00:55:41 - Validações usando a Fluent API com EF 00:58:34 - Seed de Dados Iniciais com Entity Framework 01:01:46 - Configurando Strings de Conexão para EF 01:04:39 - Dependency Inject do Contexto Entity Framework 01:07:11 - Migrations do Entity Framework 01:14:48 - Criando um Service para CRUD usando DI do Contexto EF 01:17:44 - Consulta (Query) usando Linq e o Contexto do EF 01:38:24 - Rotas e Páginas Razor no Blazor 01:41:10 - Desenvolvendo a Interface de Usuário (Razor e Bootstrap) 01:56:57 - Criando Componentes Reutilizáveis no Blazor 01:59:18 - Propriedades, Manipulação de Eventos e Data Binding no Blazor 02:11:14 - Injeção de Dependência (Dependency Injection) em Páginas Blazor 02:17:24 - Manipulação de Eventos e Data Binding no Blazor 02:19:24 - Operações de CRUD com Service e EF na Lista de Tarefas 02:28:25 - Atribuindo RenderMode InteractiveServer ao Componente 02:29:32 - Estilos Condicionalmente na página 02:39:00 - Dados iniciais da página Razor (OnInitializedAsync) 02:43:55 - Propriedades NotMapped (não mapeadas) no Model EF 02:47:39 - Ajustando a Ordenação com o Entity Framework

Descubra como implementar o BERT para previsão de palavras em sua aplicação utilizando C# e Blazor Neste vídeo, exploramos o uso do BERT da Google, um modelo de linguagem natural poderoso, para previsão de palavras. Vamos apresentar o funcionamento do modelo bert-base-uncased e suas aplicações práticas. Você aprenderá a utilizar este modelo em um aplicativo Blazor, descobrindo como prever palavras em frases incompletas e entender a metodologia de Masked Language Modeling (MLM). O BERT é conhecido por sua capacidade de ignorar distinções entre maiúsculas e minúsculas, tornando o processo de previsão mais eficiente. Durante o tutorial, abordaremos como buscar datasets de treino, entender as estruturas de request e response, e integrar o modelo em um projeto .NET Blazor. Ao seguir este guia passo a passo, você descobrirá formas criativas de aplicar a IA de linguagem natural em suas soluções de desenvolvimento de software. ## Capítulos do Vídeo - 00:00:00 - Localizando e Explorando o modelo bert-base-uncased - 00:08:04 - Testando o BERT no Huggingface - 00:10:22 - Gerando Access Token para o BERT no Huggingface - 00:11:39 - Criando uma aplicação Blazor (dotnet new blazor) - 00:13:27 - Definindo o RenderMode InteractiveServer - 00:14:12 - Definindo configurações no AppSettings.json - 00:15:44 - Extraindo a Base Url da API e o Request Json do Huggingface - 00:18:02 - Compilando e Executando Aplicação Blazor - 00:18:26 - Tipando o request usando o DTO com JsonPropertyName - 00:21:27 - Trabalhando a interface de usuário (UI) em Razor e Bootstrap - 00:22:10 - Criando o Binding em métodos e propriedades e o HTML/Razor - 00:25:11 - Injetando o HttpClient e criando o Request para o Inference Provider do Huggingface - 00:27:08 - Usando o IConfiguration para obter configuração de API Url e Api Key - 00:31:53 - Definindo permissões para a API do Huggingface - 00:32:54 - Tipando o Response da API do bert-base-uncased no Huggingface - 00:41:24 - Implementando tratamento de erros - 00:43:33 - Comentando sobre a cotas, planos e preços do Huggingface

Compartilhamos um tutorial detalhado sobre como criar animações em SVG usando .NET Blazor e C#. Você aprenderá a aplicar técnicas de animação para desenvolver barras de progresso dinâmicas e interativas em aplicativos Web, tendo como destaque a possibilidade de usar SVG em vez do tradicional canvas, oferecendo um resultado visualmente atraente e performático. Ao longo do vídeo, aprenderemos passo a passo a configurar um novo projeto Blazor, explorar a estrutura de arquivos do projeto, e adicionar animações em SVG ao HTML gerado. ### Índice de Capítulos 00:00 - Organização de projetos e criação da aplicação Blazor (dotnet new blazor) 03:30 - Configuração do ambiente Blazor e dicas de extensões para Visual Studio Code 04:32 - Estrutura inicial do projeto Blazor (template padrão Blazor e suas páginas) 05:17 - Compilação Inicial e .NET CLI (dotnet build) 05:49 - Comando dotnet watch para atualizações dinâmicas no navegador 10:04 - Declaração e Utilização de Variáveis 11:11 - Criação de estilos personalizados (CSS) do Blazor (Separação de layout) 14:34 - Utilização do evento onClick para manipular o valor de uma variável com fluxo condicional 15:11 - Render Modes no Blazor 21:12 - Implementação da barra de progresso com Bootstrap (dinamicamente) 25:29 - Animando SVG com substituição de valores fixos pelo valor dinâmico de variáveis

Nesse vídeo, iremos criar uma aplicação MVC básica (genérica) para acesso a um banco de dados usando ef com migrations, aprenderemos um pouco sobre configuration (settings) e strings de conexão, acessaremos o contexto do ef através de injeção de depedencia, criaremos mapeamento de rotas com controllers e views usando o aspnet-codegenerator para CRUD (listagem, inserção, atualização e exclusão) de registros.

Nessa dica básica iremos que criar, do zero, usando o template web, uma aplicação Mvc, entender a configuração de rotas e criar tasks no VSCode para compilação automática de styles escritos em SASS.

Neste tutorial, vamos nos aprofundar na criação de componentes no Blazor, uma poderosa ferramenta para desenvolvimento web com .NET. Este vídeo é ideal tanto para iniciantes que desejam entender a reatividade quanto para aqueles que estão um passo à frente e querem compreender a criação de componentes mais interativos. Aprenderemos a usar o Visual Studio Code para criar um projeto Blazor, utilizar perfis e extensões, e implementar um contador interativo que incorpora conceitos de gerenciamento de estado. Vamos também mostrar como configurar uma barra de progresso interativa e transformar todo o contador em um componente reutilizável. Além disso, abordaremos a organização do projeto e a estrutura dos arquivos relevantes para a aplicação Blazor. ### Índice de Capítulos - 00:00:00 Criando um Novo Projeto Blazor (dotnet new) - 00:02:38 Organizando Perfis do VS Code - 00:03:25 Estrutura de Pastas do Projeto Blazor - 00:06:10 Detalhes sobre o Arquivo program.cs - 00:07:33 Compilando e Executando a Aplicação (dotnet build e watch) - 00:10:04 Codificando a interface de usuário (UI) do arquivo razor - 00:12:09 Implementando Interatividade com um Contador - 00:12:34 Codificando Métodos, Variáveis e Eventos - 00:17:16 Definindo o Render Mode InteractiveServer (rendermode) - 00:19:18 Criando Lógica de Fluxo Condicional - 00:21:15 Implementando uma Barra de Progresso interativa (Bootstrap) - 00:24:55 Criando um Componente Reutilizável no Blazor - 00:27:50 Integração e Parametrização de Componente Blazor

Nesta aula, aprenderemos desde a criação de um simples "Hello World" até a utilização de modos de renderização em Blazor. Vamos abordar a interatividade, identificando como os diferentes render modes (InteractiveServer, InteractiveWebAssembly e InteractiveAuto) afetam sua aplicação. Entenda as nuances de cada modo de renderização. Durante o vídeo, também discutiremos como utilizar o .NET CLI para iniciar seus projetos e manter seu código organizado, além de práticas recomendáveis para desenvolvimento web. **Índice de Capítulos:** 00:00:00 - Criando um Projeto Blazor 00:03:36 - Estrutura de Arquivos do Projeto Blazor (HeadOutlet, Routes, appSettings, etc.) 00:09:35 - Compilando e executando Projeto Blazor (dotnet cli) 00:11:40 - Criando o Comportamento com Condicionais 00:15:36 - Iniciando com métodos, variáveis e eventos do Blazor 00:19:40 - Criando um Projeto Blazor no Visual Studio (diferentes render modes) 00:22:47 - Configurando componentes e rotas para diferentes render modes 00:25:08 - Trabalhando em Blazor sem Rende Modes (Static Server e form get/post) 00:25:52 - Introdução aos Blazor Render Modes (Static Server, InteractiveServer, InteractiveWebAssembly, InteractiveAuto) 00:32:10 - Trabalhando com Render Mode InteractiveServer (SSR) 00:34:37 - Trabalhando com Render Mode InteractiveWebAssembly (CSR) 00:38:27 - Trabalhando com Render Mode InteractiveAuto (SSR + CSR)

Playlist: https://www.youtube.com/playlist?list=PLZX7p4VzbEf-ro3otiL7WPdCYjMZyqNEX Neste tutorial, vamos dar continuidade ao projeto de lista de tarefas usando Blazor Server, perfeito para quem está iniciando na área de desenvolvimento web com tecnologias .NET. Abordaremos conceitos como Dependency Injection, Entity Framework, Migrations, Fluent API, páginas Razor, criação de componentes, e interação entre front e back-end de forma simples e prática. Curta o vídeo e inscreva-se no canal para não perder os próximos conteúdos! 00:00 - Manipulação de Eventos e Data Binding no Blazor 02:00 - Operações de CRUD com Service e EF na Lista de Tarefas 10:13 - Atribuindo RenderMode InteractiveServer ao Componente 11:48 - Estilos Condicionalmente na página 21:05 - Dados iniciais da página Razor (OnInitializedAsync) 26:05 - Propriedades NotMapped (não mapeadas) no Model EF 29:51 - Ajustando a Ordenação com o Entity Framework

Playlist: https://www.youtube.com/playlist?list=PLZX7p4VzbEf-ro3otiL7WPdCYjMZyqNEX Neste tutorial, vamos dar continuidade ao projeto de lista de tarefas usando Blazor Server, perfeito para quem está iniciando na área de desenvolvimento web com tecnologias .NET. Abordaremos conceitos como Dependency Injection, Entity Framework, Migrations, Fluent API, páginas Razor, criação de componentes, e interação entre front e back-end de forma simples e prática. Curta o vídeo e inscreva-se no canal para não perder os próximos conteúdos! 00:00 - Rotas e Páginas Razor no Blazor 03:46 - Desenvolvendo a Interface de Usuário (Razor e Bootstrap) 19:33 - Criando Componentes Reutilizáveis no Blazor 21:54 - Propriedades, Manipulação de Eventos e Data Binding no Blazor 34:40 - Injeção de Dependência (Dependency Injection) em Páginas Blazor (Razor)