Back to the basics

Rate this content
Bookmark

“You’ll never believe where objects come from in JavaScript.”


“These 10 languages are worse than JavaScript in asynchronous programming.”


Let’s explore some aspects of JavaScript that you might take for granted in the clickbaitest nodecongress.com workshop.


To attend this workshop you only need to be able to write and run NodeJS code on your computer. Both junior and senior developers are welcome.


Objects are from Mars, functions are from Venus


Let’s deep-dive into the ins and outs of objects and then zoom out to see modules from a different perspective. How many ways are there to create objects? Are they all that useful? When should you consider using them?


If you’re now thinking “who cares?“, then this workshop is probably for you.


Asynchronous JavaScript: the good? parts


Let’s have an honest conversation.


I mean… why, oh why, do we need to bear with all this BS? My guess is that it depends on perspective too. Let’s first assume a hard truth about it: it could be worse… then maybe we can start seeing the not-so-bad-even-great features of JavaScript regarding non-blocking programs.

This workshop has been presented at Node Congress 2022, check out the latest edition of this Tech Conference.

FAQ

Yes, there will be a recording of this session, and the organization will make it accessible.

The workshop focuses on basic principles and patterns, specifically objects and asynchronous behavior in Node.js.

The host of the workshop is Guillermo, a staff software engineer at DnSimple.

Guillermo primarily works with Ruby and JavaScript, and has also worked with Java in the past.

Yes, DnSimple is looking for people to join their small team. You can check out their jobs page for more information.

You can create objects using object literals, classes, and the module pattern. Object.create and Object.assign are also advanced methods.

JavaScript handles asynchronous behavior through callback functions and the Promise API, which includes methods like .then, .catch, .all, and .race.

The prototype chain in JavaScript is a series of linked objects that allows properties and methods to be inherited from other objects. It starts from the object's __proto__ property and ends with a null value.

The Promise API in JavaScript helps manage asynchronous operations by allowing you to chain callbacks, handle errors, and coordinate multiple operations with methods like .then, .catch, .all, and .race.

The module pattern in JavaScript uses functions to create a local scope for variables and functions, allowing for encapsulation and private variables. This pattern is useful for creating single instances or services.

Guillermo Gutierrez Almazor
Guillermo Gutierrez Almazor
128 min
15 Feb, 2022

Comments

Sign in or register to post your comment.

Video Summary and Transcription

This workshop covers basic principles and patterns in software development and engineering. It explores topics such as objects, functions, prototype chains, classes, modules, and asynchronous programming in JavaScript. The workshop emphasizes the importance of understanding context, encapsulation, and the use of promises for managing asynchronous behavior. It also discusses the differences between synchronous and asynchronous code execution and provides insights into the design patterns and best practices for writing efficient and maintainable code.
Available in Español: Vuelta a los fundamentos

1. Introduction to Workshop

Short description:

Thanks for joining this workshop on basic principles and patterns. I believe they are the best investment in your formation. Today, we'll focus on two topics: objects and asynchronous behavior of Node.js.

So I think we can start now, again, my name is Guillermo I'm your host today. Thanks for joining this workshop and a special thanks for coming because I know this is not the flashiest topic out there. Like basic principles and patterns is not a fancy framework that everybody is using or things like that.

So, yeah, good for you, too, I guess. Yeah, there's going to be a recording of this session and I think that the organization will put it on where you can access it. Yeah. There you go. Cool.

So, again, my name is Guillermo. I'm a software developer probably like most of you. I work at the company called DnSimple as a staff software engineer. I normally work on Ruby. But I also work a lot on JavaScript and in the past I've also worked on Java code bases, too. At DnSimple, we are a small team. And, by the way, we are looking for people to join us. So, be sure to check out our jobs page. If you're on the market for a job, we'll be happy to hear about you.

So, this workshop the basics, right? And I really meant it when I put that title. Because when I give talks and trainings like this one, I always try to bring it down to basic principles and patterns. Because that's what I honestly believe it's the best investment anyone can make in their formation. Because you know, frameworks and libraries tend to change so much, they're really volatile, whereas basic principles and patterns are things that have been around for a long, long time, and have been proven to be valuable and useful through time. So there you go. That's basically how I try to think about it. And also, in a two hours remote workshop like this one, there's not so not a lot of room to to talk about a lot of things and go into a lot of detail. So that's why I wanted to focus just on two topics, one objects and two asynchronous behavior of Node.js because I think those are topics that most of the people I know struggle with and these are also things that we take for granted without really having too much time to think about them and reason about them and get really into knowing how they work.

2. Understanding Objects and Values in JavaScript

Short description:

No practical notes will be given. We will focus on code for the next two hours. Objects are collections of key-value pairs in JavaScript. Values can be anything you put to the right of an equals sign. Let's look at an example with the variable foo and the property A. We can access the A property using dot notation or square bracket notation. Both will return the value 44.

So let's cut to the chase. Someone asking if practical notes are going to be given? No, I'm sorry, I haven't prepared any practical notes for you. It's just about dealing with the code that we are going to see for the next two hours and of course the repo will be there, it's public and you can do what you want with it afterwards. So, again, these are nuanced topics that require a lot of time to get into details etcetera.

And what I'm going to say then during the next couple of hours, you need to understand that these are only mental models, heuristics, ways to think about things, not canonical descriptions of how things are in the language, okay? So, let's start with the objects. So, the first topic was objects are from Mars, functions are from Venus. This was kind of a silly joke. But, really, what is an object, and why should I care? That's just the question I will try to answer. And the thing is that the way I think about objects is as if they were values that have this shape of a collection of key value pairs. So, in JavaScript, keys of those objects are called properties. And values, a value, right? So, oh. Okay. I'm going to enable this. I don't know if it's going to work. So, live transcription. There you go. It works. Okay. Let's continue.

So, what is a value, right? Whatever you can put to the right of an equals sign, that's a value in JavaScript. And you will find that almost anything is a value. You can actually put anything you want to the right of an equals sign. I was really trying really hard to think of something that was not a value, but I didn't find anything. So, let's jump to the first I have for you, we have a couple of folders. One is objects and the other one is called a sink. So, let's take the part1.js file. And you will find three lines here. And this is showcasing how an object can be thought of as a collection of key value pairs. Right? In the first line here we are creating a variable called foo. And to the right of the equal sign, I mean this part of the equal sign, we have curly brace and then an A which is the properties name. Then a colon and then 44 which is the value that I'm assigning to call A. This is an object, right there. And yeah. It has only one property with just the value. And I know that we are kind of talking about very simple things, but this we will grow on top of everything we introduce. Right? So we need to establish like the basics, right. This is what we're doing right now. And the way that we can reference the A property on foo is by using the dot notation or the square bracket notation. And you have an example of that in the following lines. The first line here, console.log, foo.A, this is a dot notation. And the next line is using the square brackets notation, where you have foo, square bracket. Oops, sorry, moving that. Square bracket. And then the property name as a string. And that will get you 44 in both cases. So, the way that code sandbox works is you've got to the bottom right, you have a section with terminal tab, console tab, and problems tab. And you have a very small plus sign on the right edge that you can click. And that should get you a new terminal. And I'm going to enable that for all of you that are following me here. So, if you create a terminal, this is basically a prompt, where you can run things.

QnA

Watch more workshops on topic

Master JavaScript Patterns
JSNation 2024JSNation 2024
145 min
Master JavaScript Patterns
Featured Workshop
Adrian Hajdin
Adrian Hajdin
During this workshop, participants will review the essential JavaScript patterns that every developer should know. Through hands-on exercises, real-world examples, and interactive discussions, attendees will deepen their understanding of best practices for organizing code, solving common challenges, and designing scalable architectures. By the end of the workshop, participants will gain newfound confidence in their ability to write high-quality JavaScript code that stands the test of time.
Points Covered:
1. Introduction to JavaScript Patterns2. Foundational Patterns3. Object Creation Patterns4. Behavioral Patterns5. Architectural Patterns6. Hands-On Exercises and Case Studies
How It Will Help Developers:
- Gain a deep understanding of JavaScript patterns and their applications in real-world scenarios- Learn best practices for organizing code, solving common challenges, and designing scalable architectures- Enhance problem-solving skills and code readability- Improve collaboration and communication within development teams- Accelerate career growth and opportunities for advancement in the software industry
Integrating LangChain with JavaScript for Web Developers
React Summit 2024React Summit 2024
92 min
Integrating LangChain with JavaScript for Web Developers
Featured Workshop
Vivek Nayyar
Vivek Nayyar
Dive into the world of AI with our interactive workshop designed specifically for web developers. "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" offers a unique opportunity to bridge the gap between AI and web development. Despite the prominence of Python in AI development, the vast potential of JavaScript remains largely untapped. This workshop aims to change that.Throughout this hands-on session, participants will learn how to leverage LangChain—a tool designed to make large language models more accessible and useful—to build dynamic AI agents directly within JavaScript environments. This approach opens up new possibilities for enhancing web applications with intelligent features, from automated customer support to content generation and beyond.We'll start with the basics of LangChain and AI models, ensuring a solid foundation even for those new to AI. From there, we'll dive into practical exercises that demonstrate how to integrate these technologies into real-world JavaScript projects. Participants will work through examples, facing and overcoming the challenges of making AI work seamlessly on the web.This workshop is more than just a learning experience; it's a chance to be at the forefront of an emerging field. By the end, attendees will not only have gained valuable skills but also created AI-enhanced features they can take back to their projects or workplaces.Whether you're a seasoned web developer curious about AI or looking to expand your skillset into new and exciting areas, "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" is your gateway to the future of web development. Join us to unlock the potential of AI in your web projects, making them smarter, more interactive, and more engaging for users.
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
React Day Berlin 2022React Day Berlin 2022
86 min
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
Top Content
WorkshopFree
Hussien Khayoon
Kahvi Patel
2 authors
Using a library might seem easy at first glance, but how do you choose the right library? How do you upgrade an existing one? And how do you wade through the documentation to find what you want?
In this workshop, we’ll discuss all these finer points while going through a general example of building a code editor using CodeMirror in React. All while sharing some of the nuances our team learned about using this library and some problems we encountered.
Node.js Masterclass
Node Congress 2023Node Congress 2023
109 min
Node.js Masterclass
Top Content
Workshop
Matteo Collina
Matteo Collina
Have you ever struggled with designing and structuring your Node.js applications? Building applications that are well organised, testable and extendable is not always easy. It can often turn out to be a lot more complicated than you expect it to be. In this live event Matteo will show you how he builds Node.js applications from scratch. You’ll learn how he approaches application design, and the philosophies that he applies to create modular, maintainable and effective applications.

Level: intermediate
Testing Web Applications Using Cypress
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Testing Web Applications Using Cypress
WorkshopFree
Gleb Bahmutov
Gleb Bahmutov
This workshop will teach you the basics of writing useful end-to-end tests using Cypress Test Runner.
We will cover writing tests, covering every application feature, structuring tests, intercepting network requests, and setting up the backend data.
Anyone who knows JavaScript programming language and has NPM installed would be able to follow along.
Build and Deploy a Backend With Fastify & Platformatic
JSNation 2023JSNation 2023
104 min
Build and Deploy a Backend With Fastify & Platformatic
WorkshopFree
Matteo Collina
Matteo Collina
Platformatic allows you to rapidly develop GraphQL and REST APIs with minimal effort. The best part is that it also allows you to unleash the full potential of Node.js and Fastify whenever you need to. You can fully customise a Platformatic application by writing your own additional features and plugins. In the workshop, we’ll cover both our Open Source modules and our Cloud offering:- Platformatic OSS (open-source software) — Tools and libraries for rapidly building robust applications with Node.js (https://oss.platformatic.dev/).- Platformatic Cloud (currently in beta) — Our hosting platform that includes features such as preview apps, built-in metrics and integration with your Git flow (https://platformatic.dev/). 
In this workshop you'll learn how to develop APIs with Fastify and deploy them to the Platformatic Cloud.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Scaling Up with Remix and Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Top Content
This talk discusses the usage of Microfrontends in Remix and introduces the Tiny Frontend library. Kazoo, a used car buying platform, follows a domain-driven design approach and encountered issues with granular slicing. Tiny Frontend aims to solve the slicing problem and promotes type safety and compatibility of shared dependencies. The speaker demonstrates how Tiny Frontend works with server-side rendering and how Remix can consume and update components without redeploying the app. The talk also explores the usage of micro frontends and the future support for Webpack Module Federation in Remix.
Full Stack Components
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Top Content
RemixConf EU discussed full stack components and their benefits, such as marrying the backend and UI in the same file. The talk demonstrated the implementation of a combo box with search functionality using Remix and the Downshift library. It also highlighted the ease of creating resource routes in Remix and the importance of code organization and maintainability in full stack components. The speaker expressed gratitude towards the audience and discussed the future of Remix, including its acquisition by Shopify and the potential for collaboration with Hydrogen.
Debugging JS
React Summit 2023React Summit 2023
24 min
Debugging JS
Top Content
Watch video: Debugging JS
Debugging JavaScript is a crucial skill that is often overlooked in the industry. It is important to understand the problem, reproduce the issue, and identify the root cause. Having a variety of debugging tools and techniques, such as console methods and graphical debuggers, is beneficial. Replay is a time-traveling debugger for JavaScript that allows users to record and inspect bugs. It works with Redux, plain React, and even minified code with the help of source maps.
Making JavaScript on WebAssembly Fast
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
Top Content
WebAssembly enables optimizing JavaScript performance for different environments by deploying the JavaScript engine as a portable WebAssembly module. By making JavaScript on WebAssembly fast, instances can be created for each request, reducing latency and security risks. Initialization and runtime phases can be improved with tools like Wiser and snapshotting, resulting in faster startup times. Optimizing JavaScript performance in WebAssembly can be achieved through techniques like ahead-of-time compilation and inline caching. WebAssembly usage is growing outside the web, offering benefits like isolation and portability. Build sizes and snapshotting in WebAssembly depend on the application, and more information can be found on the Mozilla Hacks website and Bike Reliance site.
It's a Jungle Out There: What's Really Going on Inside Your Node_Modules Folder
Node Congress 2022Node Congress 2022
26 min
It's a Jungle Out There: What's Really Going on Inside Your Node_Modules Folder
Top Content
The talk discusses the importance of supply chain security in the open source ecosystem, highlighting the risks of relying on open source code without proper code review. It explores the trend of supply chain attacks and the need for a new approach to detect and block malicious dependencies. The talk also introduces Socket, a tool that assesses the security of packages and provides automation and analysis to protect against malware and supply chain attacks. It emphasizes the need to prioritize security in software development and offers insights into potential solutions such as realms and Deno's command line flags.
Webpack in 5 Years?
JSNation 2022JSNation 2022
26 min
Webpack in 5 Years?
Top Content
In the last 10 years, Webpack has shaped the way we develop web applications by introducing code splitting, co-locating style sheets and assets with JavaScript modules, and enabling bundling for server-side processing. Webpack's flexibility and large plugin system have also contributed to innovation in the ecosystem. The initial configuration for Webpack can be overwhelming, but it is necessary due to the complexity of modern web applications. In larger scale applications, there are performance problems in Webpack due to issues with garbage collection, leveraging multiple CPUs, and architectural limitations. Fixing problems in Webpack has trade-offs, but a rewrite could optimize architecture and fix performance issues.