Discover and read the best of Twitter Threads about #html

Most recents (24)

[🤩] ¿Buscas plantillas de #HTML para tus proyectos?

1. UIdeck
2. HTMLrev
3. GrayGrids
4. HTML5 UP!
5. Web3Templates

⇟ 🧵 plantillas gratis html
Read 7 tweets
¿Quieres introducirte en la #programacion 💻 y en la #IA con cursos GRATIS de #Google? ¡En este HILO 🧵te dejaré 5⃣ recursos 🔝 para que puedas introducirte de forma gratuita en estos ámbitos la #IngenieriaInformatica! 🔥🔥🔥⬇️⬇️⬇️
learndigital.withgoogle.com/activate/cours… Con este curso de 1⃣h, puedes familiarizarte con los principios básicos de la #programacion. Más que recomendable. #tecnologia #it #software
learndigital.withgoogle.com/activate/cours… En este curso de 4⃣0⃣h aprenderás las bases del #desarrolloweb moderno, es decir, #HTML y #CSS. La base para ser programador #frontend 💻
Read 8 tweets
#programming with a fellow #dev can be more productive than you can envision!
medium.com/p/528d555f7846
#Containers provide an unparallel lift for #AI and #MachineLearning
medium.com/p/37675980b4d
Read 12 tweets
¿No entiendes #CSSGrids?

Te explico lo como hacer un layout básico en pocos tweets.

Hagamos este layout...

🚀 RT para salvar un colega

🧵 [1/13]
El primer paso es crear el #HTML. Es solo un padre con tres hijos. Nada fuera de lo común.

[2/13]
En el #CSS lo primero que hacemos es agregar width y height al 100% al <body> y <html> para que nuestro layout ocupe toda la página. Y bordes a los elementos hijos.

[3/13]
Read 13 tweets
🧵

1/ Get rid of complex, traditional backend servers while building your #websites.

According to @HTTPArchive, now more than 1% of ALL websites are based on the Jamstack architectural approach

👇

(image by C. Fayock)

#webapp #coding #developer #innovation
2/ Whether you are an experienced or a novice web developer, your main, urgent goal is to avoid:

🐢Slow loading times

🔒Security vulnerabilities

📈Scaling issues

😵Headaches

#webdev
3/ The Jamstack is a way of building web applications that utilizes modern tools and technologies based on #JavaScript, #APIs, and Markdown (J.A.M. stack), in order to decouple the #frontend from the #backend
Read 14 tweets
I'm a web developer, and a lover of anagrams.

Here's how I create animated #anagrams for the @AnagramPost. (LONG THREAD 🧵)

#webdev #html #css #javascript #php #thread
In November 2022, I made a Python program to animate anagrams of tweets as an experiment.

It wasn't very easy to use or maintain, though. It's over 1,000 lines, ~160 of which are to work around Pygame being unable to wrap text or render emojis in color.
Sometime later, I decided to try refactoring it to make it less of a headache.

But partway through, I thought to myself, "Wait, why am I trying to recreate a web layout in Pygame? I should just...do it on the web!"

So I did.
Read 30 tweets
Arquitetura de pastas para projetos #React

Minha base são as arquiteturas: #ITCSS e #RSCSS.

Visão geral do projeto e na thread mostro como organizo a pasta 📂𝙨𝙧𝙘

📂.𝚐𝚒𝚝𝚑𝚞𝚋
📂.𝚟𝚜𝚌𝚘𝚍𝚎
📂𝚊𝚙𝚒
📂𝚙𝚞𝚋𝚕𝚒𝚌
📂𝙨𝙧𝙘📌
∟📂🧵

📌Onde está
🧵Próximo passo
📂𝙨𝙧𝙘📌
∟📂𝚊𝚜𝚜𝚎𝚝𝚜🧵
∟📂𝙶𝚕𝚘𝚋𝚊𝚕𝚂𝚝𝚢𝚕𝚎𝚜
∟📂𝚌𝚘𝚖𝚙𝚘𝚗𝚎𝚗𝚝𝚜
∟📂𝚕𝚊𝚢𝚘𝚞𝚝𝚜
∟📂𝚙𝚊𝚐𝚎𝚜
∟📂𝚜𝚎𝚛𝚟𝚒𝚌𝚎𝚜
∟📄𝚖𝚊𝚒𝚗.𝚓𝚜𝚡
∟📄𝚛𝚘𝚞𝚝𝚎𝚛.𝚓𝚜𝚡
📂𝙨𝙧𝙘
∟📂𝚊𝚜𝚜𝚎𝚝𝚜📌
∟📂𝚏𝚘𝚗𝚝𝚜
∟📂𝚒𝚖𝚊𝚐𝚎𝚜
∟📂𝚒𝚌𝚘𝚗𝚜
∟📂𝙶𝚕𝚘𝚋𝚊𝚕𝚂𝚝𝚢𝚕𝚎𝚜🧵
∟📂𝚌𝚘𝚖𝚙𝚘𝚗𝚎𝚗𝚝𝚜
∟📂𝚕𝚊𝚢𝚘𝚞𝚝𝚜
∟📂𝚙𝚊𝚐𝚎𝚜
∟📂𝚜𝚎𝚛𝚟𝚒𝚌𝚎𝚜
∟📄𝚖𝚊𝚒𝚗.𝚓𝚜𝚡
∟📄𝚛𝚘𝚞𝚝𝚎𝚛.𝚓𝚜𝚡
Read 17 tweets
🔥 ¿Sabías que #HTML tiene una etiqueta especial llamada `template`?

Te sonará si has trabajado con #vuejs. Pero no te preocupes si no la conoces, te lo explico aquÍ abajo.

[ HILO ] ⇣ template tag in html5
La etiqueta `template` de #HTML te permite tener contenido oculto en tu documento HTML. Es como una guarida secreta* para tu contenido.

⚠️ *¹ No lo uses para como sistema seguro para ocultar contenido.
Y... ¿para qué? Tal vez te sirva para mejorar el #rendimiento de tu #web.
El contenido de la etiqueta no se añade a la página hasta que tú se lo indiques. (Sí, con #JavaScript)
Read 12 tweets
Aquí te dejo unos cuantos ejemplos de maquetación #HTML y #CSS con diferentes frameworks o sin ellos con la ayuda del polifacético #ChatGPT …👇
1/ Maquetación de una página "acerca de" genérica con #Bootstrap5 con varios párrafos y una imagen. Image
2/ Maquetación de una Home generalista para una Startup con #tailwindcss. Algunas pequeñas correcciones ¡y voilá! Obviamente, se trata de un comienzo. Sigamos adelante… ImageImageImage
Read 9 tweets
Une IA peut-elle vous aider à créer un site web primitif ?
Peut-elle répondre à vos questions sur le HTML / CSS ?
#OpenAI #GPT3 #HTML #CSS et évidemment spé #NSI 1/n
Une IA va répondre à mes questions sur HTML / CSS
Tu connais le #CSS et le #HTML ?
A quoi sert le #javascript ?
Et on peut créer un site web ensemble ?
#OpenAI #GTP3 2/n
Une IA va répondre à mes questions sur HTML / CSS
Comment dois je faire pour créer un site web ?
Et on le trouvera facilement sur Google ?
#OpenAI #GTP3 3/n
Read 16 tweets
E hoje é dia de exterminar mais uma confusão frequente: Você é back ou frontend? Eu sou Dev JavaScript 🤯🤩

🧵/1

#nodejs #javascript #webinar #tutorial #devlife #100daysofcode #frontend #html Image
Hoje, dia 22/11 às 19hrs vou fazer uma super live lá no canal para contar sobre lições importantes do @nodejs que você pode também usar no navegador (ou em qualquer outro lugar que roda JS)

/2
Eu recebo frequentemente dúvidas sobre alguns conteúdos do meu canal e treinamentos, algo como "ah, mas sou frontend, seu conteúdo de @nodejs é para backend"

A verdade, é a JS é uma só, tudo que tem na JS do navegador, tem no JavaScript do Node.js, #Bun e @deno_land

/3
Read 6 tweets
🙃 ¿Te quedas pegado cuando intentas hacer un proyecto de #programacion?

😉 Te explico un método para salir de esa pega y evitar la frustración.

🧵 THREAD
🧠 Cuando no puedes arrancar es porque estás viendo la aplicación como una sola tarea gigante y tu cerebro está tratando de resolverla, pero en realidad lo que debes hacer es resolver muchas tareas pequeñas.

➡️ Vamos con un ejemplo.
🤑 Desarrollemos un #app para calcular propinas.

Ok, pero ¿Por dónde comienzo?

☝🏽 Lo primero yo recomiendo es hacer un pequeño dibujo de como se va a ver con anotaciones de como va a funcionar.
Read 18 tweets
ROADMAP para ser BACKEND Developer

¿Queréis un roadmap con RECURSOS GRATUITOS para ser un gran desarrollador BACKEND?

Os dejo 7 recursos totalmente GRATIS para aprender las BASES que cualquier desarrollador BACKEND debe conocer

🧵👇

#backend #code #coding #programming #coding
1️⃣Aprende las BASES DE INTERNET

Antes de empezar a programar, entiende qué es Internet, qué es el protocolo HTTP y cómo funciona un navegador

Aquí tenéis un artículo muy interesante

vox.com/2014/6/16/1807…
2️⃣Frontend básico (HTML y CSS)

⚠️Opcional pero RECOMENDABLE⚠️

Aunque quieras ser desarrollador backend, es importante que conozcas las bases del frontend, es decir: #HTML y #CSS

Tienes el curso de @freeCodeCamp para aprender HTML, CSS y Responsive Web

freecodecamp.org/learn/2022/res…
Read 10 tweets
Hay 5 herramientas que yo uso en todos mis proyectos #web.

1. Iconfinder
2. Un generador de #css gradientes
3. Descargar y usar Google Fonts como Web Fonts
4. Y un lorem ipsum para imágenes
5. La mejor documentación

Acá el thread 🧵

#codenewbie #100daysofcode #webdeveloper
Para descargar iconos uso iconfinder.com puedes descargarte los iconos en #svg o png hasta 512px y hay muchos iconos gratuitos de calidad. 1/5
Nunca me he aprendido la sintaxis de #css gradients así que esta herramienta me permite generar el código con una interfaz bien bonita: cssgradient.io 2/5
Read 7 tweets
🌅 Buenos días 🌅

¿Buscando proyectos para practicar o para portafolio?

🧵 Te dejo 3 que me gustan por acá

#frontend #webdev
Desarrollar una pagina de producto para crowfunding y aprende:

1️⃣ Responsive design
2️⃣ Transiciones en hover states
3️⃣ Layouts con #CSS

frontendmentor.io/challenges/cro…
🏠 Room homepage

El layout de este está retador, pero te queda un proyecto interesante para mostrar en tu portafolio.

frontendmentor.io/challenges/roo…
Read 5 tweets
6 Youtube HTML and CSS courses for beginners

Thread 🧵👇
1. HTML Tutorial for Beginners: HTML Crash Course

Learn HTML using this beginner's HTML tutorial to pursue a career in web development.

You will learn all you require to get started in this HTML lesson.

⏰ Length: 1:09:33

2. Learn HTML – Full Tutorial for Beginners (2022)

Over 4 hours of HTML!

This comprehensive introductory lesson will teach you the fundamentals of web programming.

HTML5 is taught in this course.

⏰ Length: 4:07:29

Read 11 tweets
bin noch immer am rumfragen für die produktion von einem one-pager ;-)
für das #wp #wordpress-plugin zur integration von @wikidata habe ich auch keine freunde gefunden. nicht ein mal gegen angebot von geld ;-)
Read 27 tweets
🤖 ¿La inteligencia artificial te reemplazará?

¡NO! Por ahora vino a hacerte tu trabajo de #developer y #UIDesigner más fácil.

✅ 7 utilidades de inteligencia artificial para #WebDevelopers

❤️ Ayudame con un RT

🧵 HILO
1️⃣ Copilot creado por @GitHub es un "autocompletado" de código que utiliza AI para ofrecerte sugerencias a tu código, pero completa una función completa solo con el nombre, por ejemplo.

Está en beta privada, anótate en la lista: copilot.github.com
@github @tabnine parecido a Github Copilot, pero se puede usar en cualquier editor de código y no está en beta cerrada.

Tiene una versión paga y una gratis y promete ser mejor que Copilot.

tabnine.com
Read 7 tweets
🌅 Buenos días 🌅

¿Buscando proyectos para practicar o para portafolio?

🧵 Te dejo 3 que me gustan por acá

#frontend #webdev
Desarrollar una pagina de producto para crowfunding y aprende:

1️⃣ Responsive design
2️⃣ Transiciones en hover states
3️⃣ Layouts con #CSS

frontendmentor.io/challenges/cro…
🏠 Room homepage

El layout de este está retador, pero te queda un proyecto interesante para mostrar en tu portafolio.

frontendmentor.io/challenges/roo…
Read 5 tweets
🚨 NUNCA digas "NO" cuando en una entrevista te pregunten:

¿Tienes preguntas?
➡️ No es una inocente pregunta, es para probar si tienes interés.

💬 Algunas ideas de preguntas, HILO 🧵

#devjobs #codenewbie #100daysofcode
¿Cuántos son en el equipo?
¿Cuál es el tech stack?
¿Usan agile, waterfall, otro?
¿Qué control de versiones?
¿Tienen unit e integration tests?
¿Cómo se componen los equipo?
¿Qué sistema de tracking usan?
¿Qué herramientas de comunicación?
¿La mayoría usa mac o windows?
- ¿Cómo evitan el burnout de los empleados?
- ¿Cómo miden el éxito de una persona en esta posición en sus primeros meses?
- ¿Cuánto tiempo pasa desde que aprueba un feature hasta que ese código llega a producción?
- ¿Podría nombrar tres metas del equipo en 2022?

Por @kamihack
Read 6 tweets
🌅 Buenos días 🌅

🌟 Aprender #frontend. El path más perfecto jamás creado (es broma ¿o no?)

1. #HTML y #CSS
2. Proyecto
3. Proyecto
4. Proyecto
5. #JavaScript y proyecto
6. Proyecto
7. #React y proyecto
8. Y más proyec...

Te dejo 4 sitios donde encontrar proyectos 🧵
Resuelve los desafíos de #HTML, #CSS y #JavaScript del mundo real mientras trabajas con #disenosui profesionales.

frontendmentor.io/challenges
Mejora tus conocimientos de #HTML y #CSS practicando con plantillas de diseño reales. Y ofrecen un canal de Slack para preguntas y dudas.

codewell.cc/challenges
Read 6 tweets
¿Pesadillas con los memory leaks en #JavaScript?

Hay dos causas comunes:

1. Event listeners
2. Elementos eliminado del DOM, pero referenciados.

Te dejo dos videos que explican como usar el browser para detectarnos y arreglarlos.

🧵
El primero de @MicrosoftEdge tiene una herramienta para ver los Detached Elements del DOM

LINK:

En la última versión de Edge ya viene sin flag.
El siguiente el de @googlechrome y explican como utilizar los Heap Snapshots en la pestaña de Chrome para detectar memory leaks.

Read 4 tweets
"Yo, why are #JavaScript and its ecosystem so messy?!" 😡

Well, I am glad you asked... Let me tell you a story! 🤓

🧵👇
For starting... #JavaScript was not designed to be the language that it is today!

JS was created in 1995 by @BrendanEich for Netscape, a web browser that was trying to come up with a language to make the web more interactive
@BrendanEich #JS wasn't related w/ #Java, so why did they call it Java-Script?! Duh! 😳

Java was trendy! it was possible to build interactive sites by embedding Java apps in pages (applets). So it was mostly a #mktg move: "JS: the lightweight Java alternative" or something like that I guess
Read 40 tweets
¿Te cuesta navegador el historial de Git?

No es fácil, pero existe una extensión GRATIS de @code perfecta que te lo facilita:

🍉 Watermelon 🍉

❤️ RT para salvar un colega

🧵 Hilo
Con Watermelon vas a poder ver con muchísimo detalle toda la historia de tu código línea por línea.

Es superútil cuando trabajas en equipo y un simple git blame ya no es suficiente.
En detalle te permite:

1. Ver quien fue el último que tocó una línea
2. Ver cuáles fueron los commits que afectaron el archivo
3. Ver los Pull Request que incluían cambios en el archivo
Read 6 tweets

Related hashtags

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3.00/month or $30.00/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!