Step up your front-end skills with these 5 resources

SdĂ­let
VloĆŸit
  • čas pƙidĂĄn 5. 07. 2024
  • It can be hard to break away from tutorials and to start building things, but it's also the single most important thing you can do. Tutorials are great, but they won't help reinforce what you are learning, and won't push you to new levels like actual projects will. So here are some resources to help you get started!
    🔗 Links
    ✅ Frontend Mentor: www.frontendmentor.io
    ✅ Style Stage: stylestage.dev
    ✅ CSS Battle: cssbattle.dev/
    ✅ CodeWars: www.codewars.com/
    ✅ Frontend Practice: www.frontendpractice.com/
    ✅ First Timers Only: www.firsttimersonly.com/
    ⌚ Timestamps
    00:00 - Introduction
    01:39 - Frontend Mentor
    03:50 - Style Stage
    06:06 - CSS Battle and CodeWars
    07:38 - Frontend Practice
    10:01 - Open source
    #css
    --
    Come hang out with other dev's in my Discord Community
    💬 / discord
    Keep up to date with everything I'm up to
    ✉ www.kevinpowell.co/newsletter
    Come hang out with me live every Monday on Twitch!
    đŸ“ș / kevinpowellcss
    ---
    Help support my channel
    👹‍🎓 Get a course: www.kevinpowell.co/courses
    👕 Buy a shirt: teespring.com/stores/making-t...
    💖 Support me on Patreon: / kevinpowell
    ---
    My editor: VS Code - code.visualstudio.com/
    ---
    I'm on some other places on the internet too!
    If you'd like a behind the scenes and previews of what's coming up on my CZcams channel, make sure to follow me on Instagram and Twitter.
    Twitter: / kevinjpowell
    Codepen: codepen.io/kevinpowell/
    Github: github.com/kevin-powell
    ---
    And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!

Komentáƙe • 498

  • @VeaceslavBARBARII
    @VeaceslavBARBARII Pƙed 3 lety +679

    A tutorial on how to escape tutorials 😅

  • @designcode2009
    @designcode2009 Pƙed 3 lety +684

    “It works on my machine” 😂

  • @kingharji9170
    @kingharji9170 Pƙed 7 dny +1

    literally wonderful video
    01:39 - Frontend Mentor (Challenges)
    03:50 - Style Stage (Guidlines)
    06:06 - CSS Battle and CodeWars (Mastery in CSS)
    07:38 - Frontend Practice (Cloning)
    10:01 - Open source (Contribution in real projects)

  • @johantchassem1553
    @johantchassem1553 Pƙed 3 lety +86

    I love the quote "What you are seeking is also seeking you". This video exactly came in time. Thanks Kevin

  • @alessandrospiridigliozzi7943
    @alessandrospiridigliozzi7943 Pƙed 3 lety +160

    This is what I needed! I feel like I (like so many others) have been too eager to learn JS, after CSS, that I haven't made sure I had fully/properly learnt CSS. I have started working on some projects recently and realised that my CSS skills are still not as great as I thought!!!

    • @ameennazeer12
      @ameennazeer12 Pƙed 2 lety +7

      Same here man
      Im good at programming but so js and react was easy to pick up
      But nw I feel I lack CSS

    • @Semilore317
      @Semilore317 Pƙed rokem +2

      I'm in your position bro, still trying to upgrade.

    • @kamsiumeobi6128
      @kamsiumeobi6128 Pƙed rokem +1

      U feeling me

  • @MrJfergs
    @MrJfergs Pƙed 3 lety +417

    I still feel like I need to learn so much, styled components, typescript, graphql, apollo client, redux toolkit..ect. It feels overwhelming to be honest.

    • @tristanreid5770
      @tristanreid5770 Pƙed 3 lety +236

      I know that feeling! Some unsolicited advice: don't worry about learning everything, just learn one thing and try to apply it as much as possible. That way when you need to learn something else the need will be more clear, and the foundation will be stronger. "I fear not the man who has practiced 10,000 kicks once, but I fear the man who has practiced one kick 10,000 times." - Bruce Lee

    • @MrJfergs
      @MrJfergs Pƙed 3 lety +42

      @@tristanreid5770 Thanks I appreciate the feedback, I guess I'm just stressing since the pandemic I lost my more secure job and have been looking for developer jobs in the mean time, thinking I was ready to apply for them but in reality I still feel very far from that.

    • @rontoyhacao
      @rontoyhacao Pƙed 3 lety +35

      we're exactly on the same boat, i really want to focus on front-end and i've been wanting to rush things especially with js frameworks such as react but i know i'm not yet ready for it since i don't have much knowledge about javascript.

    • @AB-cn5hb
      @AB-cn5hb Pƙed 3 lety +17

      Trick is to not give a Fuck about everything. Learn one thing clearly at a label u feel confident that you are able to built something.

    • @evans8245
      @evans8245 Pƙed 3 lety

      Are you okay mate ?

  • @goannacs6861
    @goannacs6861 Pƙed rokem +45

    Your content feels so comforting. It feels like my journey begins to structure itself and I see some kind of road building that I want to take. I actually am part of codecademy pro and follow the Frontend Career Path - and don't get me wrong. I love it and it helped me to start somewhere. Else I would be so lost. And I have a sense of everything you need and it's easy to just get along. But it's super fast forward and you just have to follow steps and don't really need to think by yourself. There are small projects now and then when you finally have to do things on your own, but this is the moment you realize: shit, I actually don't know what to do. And you don't look up solutions but rather what to do anyway. And that's where I started to look for something beside codecademy (which was recommended by many anyways) and I found some tutorials, articles, videos and so on.
    But then I found you.
    And oh my...
    It's like having found my personal mentor who speaks exact my language and I just understand things all of a sudden.
    And by the way. I'm German and I don't speak English very often.
    It's just a blessing that I somehow can speak it kinda well and understand most things.
    And even though you don't try to speak slow kids English I still feel that you know how to communicate and it makes it so much easier for me.
    It may be your pronunciation or the tone? I don't know.
    Nevertheless you are my hero for now and I promise you I will sooner or later buy your pro courses. For now I am at some free courses and find video after Video an am just: đŸ€Ż
    Codecademy tells you what there is.
    Kevin tells you what that means.
    I'm 30 and I know there is hope to become some kind of developer. It's never too late and having a job that's fun probably is a bigger motivation for me than money.
    I just love this stuff but was too shy and scared my whole life to just do something useful.
    Instead I spent my day playing games and waiting for my last day on earth. Kinda sad I know 😅
    I'm married now and my wife believes in me and that's really helping alot.
    I will become someone I always wanted to be.
    🙂 Good luck to everyone and stay healthy. Physically and mentally.

    • @annah2943
      @annah2943 Pƙed rokem

      Perfectly said! Kevin, your video was recomended to me and I think it is hard to find someone who wants you to get comfortable at these first few stages so we aren't discouraged down the road

  • @AdamtheADHDev
    @AdamtheADHDev Pƙed 3 lety +14

    Kevin, you are my yoda. It's like you read my mind with what I am worried about and then create videos that offer a solution immediately. Your channel offers more value than pretty much any paid course I have found. Thank you!

  • @djordjek3916
    @djordjek3916 Pƙed 3 lety +18

    Another awesome video. That's exactly what I did. I started building projects on Frontend Mentor and I must admit, I became much more confident in my coding skills. I improved them so much. I also used a Frontend Mentor project for my first project where I used Sass and I succeeded and felt great!
    Thank you very much Kevin once again for this awesome video.
    Practice is everything!

  • @Dr01nE
    @Dr01nE Pƙed 3 lety +18

    just what i needed. applying for a frontend position coming from a full stack developer

  • @shenellepeart2365
    @shenellepeart2365 Pƙed 3 lety +38

    You have perfect timing, This is exactly what I needed. 😃😃😃

  • @jorgesoria139
    @jorgesoria139 Pƙed 2 lety +3

    Thank you so much Kevin Powell!!!!. I've been stuck in tutorial hell for 3 weeks. Now, I feel free and unafraid to start all over again and do things on my own, you are an amazing mentor.

  • @HyperBuddy
    @HyperBuddy Pƙed 3 lety +6

    Thank you so much Kevin, i was beginning to feel so lost in the tutorials. This really helps!

  • @nirajgupta73
    @nirajgupta73 Pƙed 3 lety +5

    This might be the most valuable video I have seen in a long long time.

  • @ChrisPirillo147
    @ChrisPirillo147 Pƙed 3 lety +6

    Perfect time for this! I've been looking for a video like this :)

  • @GoWokeGoBroke1
    @GoWokeGoBroke1 Pƙed 3 lety +119

    Kevin, frontendmentor sounds like the thing I was missing. Thanks a lot! I wouldn't have found it if it weren't for you!

    • @ChunkySalsa_BSU
      @ChunkySalsa_BSU Pƙed 3 lety +5

      I did my first challenge today. :3
      And I totally agree!

    • @Six5
      @Six5 Pƙed 2 lety +1

      @@ChunkySalsa_BSU did u get better

    • @jeklo3713
      @jeklo3713 Pƙed 2 lety

      @@Six5 did u get better to

    • @gandeAJ
      @gandeAJ Pƙed 2 lety

      @@jeklo3713 did u get better

    • @snehamoy
      @snehamoy Pƙed 2 lety

      @@gandeAJ yes I definitely did.. feels like I am actually going somewhere

  • @deepakarya5310
    @deepakarya5310 Pƙed 3 lety +4

    omg ...you can't believe how much i needed this...thank you so much for this

  • @mahnewr
    @mahnewr Pƙed 6 měsĂ­ci

    i can't believe how perfectly timed this video showing up in my recommendations was. it's exactly what i needed, thank you

  • @mystupidbrain5299
    @mystupidbrain5299 Pƙed 3 lety +3

    You are just an awesome dude. Thank you for all you do. Got your flexbox course and Scrimba courses. You are an amazing teacher.

  • @dragonarch0
    @dragonarch0 Pƙed 3 lety

    I am just starting out in front-end game and this appears in my recommendation. Bless you for saving my time looking for resources.

  • @benrogers8390
    @benrogers8390 Pƙed 3 lety +1

    This... This is the exact problem I've been struggling with the past few weeks. Thank you so much!

  • @Ghost-my1tr
    @Ghost-my1tr Pƙed 3 lety +1

    Thank you for this video!!! I'm now looking forward to the weekend so I can start actually practicing what I've been learning

  • @fahimmahmud3115
    @fahimmahmud3115 Pƙed 2 lety +9

    I found your channel as a random CZcams suggestion entitled "Challenging the CSS king to a CSS battle", may be it was Kyle from Web Dev simplified. And I am so glad that I found you and this video in particular. You seem like a really nice guy and I believe you really ARE a nice guy. Thanks for all the great tips.
    Love from Bangladesh.

    • @KevinPowell
      @KevinPowell  Pƙed 2 lety +2

      Yeah, if you enjoyed that one I had a rematch with him here on my channel :)
      Glad you're enjoying my other videos :D

  • @csshtmlwebdesign5301
    @csshtmlwebdesign5301 Pƙed 3 lety +4

    just what i needed to challenge myself with some real life projects! Thank you so much for sharing these Kevin! :)

  • @israelsolomonetuk3455
    @israelsolomonetuk3455 Pƙed rokem +1

    Thanks Kevin for this. You really opened my eyes to see that I do not fall into tutorial hell and to learn by building projects.

  • @iamreg1965
    @iamreg1965 Pƙed 2 lety +1

    Cheers Kevin.
    Excellent set of routes into expanding ones experience and skills into the wider community.

  • @mksk20
    @mksk20 Pƙed 5 měsĂ­ci +1

    I've just recently over 2 months ago started and my journey with frontend and your video is very helpful.

  • @l4706
    @l4706 Pƙed 3 lety +3

    Thank you so much Kevin! May God bless you my friend. I was stuck at the exact point at which you were talking about in the video.

  • @nuri00ko
    @nuri00ko Pƙed 3 lety +2

    Totally digging your shirt! Thanks for all of the cool next-level resources!

  • @pulserudeus7968
    @pulserudeus7968 Pƙed 3 lety +1

    Thank you for this amazing resources, you're giving light to my frontend pathđŸ”„ Been searching things on what should I do next and always get stuck, and here's the answerđŸ”„đŸ”„đŸ”„

  • @ysteinellingsen5692
    @ysteinellingsen5692 Pƙed 3 lety

    Thank you for paving the way for so many of us!!! :-)
    It means a lot for many people :-D

  • @rishabhjha9869
    @rishabhjha9869 Pƙed 2 lety

    This video is a gem. Thanks for all the resources.
    TIME TO UP THE GAME!

  • @zoominedits770
    @zoominedits770 Pƙed rokem

    i can not imagine where i would be without your videos man!!

  • @bapynshngain
    @bapynshngain Pƙed 3 lety +2

    Thank you so much for this. I just started on front-end developing in college and I've been going through too many tutorials and a thought came in my mind that only going through tutorials won't help me much in the long run. I need to try these sites you mentioned. đŸ€©

  • @okarts800
    @okarts800 Pƙed 3 lety +3

    Thank you very much kevin, I was really in search of such an amazing kind of website where I can challenge myself, thank you once again â˜ș

  • @philjacks8531
    @philjacks8531 Pƙed 3 lety

    These are some amazing resources that I'm gunna start using straight away! Thanks man

  • @ujjwol
    @ujjwol Pƙed 3 lety +2

    This will help a lot of people.
    As it already helped me so much.
    Thanks.

  • @malloryberthome4883
    @malloryberthome4883 Pƙed 3 lety

    What an amazing video ! I was so excited when I saw the thumbnail pp up in my suggestions and the content doesn't disappoint ! Amazing video, thanks a lot !

  • @mpb0406
    @mpb0406 Pƙed 3 lety

    Great video. I've messed around with CSS battle a little before but the other resources I've never heard of. I'll definitely be trying them out.

  • @george003
    @george003 Pƙed 2 lety +1

    I played, CSS battle seemed fun and very addictive I hope you continue making more videos with your battles, very interesting list,
    Thank you Kevin!

  • @pepperoni4045
    @pepperoni4045 Pƙed 3 lety

    I was worried about when to start a project and how and your vids came up on the recommendation. Great video, very helpful for beginners

  • @iyanuoluwasowande8447
    @iyanuoluwasowande8447 Pƙed 3 lety

    This might be the best thing I’ve found on CZcams
    Thank you đŸ‘đŸœ

  • @krisnarusdiono1304
    @krisnarusdiono1304 Pƙed 3 lety

    you are amazing, kevin. i really glad to subs your channel. i am a new learner on this field and i learn by myself. i do some research to get a good path and when i dropped here i love to make you become my mentor. thanks and keep creating

  • @adison2117
    @adison2117 Pƙed 3 lety +1

    I have recently started my frontend adventure and you come with stuff like this. Subscribed!

  • @jamesrprince
    @jamesrprince Pƙed 3 lety +2

    Thank you for the video @Kevin Powell. Been circling through tutorials like crazy.

  • @AmberyTear
    @AmberyTear Pƙed 3 lety

    I was stuck in tutorial hell for the past week which is unusual for me and I didn't know what to do next. This is super helpful, thank you.

  • @aikuaza7115
    @aikuaza7115 Pƙed 2 lety

    Wooow!! I'm first time in this channel and this is really good stuff!!đŸ”„đŸ”„

  • @bartv6924
    @bartv6924 Pƙed 3 lety +1

    What an amazing video! I am so glad this popped up in my recommendations!

  • @dcaffed9078
    @dcaffed9078 Pƙed rokem +1

    Thank you Kevin. This is just what I needed on my journey.

  • @sivasankar5036
    @sivasankar5036 Pƙed 3 lety

    you're my god sir,your video is recommended to in such a dire situation and I got improved my css tricks

  • @shaderone07
    @shaderone07 Pƙed 3 lety +2

    Just what I needed. Thank you Kevin.

  • @Bengadeer
    @Bengadeer Pƙed 3 lety

    Excellent video. Nice to hear validating advice once in a while. Motivation is the name of the game.

  • @yacoubmahamat7651
    @yacoubmahamat7651 Pƙed 3 lety

    Thank you so much really was looking for something like this. Finally some good help instead of just saying start building. Thank you your channel really helped out

  • @juliomolina8972
    @juliomolina8972 Pƙed 3 lety +1

    Lots of awesome resources. Thank you Kevin! ❀

  • @mbcxdlr2
    @mbcxdlr2 Pƙed 3 lety

    Excellent resources I wish I'd known about before. CSS battle is ideal for me right now. Thanks Kevin!

  • @travisalstrand4237
    @travisalstrand4237 Pƙed 2 lety

    As always, YOU'RE THE MAN!! Thank you!

  • @moonlightluddite
    @moonlightluddite Pƙed 2 lety +7

    Frontendmentor is super awesome, one awesome thing is that it points out accessibility and html problems when you submit your solution, I'll definitely recommend it.

  • @averageguy985
    @averageguy985 Pƙed 2 lety

    I literally was crying watching this video! It helped tons! Thanks mate :)

  • @kladdelic
    @kladdelic Pƙed 3 lety +10

    Cool video Kevin. :)
    I remember taking a frontendmentor challenge mid last year, built some project with Tailwind there. It was a pretty smooth experience, definitely great for beginners. :)

    • @f_USAF-Lt.G
      @f_USAF-Lt.G Pƙed 2 lety

      Funny thing about beginner projects... Adding focus challenges makes it a game for deepening skills learning. 😁

  • @charliesanmanansala4544
    @charliesanmanansala4544 Pƙed 3 lety

    I learned fundamentals and and basic, now i was stocked on it, this video helped me what should i do next. thanks man.

  • @rl6382
    @rl6382 Pƙed rokem

    Dude you literally make such good videos to direct those of us who have the passion to learn. Thanks so much for providing the service that you do for free ❀

  • @mpilodlamini271
    @mpilodlamini271 Pƙed 3 lety

    Thank you for this. I am really excited about firsttimers only

  • @andreschavarria7091
    @andreschavarria7091 Pƙed 3 lety +1

    I needed this video, thanks Kevin!

  • @HafizRahmanBD
    @HafizRahmanBD Pƙed 3 lety

    You made my life easy Kevin. Thanks, brother.

  • @jiteshkumarsahoo2830
    @jiteshkumarsahoo2830 Pƙed 3 lety

    Thanks Kevin! Man this community is awesome !

  • @drivan2391
    @drivan2391 Pƙed rokem

    You're the best of the best. you really made me to gain more knowledge and improve my Css while i was struggling with it thank you dear.

  • @JBurky15
    @JBurky15 Pƙed 3 lety +2

    I just started applying to jobs this week and this video is perfect, I feel likeI could use as much extra practice as possible now.

    • @g7k993
      @g7k993 Pƙed 3 lety

      Got a job yet?

  • @drboxys
    @drboxys Pƙed 3 lety +1

    Just begann with html and css :) thanks for the great links!

  • @prithvirajk7455
    @prithvirajk7455 Pƙed 3 lety +1

    Very informative and much needed. Thanks for the effort.

  • @smolenbyy
    @smolenbyy Pƙed rokem

    Thank you so much for these!! I’ve been struggling to go forward with my coding because I know all of the basics of HTML and most of CSS but it’s easier to apply if I can do it in a real world scenario

  • @stalonfernandes
    @stalonfernandes Pƙed 3 lety

    I Like How Everyone’s Making Video On The Same Topic ! Great Work Btw ❀

  • @asfandyar687
    @asfandyar687 Pƙed 3 lety +1

    exactly what I needed! Thanks a lot Kevin

  • @haythamkenway1561
    @haythamkenway1561 Pƙed 3 lety +2

    You forgot to name your channel ! you have great videos and helping a lot

  • @arafaterasung3280
    @arafaterasung3280 Pƙed 2 lety

    these are very good resources, I never heard of any except Code wars thanks KP for putting in the work to help
    us beginners

  • @cssbattle
    @cssbattle Pƙed 3 lety

    yay! Thanks for including CSSBattle in the list Kevin! 😃

  • @eihab
    @eihab Pƙed 3 lety +1

    These are some really cool resources, thank you Kevin.

  • @divyanshpandey9140
    @divyanshpandey9140 Pƙed 3 lety +2

    Another helpful video Kevin, Keep uploading these helpful content.

  • @johndoggett4657
    @johndoggett4657 Pƙed 3 lety +1

    Just video I needed. Thanks Kevin.

  • @jkmorbo
    @jkmorbo Pƙed 3 lety

    Thanks for introducing me to Frontend Challenge. I'll have to try this as I'm getting back into web dev and am pretty rusty.

  • @hanydagger7009
    @hanydagger7009 Pƙed 2 lety

    Thank you Kevin, I was lost. I really appreciate all your efforts. You are really a great teacher. I would really be glad if you noticed my comment.

  • @Pollllz
    @Pollllz Pƙed 2 lety

    Thanks for this video, Kevin. I’m a UX designer currently learning web dev skills. Your videos are brilliant and like having a front end mentor right in my pocket 😊

  • @theoglossa
    @theoglossa Pƙed 3 lety

    Thanks for this. You really have helpful resources. I'm following through your course on responsiveness

  • @mohammadqawaqneh1455
    @mohammadqawaqneh1455 Pƙed 3 lety +2

    Thanks a lot!
    Appreciate your effort Kevin
    Keep going 👏👌.

  • @RobertMcGovernTarasis
    @RobertMcGovernTarasis Pƙed 2 lety

    Great suggestions. FrontEnd Mentor for me is ideal for me as I learn (I signed up 11 months ago, although then didn’t do any learning the last 9 months 
 brain fog). Just picking it up again now. I’m a ways of from doing Style Stage. First timers only sounds useful. Going to check in out in a moment. Also need to finish your CSS course (again haven’t touch for ages)

  • @darrienjohnson9053
    @darrienjohnson9053 Pƙed 3 lety +1

    This was amazing. Appreciate all the gems 💎

  • @mohamedabdi2613
    @mohamedabdi2613 Pƙed 3 lety

    Thank you for all these resources Kevin.

  • @DesignwithCracka
    @DesignwithCracka Pƙed 3 lety

    Thanks for this! I love you new setup!

  • @liampugh4705
    @liampugh4705 Pƙed 3 lety +2

    Perfect timing to release this video for me personally

  • @astrodas1910
    @astrodas1910 Pƙed 2 lety +1

    Thank you so much! I'm close to finishing my first set of tutorials (still so much to go:) ) and was thinking to get my hands dirty on what I've learnt so far. These resources are gonna help me a lot.

    • @f_USAF-Lt.G
      @f_USAF-Lt.G Pƙed 2 lety

      It's really great that he advocates Open Source... It's a great chance to learn special needs web accessibility, while putting to practice learned skills that are rewarding AS a service & AS furthering career with UI/UX direct experience

  • @Mcata96
    @Mcata96 Pƙed 3 lety +1

    Thanks a lot! It is really useful! I'm going to check First Timer right away looks really great to me.

  • @sungjuyea4627
    @sungjuyea4627 Pƙed 3 lety +11

    So impressed. Usually these kinds of videos 'almost always' contain some ads about the websites or companies the author is running at the moment, but in this video, NONE of such.

    • @4thfugee
      @4thfugee Pƙed 3 lety

      đŸ™ŒđŸŸđŸ™ŒđŸŸđŸ™ŒđŸŸ

    • @f_USAF-Lt.G
      @f_USAF-Lt.G Pƙed 2 lety

      And that promo for Open Source!! Brings a give and get that's as rewarding in service as it's rewarding in career development!!

  • @vandelio_
    @vandelio_ Pƙed 3 lety

    Thats pretty cool. I also started creating websites for fun in the late 90's at age 12,
    then studied completely other stuff, and went back to becoming a frontend Dev. 👍

  • @jorgesaxon3781
    @jorgesaxon3781 Pƙed 3 lety

    Thank you, This might be most useful video I have seen in my life

  • @ahmed_hamza7372
    @ahmed_hamza7372 Pƙed 3 lety

    great job dude
    just the tutorial I was looking for. 😊

  • @Aaam1rK
    @Aaam1rK Pƙed 3 lety

    Cool video man, subscribed!

  • @2breborn247
    @2breborn247 Pƙed 3 lety

    Can't wait to try some of these out!

  • @lifeisniche
    @lifeisniche Pƙed 3 lety +3

    thank you so much for sharing this amazing information sir. Everything is bookmarked and I will be visiting them soon 😉😉

  • @nnamdinwolisa8771
    @nnamdinwolisa8771 Pƙed rokem

    How am I just seeing this videođŸ˜©. Thank you so much Kevin, really awesome tips here.

  • @AmaanDevelops
    @AmaanDevelops Pƙed rokem

    Thank you, your videos are truly invaluable!

  • @Alex-dv5dd
    @Alex-dv5dd Pƙed 3 lety +2

    Great video again thank you so much Kevin !