FAM

So, I summarized them for you as tips for your next presentation

Image for post
Image for post

You can have the best product in the world that doesn’t mean you will be out of stock your first day selling that product. Because first, I don’t know the product. Second, I don’t know the seller. That’s why marketing is super important.

The way we are presenting things will for sure impact the customer. I wanted to learn more about the art of presenting ideas, products, services … whatever to an audience. So, I started my 2021 by reading an awesome book by the writer Carmine Gallo. Called: Presentation Secrets Of Steve Jobs.

This book is fascinating. I decided to extract tips from it so that everyone can improve here or his presentation way. …


All that you need to prepare for a perfect interview

Image for post
Image for post

In this article, I cover Angular interview questions. Because Angular is a framework, it has a lot of concepts and architectural patterns to learn about. As an Angular front lead, I grouped out these questions for you based on my experience.

You’ll notice that I grouped questions by general knowledge about Angular. Followed by technical questions. You’ll need, though, to be prepared for some coding too. So practice!

Ready, let’s go!

General knowledge about Angular

What is Angular?

Answer: Angular is an open-source, front-end web development framework based on TypeScript developed and supported by Google.

What is TypeScript?

Answer: Typescript is a language based on javascript. Angular is based on the TypeScript language and HTML. HTML is used for the template, and TypeScript (a superset of JavaScript) is used for components. …


What’s interpolation? What’s property Binding? And, what’s two-way data binding?

Image for post
Image for post

Did you hear about data binding and wonder what it is and how it works? This question is usually asked during the interview questions. Since angular follows the MVC architecture, which means Model-View-Controler. In the template (View), we need to access to data provided by the component. That’s where data binding comes to the scenes. Data binding is a concept that is a must-know in order to build any Angular application.

In this article, I’ll cover:

  • What’s data binding
  • What’s interpolation?
  • What’s property binding?
  • What’s two-way binding,

Ready? let’s swim in the Angular world (~˘▾˘)~

What’s data binding

Data binding is one of the core concepts of the frontend framework of Angular. It’s an important concept that allows us to communicate between the component and the DOM. Since in Angular, the template (HTML /View) is separated from the Component (Controller). We need a way to communicate data and information to the template and vice versa. …


Have you been curious about what happens behind the scenes of an Angular app?

Image for post
Image for post

Do you wonder how an Angular application starts? Do you wonder about what happens behind the scenes? Dear reader, this article is for you!

The story starts from a file. Oh yeah, every angular application starts thanks to the angular.json. It’s not the application's entry door, but an Angular app starts thanks to this configuration file.

What’s the entry point?

If you are using an old version of Angular such as Angular 4 or 5, you’ll notice that you don’t have this file. Instead, you have angular-cli.json. No worries, it the same file! It just got renamed in the recent versions of Angular.

The angular.json contains all the configurations of the app. The Angular builder will look at this file to find the entry door of the application. Good, we found the entry…


Which one to choose, NPM or Yarn?

Image for post
Image for post

Have you ever used a package manager? Do you wonder what’s a package manager, and what are the best options in the frontend world? Do you wonder how it works and how to choose the right package manager for you? Dear reader welcome, this article will end up giving you a clear picture in your mind.

❓What’s a package manager?

As its name says, a package manager is a package or a collection of tools that automate some processes to focus on more important things, such as the app logic and services.

A package manager or package management system is a collection of software tools that automates the process of installing, upgrading, configuring, and removing software packages for a computer’s operating system in a consistent manner. It typically maintains a database of software dependencies and version information to prevent software mismatches and missing prerequisites. …


A trip to the Forms’ world in the Angular Planet

Image for post
Image for post

Hi dear reader, welcome back to the front-end world!

Today I choose to talk about Form in Angular. I actually choose this topic based on my experience as a lead front-end developer. This topic is often confusing since there are two types of forms in Angular: The Template-Driven Forms and the Reactive Forms.

I wrote this article to my team and all developers worldwide to help you remove the confusion between those two types forever. Yes, you read right! I’ll share with you the keys and the procedure to be a pro in this topic (▀̿Ĺ̯▀̿ ̿)

Excited, Nah? I need you to give me your mind and focus. That all you’ll need. …


What you should know about this new technology

Image for post
Image for post

Have you heard about the 5G? Did you listen to governments debating about the impacts and benefits of it? I read and listen to a lot of articles and debates about the 5G. It’s potential is just astonishing, with companies and clients started getting more confidence in machine learning and AI. The 5G came to the scene to make some dreams possible and feasible, like self-driven cars.

If you are wondering what will be the impact of this technology on the web domain, this article is made with love for you.

Here is the plan I’m going through in this…


React’s Virtual DOM philosophy.

Image for post
Image for post

Through my journey to learn and understand the philosophy of ReactJS, I came across the virtual DOM, which I found so interesting. React apps are quick and fast.

Nowadays, modern website’s challenge is about the user experience and response time. No user would like to wait when navigating a web page, right?

React has created its own concept and algorithm to address this challenge. This concept is named the virtual DOM. This concept is one of the factors that made React JS famous and a preferred UI library within developers and companies.

In this article, I’m sharing what I learned so far about the virtual DOM concept. As usual, every feedback is welcomed with pleasure, so feel free to make this content grow up thanks to you. …


+Real use case provided with code and authorization token

Image for post
Image for post

I come across SSE through my client's business user story (need). Here is the use case where I used it. Imagine you need to add some data to the database. Let’s say you have a CSV file containing each line an article that you need to push to the database’s articles table. It would be better to see a real-time progress bar that shows how much the server has processed so far. Right?

So, in this article, I’m explaining:

  • What’s SSE?
  • Why I’m using SSE?
  • How did it work?

What’s SEE?

Server-Sent Events (SSE) is a server push technology enabling a client to receive automatic updates from a server via HTTP connection. The Server-Sent Events EventSource API is standardized as part of HTML5 by the W3C. …


What you need to know about Angular 11

Image for post
Image for post

This article aims to give you a quick and global insight into what’s new in Angular 11. Therefore, the trip will be short but rich in terms of the important information you need to know. We will discover what’s new in:

  • Components’ world
  • Modules’ and compilation’s world
  • CLI’s world
  • Deprecated features and breaking changes

Components’ world

  • Dispatching custom events, which can not be simulated like change and input: dispatchEvent method to test such events.
  • Usually, context menus are opened with right-click, with Angular 11, TestElement can now dispatch rightClick event.
  • manualChangeDetection API is added to disable auto change detection manually.
  • selectOptions API is available to select options inside a native select. …

About

FAM

Writer & Front-end Software Engineer, Mentor at MyJobGlasses, a teacher at SuperProf & mother of 4 cats. I love learning, sharing what I know and help people.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store