12 ms·

How it feels to learn JavaScript in 2017

310 points by eropple 9y ago

eropple 9y ago
I submitted this after 'brlewis linked it (it's his piece) in a comment because it really hit home. Like, I've never used Mithril, but I dove into React (both web and React Native) this year and it reminds me of when doing web stuff was fun. Which, for me, was before anyone was actually using JavaScript. There are a lot of skeptics about modern JS frameworks, and I get it (my inclination in every programming environment I've ever worked in is to avoid frameworks, etc. until I know I need them), but boy is this a big, and awesome, change.
- aaron-lebo 9y ago
  You know a lot of people are terrified of change and new stuff because it might mean their skillset is obsolete. That's a lot of what this backlash against JS is. Some of the criticism is warranted, but a lot of it isn't, it comes from people who have never done anything other than sneer at the language, and for every issue JS has, you can find a matching issue in another language that either a) isn't a problem because there are idiomatic solutions or b) everyone in the choir knows it's dumb but they don't say it to outsiders, because why advertise your weaknesses? JS today is very expressive (more expressive than Python simply due to good lambdas - not to pick on Python but it's a language that doesn't get the hate of a JS or Go), it's been fast for awhile, it's got a dozen new interesting frameworks, the tooling keeps getting better, etc. This can either scare you or represent opportunity. We've got a 5k line JS app. It was written by people who weren't programmers, in a jQuery/d3 ball (it was still an impressive interface). Over the summer we've converted it to Mithril and modern JS, now it's half the size, our dev environment is setup with a simple npm install and npm start, we have reusable components that multiple people can grok and use, it only takes a 20 line webpack file to do this all, and before the summer started none of us had used the framework. It's amazing what it has enabled us to do and how simple the whole stack is. I've been building desktop apps and small intranet web apps for a decade, they don't hold a candle to what's possible if you harness this stuff. People can complain all they want but this is what progress looks like. Someone might not think it's cool that you can write an interactive single page application in 50 lines of code that anyone in the world can access, but isn't that what we wanted? It takes a day to grok this stuff, a week to build interesting stuff in it. It's worth the investment, you might actually learn to do things you couldn't before. That's fun.
  - spootnik 9y ago
    JS is love, JS is life
  - lghh 9y ago
    Not to be pedantic, but if you have a 5k line JS app that "wasn't written by programmers" who was it written by? If they wrote and shipped a 5k line JS app, in my eyes they are programmers - but possibly not very good ones.
    - aaron-lebo 9y ago
      Well, they weren't professional programmers (not their main job, done out of necessity) and they weren't trained. As I understand it they were actually learning it all on the go (like a lot of new programmers). It wouldn't be shocking if a lot of JS devs were in a similar boat, which explains the community a little bit. So yeah, they're programmers now, but they didn't start out that way and the app showed it. That's what JS and the browser allowed them to do.
      - mod 9y ago
        So experienced devs are afraid of learning something that took non-programmers a week to get up to speed and develop a well-architechted app with reusable components etc? I don't buy that, not for a second.
        aaron-lebo 9y ago
        That's not what happened. We had a set of non-programmers who built a complex jQuery app over a year, which was then translated into a Mithril app over a summer. What I said was you can be building complex applications in one of these frontend frameworks in a week. Judging from a few responses in this thread, there are a lot of people who don't want to do that for whatever reason.
  - brlewis 9y ago
    Cool story of what you've been able to do by investing in modern web technologies like Mithril. The part where you say a lot of people are terrified of heir skillset becoming obsolete -- I'm not sure I see that in web developers. Everybody I talk to is happy that their knowledge is now obsolete of which array methods don't work in IE8, for example. Possibly a lot of the backlash against JS comes from conversations that go like the "How it feels to learn JavaScript in 2016" essay rather than like the one posted here.
- brlewis 9y ago
  Thanks, glad it hit home. I also remember back when best practice in web dev was to avoid JavaScript. A lot of the new shiny things in between then and now just weren't it, but a lot of today's new shiny things are for real.
spootnik 9y ago
Don't think I'll ever be a fan of JSX and combining templating with the JS. Guess I'm just an Angular fanboy
chrisweekly 9y ago
Fantastic post. Best thing I've read on FE dev in many months. Bravo!
cabaalis 9y ago
I had a dev write some "modern" Javascript in a project. We neglected to test in slightly out-of-date safari on Mac. Took forever to figure out that "let" keyword was not supported.
- aaron-lebo 9y ago
  You're probably aware of this but that's why you put everything through Babel or Typescript to convert it. That setup is easy enough.
  - klipt 9y ago
    It's like compiling for older CPUs ... if newer CPUs could execute C++ source code directly.
  - trynewideas 9y ago
    Assuming they read the post, they're not only aware of it but also read the post's author warning their fictional subject about the performance problems of using transpilers in production, and shrugging it off for the example because it's just a learning exercise and "easy to change later".
    - troygoode 9y ago
      The warning in the content is (correctly) against performing the transpilation in the client; the fix is to run the transpiler on your server, preferably as part of your CI build process.
- mjevans 9y ago
  Obligatory links: https://caniuse.com/let https://caniuse.com/let https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#Browser_compatibility https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe... It's amazing how recently some things arrive and how late competitors skip some elements.
  - 9y ago
briantakita 9y ago
Want a library faster than mithril, no runtime download, & handlebars syntax? Try Sveltejs. Rollupjs also has "treeshaking", meaning your transpiled bundle only includes the functions that are referenced allowing you to organize your code into large modules or even use a monorepo.
- chx 9y ago
  I am too old and I wrote an AJAX chat before AJAX was called that and before jQuery existed. This left a mark on my soul manifesting in a very hostile attitude towards JS. But of course as JS spreads I am looking, reading and mostly just shaking my head. But man, Svelte makes sense. For the first time in about 15 years, a JS framework makes sense.
vturner 9y ago
"I have to confess, the build setup is the most intimidating part of modern web development for me." Here here.
- tangue 9y ago
  I feel sorry for the generation who didn't experienced the "drop file on ftp client, it's on the internet" experience. No setup, no build tools ...
  - ng12 9y ago
    I feel worse for the me of eight years ago maintaining an SPA codebase where everything was thrown on window with dozens of global stylesheets.
  - andybak 9y ago
    Shhhh. Don't tell anybody - but that still works. Even with an SPA - assuming you use a framework that doesn't force you through a build pipeline.
- roryisok 9y ago
  * hear hear
- expertentipp 9y ago
  It cannot be simple - it's there to intimidate the new employees/team members. The setup is never wrong, but "the way we do it here" - a particular initiation ceremony. Those indocile will be reported to line manager as bad team members who undermine the team spirit. Usually a junior QA person and a scrum master are the gatekeepers of the setup, green build, and the history of git commit messages.
  - austinhyde 9y ago
    In all seriousness, if this is what you encounter at your workplace, you need to get out and work somewhere else; this is an extremely toxic environment. Even if the build setup is the most complex thing on the face of the earth, if you or team members get reported for undermining the team because you don't understand it, then those are not the team members or managers you want to work with or for.
revscat 9y ago
We have recently implemented Angular4 in our project, and have started to pick it up. Recently picked up a story that was adding a simple confirmation modal to a page: "Alert" text in the top, body with some warning text, and a yes/no button. This was my first experience with modern JavaScript frameworks and TypeScript. I wanted to do it right, so worked closely with team members who were more versed in this stuff, and followed the various recommended best practices. By the time all was said and done the PR for this thing had 27 files in it. For a modal. This seems ludicrous to me. The frustration, somewhat humorous, expresses by TFA is completely understandable, though. While I came to appreciate TS, I'm still skeptical about this JS framework stuff. They seem overly complicated to me. (While I have only read casually about React, it seems similar in this regard.)
- aaron-lebo 9y ago
  Yeah something's not right. A modal is a line of code, not 27 files. The most extensible modal could be a single file component. Just starting fresh, what is a modal? It's a widget (we could use a div) which when activated is moved to the front of the z axis and steals focus. CSS can do that. Now all you need it do is keep attributes regarding the text of the modal and state representing whether it's activated (we can juse a regular JS object for both), and you've got a working modal. Some of the frameworks are needlessly complex, which is frustrating, because it's hiding something very basic.
  - thunderbong 9y ago
    I agree with the GP with regard to Angular4. But have you really tried to create a modal in HTML/CSS/JS without any framework? It's surely not one line of code!
    - aaron-lebo 9y ago
      OK, so it's a dozen. https://stackoverflow.com/questions/25920941/how-do-i-overlay-a-popup-view-in-mithril-js https://stackoverflow.com/questions/25920941/how-do-i-overla... Didn't say not to use a framework. Use it and some CSS and that's a basic task, not to mention there are other libraries which do it for you already.
alexchantavy 9y ago
Helpful post! Glad to see actual instructive examples rather than a thinly veiled "I hate js" piece.
seanwilson 9y ago
It can be a pain getting the build system up and running but once you're writing typed JavaScript code with modern features like async/wait and ES6 modules along with live + hot reloading, it's impossible to go back. It's really trendy to complain about JavaScript changing too fast right now but the last few years have brought some great changes to JavaScript.
- ng12 9y ago
  Agreed. I think the perception comes from lots of people who are using heavy frameworks for simple, mostly-static webpages. Yes, they add complexity to my life, but the experience of working with React/We pack/Typescript is unparalleled -- especially considering what I was working with only five years ago.
  - seanwilson 9y ago
    Yup. Converting old promise based code to using async/await and fixing all the places that give "variable could be undefined" type errors is so satisfying. Recently I did a huge refactor of some TypeScript code without running the app and just being guided by the type checker errors for several hours and it worked almost first time. We pack = Webpack?
- zoul 9y ago
  But didn’t we say the same thing about JS almost every year in the past? Only for the status quo to be obsoleted in a few months? Is the breakneck change curve slowing down finally?
  - lolive 9y ago
    Being a java-ist, I could not consider to learn JS without a proper type system, and a proper IDE (with autocompletion, static analysis & refactoring facilities). TypeScript & VSCode/IntelliJ save my day now. More advanced programming paradigms (a la Haskell) are nowadays almost doable in the JS ecosystem. So yes, I would consider that JS has matured as a platform. I still have no clue about frontend web frameworks yet.
d--b 9y ago
I was expecting another rant about how painful it is to navigate the hundreds of framework out there. Nice to see that people who dropped JavaScript a while get to find that things are actually better today than they were.
ertucetin 9y ago
Run away.
z3t4 9y ago
you don't have to make a monolith web app, or use React, Angular et.al, or transpilers, not even JQuery. State can be managed by observable pattern or event listeners. example: app.on("new_private_msg", updateMsgBadge); app.on("new_chat_msg", updateMsgBadge); function updateMsgBadge() { this.badge.newMessages = PRIVATE_MSG.reduce(msg => msg.unread) + CHAT_MSG.reduce(msg => msg.unread); } Parts of the app can be abstracted into micro-services. For example the signup can be it's own micro-service. Or using the plugin pattern each widget can be independent/untangled.
raldu 9y ago
The whole story felt sarcastic and also a little nauseous. Not exactly sure whether there is intended sarcasm or not. The process looks quite complicated where you have to figure out lots of "buts," "whys," and "gotchas," while keep telling yourself, "What the hell?" all the time.
- tonysdg 9y ago
  It's likely because it's a reaction piece to this article [1], which is almost entirely sarcasm. [1]https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f https://hackernoon.com/how-it-feels-to-learn-javascript-in-2...
- gggdvnkhmbgjvbn 9y ago
  Yeah to me it read like porn dialogue. The first person narrator gives gentle instructions and every line from the naïve second party is unrealistically enthusiastic.
serpix 9y ago
Having used only re-frame and Clojurescript for two years now every time I look at where the Javascript guys are I roll my head. Is nobody even slightly wondering how OOP has infiltrated modern JS development? Old school Java web development has fully seeped into Javascript with JSX replacing JSP, OOP everywhere.. It looks exactly like the bells and whistles of early 2000 web development.
- alayek 9y ago
  > Is nobody even slightly wondering how OOP has infiltrated modern JS development? I would like you to give an example of this. We use the class-syntax, yes, but inheritance usually never goes beyond one level of parent-class-child-class relationship. If anything, the JS community at large hates OOP the traditional way, and somewhat open to the prototypical pattern. The ecosystem actually prefers functional constructs. At the very least, an attempt to write pure functions.
- twhb 9y ago
  That OOP is only skin deep. Look at the way data flows, which pieces of code need to understand any given data structure. Look at the preferred way of extending classes - composition. I think what we have now is not old-school anything, but cherry-picked good parts together forming a New Thing.
  - serpix 9y ago
    Thank you for the clarification and insight!
Kiro 9y ago
It's too bad they don't address state management. Right now it's just showing how to bootstrap a static app without state changes. How do you even update your data in Mithril?
- brlewis 9y ago
  Static? That's half true. let planets; let planetFilter = planet => true; The planets variable is static in this example, but planetFilter changes. The "Voila, it works" link near the bottom of the essay leads to a live demo: https://brlewis.github.io/2017/planets.html https://brlewis.github.io/2017/planets.html Was there a particular aspect of state management you want to hear more about? I'm thinking of a follow-on post. Not sure whether the next one should be state or build system.
  - Kiro 9y ago
    Oh, you're right. The state management was so subtle that it actually didn't click when I read it. I don't understand how it knows to rerender though? From what I can tell you're just setting the variable planetFilter and that's it, while with React you would have to do a setState to register it.
    - aaron-lebo 9y ago
      You write your templates to handle the state changes, like: m('div, {style: `display: ${status ? 'block' : 'none'}`) Mithril's diffing engine does the rest. If status changes it knows to rerender that section.
      - Kiro 9y ago
        But how does Mithril know that status changes? How does it know you just changed the variable?
        pygy_ 9y ago
        By default, Mithril redraws the app after DOM events fire (in this case `onchange={filterHandler(func)}`), and when ajax requests are complete (using the `m.request()` XHR wrapper). You can also manually trigger a redraw by using `m.redraw()`, but it is rarely needed.
k__ 9y ago
Well, at least it's a web project. I'm doing mobile projects at the moment, and it feels like going back 10 years.
alayek 9y ago
A refreshing read. Was expecting a satirical negative take on the complexity. However, this only covers a small part of front-end development with VDOM based approach, and a few ES6 constructs (destructuring, arrow functions, let-const). The author misses out on mobile development, Node JS and NPM modules, server side, and Electron-based desktop apps. It's a good thing to take the positive approach, and get introduced to some interesting, low-barrier-to-entry items. At the same time, it would be prudent to keep in mind what lies ahead.
- andybak 9y ago
  I sense that the target audience is probably people who are already developers but have a negative view on the current js ecosystem. They are likely to be fairly happy with their existing approaches to desktop and server development and want to learn to use javascript where it is currently unavoidable.
- GrumpyNl 9y ago
  You dont need node.js or react for mobile developement, its not a must. I build fully responsive with html5, jQuery and a PhP api
dankohn1 9y ago
That's a very impressive demo. I did Javascript development full time from 2012-2014 (Node.js 0.8 and Angular 1.0) and it's amazing to me that essentially none of the constructs he mentions were available then. It wasn't that long ago!
tomxor 9y ago
I think a more appropriate title is what it's like to learn front end web development in 2017, not much of the discussion has anything to do with language details and everything to do with MVC and html.
abledon 9y ago
Love the babel include in the src at the top. Great strategy for introducing beginners to modern js.
williamle8300 9y ago
The author should have mentioned Preact[1]. I'd argue it's better than InfernoJS 1. https://preactjs.com https://preactjs.com
Cosmopolitan 9y ago
"position: fixed" menu on top and a non-closable div on the bottom? Why does the author hate widescreen monitors so much?
RandyRanderson 9y ago
One day, with a lot of work, Javascript will have all the features languages like C++, Java, and C# had before JS existed.
jgalvez 9y ago
That article is focused on React/JSX. Having coded Nuxt/Vue apps I seriously can't relate. With Nuxt you don't even have the build/setup pains. It just works. It just builds.
- mmcnl 9y ago
  You haven't read the article, apparently. It focuses on Mithril (not React). And Nuxt simply abstracts the build step away server-side, so it's still there.

310 points by eropple 9y ago

I submitted this after 'brlewis linked it (it's his piece) in a comment because it really hit home. Like, I've never used Mithril, but I dove into React (both web and React Native) this year and it reminds me of when doing web stuff was fun. Which, for me, was before anyone was actually using JavaScript. There are a lot of skeptics about modern JS frameworks, and I get it (my inclination in every programming environment I've ever worked in is to avoid frameworks, etc. until I know I need them), but boy is this a big, and awesome, change.

aaron-lebo 9y ago
You know a lot of people are terrified of change and new stuff because it might mean their skillset is obsolete. That's a lot of what this backlash against JS is. Some of the criticism is warranted, but a lot of it isn't, it comes from people who have never done anything other than sneer at the language, and for every issue JS has, you can find a matching issue in another language that either a) isn't a problem because there are idiomatic solutions or b) everyone in the choir knows it's dumb but they don't say it to outsiders, because why advertise your weaknesses? JS today is very expressive (more expressive than Python simply due to good lambdas - not to pick on Python but it's a language that doesn't get the hate of a JS or Go), it's been fast for awhile, it's got a dozen new interesting frameworks, the tooling keeps getting better, etc. This can either scare you or represent opportunity. We've got a 5k line JS app. It was written by people who weren't programmers, in a jQuery/d3 ball (it was still an impressive interface). Over the summer we've converted it to Mithril and modern JS, now it's half the size, our dev environment is setup with a simple npm install and npm start, we have reusable components that multiple people can grok and use, it only takes a 20 line webpack file to do this all, and before the summer started none of us had used the framework. It's amazing what it has enabled us to do and how simple the whole stack is. I've been building desktop apps and small intranet web apps for a decade, they don't hold a candle to what's possible if you harness this stuff. People can complain all they want but this is what progress looks like. Someone might not think it's cool that you can write an interactive single page application in 50 lines of code that anyone in the world can access, but isn't that what we wanted? It takes a day to grok this stuff, a week to build interesting stuff in it. It's worth the investment, you might actually learn to do things you couldn't before. That's fun.
- spootnik 9y ago
  JS is love, JS is life
- lghh 9y ago
  Not to be pedantic, but if you have a 5k line JS app that "wasn't written by programmers" who was it written by? If they wrote and shipped a 5k line JS app, in my eyes they are programmers - but possibly not very good ones.
  - aaron-lebo 9y ago
    Well, they weren't professional programmers (not their main job, done out of necessity) and they weren't trained. As I understand it they were actually learning it all on the go (like a lot of new programmers). It wouldn't be shocking if a lot of JS devs were in a similar boat, which explains the community a little bit. So yeah, they're programmers now, but they didn't start out that way and the app showed it. That's what JS and the browser allowed them to do.
    - mod 9y ago
      So experienced devs are afraid of learning something that took non-programmers a week to get up to speed and develop a well-architechted app with reusable components etc? I don't buy that, not for a second.
      - aaron-lebo 9y ago
        That's not what happened. We had a set of non-programmers who built a complex jQuery app over a year, which was then translated into a Mithril app over a summer. What I said was you can be building complex applications in one of these frontend frameworks in a week. Judging from a few responses in this thread, there are a lot of people who don't want to do that for whatever reason.
- brlewis 9y ago
  Cool story of what you've been able to do by investing in modern web technologies like Mithril. The part where you say a lot of people are terrified of heir skillset becoming obsolete -- I'm not sure I see that in web developers. Everybody I talk to is happy that their knowledge is now obsolete of which array methods don't work in IE8, for example. Possibly a lot of the backlash against JS comes from conversations that go like the "How it feels to learn JavaScript in 2016" essay rather than like the one posted here.
brlewis 9y ago
Thanks, glad it hit home. I also remember back when best practice in web dev was to avoid JavaScript. A lot of the new shiny things in between then and now just weren't it, but a lot of today's new shiny things are for real.

spootnik 9y ago

Don't think I'll ever be a fan of JSX and combining templating with the JS. Guess I'm just an Angular fanboy

chrisweekly 9y ago

Fantastic post. Best thing I've read on FE dev in many months. Bravo!

cabaalis 9y ago

I had a dev write some "modern" Javascript in a project. We neglected to test in slightly out-of-date safari on Mac. Took forever to figure out that "let" keyword was not supported.

aaron-lebo 9y ago
You're probably aware of this but that's why you put everything through Babel or Typescript to convert it. That setup is easy enough.
- klipt 9y ago
  It's like compiling for older CPUs ... if newer CPUs could execute C++ source code directly.
- trynewideas 9y ago
  Assuming they read the post, they're not only aware of it but also read the post's author warning their fictional subject about the performance problems of using transpilers in production, and shrugging it off for the example because it's just a learning exercise and "easy to change later".
  - troygoode 9y ago
    The warning in the content is (correctly) against performing the transpilation in the client; the fix is to run the transpiler on your server, preferably as part of your CI build process.
mjevans 9y ago
Obligatory links: https://caniuse.com/let https://caniuse.com/let https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#Browser_compatibility https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe... It's amazing how recently some things arrive and how late competitors skip some elements.
- 9y ago

briantakita 9y ago

Want a library faster than mithril, no runtime download, & handlebars syntax? Try Sveltejs. Rollupjs also has "treeshaking", meaning your transpiled bundle only includes the functions that are referenced allowing you to organize your code into large modules or even use a monorepo.

chx 9y ago
I am too old and I wrote an AJAX chat before AJAX was called that and before jQuery existed. This left a mark on my soul manifesting in a very hostile attitude towards JS. But of course as JS spreads I am looking, reading and mostly just shaking my head. But man, Svelte makes sense. For the first time in about 15 years, a JS framework makes sense.

vturner 9y ago

"I have to confess, the build setup is the most intimidating part of modern web development for me." Here here.

tangue 9y ago
I feel sorry for the generation who didn't experienced the "drop file on ftp client, it's on the internet" experience. No setup, no build tools ...
- ng12 9y ago
  I feel worse for the me of eight years ago maintaining an SPA codebase where everything was thrown on window with dozens of global stylesheets.
- andybak 9y ago
  Shhhh. Don't tell anybody - but that still works. Even with an SPA - assuming you use a framework that doesn't force you through a build pipeline.
roryisok 9y ago
* hear hear
expertentipp 9y ago
It cannot be simple - it's there to intimidate the new employees/team members. The setup is never wrong, but "the way we do it here" - a particular initiation ceremony. Those indocile will be reported to line manager as bad team members who undermine the team spirit. Usually a junior QA person and a scrum master are the gatekeepers of the setup, green build, and the history of git commit messages.
- austinhyde 9y ago
  In all seriousness, if this is what you encounter at your workplace, you need to get out and work somewhere else; this is an extremely toxic environment. Even if the build setup is the most complex thing on the face of the earth, if you or team members get reported for undermining the team because you don't understand it, then those are not the team members or managers you want to work with or for.

revscat 9y ago

We have recently implemented Angular4 in our project, and have started to pick it up. Recently picked up a story that was adding a simple confirmation modal to a page: "Alert" text in the top, body with some warning text, and a yes/no button. This was my first experience with modern JavaScript frameworks and TypeScript. I wanted to do it right, so worked closely with team members who were more versed in this stuff, and followed the various recommended best practices. By the time all was said and done the PR for this thing had 27 files in it. For a modal. This seems ludicrous to me. The frustration, somewhat humorous, expresses by TFA is completely understandable, though. While I came to appreciate TS, I'm still skeptical about this JS framework stuff. They seem overly complicated to me. (While I have only read casually about React, it seems similar in this regard.)

aaron-lebo 9y ago
Yeah something's not right. A modal is a line of code, not 27 files. The most extensible modal could be a single file component. Just starting fresh, what is a modal? It's a widget (we could use a div) which when activated is moved to the front of the z axis and steals focus. CSS can do that. Now all you need it do is keep attributes regarding the text of the modal and state representing whether it's activated (we can juse a regular JS object for both), and you've got a working modal. Some of the frameworks are needlessly complex, which is frustrating, because it's hiding something very basic.
- thunderbong 9y ago
  I agree with the GP with regard to Angular4. But have you really tried to create a modal in HTML/CSS/JS without any framework? It's surely not one line of code!
  - aaron-lebo 9y ago
    OK, so it's a dozen. https://stackoverflow.com/questions/25920941/how-do-i-overlay-a-popup-view-in-mithril-js https://stackoverflow.com/questions/25920941/how-do-i-overla... Didn't say not to use a framework. Use it and some CSS and that's a basic task, not to mention there are other libraries which do it for you already.

alexchantavy 9y ago

Helpful post! Glad to see actual instructive examples rather than a thinly veiled "I hate js" piece.

seanwilson 9y ago

It can be a pain getting the build system up and running but once you're writing typed JavaScript code with modern features like async/wait and ES6 modules along with live + hot reloading, it's impossible to go back. It's really trendy to complain about JavaScript changing too fast right now but the last few years have brought some great changes to JavaScript.

ng12 9y ago
Agreed. I think the perception comes from lots of people who are using heavy frameworks for simple, mostly-static webpages. Yes, they add complexity to my life, but the experience of working with React/We pack/Typescript is unparalleled -- especially considering what I was working with only five years ago.
- seanwilson 9y ago
  Yup. Converting old promise based code to using async/await and fixing all the places that give "variable could be undefined" type errors is so satisfying. Recently I did a huge refactor of some TypeScript code without running the app and just being guided by the type checker errors for several hours and it worked almost first time. We pack = Webpack?
zoul 9y ago
But didn’t we say the same thing about JS almost every year in the past? Only for the status quo to be obsoleted in a few months? Is the breakneck change curve slowing down finally?
- lolive 9y ago
  Being a java-ist, I could not consider to learn JS without a proper type system, and a proper IDE (with autocompletion, static analysis & refactoring facilities). TypeScript & VSCode/IntelliJ save my day now. More advanced programming paradigms (a la Haskell) are nowadays almost doable in the JS ecosystem. So yes, I would consider that JS has matured as a platform. I still have no clue about frontend web frameworks yet.

d--b 9y ago

I was expecting another rant about how painful it is to navigate the hundreds of framework out there. Nice to see that people who dropped JavaScript a while get to find that things are actually better today than they were.

ertucetin 9y ago

Run away.

z3t4 9y ago

you don't have to make a monolith web app, or use React, Angular et.al, or transpilers, not even JQuery. State can be managed by observable pattern or event listeners. example: app.on("new_private_msg", updateMsgBadge); app.on("new_chat_msg", updateMsgBadge); function updateMsgBadge() { this.badge.newMessages = PRIVATE_MSG.reduce(msg => msg.unread) + CHAT_MSG.reduce(msg => msg.unread); } Parts of the app can be abstracted into micro-services. For example the signup can be it's own micro-service. Or using the plugin pattern each widget can be independent/untangled.

raldu 9y ago

The whole story felt sarcastic and also a little nauseous. Not exactly sure whether there is intended sarcasm or not. The process looks quite complicated where you have to figure out lots of "buts," "whys," and "gotchas," while keep telling yourself, "What the hell?" all the time.

tonysdg 9y ago
It's likely because it's a reaction piece to this article [1], which is almost entirely sarcasm. [1]https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f https://hackernoon.com/how-it-feels-to-learn-javascript-in-2...
gggdvnkhmbgjvbn 9y ago
Yeah to me it read like porn dialogue. The first person narrator gives gentle instructions and every line from the naïve second party is unrealistically enthusiastic.

serpix 9y ago

Having used only re-frame and Clojurescript for two years now every time I look at where the Javascript guys are I roll my head. Is nobody even slightly wondering how OOP has infiltrated modern JS development? Old school Java web development has fully seeped into Javascript with JSX replacing JSP, OOP everywhere.. It looks exactly like the bells and whistles of early 2000 web development.

alayek 9y ago
> Is nobody even slightly wondering how OOP has infiltrated modern JS development? I would like you to give an example of this. We use the class-syntax, yes, but inheritance usually never goes beyond one level of parent-class-child-class relationship. If anything, the JS community at large hates OOP the traditional way, and somewhat open to the prototypical pattern. The ecosystem actually prefers functional constructs. At the very least, an attempt to write pure functions.
twhb 9y ago
That OOP is only skin deep. Look at the way data flows, which pieces of code need to understand any given data structure. Look at the preferred way of extending classes - composition. I think what we have now is not old-school anything, but cherry-picked good parts together forming a New Thing.
- serpix 9y ago
  Thank you for the clarification and insight!

Kiro 9y ago

It's too bad they don't address state management. Right now it's just showing how to bootstrap a static app without state changes. How do you even update your data in Mithril?

brlewis 9y ago
Static? That's half true. let planets; let planetFilter = planet => true; The planets variable is static in this example, but planetFilter changes. The "Voila, it works" link near the bottom of the essay leads to a live demo: https://brlewis.github.io/2017/planets.html https://brlewis.github.io/2017/planets.html Was there a particular aspect of state management you want to hear more about? I'm thinking of a follow-on post. Not sure whether the next one should be state or build system.
- Kiro 9y ago
  Oh, you're right. The state management was so subtle that it actually didn't click when I read it. I don't understand how it knows to rerender though? From what I can tell you're just setting the variable planetFilter and that's it, while with React you would have to do a setState to register it.
  - aaron-lebo 9y ago
    You write your templates to handle the state changes, like: m('div, {style: `display: ${status ? 'block' : 'none'}`) Mithril's diffing engine does the rest. If status changes it knows to rerender that section.
    - Kiro 9y ago
      But how does Mithril know that status changes? How does it know you just changed the variable?
      - pygy_ 9y ago
        By default, Mithril redraws the app after DOM events fire (in this case `onchange={filterHandler(func)}`), and when ajax requests are complete (using the `m.request()` XHR wrapper). You can also manually trigger a redraw by using `m.redraw()`, but it is rarely needed.

k__ 9y ago

Well, at least it's a web project. I'm doing mobile projects at the moment, and it feels like going back 10 years.

alayek 9y ago

A refreshing read. Was expecting a satirical negative take on the complexity. However, this only covers a small part of front-end development with VDOM based approach, and a few ES6 constructs (destructuring, arrow functions, let-const). The author misses out on mobile development, Node JS and NPM modules, server side, and Electron-based desktop apps. It's a good thing to take the positive approach, and get introduced to some interesting, low-barrier-to-entry items. At the same time, it would be prudent to keep in mind what lies ahead.

andybak 9y ago
I sense that the target audience is probably people who are already developers but have a negative view on the current js ecosystem. They are likely to be fairly happy with their existing approaches to desktop and server development and want to learn to use javascript where it is currently unavoidable.
GrumpyNl 9y ago
You dont need node.js or react for mobile developement, its not a must. I build fully responsive with html5, jQuery and a PhP api

dankohn1 9y ago

That's a very impressive demo. I did Javascript development full time from 2012-2014 (Node.js 0.8 and Angular 1.0) and it's amazing to me that essentially none of the constructs he mentions were available then. It wasn't that long ago!

tomxor 9y ago

I think a more appropriate title is what it's like to learn front end web development in 2017, not much of the discussion has anything to do with language details and everything to do with MVC and html.

abledon 9y ago

Love the babel include in the src at the top. Great strategy for introducing beginners to modern js.

williamle8300 9y ago

The author should have mentioned Preact[1]. I'd argue it's better than InfernoJS 1. https://preactjs.com https://preactjs.com

Cosmopolitan 9y ago

"position: fixed" menu on top and a non-closable div on the bottom? Why does the author hate widescreen monitors so much?

RandyRanderson 9y ago

One day, with a lot of work, Javascript will have all the features languages like C++, Java, and C# had before JS existed.

jgalvez 9y ago

That article is focused on React/JSX. Having coded Nuxt/Vue apps I seriously can't relate. With Nuxt you don't even have the build/setup pains. It just works. It just builds.

mmcnl 9y ago
You haven't read the article, apparently. It focuses on Mithril (not React). And Nuxt simply abstracts the build step away server-side, so it's still there.