Coding Challenge

SdĂ­let
VloĆŸit
  • čas pƙidĂĄn 5. 08. 2024
  • Boing! Time to simulate a spring force! This challenge fits into chapters 2 and 3 of the Nature of Code and demonstrates how to simulate the oscillating motion of a spring using vectors and forces. thecodingtrain.com/challenges...
    p5.js Web Editor Sketches:
    đŸ•č Simple Spring: editor.p5js.org/codingtrain/s...
    đŸ•č Spring Vector: editor.p5js.org/codingtrain/s...
    đŸ•č Spring OOP: editor.p5js.org/codingtrain/s...
    đŸ•č Soft Spring: editor.p5js.org/codingtrain/s...
    đŸŽ„ Previous Coding Challenge: ‱ Coding Challenge #159:...
    đŸŽ„ All Coding Challenges: ‱ Coding Challenges
    đŸŽ„ Previous Nature of Code Video: ‱ Coding Challenge #159:...
    đŸŽ„ Next Nature of Code Video: ‱ 4.1: Particle System S...
    đŸŽ„ All Nature of Code Videos: ‱ The Nature of Code
    Links discussed in this video:
    🔗 Nature of Code 3.10 Spring Forces: natureofcode.com/book/chapter...
    🔗 Nature of Code Playlist: thecodingtrain.com/learning/n...
    🔗 toxiclibs.js: www.haptic-data.com/toxiclibsjs/
    🔗 curveVertex() (p5.js Reference): p5js.org/reference/#/p5/curve...
    Other videos mentioned in this video:
    đŸŽ„ Texturing Cloth Simulation - Coding Challenge #63: ‱ Coding Challenge #63.1...
    đŸŽ„ Simple Particle System - Coding Challenge #78: ‱ Coding Challenge #78: ...
    Timestamps:
    0:00 Choo choo!! Springs Coding Challenge!
    0:40 Explain! What is Hooke's Law?
    2:51 Code! Let's make a 1 dimensional spring!
    5:13 Explain! How can we bring in vectors?
    7:17 Code! Let's adjust the code to use vectors.
    11:57 Code! Let's add gravity!
    13:03 Code! How can we control the spring with our mouse?
    13:53 Explain! But wait!! Particles!
    15:14 Copy & Paste! A particle class.
    16:41 Code! Let's make bob and anchor particles.
    18:01 Code! We need a spring class.
    21:32 Debug! What is missing?
    23:16 It works!
    24:16 Code! But wait!! Particle system!
    25:28 Code! Let's connect the particles with springs.
    27:12 Code! We can refine it a bit.
    29:29 Code! Playing with beginShape() and endShape().
    31:07 Ideas! If you make a swishy robot share it with me!
    🚂 Website: thecodingtrain.com/
    đŸ‘Ÿ Share Your Creation! thecodingtrain.com/Guides/com...
    đŸš© Suggest Topics: github.com/CodingTrain/Rainbo...
    💡 GitHub: github.com/CodingTrain
    💬 Discord: / discord
    💖 Membership: czcams.com/users/thecodingtrainjoin
    🛒 Store: standard.tv/codingtrain
    📚 Books: www.amazon.com/shop/thecoding...
    đŸ–‹ïž Twitter: / thecodingtrain
    📾 Instagram: / the.coding.train
    đŸŽ„ Coding Challenges: ‱ Coding Challenges
    đŸŽ„ Intro to Programming: ‱ Start learning here!
    🔗 p5.js: p5js.org
    🔗 p5.js Web Editor: editor.p5js.org/
    🔗 Processing: processing.org
    📄 Code of Conduct: github.com/CodingTrain/Code-o...

Komentáƙe • 143

  • @samuelgunter
    @samuelgunter Pƙed 3 lety +114

    Love these classic coding challenges

  • @ukranaut
    @ukranaut Pƙed 3 lety +40

    This channel is a national treasure.

  • @ChaoteLab
    @ChaoteLab Pƙed 3 lety +68

    And everything’s all boingy boingy boingy, indeed.

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

      All day long...

  • @ga_per
    @ga_per Pƙed 3 lety +50

    I don't even code in JS, but I love to watch your coding challenges

    • @CrashingThunder
      @CrashingThunder Pƙed 3 lety +8

      Same here. I sometimes even watch his tutorial videos despite knowing the content pretty well. I just like watching this man code.

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

      But i will try to implement this to my javaproject this were very helpfull to me

    • @WhateverOwO
      @WhateverOwO Pƙed 8 měsĂ­ci

      I code in c++ and sometimes I follow along, when I have the time to think tho.

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

    The way how i love this guy... what an amazing human being.

  • @teo4349
    @teo4349 Pƙed 3 lety +15

    Recreating these coding challenges at home is so much fun, thank you for making this content!

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

    Entire Lockdown was passed on NoC videos! Gotta love your coding and teaching style!

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

    Oh my god, this video just gave me a huge inspiration for how to implement my own kinda simple version of "force directed graphs" (using forces to visually align nodes in a graph so they don't overlap and so on).
    I have been playing around with FDGs to visualize my NEAT neural networks but couldn't quite get it right so far, but using this video's ideas as a basis is so simple yet so genius, I didn't even think about it until now :D
    Thank you so so much, Dan! I am super excited to try this out! :D

  • @ryaneakins7269
    @ryaneakins7269 Pƙed 3 lety +17

    I've been re-watching some of your earlier work, which I've always enjoyed, and it's nice to see you just continually getting better. Your explanations, and your coding, feel smoother. No more spending half-hours tracking down "this dot" errors :) !

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

      But also less “this dot” songs ;-;

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

      whoever works on the video editing does really great job, new videos are real smooth

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

    You are an amazing teacher! The way you explain things and concepts is astonishing as well as entertaining! Thanks for all the efforts

  • @mebamme
    @mebamme Pƙed 3 lety +55

    It's great to see you doing coding challenges again! :)
    Your other recent videos are probably just as good, but somehow an "I'm making a thing" video is a lot more clickable to me than "I'm teaching a thing".

    • @TheCodingTrain
      @TheCodingTrain  Pƙed 3 lety +30

      Yes, I try to make a variety of styles, but the coding challenge format tends to be quite popular with viewers!

    • @mebamme
      @mebamme Pƙed 3 lety +9

      @@TheCodingTrain It's great that you're making both challenges and more teaching-oriented videos. I'm content watching the former, but I think the beginner coders are really appreciating the latter!

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

      @@TheCodingTrain I like both
      You're my hero, Dan

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

      He is supposed to explain more, be a teacher, so I guess that's what he should do :)

    • @magnuswootton6181
      @magnuswootton6181 Pƙed 2 lety

      @@nothingnoone8752 same he does a really good job.

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

    That's so cool! I finally understood the idea behind springs

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

    now i really know how much hard work was put in matter.js

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

      There was much more hard work put into matter.js than you think,
      They only not had to make the physics engine but they also had to make their website which contained references and examples

    • @Brahvim
      @Brahvim Pƙed 3 lety

      @@abhaykashyapa Uhm...
      _i mean...that must've been the _*_easy_*_ part._

    • @abhaykashyapa
      @abhaykashyapa Pƙed 3 lety

      @@Brahvim I didn't say that making the website is hard,
      I said that making both of the things were hard

  • @mrBlagstock
    @mrBlagstock Pƙed rokem +1

    This channel is a global treasure

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

    Thank you! I found your channel recently, and now I’ve started coding again after many years paus. Love your energy and the enjoyable way you talk about maths and physics. Schools should adopt this way of teaching.
    I’m looking forward to going through all your videos! Thanks again!

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

    Thank you so much for this tutorial.. I started programming recently and have been really fascinated with all the simulation things you do on your channel. I tried doing them on my own at first just to gauge my knowledge level, but that didn't work out so well. I followed this tutorial and your other on springs and they were soo helpful. Thank you so much!! I was able to implement this in python using the pygame module. The only part I couldn't add was the curvedvertex stuff but I'm happy with what I have already, there is so much I can do with this.

  • @Amr-Ibrahim-AI
    @Amr-Ibrahim-AI Pƙed 3 lety +3

    This is joyful!
    Thanks Dan for this

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

    living legend.. millions thank YOU :)

  • @kittgs
    @kittgs Pƙed rokem

    Such an enthusiastic and great teacher. I really enjoyed this.

  • @andrewweller5119
    @andrewweller5119 Pƙed 10 měsĂ­ci

    i am often in aw of mathematiciansform the past. Hooke worked out this on paper with no way of simulating it in real time to test his theories. incredible.

  • @DrawMakeCode
    @DrawMakeCode Pƙed 3 lety

    I never thought playing with a springy string could be so meditative. Thanks for a fun challenge. I learned a lot!

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

    What an amazing content you produce

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

    So cool, I really appreciate it, thanks

  • @megauti
    @megauti Pƙed 5 měsĂ­ci

    Totally lovely contents. Thank you.

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

    Amazing video, keep going! Love it !! Thank u !

  • @funkyb6598
    @funkyb6598 Pƙed 3 měsĂ­ci

    Fantastic!

  • @nagesh007
    @nagesh007 Pƙed 8 měsĂ­ci

    Mind Blowing 😍

  • @researchandbuild1751
    @researchandbuild1751 Pƙed rokem +1

    Love your teaching style, would be awesome to see a video on correlation

  • @Casaraolanhouse1
    @Casaraolanhouse1 Pƙed 3 lety

    Dude, You're Awesome!!!!

  • @user-iz9ze7zf3v
    @user-iz9ze7zf3v Pƙed 3 lety

    One of my favourite channel

  • @nothingnoone8752
    @nothingnoone8752 Pƙed 3 lety +24

    I want to go to NYU just to take his classes

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

      It's easy you can just patreon him or support him via subscription and you get all his classes only for free.

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

      @@buddhanag4987 I can't be the only one who had a good laugh at the irony here.

    • @Brahvim
      @Brahvim Pƙed 3 lety

      Yeah,@@avananana! The way he says it. Hah! "Only for free". đŸ€Ł

    • @alfcnz
      @alfcnz Pƙed 3 lety

      What??? He's here?

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

    hi sir i am from india and i am you fan and i aslo made all the projects that you showed in p5.js .i will be very glad to see you in next video

  • @darkexior
    @darkexior Pƙed 3 lety

    I love your videos!!!

  • @yhamainjohn4157
    @yhamainjohn4157 Pƙed 3 lety

    Bravo ! TrÚs bien expliqué !

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

    why are your vids so good, i should be making my homework

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

    you are the best!!

  • @flameofthephoenix8395
    @flameofthephoenix8395 Pƙed 5 měsĂ­ci

    12:56 Interesting! I couldn't remember how to implement rest length, so what I ended up doing was taking the amount of displacement from the anchor, I normalized it, then I multiplied it by a constant that could be attained through some mathematics applied to your rest length, then I just added that value back in to the velocity, this does the exact same thing as what you did here, but likely a little more complicated and for no particular reason.

  • @60pluscrazy
    @60pluscrazy Pƙed 2 lety

    Excellent explanation. 👌🙏

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

    gosh! why are you so awesome?!

  • @yuu16
    @yuu16 Pƙed 3 lety

    Thanks for your video

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

    Limiting the x (like it can't go furthur than some maximum value)in the spring formula might have spiced the effect even more

  • @user-lu2ds7mv7z
    @user-lu2ds7mv7z Pƙed 3 lety

    Love you Dan 😍

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

    9:07 but isn't v.normalize() just dividing by x, only to be multiplied back a couple of lines later? And for that matter, you can achieve v.mult(-1) simply by reversing the order of the subtraction.

  • @juanignaciosanchez2202
    @juanignaciosanchez2202 Pƙed 3 lety

    You ARE magic

  • @TheWhitde
    @TheWhitde Pƙed rokem

    Very good brush up on my 1985 physics. Making a 3D game and putting in spring suspension which looks great so far.

  • @alfcnz
    @alfcnz Pƙed 3 lety

    Impressive.

  • @rishitkamani9672
    @rishitkamani9672 Pƙed 3 lety

    Very nice continue making videos

  • @user-iz9ze7zf3v
    @user-iz9ze7zf3v Pƙed 3 lety

    Mass bro

  • @Protiac
    @Protiac Pƙed 2 lety

    I need to do this in C#, so here's hoping i can translate from this very informative, helpful video

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

    12:17
    God creating earth. “What if I do add gravity?”
    *let gravity*

  • @Sahabatastro2
    @Sahabatastro2 Pƙed rokem

    Best in the world

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

    dan is the bob ross of code

  • @mrss649
    @mrss649 Pƙed 3 lety

    Yay!

  • @magnuswootton6181
    @magnuswootton6181 Pƙed 2 lety

    Shiffman's hair is turning into a magistrate. :) its been so long... the interesting thing with springs is which way you do correct them, left to right, or right to left, it matters if there was a lot of them connected together in a mass.

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

    What is your advice for people interested in humanistics and STEM at the same time?

  • @RafaelNunesGontijo
    @RafaelNunesGontijo Pƙed 3 lety

    I'm trying to follow along in a processing 3.5.4 windows running p5, but I can't make this work, and I'm following exactly the same code you're showing, even the color of the strokes. Does anyone have any idea what could be going on? Nice video by the way, I'm liking this content a lot!

  • @abbs0141
    @abbs0141 Pƙed 3 lety

    Hi this is Mainak from NYUAD!! I enjoy each of your videos. Wondering if you would do any video on multi processing interface?

  • @xaosIncorporeal
    @xaosIncorporeal Pƙed 3 měsĂ­ci

    Newton let Hooke peruse some of his notes. When Hooke presented this law as his own, Newton came up with the phrase, "By Hooke or by crook."

  • @w451-qx3kx
    @w451-qx3kx Pƙed 3 lety +1

    I tried to figure out spring physics myself to make soft body shapes... didn't work out well haha

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

    Dan pls make a coding challenge on super formula

  • @m.b786
    @m.b786 Pƙed 3 lety +1

    why in 2021 not using

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

    Hello Mr. Shiffman! i love what you are doing and couldn't thank you enough for your contributions!
    that being said, will we see a part 3 of agar.io tutorial? we have been looking forward for that for a long while!

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

      I really would like to get to this, yes! Sorry for leaving it hanging. Come and remind me again in a couple months. I'm focused on Nature of Code series right now.

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

      @@TheCodingTrain yes sir! all the very best for nature of code, may you give it your all! man its been so long, we still remember the old nature of code with processing and how we messed up vectors here and there! good memories, we've come so far since :)

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

    Will you ever make a tutorial about Reinforcement Learning or Q Learning? I think that would be great especially in p5!

    • @Brahvim
      @Brahvim Pƙed 3 lety

      With TensorFlow.js or ml5.js? Probably.

  • @123TeeMee
    @123TeeMee Pƙed 3 lety +2

    5:27 I honestly thought you had brought out a cabbage or something there

  • @disdis6127
    @disdis6127 Pƙed 3 lety

    How about multiplying the values by deltatime it will move things based on time rather than based on framerate

  • @YoyellDCube
    @YoyellDCube Pƙed 3 lety

    Great vid I am still watching but it's great

    • @YoyellDCube
      @YoyellDCube Pƙed 3 lety

      And as I said before I edited I am the first comment

  • @user-ve4sy5bn7q
    @user-ve4sy5bn7q Pƙed 3 lety

    woooooooooooow

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

    Bob and anchor sounds like names
    Dan..

  • @circuitguru4554
    @circuitguru4554 Pƙed 3 lety +7

    Day 1 of asking for a Newton’s Cradle

    • @samuelgunter
      @samuelgunter Pƙed 3 lety +7

      Day 1 of responding to the person asking for a Newton's Cradle

    • @Brahvim
      @Brahvim Pƙed 3 lety

      @@samuelgunter xDDD

    • @Brahvim
      @Brahvim Pƙed 3 lety

      I guess that'd be easy :/
      You can do it yourself!
      I mean..do I try doing that myself once..?
      Collision is the only problem. Simply reversing velocities doesn't really work...it glitches out.

    • @samuelgunter
      @samuelgunter Pƙed 3 lety

      @@Brahvim you wouldnt need springs. You'd need conservation of momentum (pi day collision video) and a couple of tier 1 pendulum (half of the double pendulum video)

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

    Could you do a double pendulum or a double spring pendulum?

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

      Coding Challenge #93! czcams.com/video/uWzPe_S-RVE/video.html

  • @bhavyabadhwar1
    @bhavyabadhwar1 Pƙed 3 lety

    Which language should i learn
    JavaScript or Python?

  • @muhamadfarhanfirmansyah4346

    squishy squish soft spring... :3

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

    Can you code like a pacman game it will be a good idea

  • @khalidsakka8020
    @khalidsakka8020 Pƙed 3 lety

    Making a noodle in P5.

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

    day 2 of asking for a Newtons Cradle!

  • @Nameru26
    @Nameru26 Pƙed 3 lety

    It hurts a bit, that your spring constant is k and not D...

  • @namelastname4077
    @namelastname4077 Pƙed 3 lety

    but what would it sound like :)

  • @meguellatiyounes8659
    @meguellatiyounes8659 Pƙed rokem

    can it used to simulate the mould effect ?
    czcams.com/video/_dQJBBklpQQ/video.html

  • @error_hd
    @error_hd Pƙed 3 lety

    hey if you are watching this comment can you pls tell me how to set a video as a background in p5 plssssssssssssssssssssssss

  • @SergeantYeeter
    @SergeantYeeter Pƙed 3 lety

    its showing velocity.add is not a function

  • @PabloPerroPerro
    @PabloPerroPerro Pƙed 3 lety

    Coding Challenge #835 - Feynman Diagrams

  • @netanelberman6291
    @netanelberman6291 Pƙed 3 lety

    I thought i was first, then I saw the comments thread

  • @aobcd.8663
    @aobcd.8663 Pƙed 3 lety

    omg...what did he draw there 26:41

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    Waow

  • @ivanfilatov5482
    @ivanfilatov5482 Pƙed rokem

    javascript đŸ˜±

  • @MrYeast-rq5ox
    @MrYeast-rq5ox Pƙed 2 lety

    I feel like these aren't challenges anymore.

  • @NeverBeenToBrisbane
    @NeverBeenToBrisbane Pƙed 3 lety

    Poor Bob ffff

  • @codycodes7527
    @codycodes7527 Pƙed 3 lety

    #32 in 3 hours?

  • @teit-9_piyushbhujbal66
    @teit-9_piyushbhujbal66 Pƙed 3 lety

    Dude, why you always use Javascript

  • @enpeacemusic192
    @enpeacemusic192 Pƙed 3 lety

    Meanwhile in CZcams HQ:
    class video{
    constructor(string name, channel c){
    this.name = name;
    this.c = c;
    if(this.c.name == “The Coding Train”){
    this.likeCount = 10.000;
    this.dislikeCount = 0;
    }else{
    this.likeCount = 0;
    this.dislikeCount = 0;
    }
    createURL();
    }
    }

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

    Man everytime I see this man use this weird paradigm of having both a variable for velocity anddd acceleration I die a little on the inside.
    I know it's just a simple thing but it's so pointless and just complicates things in a weird way.

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

      For me this paradigm seems very natural. But maybe I am (lile Dan?) not seeing the forest in all those trees. How would you do it?

    • @guzman-do
      @guzman-do Pƙed 3 lety

      Two different things... Nothing weird about that

    • @Bolt6265
      @Bolt6265 Pƙed 3 lety

      @@imporbis345 I mean it's fine. Interesting that people are different y'know. Just to me it's like, you can always just add forces directly to the velocity and skip any notion of an acceleration. It's like, the only thing the acceleration variable does is store accumulated forces applied, then you have to call a separate thing to actually apply and zero out the acceleration again. But all that is simplified if you just apply those forces to the velocity in the first place, and then there's no need for separate application step. So it's more efficient as well. Which is part of why it bothers me as an optimization nerd.
      In my head the idea of an object having a velocity as it is, and then adding forces directly to that makes intuitive sense.
      Having the forces go through this abstract idea of an acceleration is just off, especially considering like to me, an acceleration is a constant force applied over time, but with this its just used as a like force buffer of sorts, idk.

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    I went and hugged a guy

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    I'm sleepy

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    I wrote you a letter but ah

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    I'm sad

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    Please be ok later

  • @toastyPredicament
    @toastyPredicament Pƙed 2 lety

    Sorry

  • @jhanolaer8286
    @jhanolaer8286 Pƙed 2 lety

    spring method is bad to make like a rope.