filmov
tv
NextJS, TailwindCSS e Typescript: #24 - Começar curso flutuante no mobile
Показать описание
Facilitar o acesso ao conteúdo é essencial para uma experiência de usuário (UX) fluida e envolvente, especialmente em dispositivos móveis. Neste vídeo, vou mostrar como criar um componente flutuante de "Começar Curso" utilizando a biblioteca React Intersection Observer. Esse componente será fixado no canto da tela, garantindo que o botão "Começar Curso" esteja sempre visível para o usuário enquanto ele navega pela plataforma de cursos. Com essa abordagem, o início de um curso se torna mais acessível, o que pode aumentar o engajamento e a satisfação dos usuários. Vamos juntos implementar essa funcionalidade e tornar a navegação na sua plataforma ainda mais intuitiva e eficiente!
Links mencionados no vídeo:
Outros cursos no canal:
Livros recomendados:
Conteúdo:
0:00 | Introdução
0:25 | O que faremos nessa aula
1:30 | Entendendo o problema
4:10 | Identificar quando um elemento saiu da tela
7:30 | Instalando biblioteca auxiliar
15:30 | Criando o botão flutuante
22:30 | Ajustando novas props no componente
23:50 | Commit dos ajustes
24:35 | Finalização e agradecimentos
CODARSE - Criando a tela de detalhes de curso
#DesenvolvimentoWeb #Programação #DesenvolvimentoDeSoftware #AprenderProgramação #CursosOnline #TechTutoriais #YouTubeEducação #CodeNewbies #DesenvolvimentoFrontend #CodeWithMe #TecnologiaEducacional #WebDesign #DesenvolvimentoDeAplicativos #AprendaACodificar #TecnologiaDeFrontend #EducaçãoDigital #DesenvolvimentoDeApps #TutoriaisDeProgramação #CódigoCriativo #ProgramaçãoParaIniciantes #NextJS #typescript #javascript #tailwindcss #react #reactjs
0:24:45
NextJS, TailwindCSS e Typescript: #24 - Começar curso flutuante no mobile
5:55:35
Next.js 13 E-Commerce Tutorial (App Router, TypeScript, Deployment, TailwindCSS, Prisma, DaisyUI)
1:02:55
Next js Tutorial for Beginners | Nextjs 13 (App Router) with TypeScript
2:49:57
Tailwind CSS Full Course 2023 | Build and Deploy a Nike Website
0:36:17
Nextjs TypeORM TailwindCSS TypeScript Reddit Clone #24 Deployment
5:11:15
🔴 Let's build a Full Stack E-Commerce App with NEXT.JS 15 (Sanity, Stripe, Clerk, Tailwind, TS)...
5:55:10
Next.js 14 E-Commerce Website (Server Actions, TypeScript, Deployment, TailwindCSS, Prisma, DaisyUI)
1:57:06
Build and Deploy a Fully Responsive Modern UI/UX Website | React.js, Next.js 13, Tailwind CSS
5:23:11
Next.js 15 Crash Course | Build and Deploy a Production-Ready Full Stack App
4:41:34
Build and Deploy a Full Stack Next.js Application | React, Next JS, TypeScript, Tailwind CSS
8:15:12
Build a TEMU E-Commerce Store with NextJS 15, React 19, TypeScript | Full Stack Tutorial (2025)
3:09:13
Build a Stunning SaaS Landing Page with React, Next.js, TailwindCSS & Framer Motion | Full Tutor...
12:00:00
Build a Complete E-Commerce Shop with Next.js 14, Tailwind, React | Full Course 2024
0:11:08
NextJS, TailwindCSS e Typescript: #58 - Build e deploy na vercel
0:25:09
NextJS, TailwindCSS e Typescript: #41 - Como usar o componente de tabs do radix
3:26:29
Next.js Full Course 2024 | Build and Deploy a Full Stack App Using the Official React Framework
5:24:12
Build and Deploy a Patient Management System with Next.js | Twilio, TypeScript, TailwindCSS
7:20:20
Fresh React Portfolio Website (Next.js App, Framer Motion, TypeScript, Tailwind CSS, Email)
0:24:48
NextJS, TailwindCSS e Typescript: #00 - Apresentação do projeto
0:18:39
NextJS, TailwindCSS e Typescript: #14 - Adicionando variant no componente section
0:28:44
Tailwind CSS Tutorial with Next.js and Typescript | Part 2 - Usage and JIT Mode
0:18:08
Nextjs TypeORM TailwindCSS TypeScript Reddit Clone #23 SEO & Meta Tags
11:49:45
Build a Fullstack E-commerce using Next.js (react.js, mongo, tailwind, styled components)
0:27:04
NextJS, TailwindCSS e Typescript: #47 - Consultando playlist do YouTube
Комментарии