Engineering Notes on Medium.
In-depth, practical guides exploring React architecture, Angular decorators, RxJS reactive stream pipelines, and modern JavaScript internals.
Lesson 02: Understanding Javscript syntax
Now that you’re all set up and ready, it’s time to take the next exciting step:- ✨ Understanding JavaScript’s syntax — the rules of the game!
JavaScript
4 articles
Lesson 01: Setting Up your Javascript
JavaScript is a high-level, dynamic scripting language used to build interactive web applications.
Lesson 02: Understanding Javscript syntax
Now that you’re all set up and ready, it’s time to take the next exciting step:- ✨ Understanding JavaScript’s syntax — the rules of the game!
Lesson 03: Comments in JavaScript
Comments are nothing but the code/text that gets ignored. “Oh that’s concerning right, why do we need ignored code while writing”,So it’s just for help developers make their code more readable, maintaining, remembering what the block of code is about.
Lesson 04: Variables in JavaScript — var, let, and const
Variables are the heart of any program — they let you store, update, and use data as your app runs. With the arrival of ES6 (ECMAScript 2015), JavaScript gave us three ways to declare variables: var, let, and const.
React
4 articles
React 01: JSX and Printing Value in JSX
JSX, or JavaScript XML, is a syntax extension for JavaScript. It allows you to write HTML directly within JavaScript, which makes it easier to create and render React components. With JSX, you can structure component render outputs using syntax that looks similar to HTML, making the code more readable and expressive. Under the hood, JSX gets compiled to React.createElement() calls, which produce React “elements” — JavaScript objects that describe a component’s structure.
React 02: React Components and Props 🚀
A React component is a reusable piece of UI that can be composed to build more complex interfaces. There are two types of components in React: functional components and class components. In this blog, we’ll focus on functional components, which are simpler and more commonly used in modern React development. 💻
React 03: Passing Data from Child to Parent Component in React 🚀
Props in React are typically used to pass data from parent components to child components. However, there are scenarios where you need to pass data from a child component back to its parent. This is achieved through callback functions passed as props. Let’s break down how this works with an example! 📚
React 04: Understanding the children Prop in React 🌟
In React, the children prop is a special prop that allows you to pass components or elements as children to other components. This feature is particularly useful for creating reusable and flexible UI components. In this blog, we'll explore how the children prop works and provide a practical example to illustrate its use. Let's dive in! 🚀
Angular
4 articles
Angular Component 01: Creating Components
🔹 What’s a Component? Think of a component as a self-contained module that defines a certain part of your webpage. It’s like a Lego brick — you put them together to create something bigger and functional.
Angular Components 02: Input decorator databinding
In Angular🚀, components often need to communicate with each other, and one powerful way to achieve this is through the @Input decorator. 📨📦 This decorator allows you to pass data from a parent component to a child component, enabling seamless interaction and dynamic content updates.
Angular Components 03 : Components Output decorator
Notice inside EventEmitter the type should be in string not String. So we are emiting this value using event emitter. Taking value from html file.
Angular Components 04: components @viewchild reference
Notice inside EventEmitter the type should be in string not String. So we are emiting this value using event emitter. Taking value from html file.
RxJS Streams
4 articles
RXJS Operator 01: Of Operator
As our definition says, “Of” operator takes the argument as it can take string, number, array, HTML document, Object as an argument. And then it converts into a stream of data.
RXJS Operator 02: Ajax Operator
The ajax operator, available in the RxJS library, makes it easy to create an observable for an Ajax request by taking in a request object with the necessary URL, headers, and other options. This makes it simple to manage asynchronous data streams and handle responses from the server in a clean and organized way.
RXJS Operator 03: From Operator
The from operator is a way to create an observable sequence from an array, an iterable, a promise, an array-like object, or an event. It can be used to convert various types of data into an observable stream that can be subscribed to and processed using RxJS operators. Basically, we give a input in an array format.
RXJS Operator 04: fromEvent Operator
fromEvent is one of the creation operators. fromEvent operator is used to creating an observable from an event-emitting DOM element, an event type, and a selector function to extract the arguments from the event object that the observable will emit.
Curated Series on Medium
Explore complete learning tracks organized chapter-by-chapter.
Have a Technical Question or Want to Collaborate?
Whether you are building an engineering team, need legacy migration, or want consulting on frontend architecture, let's build together.