#lo hice otra vez de nuevo pero me
1 messages · Page 1 of 1 (latest)
creo hilo
amos
asi no molestamos
avisa cuando me leas y te explico paso a paso como funciona, asi ya te queda para futuro
ya te leo
bien
para aplicar una clase
a todos los hijos de una etiqueta
la sintaxis es asi
entre parentesis rectos, ponemos un amperson &
que significa, desde donde estamos parado
en este caso desde el form
o
[&]
[&]
hasta ahi bien ?
bien
eso es una clase
entonces le decimos
desde donde estoy parado (el form)
quiero que a los
lo que vayas a seleccionar
lo indicas con mayor que
les aplicamos tal cosa
entonces esto quedaria asi
eso significa, que desde donde estas parado (la clase del form )
todos los inputs hijos, les aplicas block
esto te ahorra, ir 1 por 1 aplicandole la clase
es decir que los hijos del form van a heredar el block
exacto, mas que herencia, es como una forma rapida de aplicar esa clase a todos los hijos con esa etiqueta
por ejemplo podria ser
dentro de un <ul> todos los <li>
<ul class="[&>li]:text-white"> ....
es una herramienta muy util
claro hace que sea mas rapido todo
yes
le aplique en el form el block pero sigue todo igual los inputs uno del lado del otro
he hecho de todo el dia de hoy por ese error
miestrame el codigo please
no puedo conectarme a ese tunnel
estoy en el trabajo y tienen un firewall especial que destringe esas conecciones
entiendo
ok so
ahh ahi cambie el block por flex-nowrap
igual
copia y pegame la form aqui
que yo la pruebo
<form class="flex flex-col h-64 font-semibold [&>input]:block">
<input class="w-max" type="text" id="user" placeholder="Nombre de usuario" >
<input type="email" id="email" placeholder="Correo electronico">
<input type="password" id="password" placeholder="Contraseña">
<input type="text" id="location" placeholder="Ubicacion">
bien, dame 1 sec
okay
ese es el codigo que volvi a hacer yo tengo el codigo desde donde inicio el problema
y pedi ayuda de chatGPT y lo hacia pero no le entendia bien lo que hacia y por eso no le preste atencion
ami me salen uno debajo del otro
asi que el problema seguro este en el padre, que no tiene un alto
osea el padre del form
a mi en el codigo anterios cuando pongo otra dimension se acoplan abajo del otro
eso o, no te esta tomando tailwind xd
el padre del form es el section
al form ?
al section
<main class="w-full max-w-sm">
<section class="bg-black border border-orange-500 w-screen h-screen ">
<div>
<h2 class="font-bold text-center text-2xl text-white mb-4">Registro</h2>
</div>
<form class="flex flex-col h-64 font-semibold [&>input]:block">
<input class="w-max" type="text" id="user" placeholder="Nombre de usuario" >
<input type="email" id="email" placeholder="Correo electronico">
<input type="password" id="password" placeholder="Contraseña">
<input type="text" id="location" placeholder="Ubicacion">
</form>
</section>
</main>
bruh no se que pasa
aver lo estoy probando en astro
quitale las etiquetas al body
aver que hace
prueba sacando todas las clases del body, es lo unico que tenemos diferente
quite todas las etiquetas del body y se fue a la esquina izquierda
bien, pero como te muestra el formulario?
aunque ya va
hace rato estoy tratando de poner el bg-orange-500 y no se pone
bueno empece a ponerle el bg orange ahora
sera que no esta agarrando tailwind?
como lo tenes instalado?
tailwind CLI
<script src="https://cdn.tailwindcss.com"></script>
creo que el tailwind no lo esta agarrando desde temprano
pega eso en el head
del html
ya vale es que a de estar tomando lo que sea en build
que tecnologia usas? o estas con html plano
si html plano
puta bida
nahh era la mierda del tailwind
😂
como hago para inciar el tailwind cuando quiero programar con el
eso me paso ayer pero ayer volvi y instale el tailwind y pues no presento problema
y voy hice otro html en otra carpeta pues me imagino que dejo de funcionar
yep
tienes una opcion que es --watch
por que, lo que pasa es que
cuando tailwind hace el build de lo que tu escribiste, lo transplila a css que en navegador entiende
eso solo se hace por comando
tienes un archivo .json por ahi ?
muestrame el pachage.json
npx tailwindcss -i ./src/input.css -o ./src/output.css --watch
este comando es el que tienes que correr, para que quede en watch
en watch significa que, cuando guardas, detencta el cambio y hace el build
ahh pero ese comando yo lo pongo en la terminal para que inicie
si
osea cuando lo pones, queda activado
si cierras la terminal, supongo qeu tienens que correrlo denuevo. no lo se
no uso tailwind asi
uso mucho framework
cuando termino el terminal se detiene
aun me quedan 2 horas de trabajo 😦
que haces tu para no trabajar asi como yo
como ?
estoy en el trabajo ahora mismo
mas no estoy haciendo nada, calentando la silla
😅
osea no
yo cuando tengo que usar tailwind ayer instale el otra vez tailwind y todo eso y funcionaba bien
pero cuando cambie de html a otra carpeta y lo inicie no funcionaba es decir lo que acaba de pasar
tu cuando vas a programar en tailwind como haces?
ejemplo en react ?
bueno ahora vite creo que tiene opcion vanilla
mira te muestro como inicializo una aplicacion con vite
Vite si no lo conoces es una herramienta que te ayuda a crear la base de tu proyecto digamos
okay tu no usas html puro tu usas un frame work?
te hace la creacion de carpetas etc
ok
html puro en el trabajo no, uso jsx, que es de react
y con react tailwind?
en mi trabajo lastimosamente no
pero si, tailwind con. todo
mira te muestro el paso a paso de como iniciar un proyecto vanilla (sin framework) pero con vite
ok
abrimos la terminal
en mi caso cree una carpeta llamada test2 y estoy parado en ella
ok
ejecutamos el siguiente comando npm vite@latest
te va a preguntar el nombre de tu proyecto
que es basicament el nombre de la carpeta donde estara todo guardado
le ponemos test
okay
te va a aparecer una lista de frameworks que puedes elegir, como vue, react, preact etc etc...
en nuestro caso, no queremos ninguno
asi que usamos la opcion vanilla
que es basciamente, sin framework, html css y js
ok
te preguntara, quieres usar typescript o javascript? asumo que no tienes idea de typescript asi que elegimos javascript
y listo! ahora solo tenemos que acceder a la carpeta
cd test
parados aqui, en el proyecto que creamos
hacemos code .
perdon
se me olvidaba
antes hay que instalar las dependencias, en vez de code ., acemos npm install
entiendo
despues si, code .
si te fijas, ya te hizo un proyecto con archivos de ejemplo y carpetas
ahora, en la terminal
si te fijas en la plagina de tailwind
tienes guias para diferentes frameworks
nosotros, como usamos vite para inicializar el proyecto nos interesa ese
ahi te dice los comandos que tienes que usar
yo tuve que hacer carpeta por carpeta
y cuando instale tailwind segun entiendo a mi se me instalo fue en una sola carpeta
pues de ahora en mas, ya sabes inicializar un proyecto con Vite
cuando aprendas a usar frameworks de javascript, tambien usaras vite
mira pase el archvio a donde esta instalado tailwind
este tipo de errores bajan hasta el auto estima
ya normal
por un momento me estrece y pense que no sabia nada
ahi pusiste el archivo que tenias dentro del proyecto que creaste?
si
bien
astro funciona igual que vite?
mmm no
vi que midu hizo un curso de astro
astro es un framework
okay
vite, es como una herramienta que sirve para setear frameworks
astro esta bueno, puede ser tan basico como quieras
o tan complejo como quieras
lastimosamente hoy en dia, no hay trabajo para eso, asi que si tu idea es conseguir trabajo algun dia
me iria directamente por un framework fuerte
pues, el unico que esta a flote en el mercado basicamente hoy por hoy es React
yo estoy estudiando analsis y desarrollo de software soy de colombia y pues en el curso nos enseñan lo basico tenemos que ser autodidactas
y estoy avanzando a saber mas porque el otro año me tocan mis practicas
se lo basico pero este tipo de cosas las conocia pero no las usaba
un poco de todo !
ya nosotros elejimos el framework con que trabajar
php no lo toco ni con guantes de goma
es desicion de los estudiantes
yo tampoco pero eso es lo que nos dicen que aprendas para conocer de todo
y saber que le gusta y que no
la proxima que tienes que tomar, en el desarollo web
sera dejar php
y centrarte en js
😂
react usa js verdad?
js lo aprendi a usar bien mi objetivo es aprender react
el concepto de React, es algo diferente
en Javascript se interactua con el DOM, modificas objetos del DOM etc
y stack es aprender react tailwind python Django o fastAPI y alguna base de datos
React funciona con un virtual DOM
las bases de datos son lo mas faci l
por eso ni te estreses
si eso me dice el profe pero no le he prestado mucha atencion
pero mientras quiero aprender lo de arriba del desarrollo
te contare la verdad
mas adelante aprendo mas
las bases de datos relacionales, (SQL) son muy parecidas unas con otras
aprendes una, y usas cualquiera
y las no SQL
es basicamente un json
si eso me di cuenta con mongoDB
cuando conecte mi api con mongoDB solo tenia que mandarle un js
y la base de datos guardaba eso
hoy por hoy, con el Edge y cloud casi todas las empresas usan Azure o AWS
pero, tambien tienen sus bases de datosd
en azure por ejemplo CosmoDB
porque el concejo de [&>input]:block me ayudo bastante
a pesar que el error era otro
me ayudo
es otro concepto a tener en cuenta a futuro, se usa bastante cuando usas tailwind
tailwind es genial, y con react es la bomba
por que, react componetiza todo
ya te mande la soli
y el backend con Django.py
puedes hacer bastante cosas
yo uso fastAPI para backend pero vi Django en una clase y es otra cosa
react tailwind y python como backend es un stack god
eso me emociona bastante saber usar esas tecnologias
pues si te soy honesto
no uso python
el backend que e echo a sido con javascript
o serverless, con javascript
entendible es que a mi el python me lo mostraron hasta por los ojos y por eso me gusta
porque lo manejo bien
claro
osea, prefiero hacer un backedn con expres.js
aceptable
si supiera python en profundidad, capaz lo haria con Django
oye que otros framework como vite hay?
si tuviera que aprender un lenguaje de backend, me gustaria Go
aqui los tienes
okay
bro me tengo que ir voy a hacer ejercicios
mañana te hablo por cualquier duda o explicacion que necesite
aqui estare si cualquier cosa precisas
bro aqui donde ingresas eso es la cmd?
cualquier terminal
cmd, powershell, warp
depende que uses
asi es en warp
ahhh
creo que por ahora es esclusiva de Mac
no es la misma?
ahhh si
cuando doy descargar sale solo para mac
bueno toca el diseño feo del cmd o powershell
que mac usas tu?
de donde eres por cierto?
trabajas allá?
ohhh entiendo
y en breves iOS
como hiciste para trabajar allá? es dificil conseguir esos trabajos no?
tienes muchos años de experiencia?
pues soy programadior desde hace poco, consegui mi residencia trabajando en el campo
ahhh entiendo
hablas ingles bien?
tu me podrias ayudar mas adelante a practicar mi ingles :/
si claro
ya estoy viendo videos de vite para aprender a usarlo
next.js funciona como vite porque veo comparaciones y no se si sirven para lo mismo
muchas cosas funcionan con vite
claro pero voy a ver unos videitos de vite pero primero debo saber bien react y tailwind para avanzar en vite