How to take your front-end skills TO THE MOON

Sdílet
Vložit
  • čas přidán 9. 07. 2024
  • Watch as I explain 5 steps to help you level up your frontend game and walk you through a neat tutorial too. The tutorial design is sourced from the Palette Supply website, link below!
    The icons I use: fontawesome.com/referral?a=75...
    Support the channel: ko-fi.com/hyperplexed (accepts PayPal, card, etc).
    CodePen: cdpn.io/VwXXPKJ
    Palette Supply: palette.supply
    Inspiration source: godly.website
    Other sites used:
    staratlas.com
    brand.twitch.tv
    www.viture.com
    Music Credits:
    Lime Soda - StreamBeats - Lofi - Harris Heller

Komentáře • 245

  • @odonatojunior
    @odonatojunior Před rokem +269

    Your channel is one of the best things I've found this year (and we're just halfway there)
    Thought it was just tutorials but it's amazing when someone remember ourselves about how great we can be just by trying

  • @andrewwoan
    @andrewwoan Před rokem +154

    Videos like these are rare, but extremely value, especially for 100% self-taught developers who have no guidance and no clue where to start. Learning how to learn is an important skill and there are a lot of fundamentals that can help this learning how to learn process (like the thought processes in this video I use a lot).
    Another example for this is the developer tools for me, I learned a lot about HTML structure and what CSS properties and being animated, and other things I've never seen in typical CSS tutorials. The network tab introduced to me different files I never heard of before like .ogg for audio/ webp for images etc. etc.. "Why did they use webp instead of jpg?" I ask myself, and when I google it I realize it's because webp is much smaller. etc.
    I could go on forever, but I wish someone told me how to learn (like this video) when I was first starting out. This is beautiful content.

    • @Hyperplexed
      @Hyperplexed  Před rokem +19

      Thank you for the kind words. Yep, that is such a great way to learn! And glad you are getting some value from the vids, makes me happy to hear.

    • @leviathancodm3659
      @leviathancodm3659 Před rokem +2

      @@Hyperplexed Hey, how about at 2:20, instead of doing it that way, we determine on which rectangle the mouse is hovering and then pan the view so that the rectangle moves to the center?

  • @DiegoSita
    @DiegoSita Před rokem +58

    I'm a mathematician and musician. I take these exact steps when making music or solving problems, and it really works. I believe everyone who's creating something or solving a complex problem actually does that, either knowingly or unknowingly (Like me). Seeking for inspiration, then breaking it all apart and executing the plan step by step is definitely the key to achieving success when coming up with good ideas.

  • @ryuu8027
    @ryuu8027 Před rokem +1

    Amazing work your videos just keep getting better and better also I really needed that extra motivation!

  • @Way_Of_The_Light
    @Way_Of_The_Light Před rokem +22

    You're a reeeeeeaaaaalllllyyy goood teacher man! Please keep making tutorials 🙏 just subscribed! your channel will definitely blow up!!

  • @PoorlySoup
    @PoorlySoup Před rokem +6

    The way you explain your thought process and show how you iterate on your work after running into errors/unexpected behaviour is what makes these videos the best developer videos I've seen. Thank you.

  • @kaurmanjot
    @kaurmanjot Před rokem +2

    I really feel grateful for having subscribed to your channel. Your channel is a unique one, from redesigning websites to motivating others, it is everything. Keep up the good work ☺️✨

  • @Ahmed-sr6gv
    @Ahmed-sr6gv Před rokem +2

    You're awesome, man!!
    I really hope wish you create a frontend course as your videos are both helpful and incredibly entertaining 🌟

  • @clayzz5695
    @clayzz5695 Před rokem +2

    Honestly, this is a really HELPFUL video for me. And I believe for a lot of people that've been self taught their self to programming especially in Front-end. The way you explain and wrap it in your video AND in less than 10 minutes, yet all the point is still pretty clear is a damn great!

  • @standleypeter545
    @standleypeter545 Před rokem

    So glad I found your channel. So hard to find astonishing channel such as this.

  • @SmokeAlarmBeeps
    @SmokeAlarmBeeps Před rokem +1

    There's very few videos on the internet that make me stop what I'm doing and inspire me to take notes. Thank you!

  • @HopingTree
    @HopingTree Před rokem +4

    Your approach is unlike anyone else I’ve seen on CZcams. Thank you for your creativity in teaching.

  • @sanchopansa7732
    @sanchopansa7732 Před rokem

    Great stuff mate! Thanks for all the work you put into this

  • @shairasaldua7180
    @shairasaldua7180 Před rokem +1

    This is the most useful front-end tutorial i have found. How to be not overwhelm things and how people break down the problems or their thought process in creating

  • @its_r4y
    @its_r4y Před 11 měsíci

    I've watched some of your recent videos today and after watching this, I understand that I need you support you because the amount of benefit I am getting from your videos are insane. It makes me to fall in love with frontend again

  • @robruizr
    @robruizr Před měsícem

    I think this just became my favourite video in all CZcams. Ever.

  • @nedalturas
    @nedalturas Před rokem +3

    I am having problems with my front-end skills, I tried to create designs and sometimes I ran into a problem that makes me demotivated to continue. I am so thankful I found this channel it helped me to re develop myself. I tried to design in a small steps that I can actually manage.

  • @crimedogs
    @crimedogs Před rokem

    Cool. Thanks man! Its so important to see inspiraton! I love this video!

  • @heyjohanna765
    @heyjohanna765 Před rokem +1

    I can't even begin to explain how much I appreciate your content! I am just starting out as a front-end developer trying to transition from design into development. I am CONSTANTLY weighed down by imposter syndrome and overwhelming thoughts that I am not good enough or not smart enough. Watching your lovely, 5-10 minute videos explaining in your calm and encouraging voice how to create interfaces I would never have been able to do by myself in a way that breaks it down, is simple, easy to understand and tackles the problem one step at a time really encourages me that with practice and a shifted mindset, I can do this too.
    Thank you so much for your videos, they make me laugh, they help me learn, and they encourage and excite me to work on projects or improve my previous projects. You are forever my favourite coding channel!

  • @mikejakusz1493
    @mikejakusz1493 Před rokem

    Love your content! They make me happy, they are simple but very mentally pleasing :)

  • @felipeleon6631
    @felipeleon6631 Před rokem

    What a great advice and an excellent way of expresing it

  • @pupinarvaja
    @pupinarvaja Před rokem

    You make learning and problem solving so much fun and interesting. Thank you very much for your videos

  • @durgeshanand6774
    @durgeshanand6774 Před 6 měsíci

    woah man you blew up my mind ..did not get you fully at the beginning but when you demonstrated i feel like im gonna do it now even though i have only basic css knowledge

  • @selvasuriya001
    @selvasuriya001 Před rokem

    Your videos are gold mine for learning front end development.

  • @MrFiregem
    @MrFiregem Před rokem

    Wow you are actually beyond, thank you so much for the inspiration.

  • @illiayershov977
    @illiayershov977 Před rokem

    Bro, your videos are so cool, thank you very much!

  • @manash.b4892
    @manash.b4892 Před rokem

    What a good way to start my day. Thank you! 🙇‍♂️

  • @LautaroRecabarrenXV
    @LautaroRecabarrenXV Před rokem

    You have helped me beyond practical skills and theoretical knowledge. Thanks to your videos I know that I can be able to make a living from this, have confidence in my abilities. Thank you very much for your videos! encourage many more people with this invisible but existing side.

  • @knwkn1
    @knwkn1 Před rokem

    I needed this today

  • @DiegoMatela
    @DiegoMatela Před rokem

    Dude I love you so much thank you for your channel hope you won't stop doing this....

  • @yusuferenislim162
    @yusuferenislim162 Před rokem +1

    "Genius, absolutely genius."

  • @weareloved
    @weareloved Před rokem

    Wow Thank you so much for your video !!! I’m ready to deep dive NOW!!!!!!

  • @HardHitMag
    @HardHitMag Před 3 měsíci

    Very helpful! Thank you

  • @bc4198
    @bc4198 Před rokem

    Fantastic, thank you!

  • @macielthales
    @macielthales Před rokem

    Awesome explanations. U literally proof that famous phrase: Think twice, code once. All the best!

  • @brew2779
    @brew2779 Před rokem

    This channel is awesome. This channel actually inspires me to continue coding.

  • @AbDevSec
    @AbDevSec Před rokem

    you are the best inspiration thanks for everything

  • @hanshangyan1512
    @hanshangyan1512 Před rokem

    Great content. Thank you Sir!

  • @salman-asghar
    @salman-asghar Před rokem

    Most amazing video I have seen ever on youtube.

  • @raymondmichael4987
    @raymondmichael4987 Před 8 měsíci

    Buddy!!
    You become my Netflix now, very inspirational and motivational 😊❤

  • @p0r5ch3911
    @p0r5ch3911 Před 4 měsíci

    I am a Front-end developer myself and whenever I have seen one of your videos I check if I already subscribed to you. You really take out the pressure and show that everything is doable if think about it.

  • @retroplayyt
    @retroplayyt Před rokem

    this is an awesome video, thank you sir more success to you

  • @__lasevix_
    @__lasevix_ Před rokem

    Legitimately the new best education video I have seen

  • @sagarbharati1438
    @sagarbharati1438 Před rokem

    Your CZcams videos are my inspiration

  • @imnbmusic
    @imnbmusic Před rokem

    really great video making
    and explaining

  • @nayanbramhane8077
    @nayanbramhane8077 Před rokem

    quite inspirational it is,
    IAADR fits in every field of computer science not only in frontend,
    Thankyou so much❤❤

  • @AdrianMark
    @AdrianMark Před rokem +1

    S tier front end advice. I cannot wait. I just cannot wait for you to make your Masterclass. Just please take my money already.

  • @khemikalse
    @khemikalse Před rokem

    This channel is fire!

  • @juanchoferro3193
    @juanchoferro3193 Před 11 měsíci

    Love it!!!

  • @zyta182
    @zyta182 Před 10 měsíci

    You are my inspiration to become a front-end developer. I'm grateful I found you.

  • @hyperqwerty1609
    @hyperqwerty1609 Před rokem

    your incredible voice is my inspiration

  • @HocineKamikaz
    @HocineKamikaz Před rokem

    Amazing content ❤️

  • @chenlim2165
    @chenlim2165 Před 7 měsíci

    Holy cow, learned a new word today... analyzation, and also learned that I've been misusing "analysis" my whole life. Wow, this was indeed a life-changing video!

  • @renataschapke6263
    @renataschapke6263 Před rokem

    So inspiring!! I have just begun development study, like a month ago. And the insecurity is always with me. Tk’s!! Xxx from 🇧🇷

  • @harmez7
    @harmez7 Před rokem

    that was gooooood. subscribed

  • @SeanSolano
    @SeanSolano Před rokem +1

    i love this channel

  • @dssdfsfddsf3761
    @dssdfsfddsf3761 Před 2 měsíci

    You are my inspirator ! ) thanks.

  • @kabirlele8522
    @kabirlele8522 Před rokem

    Wow this is some top tier videos you will find on CZcams

  • @isanrodrigueztrimino6701

    I don't understand why this channel doesn't have more subscribers

  • @oliwierkuczynski5242
    @oliwierkuczynski5242 Před rokem

    Awesome man

  • @aloobre
    @aloobre Před rokem +6

    This channel is really becoming my psychologist. I'm learning to think more like the video suggests but alos loving the content overall. Please never stop doing what you're doing! ❤

  • @omersabic8555
    @omersabic8555 Před rokem +5

    Love the video! Will 100% use this next time I get a weird looking figma file that I need to convert to a website. Thanks for the amazing content man, looking forward to the next one

  • @veecks
    @veecks Před rokem

    Finished the video and realized you made the effect in a dark theme haha, now it's your mark! Nice video!

    • @veecks
      @veecks Před rokem

      Maybe your bot need some training haha

  • @darlonhenrisouza8555
    @darlonhenrisouza8555 Před 9 měsíci

    Actually that's my favorite CZcams channel, please do more videos

  • @codenekoplays
    @codenekoplays Před rokem

    great tip .. thank you

  • @7days280
    @7days280 Před rokem

    this channel is hellla underrated

  • @massi368
    @massi368 Před rokem

    super cool i like your videos continue please i'll wait for the next

  • @GuitarSlayer136
    @GuitarSlayer136 Před rokem

    The part with the panning not working and you trying several obvious solutions that immediately failed really helped my imposter syndrome.

  • @grow-evolve
    @grow-evolve Před rokem

    You know it went deep when it’s described in that level of detail.

  • @shermanperez3386
    @shermanperez3386 Před 4 měsíci

    Thanks! :D

  • @FilledStacks
    @FilledStacks Před rokem

    Great breakdown. I'll point devs towards this that ask me this question.

  • @lisandrosormani3469
    @lisandrosormani3469 Před rokem

    I like this guy! He is to funny and teach very well

  • @ProfessorThock
    @ProfessorThock Před rokem

    What an amazing channel

  • @go_better
    @go_better Před 11 měsíci

    Thank you

  • @fernandobaroni1497
    @fernandobaroni1497 Před rokem

    Wow, nice content!

  • @Skorupa9
    @Skorupa9 Před rokem

    Good motivation

  • @nabiltriaki8890
    @nabiltriaki8890 Před rokem +1

    that last joke got me gooooooood XD i thought you going to connect the act of catching a fish to that concept IAADR

  • @thanh_12
    @thanh_12 Před rokem

    this is really cool

  • @kdot78
    @kdot78 Před rokem

    excellent

  • @patricklepamplemousse884

    I discovered your channel recently and I have to say that I’m impressed by the quality. Also if I may add my touch what you can do is build like a dictionnary with code snippets that you can access later on if you struggle that helped me alot so maybe you too :)

  • @cpcheatsmonster
    @cpcheatsmonster Před rokem

    amazing :)

  • @mookiewookie7444
    @mookiewookie7444 Před rokem

  • @NoahSteckley
    @NoahSteckley Před rokem

    That kind of bizarre “Why can I see the ____” bug scenario happens constantly, I’m so glad to see that really is just how this stuff works for everyone

  • @RegularEverydayNormalGuy

    I am amazed at your ability to help us overcome imposter syndrome, simply thank you!

  • @tharnos767
    @tharnos767 Před rokem +5

    Love your videos, very high quality!
    The biggest problem I have when working on front end is with mobile phones. For example, the design in this video looks nice on desktop but I have no idea how you could make it work (or even look similar) on small screens.
    Could you maybe do a video for tips & tricks and/or good practices when having phones in mind? I understand that the best way is to start from phones and scale up, but what if you only have a design for desktop?

    • @Hyperplexed
      @Hyperplexed  Před rokem +3

      Thanks so much! Yeah that's a great question, it's definitely a different perspective when considering mobile. I would say there's cases where it makes sense to tailor an experience specific to desktop or specific to mobile, but a lot of times you do want to cover both. I will definitely add this to the list for a future vid. Appreciate the content idea too!

  • @tropicalverktaki
    @tropicalverktaki Před rokem

    Wholesome content right here, folks

  • @sullylastname7088
    @sullylastname7088 Před rokem

    This channel is gonna be the reason I get a SWE job. Quote me on this in two years

  • @zcelmacasling2146
    @zcelmacasling2146 Před rokem

    Broo got quality contents

  • @abdalmalk_kasem
    @abdalmalk_kasem Před rokem

    i love it😂❤

  • @sanampakuwal
    @sanampakuwal Před rokem

    Best video if the viewer is smart enough to catch it!

  • @adityaroshan1688
    @adityaroshan1688 Před rokem

    That's what I was searching for mindset for css

  • @Calupp
    @Calupp Před rokem

    That B-roll of the old guy being 'inspired' by his phone 😂💀

  • @larryd9577
    @larryd9577 Před rokem

    Thanks for keeping some intermediate mistakes. Makes it more believable.

  • @euphoria1106
    @euphoria1106 Před rokem

    Great video💜️ can you tell me how to create videos like this. I need to create one for a presentation. Is there any tools

  • @Cahnisama
    @Cahnisama Před rokem +3

    2:50 How to draw an owl.

  • @monsieurkeyboard
    @monsieurkeyboard Před rokem

    Oh yeah, Banks ATMs are well known for very sleek, modern and practical interfaces that will totally catch your eye.

  • @felixst-gelais6722
    @felixst-gelais6722 Před rokem

    the 2/3rds of these tips apply to a lot more than web design tbh

  • @ericdimarzio5756
    @ericdimarzio5756 Před 9 měsíci

    “Voila! No, wait. Multiply by “-1” and… Voila!”
    😂😂😂
    Laughing at things a front end dev would laugh at makes me feel less like an imposter.

  • @victor-ling
    @victor-ling Před rokem +1

    I definitely struggle with the fear that I am not creative enough to be a frontend developer ... and I've been a professional frontend developer for 8 years now! I'm very good at the technical and not so great with the pretty, so these steps apply to even those of us in the industry who also want to be better!

  • @Rep-L4Y
    @Rep-L4Y Před rokem

    WOOOOW