JavaScript Patterns for 2017 - Scott Allen

Поделиться
HTML-код
  • Опубликовано: 26 фев 2017
  • The JavaScript language and ecosystem have seen dramatic changes in the last 2 years.
    In this sessions we'll look at patterns for organizing code using modules, talk about some of the pros and cons of new language features, and look at the current state of build tools and build patterns.
    NDC Conferences
    ndc-london.com
    ndcconferences.com
  • НаукаНаука

Комментарии • 76

  • @djpunisha29
    @djpunisha29 7 лет назад +79

    this was a really good talk, this guy is clear and concise on the point, unlike all the other JS ninjas who are just talking too fast and rambling on and on ....

    • @sgwatyt
      @sgwatyt 7 лет назад +4

      Scott has long been a developer advocate in the c#/.net community and within the past few years has really started blogging/speaking to the js community. His talks where he combines the two are also great.

    • @warrenbuckley3267
      @warrenbuckley3267 7 лет назад +7

      He has some good courses on PluralSight for both C# and Javascript

    • @jahilkhalfe
      @jahilkhalfe 7 лет назад +1

      100%!!

  • @sne4ky647
    @sne4ky647 4 года назад +2

    Seeing this in the recommendation is so sad😢 ,
    God bless your soul Scott

  • @billott2028
    @billott2028 7 лет назад +1

    Thank you for presenting the well understood OOA/OOD concepts in rudimentary JavaScript ecosystem. Computer Science educators should take note.

  • @MyronNetterlund
    @MyronNetterlund 7 лет назад +1

    Love the comments at 53:50 regarding Jasmine & integration-testing. Thank you for sharing your experience. "...a lot of the components that we write, they are orchestra-tors..." 54:33

  • @modolief
    @modolief 7 лет назад

    3:51 -- exports and imports -- excellent overview.

  • @user-ge2vc3rl1n
    @user-ge2vc3rl1n 2 года назад

    @29:00 One of my interview questions for a frontend job actually asked me about how to make frozen js objects with properties/functions inside. Took me off guard for sure

  • @dean6046
    @dean6046 5 лет назад

    Thank you! Awesome talk

  • @CarneAsadaFries_
    @CarneAsadaFries_ 6 лет назад +2

    Feels like I'm learning AS3 all over again. Classes, private functions and variables. Modules are essentially Sprites or Movieclips.

  • @PamirTea
    @PamirTea 7 лет назад

    Very informative talk, thank you.

  • @danialkalbasi
    @danialkalbasi 6 лет назад +1

    A very true point for mocking other services in unit testing. We should do more integration tests!

  • @aziaev
    @aziaev 5 лет назад

    well structured presentation

  • @olegsirbu2
    @olegsirbu2 7 лет назад

    thanks, very cool talk!

  • @fuu812
    @fuu812 7 лет назад

    Very good presentation

  • @piq-dg3vz
    @piq-dg3vz 7 лет назад +2

    About the ../../eternity of dot dot slash, instead of doing that you can leverage native node modules like process, path, and __dirname

  • @alexjumba
    @alexjumba 7 лет назад

    brilliant!!

  • @datpip
    @datpip 7 лет назад

    I had no idea the class keyword doesn't hoist. Good to know.

  • @PanagiotisKouretas
    @PanagiotisKouretas 7 лет назад +29

    Pure magic. Typical Alan Rickman...

  • @PhillipKerman
    @PhillipKerman 7 лет назад

    Great! Filled in many loose ends for me.

  • @pentalite5
    @pentalite5 6 лет назад

    Hey NDC, I love what you do and the videos you guys produce. I have transitioned over to a web developer role over the past year and have found your video's incredibly helpful. My company is going through a big promotional phase. I would love to thank you and bring you some value with a free license to our software screen casting software (Screencastify). lmk.

  • @corlaez
    @corlaez 6 лет назад

    I would love to see parcel bundler in "toolchain can impact performance"

  • @user-iu1xg6jv6e
    @user-iu1xg6jv6e 7 лет назад

    OMG, Professor Snape!

  • @youngd8445
    @youngd8445 7 лет назад

    thks

  • @serenity_zero
    @serenity_zero 7 лет назад +6

    webpack 2 is out, btw. (the video features webpack 1, which has some incompatibilities, like 'loaders' instead of 'rules')

    • @jerrysaravia
      @jerrysaravia 7 лет назад +3

      He mentioned that in his video. I found the pattern of multiple webpack configs interesting. Gonna try that.

    • @serenity_zero
      @serenity_zero 7 лет назад

      indeed, he mentioned webpack 2 at 13:40. I missed that.

    • @sobanya_228
      @sobanya_228 7 лет назад

      He uses webpack 2 already.And mentions incoming 2.2

    • @LarsRyeJeppesen
      @LarsRyeJeppesen 7 лет назад +1

      Webpack 3 is out :)

    • @RashidOmar
      @RashidOmar 5 лет назад +1

      Webpack 4 is out. Just saying.

  • @abdullahalmehedi6046
    @abdullahalmehedi6046 7 лет назад

    any link for slides?

  • @seccat
    @seccat 7 лет назад

    Great video. I'm watching for the fourth time.
    @3:10 What's a IFFE? I think you meant "Immediately-Invoked Function Expression" (IIFE)

  • @formerastronaut
    @formerastronaut 3 года назад

    Sometimes I wonder if this paradigm of breaking everything up into modules and then smooshing them all back together with a bunch of extra steps and bundlers is actually worth it.

  • @idmontie
    @idmontie 7 лет назад

    Won't modules exports be mutable by the current standard?

  • @xdev1090
    @xdev1090 7 лет назад

    You should still wrap strict code in iifes to guard against bundling with non-strict code.

  • @MZDisaster
    @MZDisaster 4 года назад

    RIP Scott Allen :(

  • @Scorp1u5
    @Scorp1u5 7 лет назад

    Focusing on gzip size is not a good idea. The files are transferred over the network with a MTU of 1500 bytes. All of your files except the smallest and largest are +/- 1 MTU from the average, meaning that excluding the outliers the transfer time is the +/- 1 packet. people forget that TCP packets are more like block devices than character devices at the low level. I'd focus purely on the execution time because that will have the largest impact on the user.

  • @politicalvegan
    @politicalvegan 7 лет назад +5

    I was always told to write my programs so that variable names and function declarations where as descriptive as possible to what the underlying behavior is doing so that it was as easy as possible for the human to understand what was going on... since these abstractions aren't adding anything that wasn't already there, I would argue they are trying to do the exact opposite... obviously not everything in this talk fits into what I'm referring to, like async/await is something that adds what wasn't already there but stuff like => or ...!!data ? data : {default:true} aren't adding anything new, its just an abstraction of what could've been written in the same Javascript you learned in the first two weeks. If you prefer condensed reading, perhaps chunk up your code into a function or get a better editor that helps with condensing code instead of trying to evolve Javascript into a different language. To be completely honest, I think the philosophy should be that, if you're using abstractions that don't add anything new, you're considered a less ideal programmer.

    • @politicalvegan
      @politicalvegan 7 лет назад +1

      you can see ...!!data ? data : {default:true} at 39:20
      this and that has always worked perfectly fine for me, just because something behaves differently than the default behavior doesn't mean that something is actually contributing that wasn't already there (aka behavior could have been altered by the programmer)... opinions on aesthetics isn't a good justification (especially in the context of Javascript) for making things needlessly inundated with details that aren't adding anything substantial... what that does do is make the entire thing *appear* to be less accessible

    • @WateryIce54321
      @WateryIce54321 7 лет назад +4

      "using abstractions that don't add anything new"? I hope you're aware of how subjective that is. What does C add to assembly? Well for one, it's simpler to reason about. Likewise, what does a short-hand lambda notation (=>) add to Javascript? It encourages a declarative programming style and reduces the amount of irrelevant code that we must read. There's a difference between being verbose and being descriptive.
      And the reason that ...!!data seems bad is because it is bad. One of the quickest ways to tell is when you can't look at the code and read it out as a simple, English statement.
      `user_age > 90 ? "old" : "young"`, does the ternary operator still seem that unreasonable? It throws people the first time around, but is easily understood afterwards and pays off by reducing control flow clutter.

    • @eggwaffle
      @eggwaffle 6 лет назад +1

      My god people really just don't like learning do they? Your example doesn't even work as arrow functions have lexical scope as opposed to the function keyword.

    • @oliver1833
      @oliver1833 6 лет назад

      Was thinking the same thing re: arrow functions. Plus there's the point that => should be read as a function, and so isn't necessarily less descriptive to a JavaScript programmer. If there was ==>, =/> and =?> as alternative iterations, the point would be more valid.
      Jacob Edwards does have a valid point in the wider scheme of things - there is a lot of condensed function in JavaScript that is not informative. A good talk on it here: ruclips.net/video/loj3CLHovt0/видео.html

  • @MrShibaMX
    @MrShibaMX 7 лет назад +3

    2017 managing JS dependencies... still kind of a mess
    surprise surprise, am I right?

  • @ahmedelwa2000
    @ahmedelwa2000 4 года назад +1

    Your are missed, Scott :))

  • @gggvvvnnn
    @gggvvvnnn 7 лет назад +3

    Given how you're basically using Gulp as a proxy to CLI, you might try just using npm scripts instead.

    • @maxtream9388
      @maxtream9388 7 лет назад

      While I agree.. You sometimes need to do some weird things with files. And it's better to do so with language that you know, which is javascript.
      Because with scripts and using CLI you need to adjust to Windows/Linux sometimes. With gulp it's only javascript.
      But if you don't need some weird custom manipulations, I agree, go full npm/yarn scripts.

    • @gggvvvnnn
      @gggvvvnnn 7 лет назад

      That makes sense. I personally start with UNIX one-liners for my npm scripts, and if I need something more complex I just invoke an external Node script and use ShellJS if needed.

  • @parthi2929
    @parthi2929 6 лет назад

    Are these already into nodejs?

    • @NZRBeats
      @NZRBeats 5 лет назад

      You can use them with transpilers(aka Babel)

  • @atbureau
    @atbureau 7 лет назад +2

    The IIFE at 2:15 is written incorrectly, no? I thought the first pair of parentheses encloses the function and the second pair of parentheses is outside the first - calling the expression.

    • @jesuslovespee
      @jesuslovespee 7 лет назад +5

      i believe either works, but your method is the preferred one.

    • @crdhdxyz
      @crdhdxyz 7 лет назад

      it is written properly. if there is a bracket opens before the function, js treats it as an expression

  • @MrYerak5
    @MrYerak5 4 года назад

    its like watching the history channel

  • @ljklj719
    @ljklj719 7 лет назад

    The first snippet of code is wrong. Wtf

  • @gyrogojo
    @gyrogojo 7 лет назад

    Great Talk!
    BTW does not this guy look/talk like American pablo escobar from Narcos :D

  • @LQRCerberus
    @LQRCerberus 6 лет назад

    why is my name on this?

  • @erbse1178
    @erbse1178 7 лет назад

    JS in general is on a good way. But even with this newest TS and stuff, seems to me, that the code still is ugly and full of pitfalls to be aware of. Hope this gets much better in the future....

  • @eloceano3829
    @eloceano3829 7 лет назад

    Let me add one more pattern: Global state management.
    I would recommend MobX over Redux. MobX is much more simple due its OOP structure and small API, instead of adding lots of indirection and bolierplate needed by the functional paradigm used in Redux.
    Note: I have nothing to do with MobX. Just a personal preference.

  • @foobarbecue
    @foobarbecue 7 лет назад +4

    "javascript. heheheh."

  • @rizwanmahmud93
    @rizwanmahmud93 4 года назад

    Rip

  • @cupajoesir
    @cupajoesir 6 лет назад

    Javascript ... ya ...

  • @kenichimori8533
    @kenichimori8533 6 лет назад

    The voice 0 JavaScript c = p
    Control Point.

  • @Ken-S
    @Ken-S 6 лет назад +1

    This talk is "too old" now

  • @floverdevel
    @floverdevel 6 лет назад

    Arrow functions are so bad :(

  • @calebprenger3928
    @calebprenger3928 7 лет назад

    I started watching this video, and every year there has to be some genius that states "everything you know is different now". Yet Javascript is still Javascript. Next Video.

    • @eggwaffle
      @eggwaffle 6 лет назад

      I hope you're not as stupid as you sound

  • @neutraltakes2134
    @neutraltakes2134 7 лет назад +4

    Thumbs up if you knew all of these in 2016!

  •  6 лет назад

    Every second sentence has a word ‘problem’. Javascript mess keeps growing.

  •  6 лет назад

    Stopped watching at ...!!data ? data ...

  • @realwizardry834
    @realwizardry834 6 лет назад

    This guy's breathing is very distracting

  • @webosm6494
    @webosm6494 7 лет назад

    So this is more a how to use the new features using tools talk. Not so much about using javascript directly, which seems is slowly becoming a dying art.

  • @CTimmerman
    @CTimmerman 7 лет назад

    Imho,
    Npm > Brunch > Webpack > Gulp > Grunt,
    Stylus > Sass > Less,
    Pug (aka Jade) > HTML,
    and Python > CoffeeScript > JavaScript.

  • @seccat
    @seccat 7 лет назад

    Great video. I'm watching for the fourth time.
    @3:10 What's a IFFE? I think you meant "Immediately-Invoked Function Expression" (IIFE)