Learn Emmet In 15 Minutes - Double Your HTML Coding Speed

[@kajkajajkaa]

Hello to fellow Odin Project students 👋🏼😉 Fantastic video, thank you for the super clear and thorough explanation!

[@robs257]

helloooo

[@victornta8796]

Lol Hi

[@apprentice-tech]

halu

[@gintoki_sakata__]

😁😇

[@chestermartin2356]

Is anyone else feeling the same relief having spent months working on chess and even more months on Ruby in general, that they didn't actually just forget all of HTML and CSS?? I was so concerned I'd have forgotten a lot, makes me feel like I might actually be able to do this stuff professionally some day 😅

[@andrewdutson7137]

Here from The Odin Project, great information and detailed explanation on the in and outs of Emmet. Thank you! :)

[@freguenshoodjean5841]

You finished the whole project ?

[@crysre]

Hi

[@timemmanson8350]

From the Odin Project. Hello to my fellow students. Nice job. Crystal clear explanation!

[@odilsoncode]

Hello from Odin, I've been using Emmet for so long without even knowing it. Thank you for your video, it's very clear💯

[@aydanwessels761]

If you hit Ctrl + i, you can trigger VS Code to suggest an Emmet snippet. If you're building a snippet and aren't getting a trigger, this will do it for you. 🙂

[@chonk7221]

This is such an absolute banger of a tip! it's so nice to be able preview the outcome...Thank you!

[@jaisanghvi3883]

Thanks for this. Ctrl + Space does the same thing. I find it easier to use this shortcut.

[@vampbat]

So happy to see other Odin students here! I looked up a few of your videos early on to learn JS when I found I needed an alternate teaching style to a few video tutorials the course recommended. Thank you so much for your content! Happy they officially linked you (finally)!

[@ldt_]

I started using VSCode because of you, I even converted my boss from using VIM that has never used any IDE or graphical editor to use this. Now you're showing me yet another trick in VSCode that I didn't know about. Thanks for this.

[@Bitrey]

I thought the title was exaggerated, but man, this will TRIPLE my speed at writing HTML! Thanks for this awesome tutorial!

[@b1mind]

(Grouping) vs using the ^ is gold!!!! thank you so much Kyle another solid video!

[@WebDevSimplified]

You're welcome! I try to throw in those little nuggets of things that I find useful since hopefully others will find it useful as well.

[@francesboy2]

My face lit up when you started showing off how we could shorthand classes and divs etc, this is such a time saver and is really exciting

[@craigburton4447]

The best (and most really powerful) Emmet tutorial I have seen. Love your channel

[@RichardJNeo]

This is the single greatest thing I’ve learned so far, I hated doing all that stuff!! This makes me so happy!!

[@adicide9070]

dude, I'm actually switching to JS from Java partly thanks to your vids!!! Super psyched.

[@RR-et6zp]

java is useless

[@dontbetoxic4387]

@@RR-et6zp ?

[@paprika_ame]

This is a great overview! Good luck to my fellow Odin Project students! 😊

[@omkarshendge5438]

hey im doing the odin project as well can we connect?

[@MythicalMaestro69]

I hate I didn't know about this channel back then when I started learning code. This is Scam videos!! It didn't make me type HTML 2 times faster, but 5 times faster!!! Thank you for making this tutorial. Subscribed!!!

[@deemon710]

THIS! This is the kinda stuff I know VC can do but it's a pain to find and get used to. Thank you not just for teaching it, but for demonstrating it as well. 🙏

[@richiedon9048]

infact, as a beginner i have decided to stop watching all other tutorials. you make things simply to my understanding. thank you

[@tech_ashwinikumar]

notes: Emmet shortcuts . class # div [] attributes {} values inside divs $ to give numbering, $$ to 0 padd .abc*5{item number $} div*5 = show 5 divs + for sibling e.g header+main+footer or (header>nav)+main+footer form:post (to create forms) form:post>(.group>label+input:text)+(group>label+input:number) Inside css position bg (background) bgc (background color) w10 or w10em or w10% (width of 10 px etc)

[@jalapenohiway]

This is really useful info for beginners like myself! Ty! Also, WHY...would anyone even "Thumbs down" this video???

[@deansprivatearchive]

They are just WDS haters, ignore them

[@rafatrashidrahi9353]

by mistake, no other way they would hit dislike

[@KamomeGakuen]

i've seen so many videos like this that are so boring that i can't retain anything, thanks for making one that's really clean and straightforward and easy to follow. most painless tutorial video i've seen in awhile

[@channelforambience]

Yeap, i'm gere because of The Odin Project too! Great video, very nice tips! Let's goooo

[@nathancovey]

Idk who Emmet is IRL but I love him

[@UmarAlFarooq]

Who are the 10 assholes who DISLIKED this video?!! Thank you for this video. It's awesome like all your others. Fantastic quality. You are a real-life hero.

[@webdevtech7154]

this was one of the best tutorials i have watched, straight to the point. thanks for the cheat sheet.

[@noscreadur]

I'm an Emmet user, and I learned some new tricks in this excellent video. Cheers!

[@ushadesai6306]

You are so generous. Thanks, learnt a lot about how powerful is Emmet!

[@TheRastaDan]

Comming from the brand new Intermediate HTML and CSS course of TheOdinProject, not sure if I would really need it. Damn was I wrong. This is really helpful and I'm abit ashamed finding out about this only now

[@kaseymurdoch9974]

I just finished foundations. Really lucky timing for me that they just reworked all this!

[@razvanbugoi83]

Very useful video, thank you! The Odin Project brought me here by the way.

[@ScileSc]

Man I just started doing it as soon as I picked up vsc, I didn´t even notice that it had a name.

[@Patrick1985McMahon]

how do you turn Emmet on in VSC?

[@ScileSc]

@@Patrick1985McMahon I dunno it´s just there. At least it should be.

[@ahurein1641]

@@Patrick1985McMahon prebuilt extension in vscode, it's already activated

[@Patrick1985McMahon]

@@ahurein1641 thank you. I will try that.

[@ahurein1641]

@@Patrick1985McMahon you're welcome

[@Sabrecho]

This easy-mode life hack utility's been around for at least 4 years now!? Where was I all this time??? 😁 tyvm Kyle!

[@ahmedAltariqi]

It’s insanely powerful!! It saves ton of time :)

[@KnightToD5]

Great content! Here from The Odin Project!

[@jemsync]

What a great video for my first day of my Full Stack JavaScript path on The Odin Project.

[@EduardKaresli]

Thanks Kyle! This video has value of gold. Nice work as usual.

[@kittieCoder]

Thanks. Really great. I love your channel.

[@alejandronieto576]

Dieses Video anzuschauen war eine sehr gute Zeitinvestition für mich. Danke sehr!!

[@ankitagarwal4914]

I knew the stuff until 8 minutes and then it blew my mind. Flabbergasted.

[@kharChehre]

Thanks Kyle! 🤯 You read my mind! I was practicing Emmet a few hours ago lol

[@emonymph6911]

Emmit is the only framework you need, people should learn this instead of other garbage

[@python_programmer7983]

I'm definitely going to be using this from now on. Way better.

[@ksrele]

This is working in Sublime Text too, thanks for this video.

[@lonk752]

this video..... That's POWERFUL! Thanks for all the power!

[@Tabbystripes]

I have been looking for something like this for a long time. Thank you!

[@albedesigns]

This is the video I didn't know I needed to see!

[@marynguyen8559]

Thanks. That was very useful! I'm a beginner and you made it very digestible and enjoyable :)

[@franciscojavierruizhernand3772]

Jajaja, I'm seeing this video because I'm learning in The Odin Project and I found many people that is learning too, it's a pleasure.

[@iamadriansantos]

T.O.P squad!

[@66lucc]

The Odin Project user passing by!

[@ashishkkrishna]

a fellow odin project strawhat here

[@66lucc]

@@ashishkkrishna Nakama!

[@nizamuddinshaikh3185]

Emmet - what a useful extension! This tutorial - what a concise pointer for use of vast ocean of Emmet! Thank you for sharing. 😃👍🌼

[@madhavkwatra5888]

knew most of the stuff so skipped a lot. Emmet is really awesome. And your explanations too.

[@tks8964]

I think it's really powerful

[@abhishekvishwanath8278]

Awesome man!! Thank you!!

[@FranciscoBourquin]

I love you!. You just saved me a bunch of time XOXO from Argentina ♥

[@TejaSwaroopArukoti]

Wonderful stuff I have learnt today. Thank you.

[@sofianebm7492]

nice trick kyle keep going !!!

[@fragrantbloom]

This was an amazing video! Thanks a lot Kyle!

[@riskacendana8085]

05:16&& "tab" for filling content shortcut🔥

[@riskacendana8085]

9:40&& instead of increment emmet

[@riskacendana8085]

02:10&& typing tag without bracket (shortcut)

[@headwaystudio]

Your videos have been so helpful on my DIY journey lol. Thanks a ton.

[@tfnsansu1727]

great work bro !!

[@dylanking000archive]

from the odin project. thanks for the great content.

[@damiantoczek8576]

You can get it also for Atom Editor. File > Settings > Install (search for emmet)

[@ambitiousperson2298]

Thank you so much, man your work is such pure gold keep going & thank you again

[@orangegd224]

Really helped me with the speed, thanks :)

[@ChristianPretorius]

Thanks Kyle! This is such a useful video!!

[@astroflexx82]

hello from the odin project!

[@Jonathan-lg1xw]

well this definately saves me a lot of time :) I knew I had shortcuts and so on in my ide, but never knew I could do all this!

[@kerryd2060]

Okay Kyle, I got up early this whole week. Will try it next week too. (-:

[@ajlebeau]

Mind blowing! Thank you!!

[@daemon491]

Great explanation. Nice work man. Can you please zoom the screen to the area we need to see. Watching on mobile is hard. Great info. Thanks

[@nonono6537]

fantastic video packed with info. thank you!!

[@muwongenicholas6281]

Wow.....thanks a lot man... this is so helpful

[@threeone6012]

Where has this been all my life?

[@shivammishra6381]

5:45 how can we select the child element in css like can we take a h1 inside a div and then enter the css for h1 as it will decrease my for creating a new div for h1 seperate que:- 6: 32 can we use something like ul*2>li*2 to create two ul with 2 li nested inside them

[@lisaweber9446]

Fabulous! Thanks - well organized and great voice

[@WebDevSimplified]

Thank you!

[@th1nhng0]

Im in love with ur videos

[@simonroyjonesuk]

Really useful and clear, Thanks so much.

[@guerra_dos_bichos]

i'm in love with emmet

[@___-_-_-_-_-_-_-_-_-___]

Thx for sharing dude 👍🏻

[@shewhocode]

Emmet is so useful for time saving

[@collinslumayi521]

Thank you Odin Project and peers

[@gnub3360]

1:32 okay and....done. great lesson!

[@ShermanSitter]

This is SO cool!!! I used this and didn't realize it...or how powerful it was. PS. I came from the clock tutorial. :)

[@kongzilla2897]

Thank you again Kyle ..I am your new subscriber now😁

[@junedkhan8453]

This is some awesome stuff.. Thanks :)

[@stevenwilt4450]

Wow it's really powerful, it's very powerful, really powerful, powerful

[@shewhocode]

Hello, I am here because I am taking up the Odin Project course :D

[@learningstuff5679]

Awesome video. Instant subscribe.

[@AGSTRANGERTunisianAuthor]

This was very helpful! Very grateful :)

[@ryan-heath]

“That’s really powerful!”

[@fatehgill5656]

this video is really powerful

[@mariaturzynska2712]

I see that you are using Enter key to convert emmet abbraviation to html. In 4:56 minute of the recording you converted html to emmet . What key did you use to toggle back from html to emmet

[@Expert-Shorthand]

I know Emmet it's amazing and work very quickly. I'm from Pakistan

[@harag9]

Great video, always wondered what you used for the quick snippets. e.g. "script", "link" etc. Thanks!

[@milton1406]

Fantastic! Thank you!

[@monketime2308]

Stay strong Odins!

[@uddhavsaikia739]

bro this just made me pause the video and see how cool this shit is....man!! damn

[@uddhavsaikia739]

*say

[@promiseebuka6102]

Thanks man, for this great tutorial😊😊

[@fluffydoggo]

First of all I didnt even know of class and id stacking, and then you had attributes too? Why am I not using this a lot. This legit would save me 30 mins to an hour for creating new HTML, CSS, and JS projects

[@Al_Gonzo]

Not only that, it helps you avoid making typos. Emmet is really useful in js too when you for example have to write "getElementById" quickly and without errors

[@codesiddhi]

Great vid! Well explained :)

[@mshamilna]

One of your best videos brothe thank you

[@WebDevSimplified]

Thank you so much!

[@md7071]

When I was learning react.js, JSX was really a strange to me but later on I found emmet supports too.