Best of JavaScript — November 2021

1. 1
   Article

   JavaScript in Plain English·5y

   4 JavaScript Concepts That Every Developer Should Know

   In this post, I will discuss four of the most important JavaScript concepts. IIFE IIFE, aka, Immediately Invoked Function Expression, are JavaScript functions defined as expressions that are immediately invoked and executed as soon as they are defined. Scope Scope determines which variables you have (or do not have) access to in different contexts. Closures are helpful to employ when you would like to pass variables, arrays, or methods from an outer function to an inner function.

   315

   14
2. 2
   Article

   DEV·4y

   Advanced Javascript Design Patterns

   Design Patterns are the solutions to commonly occurring problems in software design. These patterns are easily re-usable and are expressive. We will be discussing all these design patterns using Javascript es6 classes. I have covered here 20+ design patterns explanations in javascript. If you wish to learnAdvanced react component patterns, please find it here.

   237

   5
3. 3
   Article

   Bits and Pieces·4y

   Writing Clean Code in JavaScript

   Using object destructuring makes the code much simpler and easier to understand. Use multiple input parameters instead of single object inputs. Arrow functions provide a concise way of writing JavaScript functions. Use Template Literals for String Concatenations. Avoid the most popular way to express and handle nested functions in JavaScript 7.

   154

   7
4. 4
   Article

   DevDojo·5y

   Free 100+ MERN / MEAN Stack resources

   I have gathered all the resources that you will require to become a MERN or MEAN stack developer. All these resources will include Articles, Videos, Course, Websites, Tutorials, Books etc. And everything is FREE. You should know the basics of HTML, CSS AND JS.

   142

   5
5. 5
   Article

   DEV·4y

   Array cheatsheet Javascript

   An array is a variable which can contain several independent data, indexed by a number, called index. The index of an array is thus the element allowing to access the data stored in it. Variables in Javascript allow only one data to be stored at a time. Javascript proposes a data structure allowing to store all these data in a "common variable": the array.

   96

   4
6. 6
   Article

   Hashnode·4y

   How to make blob menu using HTML, CSS and JavaScript

   I wanted to make something simple with a little transition animation to make it look cool, so I created this blob menu. I got a lot of positive feedback when I shared it so here is the step-by-step process on how to create it. First, we got the <link> tag which is used to import font awesome icons. We got our menu items Menu icon from font-awesome icons. A "links" div that wraps all the items in the menu in one element to be shown or hidden. JavaScript code to show and hide the menu items and the blob.

   88

   10
7. 7
   Article

   Medium·5y

   Introduction to WebAssembly (WASM)

   As of today, 94% of installed browsers support WebAssembly. It enables near-native execution speed in a web browser, making it possible to port desktop applications (like AutoCAD) and video games (e.g. Doom 3) It has the potential to change websites from what we know them today to something much more.

   88

   1
8. 8
   Article

   Web Tools Weekly·5y

   VS Code Tips, Frameworks, JS Utils, React Native

   This week we look at why VS Code is so popular with developers and programmers. We also share some productivity tips and hacks to help you get the most out of the tool. And we ask you to share your favourite VS Code tips in the discussion below. Now on to this week's tools!

   79

   4
9. 9
   Article

   DEV·4y

   Tap bar with liquid animation using CSS and JavaScript

   In this article, we will create a tap bar that you can use in your mobile projects. In the HTML code, the "bar" class is the container of our tap bar and "bar-item" class are the buttons that trigger the animations. Let's first look at what are we building:

   75

   3
10. 10
    Article

    DevDojo·4y

    How to Build a Web Scraper With Node.JS

    This tutorial will demonstrate how to automate scraping data off of the website and using it for whatever purpose. The project will be built with Node.js and Express. The source code of the completed project can be found on CodeSandbox. Fork, tweak the scripts and run the code.

    74

    6
11. 11
    Article

    Honeypot·5y

    Flutter vs React Native: The Battle of the Cross-platform Arena

    Flutter is a cross-platform software development kit (SDK) used to build natively compiled applications. React Native was introduced back in 2015 by facebook to develop native Android and iOS applications. Flutter ships with native components by default and compiles to X86 and ARM out of the box.

    67

    7
12. 12
    Article

    Quastor Daily·4y

    How Facebook Encodes Videos

    Quastor Daily is published every Thursday. This week we look at how Facebook encodes videos. We also look at the benefits and downsides of Rust for JavaScript tooling. Plus, a couple awesome tech snippets on Unity for Software Engineers and a new question from Facebook.

    66

    4
13. 13
    Article

    DEV·4y

    javascript - Everything you always wanted to know about localStorage (but you were afraid to ask)

    LocalStorage is a read-only property of the window interface that allows us to access the Storage for the Document’ origin (aka the browser). It let us save key-value pairs on the user browser. This was introduced on HTML 5 and everything it’s stored as a String, but I will show you how to save JSON objects.

    57

    3
14. 14
    Article

    gitconnected·4y

    Top 5 JavaScript ES12 Features You Should Start Using Now

    Learn the amazing features offered by the ECMAScript 2021 update. Beginners and experienced developers can benefit from this article. Top 5 JavaScript ES12 Features You Should Start Using Now. The new features include Numeric Separators, Private Class Methods and Accessors, and AggregateError.

    50
15. 15
    Article

    DevDojo·4y

    Top 6 Javascript Chart Libraries

    JavaScript is a programming language used to develop dynamic and interactive websites. There are over 1.8 Billion websites in the world, and JavaScript is used on 95% of them. I have compiled the best and useful Chart Libraries that you need as a Javascript developer. The JavaScript Chart Libraries helps you easily visualize data using JavaScript.

    47

    4
16. 16
    Article

    The Software House·5y

    Code with pleasure. Typescript improves Developer Experience

    Developer experience is a concept of making the day-to-day of software developers better and easier. TypeSccript is a programming language that is a superset of JavaScript. TypeScript lets you balance between not-as-predictable dynamic code and static typed code.

    36

    5
17. 17
    Article

    DZone·5y

    Is Next.js Here to Stay?

    Next.js allows developers to create super fast and ultra user-friendly websites. The Javascript framework is employed by many big digital companies such as Twitch and Netflix. Next.js is considerably more pricey than other frameworks and it doesn’t offer free management. There are also ongoing costs that you have to consider, such as hiring a web developer.

    29

    2
18. 18
    Article

    DevDojo·4y

    Free JavaScript mine of resources

    Free resources for learning JavaScript. Includes free books, courses, tutorials and playlists. Each of the sites listed below has an excess of JavaScript information to learn from and refer back to. Listed below are some fantastic beginners JavaScript playlists to watch and code along to. If you wanna add something comment below.

    28

    1
19. 19
    Article

    Product Hunt·4y

    Throw-Me - A hassle free URL shortener

    27

    4
20. 20
    Article

    SNIPCART·4y

    WebAssembly vs. JavaScript: The Complete Guide

    WebAssembly (WASM) was designed with a single aim: to execute efficient modern browser-based apps at high-performance levels. It is a low-level, bytecode, assembly-like language designed to run natively on the web. We take a long hard look at WebAssembly, how it works, what makes it different from JavaScript, and the last burning question: is it better than JavaScript?

    27

    1
21. 21
    Article

    gitconnected·4y

    Code a cookie-based darkmode switch in CSS and vanilla JavaScript

    Code a cookie-based darkmode switch in CSS and vanilla JavaScript. The darkmode button is located inside the <header> element on line 13. In the stylesheet, I define the body in its light and dark state. Also I set the design for dark mode button in lightmode und darkmode (classname active) status.

    27
22. 22
    Article

    freeCodeCamp·4y

    JSON for Beginners – JavaScript Object Notation Explained in Plain English

    JSON (JavaScript Object Notation) is a text-based data exchange format. It is a collection of key-value pairs where the key must be a string type. The key and value must be separated by a colon (:) symbol. No comments (// or /* */) are allowed in JSON data.

    26
23. 23
    Article

    DEV·4y

    Web-push Notification using React and Node js

    The React app uses a service worker to serve content to users. This lets the app load faster on subsequent visits in production, and gives it offline capabilities. It also means that developers (and users) will only see deployed updates onsequent visits to a page, after all the existing tabs open on the page have been closed.

    25
24. 24
    Article

    DEV·4y

    Responsive Side Navigation Bar in HTML CSS and JavaScript

    In this article you will learn how to create Responsive Sidebar Menu using HTML CSS JavaScript. Below I have shared a video tutorial for you which will help you to know how to make this Responsives Side Navigation Bar step by step. I created this project with the help of HTML CSS and JavaScript. First I created a top menu bar with a logo and a menu button. I then created a site bar that contains a lot of icons and menu items.

    22
25. 25
    Article

    SitePoint·4y

    How to Fetch Data in Svelte

    This tutorial explores how you can consume and render data from an API in your Svelte application. We’ll build a sample application that interacts and displays data provided by a REST API server. This application will allow users to fetch lists of blog posts and display them on the page.

    19

    1