Excelente! muy bien explicado, me sirvió mucho. Adjunto código para que el navbar se cierre cuando queda abierto en modo mobile y volves a desktop import React, { useState,useEffect } from 'react'; useEffect(() => { function handleResize() { if (window.innerWidth > 768) { setClicked(false); } } window.addEventListener('resize', handleResize); return () => window.removeEventListener('resize', handleResize); }, []);
@guillermofernandez1971
6 ай бұрын
Para los que queremos aprender mas de React y estamos iniciando nos sirve muchísimo. Ahora a intentar ajustarlo al código que ya he generado en mi proyecto de React. Muchas gracias Joaquín
@matiassomoza8207
Жыл бұрын
Muuuyy buenoooo!! Al fin encontré alguien que la tiene clara con con React y con CSS. Segui subiendo videos porfa, me doy cuenta que muchos que estamos aprendiendo React, de estilos no saben practicamente nada Y acá tenés diseño, todo. Genial. Habrá posibilidad de que armes videos de React utilizando más Hooks, Formularios Controlados, Algún request a una Api para desplegar contenido, que en lugar de utilizar las etiquetas anchor para los links uses React-Router? Se me ocurre que este Navbar que armaste puede ser el comienzo de una App, e ir incluyendo esos temas que se piden un montón y no abundan las explicaciones claras como la tuya, muchisimo menos en español. Ya lo estuve compartiendo en grupos de estudiantes de Desarrollo Web. Vos acá utilizaste esta librería styled-components; usas css modules? Conozco esa manera de dar estilos también; y React Icons para los iconos ponele. Después, como normalizas el CSS para que no haya conflicto entre los distintos Browser? Conozco Normalize CSS, ,pero hay otras formas. Muy buen uso de la propiedad position! A mi se rompían las páginas con el absolute y el relative. Y le metiste Flexbox, transitions, z-index, el juego entre los valores inline y block de la propiedad display... muy completo, en veinte minutos. Voy a estar atento a tus videos sobre el la librería React. Si sabes algo de Redux también sería genial. Y ya abusando jaaj, Node.js con Express, PostgreSQL y Sequelize para el Back. Tanto por aprender. Excelente tu aporte Joaquien, gracias!!!!
@laraalbornoz6388
2 жыл бұрын
Estoy facinada con este tutorial, me vino perfecto para mi porfolio, muchas gracias!!
@sisisisisisisis5230
Жыл бұрын
La verdad que explicas re piola Joaquin. Muchas gracias por compartir conocimiento ☺☺☺☺
@Chillguy03
2 жыл бұрын
justo estoy haciendo mi portafolio y me diste una gran idea gracias!
@NANAPATY
2 жыл бұрын
Excelente tutorial muy bien explicado, mil gracias, ya lo apliqué en mi nuevo proyecto. Excelente diseño.... saludos desde Colombia😉😊
@henrysilva9464
8 ай бұрын
exelente me ayudaste mucho
@David-repetto
2 жыл бұрын
Gracias Joaquín! Me ayudaste muchisimo!
@angelleninmorales893
Жыл бұрын
Cual extension de VSC te permite ver autocompletar las caracteristicas de lo que vas colocando para cada componente debajo de const NavContainer= styled.nav`
@nahuelalejandropedemonte3530
2 жыл бұрын
buenísimo el tuto , gracias por compartir!
@mjinse
2 жыл бұрын
Excelente!!!me sirvió bastante, gracias!
@andrealeon8415
2 жыл бұрын
Me encantó como explicas
@joaquinpinto8131
Ай бұрын
pero que lindo nombre
@mikecode6221
2 жыл бұрын
Muy bueno tio, muchas gracias.
@pablomurillo1204
Жыл бұрын
Excelente! Me re sirvió amigo
@utmzzz
2 жыл бұрын
Sos un capo bro😞
@carlosmalissia9308
Жыл бұрын
Hola amigo...excelente tu video...ahora bien me podrias ayudar a que el nav no se superponga con el contenido cuando hay contenido ...o como hacer que el contenido se mueva abajo del nav....
@arnoldgalindo3516
Жыл бұрын
Muy crack, nuevo suscriptor
@CG-ly8wj
2 жыл бұрын
Muy bueno, lo voy a hacer para mi proyecto del bootcamp.
@dantrinchero
Жыл бұрын
Muy claro, no tenes ganas de hacernos un curso de react? XD
@cuervofran79
2 жыл бұрын
Excelente, gracias! Que siga creciendo tu canal
@anime-en-castellano
Жыл бұрын
gracias pibe
@codingjhames
Жыл бұрын
Ibamos hasta la parte del BgDiv y se me rompió todo jajaja, hasta aquí dejo este tutorial.
@ismaellunaatienza3513
2 жыл бұрын
Con el rfce que escribes al principio de los .jsx para autocompletar el fichero, me salen otros autocompletados totalmente diferentes. Sabrías decirme eso a qué es debido y como solucionarlo
@darkantho1
2 жыл бұрын
Una pregunts en el momento que se presione los links se abre la barra como se bloquea eso en la pantalla completa
@Deus-lo-Vuilt
Жыл бұрын
excelente dejo like y sub
@francinakb8256
6 ай бұрын
en la constante de styled.nav por que utilizas esa tilde?
@rafaelirigoyen7698
8 ай бұрын
Hola muy bueno el video!! sabes que tengo un problema con el icon de hamburguesa cuando le vuelvo a dar click no vuelve a su lugar original queda torcida, porque sera eso? copie el css tal cual
@ulisandro1214
Жыл бұрын
Hola joaquin muy bueno tu navbar , mira te comento estoy haciendo un proyecto , pero cuando apreto el menu hamburguesa los links no se ven si hay un contenido adelante (por el z-index:-1; ) y cuando lo saco directamente se bugea y no muestra los links y se queda en negro , intente de todo pero no logro hacer que los links se vean primero ante ante todo , ni poniendo z-index al navbarContainer , alguno solucion y gracias muy bueno tu conocimiento
@drtavox
Жыл бұрын
Me esta pasando lo mismo, pudiste arreglarlo?
@carlosmalissia9308
Жыл бұрын
hola si a mi tambien me sucede y es porque el nav esta con position absolute y cae arriba de los contenidos, la unica manera que encontre es poner z.index -2 al contenido, pero igual si tengo un boton en el contenido no puedo acceder, porque queda atras de todo..asi que intentare que los contenidos se corran hacia abajo cuando aparece el nav, para que no se superpongan....lindo desafio....
@federicosabatini1240
Жыл бұрын
Muy bueno el video ! te consulto si cree componentes react con bootstrap que tienen alerts y tables como logro que sean responsive ?
@andreasmeggetto4114
2 жыл бұрын
Buena crackkk
@estebancastell1511
2 жыл бұрын
Gracias Bro
@finanzas374
Жыл бұрын
En la primera ya no me funciona el Styles.nav' me marca error y lo importa mal se rompe todo
@joannarvaez4891
2 жыл бұрын
Exlente, mañana lo hare, estoy iniciando en react, este sera mi primer proyecto real, cuanto tiempo te llevo aprender esto?
@vespyra1
Жыл бұрын
no me aparece el btn de burguer no se q hacer
@catisito6766
Жыл бұрын
hola buenas, no sabras porque no me toma el styled-components no me detecta el css dentro del const :( importe todo pero aun asi no me deja. tengo Vite
@danielaguilar7570
2 жыл бұрын
hay un sniped que te sugiera css para escribir en el componente?
@ismaellunaatienza3513
2 жыл бұрын
cuales son los paquetes visuales que tienes instalado y tienes alguno de autocompletado de funciones?
@ismaellunaatienza3513
2 жыл бұрын
No me pilla bien el NavContainer, los estilos como estan entre una comilla me lo lee como string
@ederr_
2 жыл бұрын
@@ismaellunaatienza3513 Amigo, me estaba pasando lo mismo, tenes que descargar la extensión vscode-styled-components
@julian6002
11 ай бұрын
@@ederr_ que grande!!! era esto! yo pensando que había instalado mal algo jajaja
@Diego-pu1ld
2 жыл бұрын
Muy bueno! porque al colocar los estilos a vos te aparecen la abreviaturas de emmet (para escribir menos). A mi no me aparecen
@joakov3
2 жыл бұрын
Descargate la extension de styled-components
@christianomarortizsalvador7796
Жыл бұрын
@@joakov3 Gracias!, era la extensión que estaba buscando
@jimenacambronero
2 жыл бұрын
hola, alguien sabe porque me permite usar emmet cdo creo los componentes pero no cuando doy estilos? gracias
@YohGar2854
Жыл бұрын
como le hago para que no se muestre el contenido al desplazar el menu
@luisguillermobarrazaromero2157
Жыл бұрын
A mi si me funciona pero en mi caso estoy haciendo una página web con productos y al momento de desplegar el navbar, los productos de mi pagina se superponen , alguien sabe como hacer para que los productos se vayan atrás del navbar??? 😢
@clasesutnfrc8699
2 жыл бұрын
Lo probe con storybook y se rompe el responsive en algunas resoluciones
@gastonjzabala
2 жыл бұрын
cuando aprieto los links en modo computadora se abre el menu responsive jaja
@joannarvaez4891
2 жыл бұрын
como hiciste para colocar los colores en los estilos, los tengo arriba pero en los estilos no
@joakov3
2 жыл бұрын
Con la extensión de styled components
@clasesutnfrc8699
2 жыл бұрын
07:59 Crear boton de hamburguesa
@gonzaloquiroga6659
2 жыл бұрын
amigo hice todo tal cual a vos y cuando hago click en algun link del navbar se me cambian las clases de links a links active y se me pone toda la pantalla en negro, como podria hacer?
@agustinmatias9410
2 жыл бұрын
me pasa igual, lo pudiste solucionar?
@YohGar2854
Жыл бұрын
yo estoy usando next js y me presenta este error Warning: Prop `className` did not match. Server: "sc-gKPRtg jUZyYe" Client: "sc-bcXHqe kcTAUC" at header
@joakov3
Жыл бұрын
Creo que next requiere una configuración extra en styled components
@YohGar2854
Жыл бұрын
@@joakov3 investigaré un poco
@elliot1277
2 жыл бұрын
No es menos complicado hacer un .css aparte?
@joakov3
2 жыл бұрын
Es lo mismo, solo que al tener los estilos en cada componente individual, es más fácil encontrar el css de cada cosa
@cat362
2 жыл бұрын
Amigo no me funciona me sale la pantalla del navegador en blanco
@plex5600
2 жыл бұрын
a mi tambien, alguna solucion?
@leadnauta
Жыл бұрын
Hola debes ir al App.js y colocar este codigo, debe importar el navbar, el instructor lo hace el video, pero es muy rápido. import logo from './logo.svg'; import './App.css'; import styled from 'styled-components' import Navbar from './components/Navbar'; function App() { return ( ); } export default App;
@westhuizen
Жыл бұрын
@@leadnauta y como te quedo el codigo en Navbar.jsx
@cristianrodriguez-ip5mv
Жыл бұрын
@@leadnauta me faltaba agregar el import en app.jsx, muchas gracias!!
@agustinescudero
Жыл бұрын
"lo que tenemos que.. mandarlo a la mierda" jajajaja
@gastonjzabala
2 жыл бұрын
che, yo tengo un problema ajaja
@cesarbergamasco370
2 жыл бұрын
Se me solapa el menú hamburguesa con el body! Como lo puedo solucionar?
@mikeskold89mm
2 жыл бұрын
position absolute, fijate eso
@cesarbergamasco370
2 жыл бұрын
otra de las cosas q tengo q solucionar es, al hacer click en un link, no se cierra el menu.
@luisguillermobarrazaromero2157
Жыл бұрын
Pudiste solucionar el problema, me pasa lo mismo :(
Пікірлер: 74