Best of JavaScript — October 2022

1. 1
   Article

   Community Picks·4y

   Developer Roadmaps

   Developer Roadmaps roadmap.sh is a community effort to create roadmaps, guides and other educational content to help guide the developers in picking up the path and guide their learnings. The project is OpenSource, 6th most starred project on GitHub and is visited by hundreds of thousands of developers every month. We are working on a solution for teams. Help us shape the platform. The project has a solution to build and build a new software that will be available.

   767

   44
2. 2
   Article

   Next.js·4y

   Blog - Next.js 13

   Next.js 13 includes Turbopack, the new Rust-based successor to Webpack. New next/image(stable): Faster with native browser lazy loading. New @next/font(beta): Automatic self-hosted fonts with zero layout shift.

   422

   24
3. 3
   Article

   Community Picks·4y

   8 must-know tips for writing clean code with Javascript

   Clean Javascript code can be a challenge, even for seasoned programmers. Here are the top tools and tricks you can use to take your code quality to the next level. Use a linter (ESLint/TSLint)

   403

   27
4. 4
   Article

   freeCodeCamp·4y

   Harvard CS50 – Free Computer Science University Course

   Harvard CS50 is one of the most popular beginner computer science courses in the world. The course teaches students how to think algorithmically and solve problems efficiently. Topics include abstraction, algorithms, data structures, encapsulation, resource management, security, software engineering, and web programming.

   379

   17
5. 5
   Article

   Community Picks·4y

   JavaScript from ES6 to ES12 in 2022

   JavaScript from ES6 to ES12 in 2022 is one of the three most crucial programming at front-end positions. There are some new scripts to support software engineers by ES6 ~ ES12 for now. ECMA specification is made up of parties, including browser vendors, who meet to push JavaScript proposals. The promise is a solution to asynchronous (non-synchronous) writing, which is more elegant than the original callback writing. In the early days, it was a suite of the open-source community.

   338

   11
6. 6
   Article

   DEV·4y

   Learn this before React

   The destructuring rest & spread operator promises map and filter methods. The find method returns the first element that satisfies the condition. FindIndex returns the index of that ["jack", "pritom" The spread operator enables us to spread the content of a iterable (i.e. array) into individual elements Spread. In simple terms promises are used to handle asynchronous operations.

   230

   17
7. 7
   Article

   DEV·4y

   Understanding Async & Await

   A Promise is a primitive data type that represents a future value. It's a JavaScript object with two pieces of information: the promise state, and a value or error. A promise is settled when the promise has either fulfilled or rejected. With 30+ real-world exercises you'll transform knowledge into a practical skill that will make you a better developer.

   189

   10
8. 8
   Article

   Community Picks·4y

   Make your React apps fast again

   Profiler can help you improve performance of a React application. We will go over ways to improve the performance of an app, including some pre-optimization techniques. We can use the Profiler in the React DevTools to measure performance of our apps. To use the profiler, you must Some are asynchronous, such as background HTTP calls, while others occur by user or You.

   170

   6
9. 9
   Article

   Community Picks·4y

   With 30+ Articles, You Will Not Be Confused When Learning TypeScript

   This series will introduce the core knowledge and techniques of TypeScript in the form of animations. With 30+ Articles, You Will Not Be Confused When Learning TypeScript Through Vivid Animations, You Can Easily Understand the Difficult Points and Core Knowledge of Type javascript.plainenglish.io Purpose of Declare Keyword in TypeScript A Detailed Introduction to the Role of Type Script Declare.

   159

   7
10. 10
    Article

    Medium·4y

    7 Shorthand Optimization Tricks every JavaScript Developer Should Know 😎

    JavaScript has a built-in method to help you with this. For-of and For-in loops are a great way to iterate over an array or object without having to manually keep track of the index of the keys of the object.

    139

    15
11. 11
    Article

    Community Picks·4y

    The Web’s Next Transition

    The web is made up of technologies that got their start over 25 years ago. AJAX was popularized as a term in 2005 and a lot of people started making HTTP requests in the browser.

    130

    7
12. 12
    Article

    Medium·4y

    JavaScript Deep Concepts You Should Know

    JavsScript is a single-threaded and synchronous programming language. When an asynchronous task is passed the JavaScript will pop out it to the web APIs and the browser will take care of it.

    127

    6
13. 13
    Article

    Product Hunt·4y

    Ultra - Fast JavaScript package manager

    Fast JavaScript package manager Ultra is a fast and efficient package manager for JavaScript. It uses a shared store to install packages faster and save space on common dependencies shared by your projects.

    119

    5
14. 14
    Article

    freeCodeCamp·4y

    find() vs filter() in JavaScript – Differences Explained with Examples

    find() vs filter() in JavaScript is a common interview question that JavaScript developers often get asked is to explain the difference between the find() and filter() methods. In this tutorial today, I'll walk you through what these methods are and when you should use them.

    114

    9
15. 15
    Article

    Community Picks·4y

    11 Features in Node.js 18 you need to try

    Node.js 18 was released on the 19th of April this year. The community is looking forward to this release with many new features and other benefits. You can now use Node Watch index on your file name to start watching your files without having to install anything.

    104

    4
16. 16
    Article

    SitePen·4y

    Intro to HTML-first Frontend Frameworks

    Qwik API allows Qwik to bootstrap with a very small amount of framework code. Qwik is used for builder.io which is a complex, interactive, stateful web application. Marko 6 is in the works and it will be interesting to see what they achieve.

    101

    7
17. 17
    Article

    asayer·4y

    JavaScript SEO best practices

    JavaScript is a popular programming language used by more than 80 percent of U.S. stores. Google’s webmaster is saying: The JavaScript frameworks were first implemented on the client side only while inviting much trouble in client-side rendering. The worst thing is that the wrong website or a wrong page could appear on the search results. This will eventually resolve on its own but could cause issues.

    95

    1
18. 18
    Article

    Auth0·4y

    Stranger Scripts

    JavaScript is out! The Weirdo on Maple Street Joey, Andrea, and Juan are wandering in the woods when they encounter JavaScript. They freeze as the programming language tries to communicate with them but can't figure out what it's trying to say. With the help of an interpreter, they managed to capture the strange language. This happens because the sum now acts as a concatenate and converts each side of the + sign into a string. This is done by design.

    87

    9
19. 19
    Article

    freeCodeCamp·4y

    Data Visualization Tools – 2022 Guide

    Tableau offers three plans you can choose from — Tableau Creator, Tableau Explorer, and Tableau Viewer. Tableau's Qlik Sense Business plan starts at $30 per user/month billed annually. Infogram Inforgram is a great tool for creating infographics, reports, dashboards, slides, social media posts, email headers, and more easily.

    86

    2
20. 20
    Article

    Community Picks·4y

    Javascript Proxy: Using Javascript Proxies like a Pro

    Javascript Proxies are objects in Javascript which allow you to make a proxy of an object. They also define custom behaviour for standard object operations like get, set and has. This turns proxies into quite a powerful tool, so lets look at how they work. Let’s look at some of these in a bit more detail to understand how proxies work.

    71

    4
21. 21
    Article

    freeCodeCamp·4y

    Code a project three different ways (JavaScript + REST API + Database)

    Code a project three different ways (JavaScript + REST API + Database) We just published a course on the freeCodeCamp.org YouTube channel that will teach you how to code a flight widget in JavaScript using multiple methods.

    63

    3
22. 22
    Article

    Community Picks·4y

    Why We're Breaking Up with CSS-in-JS

    CSS-in-JS allows you to style your React components by writing CSS directly in your JavaScript or TypeScript code. It's easy to accidentally apply styles more widely than you intended. The ability to use JavaScript constants in styles reduces duplication in some cases, since the same constant does not have to be defined as both a CSS variable and a JavaScript constant. Inline styles are not ideal for performance.

    61

    4
23. 23
    Article

    freeCodeCamp·4y

    How to Build a Modal with JavaScript

    A pop-up window is called a modal, a web page element that pops up and displays in front of other page content. You can also use modals for other things like creating call-to-action elements, navigation menus, newsletter widgets, and more. In this tutorial, I'll walk you through { display: flex; align-items: center; justify-content: space-between; }.

    55

    2
24. 24
    Article

    freeCodeCamp·4y

    How to Use map(), filter(), and reduce() in JavaScript

    Map, filter, and reduce are three of the most useful and powerful high-order array methods. In this tutorial, you'll see how each of these high- order array methods work. You'll also learn where you'll want to use them, with the help of analogies and examples. The reduce() method reduces an array to a single value by performing the desired operation on the elements collectively.

    55

    1
25. 25
    Article

    Community Picks·4y

    ES6 Handbook

    In ES5, you declare variables via var. Such variables are function-scoped, their scopes are the innermost enclosing functions. Block-scoping helps with keeping the effects of code fragments more local.

    51

    6