Today we're going to explore the topic of blockchain. If you're interested in cryptocurrencies you've probably heard of the word Blockchain, but what is it? Let me explain it to you in a nutshell. 🤓

Blockchain is a distributed database/state machine. This means that each network user holds a copy of this database locally - meaning the database is on more than one device. This database consists of records arranged in chronological order. This list consists of multiple data blocks, each block is linked to the previous and next block. The blocks document the time and order of transactions and they are linked in a way that makes it impossible to change the data or insert a new block between existing ones.

Who participates in the Blockchain network?

Anyone can join public networks such as Bitcoin or Ethereum and become part of them. This network is based on peer-to-peer (P2P). It connects users, transfers transactions ( which will be discussed later in the article ), and blocks of verified transactions. The network is always based on the standardized Gossip protocol.

Blockchain security

All blocks are secured by cryptographic evidence (e.g.: signatures) and blockchain data synchronization security is ensured by consensus algorithms such as Proof of Work (e.g.: ethash). Many people believe that Blockchain is safer than banks because there is no central actor to control your money.

But what is held in these blocks?

The blocks hold the transactions that make up the current state of the entire blockchain. What are transactions? They have verified changes in the state of the main state machine/database ( ie: the main ETH blockchain, for example). The transactions that are in the blockchain are verified by other users of the blockchain network.

Blockchain usually also has a reward system implemented based on providing its computing power for computations so-called: mining.

Summary

• blockchain is a database distributed among the users of the network
• it consists of blocks that are arranged chronologically and each block has one preceding and one following
• any user may introduce a change to the blockchain, through transactions
• for a chance to be introduced to the blockchain, it must be verified
• by participating in the blockchain network we can share computing power, that is, to do so-called mining

And that in a nutshell is blockchain, in the next posts of the #IntroToCrypto series on the #codingbrah blog we will go much deeper into this topic.

Farewell 👋

Bonus: A very good demo on how blockchain works can be found here → https://andersbrownworth.com/blockchain/blockchain

~ Kacper

Yo, yo, yo! Guess who's back?! 🤙 I've not been posting here for some long amount of time 😅. However, it's time to change that! I won't be able to post here daily as I've got a lot of side projects, but I'll try my best to be more active! This post is quite short, but it should be enough to cover the subject. If not, then let me know in the comments what else you want to know 😃. Ok, let's get back to the topic! 🔥

Create React App vs NextJS

Many developers are questioning themselves if they should use either Create React App (CRA) or NextJS to create a project. In this post, I’ll give you a quick overview of Create React App and NextJS, show some pros and cons of each, and then I’ll point out in which case I would use them. However, you should know that they are kind of different technologies, so I won’t strictly compare them.
Also, you must remember that there are no bad or good technologies (except PHP - it’s bad 😝 ). Everything depends on the need of the project.

Create React App

Create React App is a standalone command-line tool used to generate a new React project. Project created with Create React App is using client-side rendering (CSR) solution. That means the browser gets mostly an empty HTML document with just links to your CSS and JavaScript bundles. In this case, the user will need to wait for all bundles to load and then have the virtual DOM moved to the browser DOM for the page to be viewable.

NextJS

NextJS is a framework that is built on top of React library. It was developed by Vercel (formerly Zeit). It uses a server-side rendering (SSR) solution to render the project in the browser. In this case, the browser will receive from the server’s response a ready-to-be rendered HTML document of the page. That means the user can start viewing the page while the process of building a virtual DOM and attaching events is in progress. Also, there is a command-line tool called Create Next App, which bootstraps a Next.js app.

Create React App - Pros

Pros

• You can host your app on any file host as it’s rendered on client-side
• Website is rendered pretty fast after the initial slow load
• Avoids constant full page reloads
• Only one build dependency - react-scripts
• Supports TypeScript out of the box
• It’s very well maintained

Create React App - Cons

Cons

• Initial load time can be slow due to the requirement of rendering the JS bundles
• It has a negative impact on SEO, which can be solved using pre-renderer
• Client-side rendering causes higher memory consumption on client-side devices
• It’s quite hard to add custom build configs

NextJS - Pros

Pros

• SEO is not impacted due to HTML being rendered on the server-side and directly passed to the browser
• It provides an easy-to-use routing system out of the box
• Initial page load is crazy fast - the advantage of SSR
• It’s kind of easy to deploy when using the Vercel platform (CI/CD provided)
• Easy to add custom build configs
• Supports TypeScript out of the box
• It’s very well maintained

NextJS - Cons

Cons

• Higher server consumption as every page load is rendered on the server-side. However, this can be reduced by cache implementation.
• Higher server consumption increase its cost
• It’s hard to customize provided routing system if there is such a need

When to use each?

React

When building web applications or gated web applications (the ones that can be accessed only after login).

NextJS

When building a landing page, eCommerce shop, marketing website, or another website where we care about SEO.

Meme for today

Service Worker is just a fancy Web Worker. The difference is, it’s actually placed between your application and the third party services. You can consider it as a kind of middleware function that can parse all requests and do something with data.

Service Workers are a concept a lot more complicated than regular Web Workers. That’s why today we’ll focus just on understanding the base concepts and use cases. In the following posts, we’ll dive deeper into implementation details.

Difference between Service Workers and Web Workers 🧐

The major difference between Service Workers and Web Workers is that Service Workers are persistent. They don’t erase when you close tabs. They’re not even cleared up when you close your browser. When you think about it, it’s a really powerful concept that allows you to use your creativity in a completely different way.

The most important thing you have to remember is that the Service Worker is just a JavaScript application that is running on the browser. This way we have the ability to use some native browser APIs to handle different use cases in our application.

Push Notification 🔥

Thanks to Notification API, Service Worker can send messages from the browser even if the page isn’t opened. It can be super useful when we want to notify the user about some new activities on his profile, new blog posts, or maybe new discounts in our shop.

One thing we have to remember, the user has to grant the application the right to send notifications. It’s really important from the UX point of view, to not throw these request permission alerts directly when a user shows on our page. We should do this more intelligent after the user is engaged in some activities and he understands the benefits from this feature.

Offline App 🤯

Probably the most widely used use case is to create the ability to use your application without an internet connection. That sounds ridiculous (🤯) at first, but when you think about it, it totally makes sense. Using Cache API you can store necessary files from your application, for example, HTML, CSS, and JS.

We can even indicate to the user that he is in the offline mode and provide some user-friendly alerts telling that he can’t use any POST requests.

But what if the user wants to prepare POST request being offline? 🤔

Temporarily storing data 🤓

Imagine the following scenario. After writing a long post you want to publish it to the page. Unfortunately, when we clicked the submit button, it turns out we haven’t had an internet connection 😱

In most cases, you’d seen this cool but also unproductive dinosaur 🦖 mini-game or some other browser indicators when you wanted to get access to the page without the proper internet connection.

Thanks to Service Workers you can avoid this issue. Imagine this scenario in a different way: you click the button and then you see an elegant, clean message that your data has been successfully saved in a browser but, because you don’t have access to the internet right now it can’t be sent. It also informs you that as soon as you reconnect your data will be immediately sent to the server. This way sounds much cooler, right? 😎

Summary 🥺

That’s it for now 🤓. As I mentioned at the beginning, Service Workers are a much more complex concept.

Right now, we’ve just scratched the surface, soon we’ll learn the implementation details and how to turn these brilliant ideas into products 😉. Stay tuned and have a nice day! 🤙

Recently, I'm not that active here, but this is due to a lot of work that I have 🤓 I'm working on a couple of projects on which I will share more in near future (one of the projects is a game build with React Native - siiiick! 🤯).

Ok, let's get back to the topic! 5 React good practices! 🔥

#1 Remember to keep your components small and function-specific

I think we all have been at least once in a project that is a total mess when it comes to its file and folder structure. This uncontrolled mess can be changed by keeping your components small and dividing them by a logic/function that they handle. A single component should render just a specific element of your page or handle particular behavior. This approach will help you in keeping your code fresh and clean!

Also, it will help in better maintaining your tests, so it’ll be easier to catch a bug and most importantly it will help you and your co-workers to understand easier the code you wrote (especially when you go back to it after some long period 😜 ). As John Wood once said:

#2 Consider using (or not 🤔 ) DRY principle when creating methods

One of the popular principles out there is DRY. It is recommended to use everywhere, like literally everywhere. Even if you ask your neighbor Steven, he’ll also recommend it to you. If you’re not familiar with DRY, then let me quickly explain it. As you have already seen in the title DRY means Don’t Repeat Yourself. Simply said it’s a principle that encourages us to create reusable functions, so they’ll be not repeated within our code. The opposite of the DRY principle is WET (Write Everything Twice or also known as Waste Everyone’s Time). It is usually trashed, by others, because it encourages you to write duplicated code.

Also, some time ago Kent C. Dodds presented a new “principal” (it’s more like philosophy) called AHA (Avoid Hasty Abstractions). This “principle” states that “you shouldn’t be dogmatic about when you start writing abstractions but instead write the abstraction when it feels right and don’t be afraid to duplicate code until you get there”. I think it’s worth checking it out. Link below: https://kentcdodds.com/blog/aha-programming

#3 In most cases try to use controlled components instead of uncontrolled ones.

I’m going to start with a quick explanation, as maybe some of you are wondering now "what the hell are controlled and uncontrolled components? 🤔" Ok, so both are used only in a form element, and being more specific they are used in the input, textarea, and select elements. Controlled components are the ones that value is maintained by React’s local state, so in this case, we’re achieving a “single source of truth”. On the other hand, uncontrolled components are components that DOM uses itself to handle data from a form. Both solutions give you the possibility to have one-time value retrieval and validation on submit. However, only controlled components are the ones that should be used in the case when you need instant field validation, conditionally disabling the submit button, enforcing specific input format, or for example creating dynamic inputs. The only case where usage of uncontrolled components is a must is an input element with a “file” type. In this element, the value can be only set by a user, and not programmatically.

#4 Write tests for your components

You’ve got an error and don’t know where it comes from? I think that’s a good reason to start writing tests for your components 😜 .

Well written tests are not only preventing you from having bugs but also improves the quality of the code. Moreover, it will provide you documentation as you will have every functionality of the method described. Also, it will simplify the debugging process as if a test fails, then only the latest changes made in the code will need to be debugged. I can keep writing more and more advantages of writing tests, but this is not the case here. Just remember to not be lazy and start writing those tests! 😜

#5 Use React PropTypes or TypeScript

Type checking alongside tests is very useful to keep your code out of bugs 🐛 . It is used to make sure that data you receive is valid (ex. method that should take as an argument a string value, didn’t receive an object instead). Also, using type checkers you create some kind of documentation for you as you’re defining what type of data the function takes as input and what type of data it returns as output. That helps later on for example when doing refactoring or just to help other co-workers to understand your code better! For type checking, you can use PropTypes, which is a small library for checking React props and similar objects, but if you want to go total badass 🤟, you can use TypeScript, which is an open-source programming language.

I will do a separate article on those two, but the difference that you should know for now is that PropTypes is type checking at runtime and Typescript validate the types at the time of compilation.

The End 🥺

That's it for today! 🤓 Feel free to drop a comment or like if you found this post useful! 😊 Also, let me know if you would add something else to this list! 🤙

What's up, everyone!? 🤙 I haven't posted for a while, but... I'm back! 🤟 Today I'm going to give you 5 tips on how to easily improve accessibility on your website! 🤓

#1 Use semantic HTML tags

Semantic HTML tags are very essential because when a screen reader or any other sort of assistive device scans a web page, it gets information about the Document Object Model (DOM), or the HTML structure of the page.

HTML elements that you should consider using when creating any page are header, nav, main, article, aside, footer. Elements like div or span are recommended to be used only for layout purpose.

When it comes to the headings, it’s recommended to use one h1 tag per page, and it should match the page title. Other headings should logically represent the page content for screen readers, so they will read the website like kind of a book.

#2 Include alt attribute in img elements

Let’s start with what is alt attribute. When it comes to accessibility, alt text is used in screen readers to better understand an on-page image. However, it also helps in other cases. For example, it will show up in place of an image when the image can’t be loaded and it is also used to provide better image descriptions to search engine crawlers, which helps them to index an image properly.

How to write good alt text?

• Describe the image as precisely as you can

• Keep it short (let’s say around 125 characters)

• Avoid keyword stuffing

• Don’t include “photo of”, “image of” etc.,

• Use longdesc=“” when you need to describe more complex images, which require a longer description

• Image buttons should have an alt attribute that describes the function of the button i.e.: “sign up”.

#3 Use ARIA for non-standard interactive elements

Accessible Rich Internet Applications (ARIA) is a set of attributes, which define ways to make content and web apps more accessible to people with disabilities. It gives HTML the possibility so that interactions and widgets commonly used in applications can be passed to assistive technologies when there is not otherwise a mechanism.

HTML5 semantic elements already have built-in ARIA elements, so you don’t need to worry about it in case of them!

Example of ARIA properly used:

<div id=“percent-loaded” role=“progressbar” aria-valuenow=“75” 
     aria-valuemin=“0” aria-valuemax=“100”>
</div>

#4 Try to avoid the CAPTCHA

Probably all of us were accused of being a robot more than a once. I’m not risking to say that we all love CAPTCHA as much as we love PHP 💜. However, when it comes to accessibility, it’s good to not implement CAPTCHA at all 🤓.

In case if you really, really need it then have in mind to make it simple to understand and to include alternatives for users with disabilities, such as:

• Providing more than two ways to solve the CAPTCHAs
• Providing access to a human representative who can bypass CAPTCHA
• Not requiring CAPTCHAs for authorized users

#5 Associate labels with form controls

Labels ale really important when it comes to the forms. They’re describing the purpose of the form control. Therefore you should provide labels to identify all form controls, including text fields, checkboxes, radio buttons, and drop-down menus. In most cases, this is done by using the label element.

Example:

<label for=“firstname”>First name:</label>
<input type=“text” name=“firstname” id=“firstname”>

However, if you want to hide the label as its purpose is clear from the surrounding content, then it’s recommended to use aria-label or aria-labelledby, so the form controls could be easily described by screen readers and other assistive technology.

Example:

<input type=“text” name=“search” aria-label=“Search”>
<button type=“submit”>Search</button>

<input type=“text” name=“search” aria-labelledby=“searchbutton”>
<button id=“searchbutton” type=“submit”>Search</button>

Would you add something to this list? 🧐

Feel free to share your tips in the comments! 😄

What's up, everyone!? 🤙 Today I'm going to give you 6 tips on how to easily improve SEO on your website! 🤓

#1 Use Title tag

The HTML title tag is probably the most important (if not the most important) element on any web page. Title tags are displayed on search engine results pages as the clickable headline for a given result and are important for usability, SEO, and social sharing.

What to consider to write a good title?

• Title length - if the title is too long it may be cut off by the search engine (“…” will be added at the end). This could possibly impact your title as important words may be omitted. It’s hard to define the exact limit of characters but based on my research it's about 50-60.
• Avoid stuffing keywords - titles with just a list of keywords are bad for search users and can be bad for search engines
• Create a unique title for every page - this helps search engines to understand that content on our web page is unique and valuable, and also drive higher click-through rates. You can use this example format for your titles:

Primary keyword - Secondary keyword | Brand name

Sexy black sandals - Shoes | Urban Clothing

#2 Use Open Graph protocol

Open Graph meta tags are helping to control how the URL of your website is displayed when shared on social media. They need to be placed in of your web page.

Why they are so important?

• They make content more eye-catching, which can improve click-through rates on your site.

• They help you to provide more information about the content on the web page

• They help to understand Facebook and other social platforms what the content is about, which may help you to increase your brand visibility

Basic Open Graph meta tags:

• og:title - Title of your web page. It shouldn’t be too long (stick to 50-60 characters as in title tag).

• og:type - The type of your object i.e. article, video, etc.

• og:image - An image URL, which should represent your object within the graph. For optimal clarity across all devices use 1200x630 dimensions.

• og:url - The canonical URL of your web page

For more tags see official Open Graph protocol docs: https://ogp.me/

#3 Use meta description tag

The meta description is the second thing that you see underneath the title tag in any search engine result. This element can have an effect on whether someone clicks on your link to check your content. Keep it meaningful and don’t stuff keywords - it should describe what can be found on the web page. Also, remember to have different descriptions on every page.

#4 Keep your URL structure simple

The URL structure of your site should be as simple as possible. URLs should be constructed logically and they should be easily understandable for humans (when it’s possible to use the readable word rather than long ID numbers). Also, it’s recommended by Google to use hyphens instead of underscores.

Example:
https://www.example.com/blog/first-blog-post.html

#5 Use noreferrer, nofollow and canonical for anchor tag rel attribute

noreferrer has no direct impact on SEO, but it does have an indirect effect on your link building and promotion efforts. It prevents passing the referrer information to the target website by removing the referral info from the HTTP header. Explaining further, that means if someone arrives at your site from a link that uses this link type, your analytics won’t show who referred that link. Also, noreferrer prevents a JavaScript exploit involving window.opener. However, remember to not use it on internal links as it can mess up with your analytics reports.

nofollow tells search engines not to follow the link to the next page and therefore shouldn’t pass any link authority to the link target. It’s recommended to use it for: links in comments or on forums, advertisements, and sponsored links, paid links.

cannonical helps to prevent duplicate content issues. What that means is, if you have several versions of the same content, you pick one canonical and point the search engines at it. It improves SEO because the search engine knows which version is canonical and can count all the links pointing at the different versions as links to the canonical version.

#6 Use alt tag in the img element

I’ve already mentioned that alt tags improve accessibility on your site in the previous post. However, it can also impact the SEO of your website! Using an alt tag helps search crawlers to understand what is shown on the image.

When it comes to writing good alt text, the rules are the same as described in the accessibility post:

• Describe the image as precisely as you can
• Keep it short (let’s say around 125 characters)
• Avoid keyword stuffing
• Don’t include “photo of”, “image of” etc.,
• Use longdesc=“” when you need to describe more complex images, which require a longer description
• Image buttons should have an alt attribute that describes the function of the button i.e.: “sign up”

Summary

That's it for this post! 🤙 Let me know in the comments if you liked it and if you already use those basic tips in your daily job 🤓

What's up, everyone!? 🤙 Today we’ll dive deeper into time complexity and the big O notation. There are a number of factors that have an impact on the time complexity, in other words how fast our application would be.

There is one important thing we have to keep in mind. There are two different types of complexity: Space and Time. The first one is related to how much memory our application uses, the second one describes how many operations our application executes (we must keep in mind, that JavaScript as a language is single-threaded so the overall number of operations is important but also the time complexity of particular operation matters).

Today we’ll talk about Time Complexity. Or, rather, something more, that can effectively describe our Time Complexity - big O notation.

Easily speaking, the big O notation allows us to estimate if our code is fast or slow. Well, “fast” and “slow” are not enough, in most cases, we should look at how our algorithm will behave on the scale.

What if 1000000000 users will open our website (ok, probably even Netflix isn’t prepared for those types of numbers 😂 ).
What if our loop has to handle 1000000000 elements in our array?
What if this array would have 100 nested arrays inside?
What if I stop giving those ridiculous examples? 🧐

In today’s post, we’ll answer all these questions! Ok, so let’s go through all of the most popular complexities.

Constant - O(1)

The easiest to understand (and the fastest!) is the constant order. What does it mean? Our operation will ALWAYS take the same amount of time. This is the most desirable type of order because it’s the most predictable. We always know how our algorithm would behave and how can it affect our performance. We also don’t have to write complicated test cases because we know that every single one will always work the same way! Ok, so you probably asking which kind of operations are O(1)? These ones, which can reach the appropriate memory area without the need for searching.

Examples:

array[2] // give me this third element of an array
object.property // give me this property of this particular object

Every primitive operation like sum, subtraction, etc.

But there are some tricky ones. What about shift operation? Theoretically, all it does is removing the first element of an array. So you might think that our intelligent thread knows exactly where to go. Although it actually removes only the first element, it also has to change the order of all others. The second element will be first, third will be second, etc.

Linear - O(n)

In this case, the number of operation that has to take place is proportional to the number of inputs. If they are the same, the complexity would be O(n), if they are two times larger, it would be O(2*n). It doesn’t matter that much because the scale remains the same. This complexity is obviously slower than the constant one but at the end of the day, it’s pretty common. I mean, probably every website has some operations that have this complexity. The simplest and easiest to understand the form of this one is the loop. ForEach, Map, For, While, there are many different types but at the end of the day they all work the same way.

Logarithmic - O(logn)

Ok, so this one sounds interesting. All you need to know is, in this case, the number of operations is decreasing when the number of your inputs grow. Imagine the loop which in the first iteration you have to proceed 100 operations, in the second one 50, in the third 25, etc. The fraction doesn’t matter that much, because again - the only thing that matters is scaling. As you may imagine this one is pretty good because it grows very slowly. It means, it’s better than the linear one but worst (slower) than the constant one. Ultimately this is the one that is, the most desirable among all developers.

Big-O complexity chart

Ok, so now, when we’ve described all good ones (constant, logarithmic) and all average ones (linear), let's talk about one of which you should avoid in many cases.

Quadratic/Cubed - O(n²)/O(n³)

There isn’t that much to talk about. It’s just a loop inside a loop. That’s it.

Every time, when we put a loop inside a loop our complexity is multiplied by n. So for example:

array.map(a => a.map(b => b.map(c => c.prop)))

would have the complexity of n³.

As you probably can imagine this approach of nesting loops can put you in some serious problems if it’d get out of control.

That’s why we should always be aware of what we’re putting inside a loop.

Sometimes we don’t even realize that we’re creating the quadratic complexity. Take look at this example:

const isGreaterThan = value => element => ( element > value );
array.map(element => element.find(isGreaterThan(10)));

What with this example? Theoretically, we have just one loop (map) but notice, that the find function works exactly like a loop. It doesn’t just point this particular value (it’d be a constant complexity then).

It literally goes from first to the last index searching for this particular value. What if this value would have the last index?

Remember, in terms of the big O notation we always look at the worst possible case. You must always remember to pay more attention when you deal with an array inside a loop.

Some of the tricky functions:

• every
• filter
• find
• includes
• reduce

Especially you should pay attention to array sorting algorithms. Bubble sort, selection sort, quick-sort in the worst-case scenario can cost you a lot of time. In many cases, it is more effective to implement an algorithm based on the recursion (although it’s better in terms of time complexity, space complexity grows).

There also are some totally sick complexities like O(2ⁿ) or O(n!). They are not that common so I’ll not spend much time describing it. I just want to mention the real-life example (just for fulfilling your curiosity). They’re basically all brute force algorithms when you want to find the particular value testing every possible combination (usable if you want to break a password).

Summary

That’s it for today. At the beginning of this post, I've mentioned that big O notation is something only related to the Time Complexity. Sike! 😜 That’s not entirely true, it’s used to describe all complexities, but it’s mostly used in terms of time.

I strongly encourage you to check out this website: https://www.bigocheatsheet.com/

Today I want to take a look into some basic JavaScript Data Structures. 🧐

Yeah, I know, it doesn't sound that fascinating but it's probably the only way to become code master (or, at least, understand your own code a little more) 😄 .

Do you pay attention, in your daily work, to Data Structures or don't have time for this stuff, and simply you choose the simplest and fastest solution? Let me know in the comments!

Data Structure

Firstly, let’s define what Data Structure is. As the name may suggest it’s just a way to organize/structure your data. Every piece of information that is floating through the web must exist in memory with some kind of solid, logical representation. It is crucial from the perspective of developers to know the difference between the most popular data structures because in many cases the right choice can noticeably reduce the big O complexity and speed up your app. But what actually big O is? 🤔

Big O

The big O notation is a common way to express the time complexity of an app. It’s used in the meaning of the worst-case scenario (situation when your algorithm must handle the worst possible case, for example to loop through the longest or deepest array). Two other notations (rather rarely used) are Big Omega (best case scenario) and Big Theta (average-case scenario). As you can see, developers by their nature don’t look that often on the bright side of life 😔 . There are many different types of orders (complexity types). I’ll definitely take a closer look at each one later, but for now, let’s get used to this concept and go directly to the first data structure - Stack.

Stack - Last In First Out (LIFO)

A stack is an ordered list in which the most recently added element is the first one to remove.

The simplest implementation:

const stack = [ ];
stack.push(2); // stack is now [2]
stack.push(5); // stack is now [2, 5]
stack.pop( ); // stack is now [2]

Queue - First In First Out (FIFO)

As you probably might guess based on the previous definition, a queue is also an ordered list but this time, the most recently added element is the last one to remove. Elements are removed in the same order as they were added.

The simplest implementation:

const queue = [ ];
queue.push(2); // queue is now [2]
queue.push(5); // queue is now [2, 5]
queue.shift( ); // queue is now [5]

Linked List

Now, when we have the basic knowledge about two, most fundamental data structures, let’s talk about something much more interesting.

A linked list is a structure in which each element is linked (or, in other words, has a reference) to the next node. This kind of data structure is at some points implemented, for example, in Blockchain.

Hash Table

The main idea behind the hash table is to speed up the process of searching and comparing elements. Each element has its own number representation that is generating using the hash function. When we want to find a particular element we can just search through the indices (which in many cases can be a lot faster and more efficient).

Summary

I know that this topic is probably way less interesting than some fancy SEO tricks and on the first look, it’s much harder to understand and put in real-life examples. You must understand, that sometimes, we all have to go through this though definitions to create strong fundamentals before we can do some real magic 🧙‍♂️.