Forem: MohitSinghChauhan

Mastering MongoDB Collections

MohitSinghChauhan — Tue, 15 Aug 2023 20:13:52 +0000

MongoDB stores your data in collections - groups of documents that allow you to organize and query your data efficiently.

Getting to grips with collections is key to leveraging the full power of MongoDB. This in-depth guide will cover everything you need to know.

Why Collections?

Suppose you are building an application to track courses and students at a university. You may store your data in two collections - courses and students.

Some example documents in the courses collection:

{
  "name": "Data Structures",
  "dept": "Computer Science",
  "credits": 3  
}

{
  "name": "Database Systems",
  "dept": "Computer Science", 
  "prereqs": ["Data Structures"],
  "credits": 3
}

And in the students collection:

{
  "name": "Jane Doe",
  "studentId": "101", 
  "major": "Computer Science",
  "enrollments": ["Data Structures", "Database Systems"]   
}

Organizing the related data into logical collections makes querying and managing the data intuitive.

Creating Collections

To create a new collection, use the db.createCollection() method:

db.createCollection('students')

This will create an empty collection named 'students'.

Naming Collections

Collection names cannot start with system. - this is reserved.
Avoid using the $ character in names.

Other than these, there are no specific restrictions on collection names in MongoDB. But some good practices apply:

Use meaningful, domain-driven names like users, products etc.
Use camelCase or PascalCase and avoid underscores or hyphens.
Keep names short but descriptive.
Use plural nouns for names and singular forms for documents.

Listing Collections

Use show collections to view existing collections:

> show collections
courses
students

You can also query the system.namespaces collection to list user-defined collections.

Dropping Collections

To remove an entire collection including all its documents, use the drop() method:

db.logs.drop()

If the collection does not exist, MongoDB will throw an error.

Collection Methods

Some useful collection methods and operations:

db.collection.find() - Queries documents in the collection
db.collection.insertOne() - Inserts a single document
db.collection.insertMany() - Inserts multiple documents
db.collection.updateOne() - Updates one document
db.collection.updateMany() - Updates multiple documents
db.collection.deleteOne() - Deletes one document
db.collection.deleteMany() - Deletes multiple documents
db.collection.createIndex() - Creates an index on a field
db.collection.drop() - Drops/deletes the collection

And many more!

To Understand them in depth, Read my blog on it - Learn MongoDB in One Shot - Ultimate MongoDB Guide

Capped Collections

Capped collections have a fixed size - they stop growing after reaching the configured size. Older documents age out and are overwritten in FIFO order.

They provide high performance for use cases like logs:

db.createCollection('logs', {capped: true, size: 10000})

Capped collections automatically maintain insertion order and do not need indexes.

You can pass options to configure the capped collection on creation:

capped - Boolean to specify if the collection is capped. Capped collections have a fixed size.
size - Maximum size of a capped collection in bytes.
max - Maximum number of documents for a capped collection

db.createCollection('logs', {
  capped: true, 
  size: 10000,
  max: 100
})

This caps the collection to 10KB and 100 documents. Older documents age out automatically making it suitable for log data.

Note:

The size argument is always required, even when you specify the max number of documents. MongoDB removes older documents if a collection reaches the maximum size limit before it reaches the maximum document count.

Collection Validation

You can define a JSON schema to validate documents during insertion and updates:

Collection Schema validation is most useful for an established application where you have a good sense of how to organize your data. You can use schema validation in the following scenarios:

For a users collection, ensure that the password field is only stored as a string. This validation prevents users from saving their password as an unexpected data type, like an image.

For a sales collection, ensure that the item field belongs to a list of items that your store sells. This validation prevents a user from accidentally misspelling an item name when entering sales data.

For a students collection, ensure that the gpa field is always a positive number. This validation catches typos during data entry.

When MongoDB Checks Validation

When you create a new collection with schema validation, MongoDB checks validation during updates and inserts in that collection.

When you add validation to an existing, non-empty collection:

Newly inserted documents are checked for validation.

Documents already existing in your collection are not checked for validation until they are modified.

const studentSchema = {
  validator: {
    $jsonSchema: {
      bsonType: 'object',
      required: ['name', 'studentId'],
      properties: {
        name: {
          bsonType: 'string' 
        },
        studentId: {
          bsonType: 'string',
          minLength: 5
        },
        gpa: {
          bsonType: 'number',
          minimum: 0,
          maximum: 4 
        }
      }
    }
  }
}

db.createCollection('students', studentSchema)

xxxxxxxxxxxxxxxxxxxxxxxxx OR xxxxxxxxxxxxxxxxxxxxxxxxxxx

db.createCollection('users', {
  validator: {
    $jsonSchema: {
          bsonType: 'object',
          required: ['name', 'studentId'],
          properties: {
            name: {
              bsonType: 'string' 
            },
            studentId: {
              bsonType: 'string',
              minLength: 5
            },
            gpa: {
              bsonType: 'number',
              minimum: 0,
              maximum: 4 
            }
          }
        }
      } // Document validator
    })

This enforces that:

name and studentId are required string fields
studentId must be at least 5 characters
gpa must be a number between 0-4

Validation allows enforcing data consistency as applications and data volume scales.

Other options like validationAction allows configuring whether to error or warn on invalid documents.

db.createCollection('users', {
  validator: {...}, // Document validator
  validationLevel: 'strict', // Validation mode
  validationAction: 'warn' // Action on validation failure  
})

The validationAction determines what happens when a document fails validation:

error - Insert/update will fail and an error will be thrown. This is the default.
warn - The operation will succeed but a warning will be logged.

By default MongoDB rejects the operation and does not write the document to the collection. Check Out this to know more.

Setting validation rules ensures consistency as your application scales.

Auto-Indexing

By default, MongoDB automatically creates an index on the _id field when a collection is created.

For example:

db.students.getIndexes()
[
  {
    "v" : 2,
    "key" : { "_id" : 1 },  
    "name" : "_id_" 
  }
]

The _id index provides efficient lookup by primary key. But indexing has overhead, so it may be disabled for use cases like:

Bulk loading data where high write speed is needed
Prototyping where indexes aren't needed yet

You can disable auto-indexing on _id using:

db.createCollection('data', {autoIndexId: false})

Later, you can manually create indexes as needed for production use.

Ending Note :)

Collections are a core building block of MongoDB. Mastering collections allows you to organize, manage, and query your MongoDB data efficiently.

With this foundation, you now have a solid grasp of how to work with MongoDB collections.

To learn more, I advise you to read MongoDB Official documentation it provides a wealth of resources to continue advancing your MongoDB skills. And the active community enables learning from MongoDB experts around the world.

I also recommend checking out my other blog post (0xUpdate It also featured on Pfficial Mongodb Newsletter) - Learn MongoDB in One Shot - for a comprehensive beginner's guide to MongoDB fundamentals.

I hope you enjoyed this in-depth exploration of MongoDB collections. Let e know in the comments what topics you would like covered next!

From Zero to GraphQL Hero: The Ultimate Getting Started Guide

MohitSinghChauhan — Sun, 13 Aug 2023 03:49:52 +0000

Learning GraphQL can feel daunting at first. I remember when I started - my head was spinning with all the new concepts of schemas, resolvers, mutations and more! But stick with it, because GraphQL is so worth learning. Let me walk you through everything step-by-step.

What is GraphQL?

GraphQL is a query language that was developed internally by Facebook in 2012 before being publicly released in 2015. I like to think of GraphQL as a communication protocol between client and server. The client can request exactly the data it needs from the server, and the server specifies how clients can request data through a schema.

My friend Tanishq explained it to me like this:

With GraphQL, the client is in charge! It asks for the data it needs. Think of the GraphQL server like a waiter, and the client like a customer ordering food off a menu. The client can order exactly what they want from the menu, in a single request.

GraphQL be like:

This allows the client to avoid overfetching and underfetching data like what can happen with REST APIs. The data requirements are more predictable.

Why Use GraphQL?

There are a few key reasons GraphQL improves over traditional REST:

Flexible Queries

The core idea of GraphQL is that the client can query for the exact data it needs, avoiding both overfetching and underfetching.

For example, say you have a books endpoint that returns all book fields. If your app only needs the titles, it wastes bandwidth to fetch everything. With GraphQL, you could write a query to just get the titles.
Strong Typing

GraphQL schemas provide excellent documentation of what queries are possible with strong typing. My friend Sai who writes React apps (like me) loves this:

I never have to wonder what data I can fetch or what parameters to pass. The GraphQL schema tells me everything I need to know without guesswork.
Powerful Evolutability

Changing REST API endpoints often requires versioning to avoid breaking changes. With GraphQL, you can smoothly add new fields and types without needing major version updates. Existing queries keep working as-is.
Unified API

GraphQL serves as a unified interface between the client and varying backends like databases, microservices, REST APIs and more. This simplifies the client.
Developer Experience DX

The GraphQL ecosystem offers some amazing developer tools like GraphiQL for interactive exploration of schemas, improved error messaging, and auto-generated documentation.

Core GraphQL Concepts

To use GraphQL effectively, you'll need to understand its core concepts:

Type System

This defines the different object types available, with fields on each type. For example, a Book type might have title, author and pages fields.
Query Language

This lets the client request data by specifying fields. You can query for just the fields needed and join data across types.
Resolve Functions

These functions are provided by the developer to fetch real data for each field. They plug into databases, services, etc.
Schema

The schema defines all the types, fields, relationships and operations available. It's like the API contract between client and server.
Mutations

Along with queries, mutations allow modifying data by creating, updating or deleting records. The schema defines available mutations.

A Simple Query Example

Let's look at a very simple schema:

type Query {
  hello: String
}

This defines a root Query type with one field, hello, that returns a String.

Here is a query that a client could make against this schema:

{
  hello  
}

When executed, the server would respond:

{
  "data": {
    "hello": "Hello world!"
  }
}

Already from this simple example, you can see GraphQL's power:

The schema serves as documentation for what queries are allowed.
The client requests only the specific data fields they need.
The response data maps perfectly to the shape of the query. ## Fetching Objects and Fields

Let's look at a more advanced schema:

type Query {
  books: [Book] 
}

type Book {
  title: String
  author: String
}

This defines a Book type with some fields, and the root Query that returns a list of Book objects.

The client could query this like:

{
  books {
    title
    author
  }
}

The server would respond with:

{
  "data": {
    "books": [
      {
        "title": "The Great Gatsby",
        "author": "F. Scott Fitzgerald"
      },
      {  
        "title": "The Catcher in the Rye",
        "author": "J.D. Salinger"  
      }
    ]
  }
}

This allows the client to select only the specific Book fields needed.

Arguments and Variables

Adding arguments to a field allows passing parameters:

type Query {
  book(id: ID): Book
}

Now the book field takes an id argument to query a specific book.

We could call it like:

{
  book(id: "1") {
    title
  }
}

Variables let you extract out the dynamic arguments for reuse:

query GetBook($bookId: ID) {
  book(id: $bookId) {
    title
    author
  }
}

And pass in the variable value:

{
  "bookId": "1"
}

from https://www.howtographql.com/

Mutations

Along with queries, GraphQL includes mutations to modify your data:

type Mutation {
  addBook(title: String, author: String): Book
}

This provides an addBook mutation that takes a title and author and returns the new Book object.

A client could call it like:

mutation {
  addBook(title: "Moby Dick", author: "Herman Melville") {
    title
  }
}

GraphQL Clients

There are many client options for calling GraphQL APIs from different languages:

JavaScript: Apollo, Relay, urql
Java/Kotlin - Apollo Android
Swift - Apollo iOS
Ruby - graphql-client
Python - Graphene, Apollo-Python
Go - graphql-go
C# - GraphQL .NET

These clients handle query parsing, network handling, caching and other features required to call a GraphQL API.

GraphQL Servers

On the server, you need a GraphQL library to provide a runtime for executing queries against your schema. Some options include:

JavaScript: Apollo Server, GraphQL Yoga
Java: graphql-java
Ruby: graphql-ruby
Python: Graphene, Apollo-Python
Go: graphql-go
.NET: GraphQL .NET

The server parses incoming queries, validates them against the schema, executes by calling your resolve functions, and returns the response.

Learn with Great Resources

The best way to learn GraphQL is by writing some queries yourself! I recommend starting with the official GraphQL docs:

Official Getting Started

Some other excellent resources I used when learning:

How to GraphQL -> By Prisma
YouTube

The GraphQL community is also extremely friendly and helpful if you get stuck! Don't be afraid to reach out.

I hope this guide gave you a great introduction to GraphQL. There are a lot of new concepts, but just take it slow and try writing some examples. Over time, it will all come together. Have fun unleashing the power of GraphQL!

⚡⚡Happy Coding ⚡⚡

Is JavaScript Null actually a Object ?

MohitSinghChauhan — Tue, 08 Aug 2023 17:43:21 +0000

As a beginner learning JavaScript, you may have come across some odd behaviors that seem confusing at first. One of these is when you check the type of null using the typeof operator, it returns "object" instead of something like "null".

typeof null; // "object"

This doesn't seem to make sense at first. Null is supposed to represent the absence of a value, so why is it considered an object?

To understand why this happens, we need to learn a little history behind the JavaScript language.

A Brief History of JavaScript

JavaScript was created in 1995 by Brendan Eich in just 10 days! The language was initially called Mocha, then LiveScript, and finally JavaScript when it was released alongside Java in Netscape Navigator 2.0.

When creating JavaScript, Eich borrowed ideas from other languages like Self and Scheme. He also had to make sure it integrated well with Java in the browser.

This short timeframe meant that JavaScript had to be designed and implemented very quickly without too much planning ahead. As a result, some imperfections in the language crept in that still affect us today. The typeof null behavior is one such example!

How Values Are Stored in Memory

In the first version of JavaScript, there were only five primitive data types:

Undefined
Boolean
Number
String
Object

That was it! No other primitive types like null, symbol, or bigint existed.

So at that time, the typeof operator only needed to distinguish between these five types.

To actually understand why null returns "object", we need to learn how values are represented in memory in JavaScript.

In the original implementation of JS, values were stored in memory as a type tag and actual data.

The type tag was used to determine what type of data it was. Objects were assigned the type tag of 0.

Value in Memory:

Type Tag: 0
Data: {...}

For primitive values like strings, numbers, etc. the type tag would be different:

Type Tag: 1
Data: "Hello World"

When it came to null, which represents the absence of a value, it was decided that it would be stored in memory as a null pointer - which is represented as 0x00 in most languages.

So null ended up being stored in memory as:

Type Tag: 0 
Data: 0x00

Notice that 0 type tag? The same one used for objects!

And this is why when you checked the type of null, it would report "object" - due to it having the same type tag.

Why Not Change It?

So it's clear that this was a bit of an oversight in the initial implementation. Why not just change it so that null has its own type tag and typeof returns "null"?

The main reason is backwards compatibility. When typeof null was changed to "object", a lot of existing code was already relying on this behavior. Changing it would break that code.

Here are some examples:

// Relying on null being an object
function check(val) {
  if (typeof val === 'object') {
    // do something
  }
}

check(null); // would break with a change

Since JavaScript is so widely used, backwards compatibility is crucial. The odd typeof behavior stuck around to avoid potentially breaking the web!

I hope this gives you a better understanding of why JavaScript exhibits this odd behavior with null! The history of programming languages is full of little quirks like this, but they help show how languages are evolving tools.

Connect with me on twitter : MohitSChauhan

Happy Coding ❤️

Mastering JavaScript Array Methods

MohitSinghChauhan — Fri, 04 Aug 2023 16:21:51 +0000

For many developers, arrays are the one data structure to rule them all. Arrays provide an intuitive way to organize ordered information and access it efficiently. But to truly unlock the power of arrays, you need to master the wide range of methods JavaScript provides.

JavaScript array methods are like magical incantations for manipulating arrays. With just a few lines of code, you can iterate, sort, map, join, filter, and reduce effortlessly. Forget messy for loops and complicated logic - these methods abstract away the complexity.

In this guide, you'll learn array syntax like the back of your hand. We'll explore all the essential methods for wrangling array data. Code examples demonstrate key concepts so you can quickly apply them in your own projects.

Take your JavaScript skills to the next level and learn to think like a true master of arrays! With the spells, I mean methods - we'll cover here, arrays will become an invaluable part of your toolbelt. Let's summon some arrays and get started!

Basic Methods

Let's start with some of the basic methods for manipulating arrays:

push()

The push() method appends a new element to the end of an array.

let fruits = ['apple', 'banana'];

fruits.push('orange'); 

// fruits is now ['apple', 'banana', 'orange']

pop()

The pop() method removes the last element of an array.

let fruits = ['apple', 'banana', 'orange'];

let lastFruit = fruits.pop(); 

// lastFruit is 'orange'
// fruits is now ['apple', 'banana']

unshift()

The unshift() method adds a new element to the beginning of an array.

let fruits = ['apple', 'banana'];

fruits.unshift('strawberry');

// fruits is now ['strawberry', 'apple', 'banana']

shift()

The shift() method removes the first element of an array.

let fruits = ['strawberry', 'apple', 'banana'];

let firstFruit = fruits.shift();

// firstFruit is 'strawberry'
// fruits is now ['apple', 'banana']

Iteration Methods

Next let's look at methods that iterate over arrays:

forEach()

The forEach() method executes a callback function on each element in an array.

let fruits = ['apple', 'banana', 'orange'];

fruits.forEach(fruit => {
  console.log(fruit);
});

// Logs: 
// apple
// banana  
// orange

map()

The map() method returns a new array with the callback function applied to each element.

let numbers = [1, 2, 3]; 

let doubledNumbers = numbers.map(n => n * 2); 

// doubledNumbers is [2, 4, 6]

filter()

The filter() method returns a new array with only elements that pass a condition inside the callback.

let numbers = [1, 2, 3, 4, 5];

let evens = numbers.filter(n => n % 2 === 0);

// evens is [2, 4]

reduce()

The reduce() method reduces the array to a single value, by calling the callback on each element.

let numbers = [1, 2, 3, 4, 5];

let sum = numbers.reduce((accumulator, current) => {
  return accumulator + current;
}, 0);

// sum is 15

some()

The some() method returns true if any element in the array passes the condition.

let numbers = [1, 2, 3, 4, 5]; 

let hasEven = numbers.some(n => n % 2 === 0);

// hasEven is true

every()

The every() method returns true only if all elements pass the condition.

let numbers = [2, 4, 6, 8];

let allEven = numbers.every(n => n % 2 === 0); 

// allEven is true

find()

The find() method returns the first element that passes the condition.

let users = [
  {id: 1, name: 'John'},
  {id: 2, name: 'Sarah'},
  {id: 3, name: 'Mike'}
];

let user = users.find(user => user.id === 2);

// user is {id: 2, name: 'Sarah'}

findIndex()

The findIndex() method returns the index of the first element that passes the condition.

let users = [
  {id: 1, name: 'John'},
  {id: 2, name: 'Sarah'},
  {id: 3, name: 'Mike'}  
];

let index = users.findIndex(user => user.id === 2);

// index is 1

Joining and Splitting

There are also useful methods for joining and splitting arrays:

join()

The join() method creates a string from array elements, separated by a delimiter.

let fruits = ['apple', 'banana', 'orange'];

let fruitString = fruits.join(' and '); 

// fruitString is 'apple and banana and orange'

split()

The split() method splits a string into an array based on a delimiter.

let fruitString = 'apple, banana, orange';

let fruits = fruitString.split(', ');

// fruits is ['apple', 'banana', 'orange']

Other Helpful Methods

Here are a few more handy methods:

slice()

The slice() method returns a shallow copy of a portion of an array.

let fruits = ['apple', 'banana', 'orange', 'grapes'];

let citrus = fruits.slice(1, 3);

// citrus is ['banana', 'orange']

splice()

The splice() method changes the contents of an array by removing and/or adding elements.

let fruits = ['apple', 'banana', 'orange', 'grapes'];

fruits.splice(2, 1, 'cherry');

// fruits is now ['apple', 'banana', 'cherry', 'grapes']

concat()

The concat() method merges two or more arrays together.

let fruits = ['apple', 'banana'];
let citrus = ['orange', 'lemon'];

let produce = fruits.concat(citrus); 

// produce is ['apple', 'banana', 'orange', 'lemon']

includes()

The includes() method checks if an array contains a value. Returns true or false.

let fruits = ['apple', 'banana', 'orange'];

let hasApple = fruits.includes('apple'); 

// hasApple is true

Easter Eggs

Here are some array method tips that could come in handy:

Use map() instead of a for loop to avoid mutating the original array.
filter() can be used to remove null, undefined and false values from an array.
some() is short-circuiting - it stops iterating once it finds a match.
every() is short-circuiting - it stops iterating once it finds a non-match.
reduce() can be used to flatten nested arrays.

Conclusion

And there you have it - everything you need to know about JavaScript array methods! From joining strings to filtering data, these methods unlock the real power of arrays.

The key is to understand what each method does, and when to reach for it. Memorize this guide, play around with some examples, and arrays will become second nature. Soon you'll be able to refactor chunks of code into neat one-liners with methods like map, filter and reduce.

Mastering arrays is a milestone for any JavaScript developer. Use this guide as your reference whenever you need to manipulate ordered data. And just think - when you nail those array interview questions.

Don't forget to checkout my other blogs to become JS Wizard :) , I'll start JS Series soon to share more in-depth knowledge on JAVASCRIPT, Till then

Thanks for reading

Happy Coding ❤️

Meet Mr. Query Selector - Your New BFF for DOM Manipulation

MohitSinghChauhan — Thu, 03 Aug 2023 22:31:30 +0000

Have you ever tried to extract or collect data from a website using JavaScript? This is known as web scraping, and it requires targeting specific elements on the page to grab the data you need.

While attempting web scraping, I realized how handy it become when you are already familiar with Mr. Query Selector!

In this post, we'll get to know how querySelector works and all the super useful tricks it has up its sleeve for targeting elements. Get ready to become a querySelector pro!

Introducing...Mr. Query Selector!

When you want to interact with an element on a web page using JavaScript, you first need to find and select that element.

That's where the querySelector method comes to the rescue!

querySelector allows you to find an element using a CSS selector, just like how you would style it in a stylesheet. It will search through the whole document and return the first element that matches the selector you passed it.

Let's look at a quick example:

const elem = document.querySelector('p');

This will find and return the first <p> element on the page. Pretty handy!

The selector you pass to querySelector can match by element type, class, id, or anything else that CSS supports.

Now that we know the basics of using querySelector, let's explore some common use cases.

Finding Elements by Type

To find elements by their HTML tag name, pass the element name into querySelector:

const elems = document.querySelector('div');

This will grab the first <div> on the page.

You can also select multiple elements of the same type using querySelectorAll:

const divs = document.querySelectorAll('div');

Now you have a whole collection of <div> elements to work with.

Targeting Elements by Class

What if you only want a specific <div> like one with a class of "sidebar"? Easy!

const sidebar = document.querySelector('.sidebar');

By including the class name with a . prefix, we can target elements with a certain class.

Grabbing Elements by ID

If an element has an id attribute, you can directly select it using:

const banner = document.querySelector('#banner');

Because IDs are unique, this will only match one element on the page.

Combining Selectors

Now here's where Mr. Query Selector starts to show his true power. You can combine multiple selectors to target elements based on several criteria.

For example, to find all <span> elements with the class "highlight" inside <div> elements:

const spans = document.querySelectorAll('div span.highlight');

By combining the element, class, and ancestry selectors we created a very specific matcher.

You can even nest these selectors infinitely to drill down and grab nested elements deep in the DOM tree!

Selecting by Attribute

Need to find all links that open in a new tab? Query selector has attributes covered too:

const newTabLinks = document.querySelectorAll('a[target="_blank"]');

The [attribute] selector will look for elements with a matching attribute value. Super useful!

Getting Advanced with Pseudo Selectors

CSS allows styling elements that are in a certain state, like when a button is hovered over.

Query selector lets you select these pseudo states as well!

For example, to find all visited links:

const visitedLinks = document.querySelectorAll('a:visited');

And form elements that are checked/selected:

const checkedCheckboxes = document.querySelectorAll('input[type="checkbox"]:checked');

The :pseudo-class notation works just like it does in CSS.

Putting It All Together

Now that you know all of Mr. Query Selector's tricks, let's see him in action with a complex selector:

const innerSpan = document.querySelector('div.sidebar > ul > li span');

This will find the <span> element that is a descendant of an <li>, which is inside a <ul>, which is inside a <div> with the class "sidebar". Phew!

As you can see, by combing CSS selector capabilities, querySelector allows you to grab nearly any element on the page precisely and efficiently.

Why Use Query Selector?

Now you might be wondering, why use querySelector instead of just giving elements an id and getting them directly?

Good question! The main benefit of using querySelector is that it doesn't require you to modify the HTML. This allows you to write JavaScript that works across many pages regardless of their structure.

Query selector also lets you get sets of elements without having to give each one a unique ID. Oftentimes you want to select a group of elements by a shared class or attribute rather than single elements.

Overall, querySelector is an extremely handy method that allows flexible, powerful element selection without tying you to a particular HTML structure.

Common Mistakes to Avoid

While querySelector is great, there are a few common mistakes to avoid:

Typos! Double check your selector string - an incorrect class name or attribute will prevent it from matching.
Assuming an element exists. querySelector will return null if no match is found, so check for that.
Forgetting querySelector only returns the first match. Use querySelectorAll to get a collection.
Overly complex selectors. Try to keep your selectors simple and focused for performance.

Ready to Find Your Elements!

And with that, you've leveled up your querySelector skills!

You now have the superpower to grab any element on a page with precision and flexibility. Query selecting makes easy work of even the most complex DOM structures.

Go forth and start querying! Let querySelector help you easily access and manipulate elements in your JavaScript projects.

Happy Selecting ❤️

Detailed Guide to Firebase Realtime Database with a CRUD Tutorial using JavaScript

MohitSinghChauhan — Wed, 26 Jul 2023 21:17:58 +0000

Firebase Realtime Database is a cloud-hosted NoSQL database that allows storing and syncing data between users in realtime. In this comprehensive guide, we will explore the key features of Firebase Realtime Database, understand how data is structured, and go through a detailed CRUD (Create, Read, Update, Delete) operations tutorial using JavaScript.

Overview of Firebase Realtime Database

Firebase Realtime Database is a flexible, scalable database for mobile and web application development. Here are some of its notable features:

Data is stored as JSON and synchronized in realtime to every connected client.
Realtime listeners can be used to subscribe to data changes.
Offline data persistence allows apps to continue functioning while offline.
Built-in security rules and authentication helps secure data access.
Integrates seamlessly with other Firebase services like Analytics, Crashlytics, etc.
Usage-based pricing - pay only for the resources you use.

The database uses key-value pairs to store data. The keys are strings while the values can be primitive types like numbers, strings, booleans or complex nested objects.

Data is organized into hierarchical JSON documents similar to below:

{
  "users": {
    "alovelace": {
      "name": "Ada Lovelace",
      "email": "alovelace@gmail.com"
    },
    "ghopper": { 
      "name": "Grace Hopper",
      "email": "ghopper@gmail.com"
    }
  }
}

With this structure, related data is grouped into collections called nodes. For our user's data, "users" is the root node while "alovelace" and "ghopper" are child nodes.

Now let's understand how to get started with Firebase Realtime Database.

Getting Started with Firebase Realtime Database

To use Firebase Realtime Database, you need a Firebase account and a project. Follow these steps:

Sign up for a free Firebase account at https://firebase.google.com
Create a new Firebase project or select an existing one.
In the Project Overview page, click on "Realtime Database" to access the database console.
In the Database console, you can view stored data, add new nodes, edit/delete existing nodes.
To start reading/writing from your app, you need to configure the SDK. Follow the setup guide to add Firebase to your app.
Make sure to define security rules to restrict data access. We'll cover this later.

That completes the basic setup. The Firebase SDK provides a simple API to perform CRUD operations which we'll cover next.

Performing CRUD Operations

The Firebase SDKs provide simple methods to create, read, update and delete data. Let's go through each operation with examples:

1. Create Data

To write data, we use the set() method. It writes data to the specified database path or replacing any existing data at that path.

// Write "ada" node to "users/alovelace"
db.ref("users/alovelace").set({
  name: "Ada Lovelace",
  email: "alovelace@gmail.com"  
});

// Output
// Wrote data to https://<databaseName>.firebaseio.com/users/alovelace

We can also pass complex nested objects to set() which will be stored as JSON.

2. Read Data

To read data, use the once() method. It fetches data from the specified path a single time.

const userRef = db.ref("users/alovelace");

userRef.once("value").then(snapshot => {
  const user = snapshot.val();
  console.log(user.name); // Ada Lovelace 
  console.log(user.email); // alovelace@gmail.com
});

// Output
// Ada Lovelace
// alovelace@gmail.com

We can also use on() to setup persistent listeners that keep listening for data changes.

3. Update Data

To update existing data, use update(). It updates only the specified child keys.

// Update email
db.ref("users/alovelace").update({
  email: "ada@lovelace.com"  
});

// Output 
// Updated 1 key/value pair(s)

To replace all data, use set() again.

4. Delete Data

To delete data, use remove(). It deletes all data at the specified path.

db.ref("users/alovelace").remove();

// Output
// Successfully removed data from https://<databaseName>.firebaseio.com/users/alovelace

This covers the basic CRUD operations. But there are more advanced queries we can perform which we'll see next.

Querying Data

Firebase provides several methods to query and filter data. Some useful ones are:

orderByChild() - Sort results by a child key
limitToLast() - Get last n results
startAt()/endAt() - Fetch results in a range
equalTo() - Find items matching equality filter

Let's see some examples:

// Sort users by email alphabetically
const usersRef = db.ref("users");
usersRef.orderByChild("email").once("value", ...);

// Get last 5 chat messages
const chatsRef = db.ref("chats"); 
chatsRef.limitToLast(5).once("value", ...);

// Fetch users between ages 18 to 30 
usersRef.orderByChild("age")
         .startAt(18).endAt(30)
         .once("value", ...);

// Find user by email
usersRef.orderByChild("email")
        .equalTo("ada@lovelace.com")
        .once("value", ...);

We can combine multiple query methods together to create complex queries.

Using Wildcards for Flexible Queries

When building queries, we can use wildcards in our database references to match flexible data paths.

Some examples:

// Get posts for all users 
const postsRef = db.ref("users/*/posts");
// This will match /users/uid1/posts, /users/uid2/posts etc

// Find recent posts across users
const recentPostsRef = db.ref("users/*/posts/*"); 
recentPostsRef.limitToLast(10).once(...)
// This will return the 10 most recent posts under any user

// Get chat messages for any room 
const roomMessagesRef = db.ref("chatrooms/-*/messages");
// This will match /chatrooms/room1/messages, /chatrooms/room2/messages etc

Wildcards provide a flexible and powerful way to query data without knowing the exact node structure beforehand. They are useful for common social app patterns like:

Fetching recent posts across users
Getting messages for any chatroom
Searching data by value across nodes

Refer to the Firebase docs for more details and examples on using wildcards for queries. They help build robust applications by querying data in a dynamic way.

Now that we have covered basic operations, let's discuss how to structure your data.

Structuring Your Data

As we saw earlier, data in Firebase Realtime Database is organized into hierarchical JSON documents. But how we design this structure is crucial for performant apps. Here are some best practices for structuring data:

Organize data by collections/categories - Group related entities like users, posts, comments together as separate root nodes. Avoid a single large list of items.
Avoid nesting data too deep - Excessively nested data requires multiple roundtrips to fetch. Keep nesting levels shallow.
Mix shallow and deep paths - Use a mix of deep and shallow child nodes. Shallow nodes are ideal for frequent writes while deep paths are good for less frequent data.
Keep lists of items small - When storing collections like messages or posts, limit number of items per node to max 100-200 items.
Avoid saving large unstructured data - Store files like images or videos on cloud storage like Firebase Storage. Store only URLs in database.
Denormalize data when needed - Duplicate data across locations to avoid excessive joins.

By planning your data structure upfront keeping these points in mind, you can optimize your app for performance.

Next we need to learn how to secure our data by defining security rules.

Adding Security Rules

By default, any data in your Firebase database is readable and writeable by anyone. To restrict access, we define security rules on each node.

Some examples:

// Allow only authenticated users to read/write user data
"users": {
  ".read": "auth != null",
  ".write": "auth != null",

  "$userId": {
    // Allow only the user to read/write their data
    ".read": "auth.uid === $userId",
    ".write": "auth.uid === $userId",
  }
}

// Make "posts" readable by anyone but writeable only by admins
"posts": {
  ".read": true,
  ".write": "root.child('admins').hasChild(auth.uid)" 
}

Rules are applied recursively. So a user can only read/write their data but not others'. These simple declarative rules make securing data easy.

For more examples, refer the Firebase documentation on security rules. Defining proper rules as your app evolves is crucial to data security.

Conclusion

So in this detailed guide, we looked at how to use Firebase Realtime Database for building realtime apps. Some key takeaways:

Data is stored as JSON documents and synced across clients in realtime.
Perform common CRUD operations using the intuitive Firebase SDK methods.
Structure your data keeping in mind considerations like nesting levels, list sizes, denormalization etc.
Secure access to data using declarative security rules based on authentication.

By leveraging the flexible APIs provided by Firebase Realtime Database, you can focus on creating engaging realtime apps without the backend headaches. Use the knowledge gained from this tutorial to start building your next Firebase-powered application today!

Don't forget to checkout my other gem articles.

Happy Coding ❤️

LeetBuddies: Follow friends on Leetcode

MohitSinghChauhan — Wed, 26 Jul 2023 05:42:07 +0000

Hey, hey! What's up, fellow coding enthusiasts? It's your pal Mohit here, just a regular dude who's diving headfirst into the world of coding, algorithms, and data structures.

I am a fullstack developer but I do not do many algorithm questions which are asked in interviews. So, I decided to try my hands on LeetCode.

Let me tell you about a little bump I encountered on my coding journey recently, and I thought it'd be great to share it with all of you.

You know what's been a game-changer for me as a beginner? Having a solid group of friends to learn and grow alongside. They're like my trusty study buddies, always there to keep me motivated and inspired.

But here's the catch: Our beloved coding platform LeetCode, doesn't offer a tiny feature to track my friends' progress. Bummer, right? I mean, imagine the extra boost of encouragement I could get from seeing how my buddies are doing and celebrating their victories together.

And that's where the lightbulb moment struck!

My developer mind decided to solve this problem! Thus, the brainchild of LeetBuddies was born—an awesome Chrome Extension that makes tracking your friends on LeetCode an absolute breeze.

Imagine You head over to the Chrome Web Store, grab your copy of LeetBuddies, and seamlessly install it in your browser voila! You've unlocked the doors to your very own LeetCode community. Now, you can effortlessly keep tabs on your friends' coding activity, check out their progress through vibrant heatmaps, stay in the loop with their contest ratings, and even witness their growth over time through nifty graphs. How cool is that?

It has features like :

Have Hovercard that has multiple extensions to show Heatmaps, Activity, and Contest Rating Graphs.
Keep track of no. of easy, medium, and hard problems your friends solved so far.
You can even customize the theme of your hovercard :)
Leaderboard style layout ⚡
Most Importantly it have Dark Theme - Like our lives :|

Oh, did I mention the icing on the cake? LeetBuddies is open-source, meaning you can jump right into the mix on GitHub and contribute your coding wizardry to make it even more awesome. Talk about community power, right?

Whether you're a coding newbie taking your first steps or a seasoned pro with a black belt in programming, LeetBuddies will keep you connected with your friends and inject a thrilling dose of excitement into your coding journey.

It's a tool crafted by a coder, for coders just like us.

So, without any further ado, head over to the Chrome Web Store and snag yourself a copy of LeetBuddies. Don't forget to share the love with your buddies too!

Haven't you sold yet to download this extension? Alright then, allow me to present you with a few screenshots:

Oh, and hey, if you've got some brilliant ideas or suggestions for new features, I'm all ears! Shoot them my way, and I'll be here, ready and eager to listen, making LeetBuddies an even more epic experience for all of you. Happy coding, my friends! May your LeetCode adventures be filled with excitement and triumphs!

Chrome Web Store link: https://chrome.google.com/webstore/detail/leetbuddies/bdjodimflodichjajpgehjfbdbhkbhnd/

Do Give the 5 ⭐ rating, it helps.

Github Repo link : https://github.com/MohitSinghChauhan/LeetBuddies, Feel free to raise PRs, Do give it a star ⭐

Learn MongoDB in One Shot - Ultimate MongoDB Guide

MohitSinghChauhan — Mon, 24 Jul 2023 23:43:02 +0000

Update: This article is featured in Official MongoDB Newsletter
Read full newsletter here 🔗

MongoDB is a popular open-source NoSQL document database. It stores data in flexible JSON-like documents rather than tables with a fixed schema like SQL databases. MongoDB makes it easy to store and query large volumes of unstructured or semi-structured data.

Why Use MongoDB?

Some key advantages of MongoDB:

Flexible schema - Documents can have varying sets of fields, allowing you to store different types of data in the same collection.
Scalability - MongoDB scales horizontally using sharding to support high volumes of reads and writes. (Read more here...)
Performance - The document storage model allows for faster queries compared to relational databases. Indexes and in-memory caching provide further performance boosts.
High availability - Replica sets provide automatic failover and data redundancy.
Rich queries - Supports dynamic queries against documents using a document-based query language.

Wants to read all advantages of MongoDB DBMS, check out here...

Key Concepts

Before we jump into using MongoDB, let's understand some key concepts:

Document - The basic unit of data in MongoDB. Similar to a row in an RDBMS table. Documents are stored in JSON-like (BSON) format with field-value pairs.
```
{ 
    "_id": "507f1f77bcf86cd799439011", 
    "name": "Mohit Singh Chauhan", 
    "age": 22
}
```
Collection - A group of documents, similar to a table in RDBMS. A database can have multiple collections.
Database - A physical container for collections. Each MongoDB server typically has multiple databases.

Installing MongoDB

I believe you can install it by reading the docs. It is pretty straightforward. You need to install MongoDB Community Server and MongoDB Shell

Follow the links : MongoDB Community Edition and MongoDB Shell,

Set PATH Env Variable for Windows, & Install MongoDB VS Code Extension.

Data Types in MongoDB

MongoDB supports a wide variety of data types for fields in documents:

String - UTF-8 encoded string for storing text.

{ name: "John Doe" }
Integer - Used for numeric values.

{ age: 25 }
Boolean - Stores true/false values.

{ active: true }
Double - 64-bit floating point value for decimals.

{ price: 24.99 }
Arrays - Stores lists of values in a single key.

{ hobbies: ["football", "chess", "code"] }
Embedded Documents - Stores documents inside other documents.

{ address: { street: "123 Main St", city: "New York" } }
Object IDs - Special datatype used for document IDs, IDs are autogenerated untill explicitly defined.

{ _id: ObjectId() }
Dates - Date and time stored as milliseconds since Unix epoch.

{ createdAt: new Date() }
Null - Represents missing or unknown data.

{ middleName: null }

MongoDB provides a flexible schema design allowing documents in a collection to have varying sets of fields.

Inserting Documents

To insert a document into a collection:

db.users.insertOne({
  name: "John",
  age: 30
})

To insert multiple documents:

db.users.insertMany([
  {name: "John", age: 30},
  {name: "Jane", age: 27}
])

MongoDB automatically generates a unique _id field if not provided.

Querying Documents

Use find() to query documents in a collection. It supports:

Query filters to select matching documents
Projection to return specific fields
Sorting
Limiting results
Cursor for pagination

Query Filters

To return all documents in a collection, pass an empty filter object to find():

db.users.find({}) // returns all documents

Specify a query filter object to select matching documents:

db.users.find({age: {$gt: 18}}) // age greater than 18

Common query operators:

Comparison ($eq, $gt, $lt)
Logical ($and, $or, $not)
Evaluation ($exists, $type)
Array ($in, $nin)

Projection

Specify a projection document to return only selective fields:

_id is true by default so you need to explicitly tell mongosh to not project id

db.users.find({}, {name: 1, email: 1}) // only return name and email

Sorting

Pass a sort specifier to sort():

db.users.find({}).sort({age: -1}) // sort by age descending
db.users.find({}).sort({age: 1}) // sort by age ascending

Limiting

Limit results with limit():

db.users.find({}).limit(10) // only return 10 docs

Pagination

Use cursor for skipping and limiting:

const cursor = db.users.find()
cursor.skip(10).limit(10) // skip 10, limit 10

There are many more querying capabilities - covered later!

Updating Documents

Use update operators like $set to update documents:

db.users.update({name: "John"}, {$set: {age: 20}})

Common update operators:

$set - Sets value of a field
$inc - Increments value
$min/$max - Updates if less/greater than current
$push/$pull - Adds/removes from an array
$rename - Renames a field

Deleting Documents

To delete documents, use deleteOne() or deleteMany():

db.users.deleteMany({status: "inactive"})

Indexes

Advanced Topic Alert

Indexes allow the MongoDB query engine to quickly find and sort documents by their indexed fields without having to scan every document in the collection.

For example, adding an index on the name field will allow fast lookups like:

db.users.find({name: "John"})
db.users.find({name: {$gt: "A"}})  
db.users.find({}).sort({name: 1}) // sort by name ascending

Without an index on name, these queries would require a full collection scan which can be 100x or more slower on large collections. Indexes make a dramatic impact on performance.

To create an index:

db.users.createIndex({name: 1}) // Ascending index

The index will be created in the background and does not block reads/writes.

Some considerations when using indexes:

Indexes consume disk space and memory to store the indexed data efficiently.
Adding indexes will slow down write operations like inserts and updates as the indexes also need to be updated.
Use indexes judiciously on fields that are frequently queried or sorted on. Avoid over-indexing.
Index types like text, geospatial provide additional query capabilities.
Compound indexes can be created on multiple fields.

Summing Up, Indexes allow fast lookups and sorting of documents by indexed fields but also have storage overhead and impact write performance. Use indexes judiciously based on query patterns and system resources.

Where To Go From Here

You should now have a solid understanding of the fundamentals of MongoDB. Some recommended next steps to take your MongoDB skills to the next level:

Install MongoDB locally and play around with inserting, querying, updating and deleting documents through the MongoDB shell. Hands-on experience is key for mastering MongoDB.
Read MongoDB's documentation on aggregation to learn how to perform advanced analytics and data processing on dataset.
Learn how to model one-to-one, one-to-many, and many-to-many relationships between documents using embedding and linking.
Understand MongoDB's architecture including sharding and replication. Set up a simple sharded cluster.
Get started with MongoDB Atlas (MongoDB Cloud Database) to easily spin up a managed MongoDB cluster on the cloud.
Learn how to develop applications using MongoDB drivers for languages like Node.js, Java, Python.
Explore best practices for data modeling, indexing, and performance optimization when working with MongoDB.

The Mongo community also provides tons of resources to further advance your skills!

Happy Coding 💖

Clean Code 101: Variable Naming Conventions - Part 1

MohitSinghChauhan — Sun, 23 Jul 2023 21:27:28 +0000

What's the best way to measure how clear and understandable code is? Simple - count the "WTFs/minute". When reading confusing, messy code, you can't help but think "What the heck is this doing?" more often. Those WTF moments add up fast, wasting time and energy trying to understand bad code.

So, what causes those WTF head-scratching moments? Usually it's code that ignores clean coding principles:

Poorly named variables/functions
Overly complex conditionals and loops
Deep nesting and sprawling functions
No comments explaining the intent
Inconsistent formatting

Code like this takes longer to understand. It's a pain to update or fix bugs. Other developers on your team will struggle with it too.

Writing clean code minimizes "WTFs" and speeds up development. Your future self will thank you when revisiting old code. Fixing bugs and adding features in clean code is much easier.

Let's start writing JavaScript that brings clarity, not confusion! The less "WTFs-per-minute", the better!

Variable Naming 101

Variable naming is one of the most important skills in programming. The names we choose for variables can make our code either very readable and maintainable or extremely confusing. Here are some best practices for naming variables in JavaScript:

Use Meaningful and Pronounceable Names

Variable names should clearly convey what data they contain or what purpose they serve. Avoid single-letter variables like x or abbreviated names that may be unclear like nmd.

Bad:



const yyyymmdstr = moment().format('YYYY/MM/DD');

Good:



const currentDate = moment().format('YYYY/MM/DD');

Variable names should also be pronounceable to aid in code review and discussion. For example, currDate is more pronounceable than crDt.

Avoid ambiguous names that force the reader to mentally map what the data represents.

Bad Example:



const locations = ["Austin", "New York", "San Francisco"];

locations.forEach(l => {
  // do stuff

  // do more stuff

  // what was l again?
  dispatch(l); 
});

Good Example:



const locations = ["Austin", "New York", "San Francisco"];

locations.forEach(location => {

  // do stuff

  // do more stuff

  dispatch(location);
});

The second example is much clearer in conveying we are iterating through an array of locations.

Use variable names like location rather than short names like l to avoid mental mapping. Your co-workers will thank you!

Use the Same Vocabulary for the Same Types

Try to use a consistent vocabulary across your codebase for variable names representing similar data types or concepts. For example, always refer to a user object as user instead of sometimes using user, userInfo, client, etc.

Bad:



getUserInfo(); 
getClientData();
getCustomerRecord();

Good:



getUser();

This improves readability and avoids confusion when working on different parts of the codebase.

Use Searchable Names

We read code much more than we write it. Ensure your variable names can be easily searched to aid in understanding the code later. Avoid generic names like data or object that reveal little about what's inside them.

Tools like buddy.js and ESLint can help identify unnamed constants.

Bad:



// What is 86400000 milliseconds for? 
setTimeout(blastOff, 86400000);

Good:



// Declare as a capitalized named constant
const MILLISECONDS_PER_DAY = 60 * 60 * 24 * 1000; 

setTimeout(blastOff, MILLISECONDS_PER_DAY);

Use Explanatory Variables

For complex operations, use intermediate variables to aid readability. Avoid forcing the reader to mentally map what a block of code is doing.

Bad:



const address = 'One Infinite Loop, Cupertino 95014';
const cityZipCodeRegex = /^,([^, \]+) ([^, \]+)(?: ([^,\s]{5}))?$/; 

saveCityZipCode(
  address.match(cityZipCodeRegex)[1], 
  address.match(cityZipCodeRegex)[2]
);

Good:



const address = 'One Infinite Loop, Cupertino 95014';
const cityZipCodeRegex = /^,([^, \]+) ([^, \]+)(?: ([^,\s]{5}))?$/;

const [, city, zipCode] = address.match(cityZipCodeRegex) || [];
saveCityZipCode(city, zipCode);

Avoid Unneeded Context

Don't repeat class or object names in variables. The context is usually obvious from nearby code.

Bad:



const Car = {
  carMake: 'Honda',
  carModel: 'Accord',
  carColor: 'Blue'  
};

function paintCar(car, color) {
  car.carColor = color;
}

Good:



const Car = {
  make: 'Honda',
  model: 'Accord',
  color: 'Blue'
};

function paintCar(car, color) {
  car.color = color; 
}

Use Default Parameters Instead of Conditionals

In ES6, default function parameters can replace conditional logic. Be aware this only works for undefined values - other falsy values like '' or 0 will not be replaced.

Bad:



function createMicrobrewery(name) {
  const breweryName = name || 'Hipster Brew Co.';

  // ...
}

Good:



function createMicrobrewery(name = 'Hipster Brew Co.') {
  // ...
}

Following these variable naming best practices will make your code clearer and more maintainable for both yourself and other developers. Put care into the names you choose!

Ending Note :)

Following these general guidelines will help you to reduce "WTFs" and improve your code's clarity.

But there's more we can do to level up our clean coding skills. In the next parts of this series, we'll tackle topics like:

Common code smells to avoid
Refactoring techniques
Clean architecture patterns
Writing robust tests
Automating code linting

See writing clean code is a journey. But by incrementally adopting principles like those covered today, we put ourselves on the path to mastering this critical skill.

If you want to go super in-depth, give a read to very famous book Clean Code: A Handbook of Agile Software Craftsmanship by Robert C. Martin (Uncle Bob), which also inspired this blog.

The more we value readable, maintainable code, the better experience we create for our users, teammates, and future selves. Take Oath to get onward with clean code!

Happy Coding ❤️

Forem: MohitSinghChauhan

Mastering MongoDB Collections

Why Collections?

Creating Collections

Naming Collections

Listing Collections

Dropping Collections

Collection Methods

Capped Collections

Collection Validation

When MongoDB Checks Validation

Auto-Indexing

Ending Note :)

From Zero to GraphQL Hero: The Ultimate Getting Started Guide

What is GraphQL?

Why Use GraphQL?

Core GraphQL Concepts

A Simple Query Example

Arguments and Variables

Mutations

GraphQL Clients

GraphQL Servers

Learn with Great Resources

Is JavaScript Null actually a Object ?

A Brief History of JavaScript

How Values Are Stored in Memory

Why Not Change It?

Mastering JavaScript Array Methods

Basic Methods

push()

pop()

unshift()

shift()

Iteration Methods

forEach()

map()

filter()

reduce()

some()

every()

find()

findIndex()

Joining and Splitting

join()

split()

Other Helpful Methods

slice()

splice()

concat()

includes()

Easter Eggs

Conclusion

Meet Mr. Query Selector - Your New BFF for DOM Manipulation

Introducing...Mr. Query Selector!

Finding Elements by Type

Targeting Elements by Class

Grabbing Elements by ID

Combining Selectors

Selecting by Attribute

Getting Advanced with Pseudo Selectors

Putting It All Together

Why Use Query Selector?

Common Mistakes to Avoid

Ready to Find Your Elements!

Detailed Guide to Firebase Realtime Database with a CRUD Tutorial using JavaScript

Overview of Firebase Realtime Database

Getting Started with Firebase Realtime Database

Performing CRUD Operations

1. Create Data

2. Read Data

3. Update Data

4. Delete Data

Querying Data

Using Wildcards for Flexible Queries

Structuring Your Data

Adding Security Rules

Conclusion

LeetBuddies: Follow friends on Leetcode

Learn MongoDB in One Shot - Ultimate MongoDB Guide

Why Use MongoDB?