Guide · Open source
How to use modern-js-cheatsheet: a quick guide to ES6 syntax
Updated · written with AI from the project's own documentation and checked against our catalogue data
modern-js-cheatsheet is a free, open-source reference that explains the JavaScript syntax you will often meet in modern projects and sample code, mostly features from ES2015 (ES6). It is written for developers who know basic JavaScript but find React and other modern codebases hard to read. After this guide, you will know how to open the cheatsheet, find the concept you need, and use its examples and links to read unfamiliar code.
Modern JavaScript Cheatsheetmbeaudru/modern-js-cheatsheet · ★ 25.6k · MIT Install options & downloads Quick start
- 1Open the cheatsheet. Go to https://mbeaudru.github.io/modern-js-cheatsheet/ in your browser to read it online. No install is listed in the README.
- 2Clone it if you want a local copy. Run git clone https://github.com/mbeaudru/modern-js-cheatsheet in a terminal to download the repository.
- 3Scan the table of contents. Find the notion that matches the syntax you are trying to understand, such as promises or async/await.
- 4Read the short explanation and sample code. Start with the short explanation, then study the sample code to see the pattern in use.
- 5Follow the links for depth. Use the external resources listed under each notion, or MDN, when you need a fuller explanation.
- 6Apply it back to your code. Return to the codebase you are reading and check the unfamiliar line against the example.
What the cheatsheet covers
The cheatsheet is organised as a list of notions. Each one has a short explanation, sample code and links to further reading. Topics include variable declaration with var, const and let, arrow functions, function default parameters, destructuring, array methods like map, filter and reduce, the spread operator, template literals, imports and exports, classes, promises, async/await, generators and static methods.
- Variable declaration: var, const, let
- Arrow functions and default parameters
- Destructuring objects and arrays
- Array methods: map, filter, reduce, find
- Promises and Async Await
- Classes, extends and super, static methods
Get the cheatsheet: read online or clone it
The project is designed to be read in a browser through its homepage, https://mbeaudru.github.io/modern-js-cheatsheet/. If you prefer a local copy, the README gives this command to clone the repository:
git clone https://github.com/mbeaudru/modern-js-cheatsheetHow to read a notion entry
Start with the Short explanation to get the core idea, then look at the Sample code. Use the Detailed explanation when you need more depth. The README also says the author sometimes adds personal tips, and marks them as personal recommendations, so you can tell them apart from general facts.
The table of contents lists each notion, so you can jump straight to the one you are stuck on. The Glossary at the end defines terms such as scope and variable mutation.
- Read the short explanation first
- Study the sample code and compare it with the code you are reading
- Follow the external resource links when you need more depth
Use it to understand real code
When you meet unfamiliar syntax in a React file, look up the keyword or pattern in the table of contents, read its sample, then return to your code. For example, if you see const with an arrow function and a destructured parameter, the cheatsheet's sections on const, arrow functions and destructuring explain each part.
Know what it does not do
The README states that the guide does not teach JavaScript from the ground up. It covers selected concepts and links to MDN for fuller explanations. If you need a complete specification or an exhaustive language reference, use MDN or the language standard instead.
What people use it for
- Reading React components that use arrow functions, destructuring and spread syntax
- Refreshing how let, const and var differ in scope
- Understanding promise chains and async/await in sample code
- Looking up ES6-era syntax quickly while studying
Frequently asked questions
Is modern-js-cheatsheet free?
Yes. The project is released under the MIT licence, and the README lists no price. You can read it online or clone the repository.
How do I install modern-js-cheatsheet?
The project is a read-online resource, so there is no install step listed. To get a local copy, run git clone https://github.com/mbeaudru/modern-js-cheatsheet.
What are the prerequisites for modern-js-cheatsheet?
The README lists no prerequisites. It assumes you already know basic JavaScript, since it does not teach the language from the ground up.
Is modern-js-cheatsheet good for complete beginners?
No. The README says it is not intended to teach JavaScript from the beginning. Learn the basics first, then use the cheatsheet to read modern code.
What are good alternatives to modern-js-cheatsheet?
Comparable projects mentioned for this item include You Don't Know JS, Eloquent JavaScript and javascript-questions. The README also links to MDN for fuller language references.
Does it cover the full JavaScript specification?
No. It covers selected concepts, mostly from ES2015, and links to MDN for more detail. Use the specification or MDN if you need an exhaustive reference.
New agent skills, repos and AI tools — every week
The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.
Our verdict
Use modern-js-cheatsheet if you know basic JavaScript and want short, example-driven explanations of ES6-era syntax, especially when reading React or other modern code. Skip it if you are a complete beginner or need a full language specification, and choose Eloquent JavaScript or MDN instead.
Install options & downloads