Changelog

JavaScript Icon

JavaScript

JavaScript is an object-oriented programming language used alongside HTML and CSS to give functionality to web pages.
384 Stories
All Topics

React Icon github.com

An interactive, explorable explanation about the peculiar magic of sound waves

This interactive guide introduces and explores waveforms. It covers how to read waveform graphs, goes over the fundamental physics of sound, teaches how it relates to music and harmony, and demonstrates how to build complex tones from simple ones. Even if you don't care how waveforms work, check it out for the quality of the experience alone. Built with React, Styled Components, and SVG.

read more...
logged by @jerodsanto 2018-02-16T14:12:00.011027Z permalink #learn #react #javascript

Ember Icon emberjs.com

Ember team releases version 3.0 of their ambitious web framework

Today the Ember project is releasing version 3.0.0 of Ember.js, Ember Data, and Ember CLI. Ember 3.0 doesn't introduce any new functionality, instead it focuses the framework by removing long-deprecated APIs and support for legacy platforms. A major version release with no new functionality: bold move. Perhaps a winning strategy if it can garner similar praise as Apple's Snow Leopard update to macOS (nee OS X). Ember is like the Energizer Bunny of web frameworks. Can you believe the team has been working on it since 2011? That's like forever in webdev-years.

read more...
logged by @jerodsanto 2018-02-15T19:34:00.009864Z permalink #ember #javascript

Smashing Magazine Icon Smashing Magazine

Replace jQuery with Vue.js without requiring a build step

What some people don't not know is that you can incorporate Vue into your project the same way that you would incorporate jQuery, no build step necessary. You don’t have to rewrite the HTML in JavaScript, you don’t have to use webpack, and you don’t have to set up a giant system. In this post Sarah Drasner covers common jQuery use cases and how to switch them over to Vue, and why you'd even want to.

read more...
logged by @adamstac 2018-02-15T04:23:57.280448Z permalink #javascript #jquery #vue

JavaScript Icon github.com

Front End Interview Handbook

Remember the Front-end Job Interview Questions project that we talked to Darcy Clark about way back in the day? Well, this is the answer to that project. Literally. It's answers to the questions. It dubs itself as: almost complete answers to "Front-end Job Interview Questions" which you can use to interview potential candidates, test yourself, or completely ignore They forgot to mention the other use case: memorizing the answers just in case your interviewer pulls questions directly from this list 😉

read more...
logged by @jerodsanto 2018-02-12T16:24:00.009533Z permalink #front-end #javascript

Rico Sta. Cruz Avatar The Changelog #283

Devhints - TL;DR for Developer Documentation

Rico Sta. Cruz joined us to talk about his project Devhints — cheatsheets for developers! There are more than 365 cheatsheets you can contribute to and it's open source. We talked about the design, technical implementation, community, and alternate interfaces (CLI). We also covered RSJS, RSCSS, and Docpress. You have to sell what it is you're building in your documentation. It's not just describing what it is and how to use it. It's about telling interesting stories. — Rico Sta. Cruz

read more...
Play
logged by @adamstac 2018-02-09T23:18:08.927265Z permalink #practices #javascript #css

Node.js Icon meowni.ca

Automatic visual diffing with Puppeteer

Monica Dinculescu: I did a little song-and-dance that sets up Puppeteer , takes screenshots of your app (like, all the routes you care about), and then compares them to the “golden” ones. If they match, your test passes! It only works with Chrome (because Puppeteer), but that's not a big deal since this is the kind of thing you only put in your devDependencies. The results are super cool in your test suite output:

read more...
logged by @jerodsanto 2018-02-05T21:35:00.011605Z permalink #node #javascript #testing

Medium Icon Medium

Hallelujah—In Praise of Babel

This made the rounds back in December, but it's still worth sharing as it's so cool. Angus Croll re-wrote Leonard Cohen's 1984 hit to sing the praises of Babel.js! 👏 I heard there was a clever trick That rewrote all your JavaScript But you don’t really care for magic, do ya (Also check out the audio version by Shawn Wang)

read more...
logged by @jerodsanto 2018-02-05T19:24:00.009242Z permalink #babel #javascript

David Heinemeier Hansson m.signalvnoise.com

Stimulus 1.0: a modest JavaScript framework for the HTML you already have

When you combine the gains of Turbolinks and Stimulus... Turbolinks maintains a persistent process, just like single-page applications do. It intercepts links and loads new pages via Ajax. The server still returns fully-formed HTML documents. This strategy alone can make most actions in most applications feel really fast. For Basecamp, it sped up the page-to-page transition by ~3x. But Turbolinks alone is only half the story. Prior to Stimulus, Basecamp used different styles and patterns to apply "JavaScript sprinkles". Stimulus rolls up the best of those patterns into a modest, small framework revolving around just three main concepts: Controllers, actions, and targets. It’s designed to read as a progressive enhancement when you look at the HTML it’s addressing... You should 💯 read the rest of this post as well as watch this proposition of Turbolinks from Sam Stephenson at RailsConf 2016. ALSO, we're recording a show next week with David Heinemeier Hansson about Stimulus, so send us any questions you have by replying to this email, Slack, or Twitter.

read more...
logged by @adamstac 2018-02-03T06:10:32.195681Z permalink #stimulus #javascript #front-end

React Icon formidable.com

Building an offline-first website

Last August we covered the phenomenon of this offline-only site from Chris Bolin. It forced you to be offline to view the actual message Chris was trying to share. For Chris, it was about communicating the general hum of distraction and interruption we all face from constantly being connected. It's something we've become very comfortable with. So much so, that to go offline requires deliberate intention. It's hard to do. Chris Bolin: Do you want to be productive? Just go offline, because to maintain a constant connection to the internet is to maintain a constant connection to interruptions, both external and internal. Well, we totally missed this breakdown of how he built that site (he published that a few months later) and we also didn't notice the offline site is on GitHub so you can view the code and even contribute by translating it to your language.

read more...
logged by @adamstac 2018-01-30T16:58:37.823664Z permalink #react #javascript

JavaScript Icon rollbar.com

Top 10 JavaScript errors from 1000+ projects (and how to avoid them)

Our friends at Rollbar did some digging through their data and found some insightful stuff. we looked at our database of thousands of projects and found the top 10 errors in JavaScript. We’re going to show you what causes them and how to prevent them from happening. If you avoid these "gotchas," it'll make you a better developer. Freakin' JS. I know many of these all too well.

read more...
logged by @jerodsanto 2018-01-26T16:57:00.10660Z permalink #javascript

Slack Engineering Icon Slack Engineering

Keep webpack Fast: A Field Guide for Better Build Performance

Slack chose webpack as their build tool, but it wasn't fast enough. Our build took minutes, not seconds: a far cry from the sub-second concatenation we were used to. Slack’s web teams deploy up to 100 times on any given work day, so we felt this increase acutely. Let's just say they went to work and came up with several techniques to speed up the build process. webpack is a fantastic, versatile, tool that does not need to cost the earth. These techniques have helped us reduce our median build time from 170 to 17 seconds and, while they have done much to improve the deployment experience for our engineers, they are by no means a complete work.

read more...
logged by @adamstac 2018-01-21T04:53:59.376518Z permalink #javascript #webpack #performance
0:00 / 0:00