A Comparison application boilerplate to compare code samples, api changes, framework deprecations and many more.

Check out the deployed app!

git clone [email protected]:rajasegar/this-vs-that.git

Feel free to modify the parameters like INPUT, OUTPUT, EXT, etc.,

# File name convention for left column
# eg: this.html
INPUT="es5"

# File name convention for right column
# eg: that.html
OUTPUT="es6"

# File extension to identify which type of file
# eg: html, js, css, etc.,
EXT="js"

code
| fat-arrow-functions
| | es5.js
| | es6.js

es5.js

// ---------- ES5 ----------
function calcCircleArea(radius) {
  return Math.PI * radius * radius;
}

es6.js

// ---------- ES6 ----------
const calcCircleArea = (radius) => Math.PI * radius * radius;

$ ./update-doc.sh

You should get something like this:

This is a vanilla JavaScript application. You must serve the files locally in order for the JavaScript and CSS to load in the browser. For example:

npm install http-server -g
http-server .

Visit http://localhost:8080 to see the results. If you make changes, restart the server. You might have to clear the cache to see your changes. (In Chrome, open the dev tools, then right click on the browser's main refresh arrow and choose Empty Cache and Hard Reload, or configure your dev tools to not keep a cache in the first place.)

Once you made changes to the comparison files under code/ you need to run the update-doc.sh script to reflect the latest changes.

./update-doc.sh

Contributions are welcome! Simple examples can be added to this cheat sheet. Copy and paste a <section> block in index.html. Create the code sample files in the code directory, change the data tag of the <pre>, and you're done! Try to follow the same file naming scheme as is used elsewhere, and make sure to name any .html files

This site is deployed to GitHub Pages automatically from the master branch.

This uses Prism code hightlighting with the file highlight plugin.

Inspired by YouMightNotNeedJQuery.

• YouMightNotNeedJQuery
• Svelte 2 vs 3
• Ember Octane vs Classic Cheat Sheet