Discover and read the best of Twitter Threads about #HTML

Most recents (24)

How to become a self-taught Web Developer:

1️⃣ Define clear goals and establish a roadmap for your web development journey. #ClearGoals 🎯
2️⃣ Find reliable learning resources like online courses, tutorials, and coding communities to support your self-learning. #LearningResources 📚
3️⃣ Master the essentials: HTML, CSS, and JavaScript. These form the foundation of web development. #HTML #CSS #JavaScript 💻
Read 8 tweets
[🤩] ¿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

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!