I Built A Snake Game By Reversing A Linked List (JavaScript & React project tutorial)

Sdílet
Vložit
  • čas přidán 27. 08. 2024

Komentáře • 158

  • @clem
    @clem  Před 3 lety +197

    "You'll never have to reverse a linked list on the job."
    *Clement has entered the chat.*

    • @tanmaygautam1348
      @tanmaygautam1348 Před 3 lety +3

      that's why I don't like coding interview 😭

    • @leonig01
      @leonig01 Před 3 lety

      I actually had to reverse a linked list on a couple of interviews. Tbh, not sure I could do it now out of the blue.

    • @charlest3788
      @charlest3788 Před 3 lety

      Huge fan of you man! You are an inspiration to newcomers in tech. Keep up the work

    • @MrBot1337
      @MrBot1337 Před 3 lety +1

      If only we could make snake on the job 😂

    • @themarksmith
      @themarksmith Před 3 lety

      Did you use a js framework for parts of the alogoexpert site or is it all plain js?

  • @YourAverageTechBro
    @YourAverageTechBro Před 3 lety +105

    Hahaha wow, never thought the day would come where reversing a linked list would actually be used. Impressive stuff!

    • @oinkinator2
      @oinkinator2 Před 3 lety +1

      Woah! I love your channel haha. Didn’t expect to see you here!

    • @su4onokzhe
      @su4onokzhe Před 3 lety +1

      But the day when it’s actually needed has not come yet

  • @zioping
    @zioping Před 3 lety +31

    2:58 hearing it with eyes closed made chuckle

    • @clem
      @clem  Před 3 lety +2

      😂

    • @DylanSterling
      @DylanSterling Před 3 lety +1

      @@clem Is there a “No Context Clément” Twitter account? Because this might need to happen.

  • @hemanthkotagiri8865
    @hemanthkotagiri8865 Před 3 lety +51

    The ad that I got on this video: "So you know how to reverse a linked list, but do you know how to design a large scale distributed system?"
    Wow, perfect timing.

    • @clem
      @clem  Před 3 lety +41

      Next project: *I Built A Large-Scale Distributed Multiplayer Version Of The Snake Game*

    • @hemanthkotagiri8865
      @hemanthkotagiri8865 Před 3 lety +3

      @@clem Looking forward to it.

    • @soumyashreepatra6224
      @soumyashreepatra6224 Před 3 lety

      @@clem plzz do. It'll be awesome to see

  • @amitkalay5131
    @amitkalay5131 Před 2 lety +1

    Pretty refreshing to see that an experienced programmer/entrepreneur like you can get stuck/frustrated on a "simple" bug... happens to me all the time at work!
    ~ "If you're really stuck on something, move onto something else and come back to it with a pair of fresh eyes"

  • @watcbd
    @watcbd Před 3 lety +76

    "I don't THINK I'll need stack overflow." When imposter syndrome hits you right before coding a snake game.

  • @josephwong2832
    @josephwong2832 Před 3 lety +1

    love this format of building stuff every once and a while clem!

  • @LordOfTheUniverseAndSpace

    Woh! You have really made some serious use of reverse linked list.
    Good stuff.

  • @giovannimarcon3822
    @giovannimarcon3822 Před 3 lety +5

    Wow, what a coincidence. I just finished coding my snake with js, but I am a simple guy so no linked lists shenanigans haha

  • @SamMcPieVTOL
    @SamMcPieVTOL Před 3 lety +4

    Someone needs to make a compilation of all the ways Clement has transitioned plugging algo expert. SOMEONE GET ON IT.

  • @qLac3
    @qLac3 Před 3 lety +2

    Thank you very very for showing that struggeling and getting annoying Bugs can even happen to such advanced people. Watching people get through their Code without any problems can give the feeling of being really far away from what a programmer should be able to handle

  • @pulakdeyashi
    @pulakdeyashi Před 3 lety +3

    Hi Clément,
    Please try to do a git commit on each baby steps. It will be really helpful.

  • @smaranh
    @smaranh Před 3 lety +5

    Could you add this concept to AlgoExpert? Actual small projects based on the Algorithm problems in AlgoExpert?

  • @MrBot1337
    @MrBot1337 Před 3 lety +2

    I'm waiting till this is asked on AlgoExpert. What do you guys think, easy, medium, or hard?

  • @rbt-0007
    @rbt-0007 Před 3 lety +2

    Yesssss tutorial from Clément😃

  • @TheGerarq
    @TheGerarq Před 3 lety

    Really nice and refreshing video, awesome Clem !

  • @adarshchhokar3818
    @adarshchhokar3818 Před 3 lety +24

    Has a big af monitor. Yet still codes on his 13 inch MacBook. BRUH!

  • @RawPeds
    @RawPeds Před 3 lety

    I like that you showed the bug when occurred, and how you dealt with it.
    Feels relatable.

  • @TheRebellion-X
    @TheRebellion-X Před 3 lety +1

    Wow!! I never knew someone had the same idea, I thought about it too when I started learning DSA but I couldn't implement it

  • @harispapadopoulos4295
    @harispapadopoulos4295 Před 3 lety +5

    That was worth the wait

  • @ithinktechnologies
    @ithinktechnologies Před 3 lety +1

    Finally something practice. Well thanks for the video,

  • @sarvagyasingh4518
    @sarvagyasingh4518 Před 3 lety +1

    coding videos on clement's channel ? this is beyond science

  • @inordirections
    @inordirections Před 3 lety +5

    First time I've heard "leave it as an exercise to the v i e w e r", haha. And now I know the main motivation for 'leaving it as an exercise': textbook authors just get tired and have other shit to do.

  • @lannguyen538
    @lannguyen538 Před 3 lety

    This is great ! Pls do more "tutorial" series

  • @jakariasami
    @jakariasami Před 3 lety +2

    that's what I was waiting for 💥😘

  • @Thinkpanda404
    @Thinkpanda404 Před 3 lety

    Why am I getting an algoexpert ad right before watching algoexpert 😂😂😂

  • @megaman2016
    @megaman2016 Před 3 lety +4

    TechLead taught you well!

  • @joshua4262
    @joshua4262 Před 2 lety

    Game is still kinda broken. When you hit the wall, the snake stops alright, but when u press a direction key it starts moving again despite gameover. Please solve this. Thanks.

  • @sammymtk1528
    @sammymtk1528 Před 3 lety

    The innuendo is astonishing 😂

  • @KaroCodes
    @KaroCodes Před 3 lety +7

    Now port it on nokia 3310 and bring early 2000s back :'-)))

  • @abdulbadisabir6653
    @abdulbadisabir6653 Před 3 lety

    Wow, you actually found a use case for reversing a linked list

  • @randomrainforest
    @randomrainforest Před 3 lety

    move the end node to what the direction is relative to the start node

  • @mashab9129
    @mashab9129 Před rokem

    I had an idea of creating small projects as i go thru leetcode challenges, but that proved to be very challenging to me. would be nice if you could create a visualizer for leetcode challenegs - that would help me ( and probably other devs) tremendously

  • @haithemothmane4558
    @haithemothmane4558 Před 3 lety

    Thanks Clément Mihailescu

  • @joaquimmenezes7396
    @joaquimmenezes7396 Před 3 lety +2

    Clement the great
    Love from goa

  • @excyl
    @excyl Před 3 lety

    Love those typical surprise moments: 'Wait why is this working now' or 'This was working a moment ago'
    Also spending 20 minutes to find a broken conditional statement, I feel the pain. I once searched an hour for a '!' that was missing....
    Still surprising how good React works for making small games, would have chosen PixiJS or just a plain canvas probably.

  • @jenniepink8894
    @jenniepink8894 Před 3 lety +1

    Keep doing coding videos for us clement
    I like that

  • @mohammednihad6755
    @mohammednihad6755 Před 3 lety

    More videos of this type plz :) 💙

  • @codewithyouml8994
    @codewithyouml8994 Před 3 lety +1

    It will be cool ... if u make more videos ... of making .... coding videos .... plsssssssss ....

  • @AndrewTSq
    @AndrewTSq Před 2 lety

    ah I learn something new everyday. When I did a snakegame, I used an array for the snake, [{x:1,y:1},{x:1,y:2}] etc.. and then I just shifted the array 1 object, and inserted the new position for the head. and if the snake eat something, I did not shift the array, and made it one object longer.

  • @dipeshpatil2771
    @dipeshpatil2771 Před 3 lety

    Clement please make more such videos. We really like to learn from you

  • @abhaytiwari6411
    @abhaytiwari6411 Před 3 lety

    I like this type of video . Please keep it up

  • @maccsguitar
    @maccsguitar Před 3 lety

    setInterval was never cleared, so there were multiple intervals running each with different closures

  • @user-pi4vj3cm3u
    @user-pi4vj3cm3u Před 9 měsíci

    Somebody please explain what case he was talkin about on 30:20 "When you have only one node..."

  • @AlgoHacks
    @AlgoHacks Před 3 lety +2

    I think we can use then finding loop Algorithm in Linkedlist to check if 🐍 tried to ate himself 😉

  • @billy8461
    @billy8461 Před 3 lety +1

    Impressive, but can you build a project that involves reversing a binary tree?

  • @pedroalonsoms
    @pedroalonsoms Před 3 lety

    Hi clement great video

  • @IkraamDev
    @IkraamDev Před 3 lety

    Yes, please more coding videos!

  • @Abhishek-dp5tc
    @Abhishek-dp5tc Před 3 lety

    38:23 Woah, I referenced to the same, Nice!!

  • @zaidshaikh2536
    @zaidshaikh2536 Před 3 lety

    So I guess we can expect a video on large scale distributed system.

  • @akashp4863
    @akashp4863 Před 3 lety

    can you please make a video on "are web developers software engineers? How are UI or front end of desktop softwares made, if HTML and CSS are only used in web development?" and end the confusion.

  • @andreiiaz2097
    @andreiiaz2097 Před 3 lety +1

    This is the perfect example that job interview problems describe the most idiotic way to solve daily tasks.

  • @rossomaguire17
    @rossomaguire17 Před 3 lety

    Thanks for this 🙂

  • @karthik_sama
    @karthik_sama Před 3 lety

    Nice monitor u got there
    Two 13" screens didn't make the cut

  • @mhyeganeh
    @mhyeganeh Před 3 lety

    31:22 "Oh... Wait! Why is this working...?!" 😄

  • @HorizonHuntxr
    @HorizonHuntxr Před 3 lety +1

    Clement I'm currently learning JavaScript from udemy and have plans to become a front end engineer, but I'm concerned from articles and posts I've read that javascript will die in the near future, do you think that's the case?

    • @georgeskhater487
      @georgeskhater487 Před 3 lety +2

      I don't think you should worry about that cuz even if it dies learning a language is easy as long as you know the concepts

    • @thugsmf
      @thugsmf Před 3 lety +1

      Hey unknown player. Just pick a language and learn it well. Once you learn a language, it will be easy to learn other languages. Concepts are pretty much the same; just a different syntax

  • @nawazkamboo8750
    @nawazkamboo8750 Před 3 lety

    Please take Google interview of @CodeWithHarry
    Great AlgoExpert from India

  • @soulsnatched
    @soulsnatched Před 3 lety

    beo PLEASE do more videos like this

  • @chrismanning5232
    @chrismanning5232 Před 3 lety +1

    Y(row)*Width + X(col) is what you were looking for the entire time. If you started your cell values at 0 (like any sane programmer) instead of 1, this would give you your cell value from row/col.
    Edit again: snake grows from the head (food is replaced with new head)

  • @babbiking1
    @babbiking1 Před 3 lety

    can you please suggest how to create multi dimensional array at run time with python.. i need dynamic array not static array

  • @pratyakshyt
    @pratyakshyt Před 3 lety

    Nice Clement

  • @alex4tm1
    @alex4tm1 Před 3 lety

    24:20 "if you touch yourself you die !" where have i heard that before xD xD xD

  • @fly_that_kite
    @fly_that_kite Před 3 lety

    Is that your WoW setup in the background? Are you gonna stream on twitch any time soon?

    • @clem
      @clem  Před 3 lety +1

      No WoW these days, but other games 😉 -- and I'm not sure for Twitch. I'll definitely announce it if I do!

  • @lawlietnear8374
    @lawlietnear8374 Před 3 lety

    funny but I have some comments :
    first, I think it is not good to use for keyword when we are front end dev, we only use map(), filter(), (..) only lambda function,
    second, I think to write the entire code on only one component is not a best practise, split more the code, because it is hard to see a typescript file with so many line of codes
    after say that is was a very advertising video

  • @peterkariukimutuura
    @peterkariukimutuura Před 3 lety

    Wow! It's working, how did I do that. it's magical working.

  • @guitarman813
    @guitarman813 Před 3 lety

    I remember playing this game on the Nokia 3310 back in the day! Looking forward to building this!

  • @momostan1714
    @momostan1714 Před 3 lety

    didn't know you can use color palette on vs code.

  • @ayyank9795
    @ayyank9795 Před 3 lety

    Clement i have a question is it possible for you to work from home as a software engineer?

  • @bianchialex
    @bianchialex Před 3 lety

    Real talk: ultrawide monitor worth it?

  • @wilsonwang8641
    @wilsonwang8641 Před 3 lety

    Why my code works magically, but it's awesome. lol😀

  • @AmritAgarwal07
    @AmritAgarwal07 Před 3 lety

    any Promo Code for algoexpert

  • @gian5138
    @gian5138 Před 3 lety

    Frustration with coding what makes a programmer good, How many hours you built it?

  • @jacoblockwood4034
    @jacoblockwood4034 Před 3 lety

    20:21 why is this not a switch statement or a class :O

  • @claudiooliveira698
    @claudiooliveira698 Před 3 lety

    Is that jiren on your desktop? Please tell me it's Jiren

  • @mathilekikisocom
    @mathilekikisocom Před 3 lety

    why not use canvas?

    • @mathilekikisocom
      @mathilekikisocom Před 3 lety

      and also why not use requestAnimationFrame instead of setInterval

  • @kalahari8295
    @kalahari8295 Před 2 lety

    Really curious about how long it really took - (imposter syndrome)

  • @akashp4863
    @akashp4863 Před 3 lety +2

    24:44 thats what she said

  • @sapy4124
    @sapy4124 Před 3 lety

    Can RTX 3090 run this game?

  • @omfuke3083
    @omfuke3083 Před 3 lety +3

    i created chess game just by using if and else LOL

  • @adarshchhokar3818
    @adarshchhokar3818 Před 3 lety +1

    MORE TUTORIALS PLEASE< PLEASE!!! please = [true, false] => please[0]

  • @adityavarmavetukuri830

    Okay, You'll never invert a binary tree in a job. Clement says challenge accepted!

  • @gtv3582
    @gtv3582 Před 3 lety

    "do you write code, tabnine will speed up your coding process"

  • @Muna-yk5gi
    @Muna-yk5gi Před 3 lety

    Clement, It'd be really cool if you could make a video about how you got into an ivy league college with some tips because you went to upenn.

  • @Lucas-hh4oh
    @Lucas-hh4oh Před 3 lety +1

    22:30 This is what happens if you don't test your code

  • @wordshot1506
    @wordshot1506 Před 3 lety

    ex-google engineer creating a snake game!

  • @kimayapanash8998
    @kimayapanash8998 Před 3 lety

    Sir just tell me what i should choose to make my final year project
    React
    Flutter
    I need help

    • @unknownman1
      @unknownman1 Před 3 lety

      react is cool.

    • @migueldomingos4570
      @migueldomingos4570 Před 3 lety

      if it's an app go for flutter; if it's a website go for react

    • @kimayapanash8998
      @kimayapanash8998 Před 3 lety

      @@migueldomingos4570 Thats what im struggling with
      Web Development or App Development

    • @migueldomingos4570
      @migueldomingos4570 Před 3 lety

      @@kimayapanash8998 I personally find app development more enjoyable and if you want to show something impressive for the final project app dev more easily impresses than web development.

    • @kimayapanash8998
      @kimayapanash8998 Před 3 lety

      @@migueldomingos4570 i thought app development was easier to learn than web development

  • @otmanm4095
    @otmanm4095 Před 3 lety

    HAHAHA ! You insane! Thanks for content!

  • @stefanosgiannakopoulos5552

    Reversing a linked list in JS and Python is too easy. Real men do it in C++. Just kidding. Love your vids❤

  • @Abhishek-dp5tc
    @Abhishek-dp5tc Před 3 lety

    24:38 Lmao, how big your snake is 🤣 🤣 🤣 🤣

  • @aadityamunjal7861
    @aadityamunjal7861 Před 3 lety +2

    Get ready for 200 pull requests lol

  • @swaroopnath8747
    @swaroopnath8747 Před 3 lety

    You took Ben Awad too seriously😂

  • @gri34psous
    @gri34psous Před 3 lety

    Likewise being a successful software engineer at Google and Facebook and being good at making games are two different skills.

  • @luciangutu
    @luciangutu Před 3 lety

    Entertaining stuff! Now code an AI to play the game :)

  • @rohithchittibommala2002

    clem how much do you spend on advertising because almost on every video I will see algo girl

  • @Abhishek-dp5tc
    @Abhishek-dp5tc Před 3 lety +1

    16:10 haha, setIntervals are weird in React as it goes for its declarative programming approach
    Faced this too when I was creating a timer app
    Check out this post by Dan: overreacted.io/making-setinterval-declarative-with-react-hooks/
    It helped me

  • @IkraamDev
    @IkraamDev Před 3 lety

    Looks like a 13inch screen wasn't big enough for you after all lol

  • @watercupcoolness8354
    @watercupcoolness8354 Před 3 lety +1

    I looked at the thumbnail and nearly threw up. in a good way tho

  • @ashutoshtelang8621
    @ashutoshtelang8621 Před 3 lety

    woww!

  • @TheFredybotas
    @TheFredybotas Před 3 lety +3

    Nice project! I've been playing with snake recently too. I created a solver using hamiltonian cycles (see it in action here - czcams.com/video/9AtxLypiqjA/video.html)
    It would be nice to create a solver for this kind of reversable snake.

  • @AndrewTSq
    @AndrewTSq Před 2 lety

    24:21 lol :D 24:37 LOL :D