<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Harry Lucas</title>
    <description>The latest articles on Forem by Harry Lucas (@harryblucas).</description>
    <link>https://forem.com/harryblucas</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F135449%2F22111b50-598f-4c04-b300-87f89c29c862.jpg</url>
      <title>Forem: Harry Lucas</title>
      <link>https://forem.com/harryblucas</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/harryblucas"/>
    <language>en</language>
    <item>
      <title>What every developer needs to know about TCP</title>
      <dc:creator>Harry Lucas</dc:creator>
      <pubDate>Mon, 25 May 2020 17:27:14 +0000</pubDate>
      <link>https://forem.com/harryblucas/what-every-developer-needs-to-know-about-tcp-36p5</link>
      <guid>https://forem.com/harryblucas/what-every-developer-needs-to-know-about-tcp-36p5</guid>
      <description>&lt;p&gt;&lt;em&gt;This article was originally posted on &lt;a href="https://breadth.substack.com/subscribe"&gt;Breadth&lt;/a&gt; a weekly newsletter aimed at helping you increasing your technical (and non-technical) knowledge to help you become a more effective engineer&lt;/em&gt;&lt;/p&gt;




&lt;p&gt;TCP / IP - the real MVP of the internet.&lt;/p&gt;

&lt;p&gt;Nearly every website/application uses them.&lt;/p&gt;

&lt;p&gt;It is literally the fundamental building blocks that pretty much powers everything, yet many developers who build upon these foundations have no idea how they work.&lt;/p&gt;

&lt;p&gt;And you know what? That can be ok - the best part about it being around so long is that it has proven to be a trustworthy and semi-reliable set of protocols.&lt;/p&gt;

&lt;p&gt;You don't have to know in-depth how it works, but it is good have a basic foundational knowledge.&lt;/p&gt;

&lt;p&gt;Let's dive in.&lt;/p&gt;

&lt;h2&gt;
  
  
  👇 The low down
&lt;/h2&gt;




&lt;p&gt;Firstly, let's clear something up.&lt;/p&gt;

&lt;p&gt;TCP / IP isn't a single thing - it's two separate protocols. Well, sort of. Really, it's one protocol built on top of the other. IP is the base level protocol. It stands for Internet Protocol.&lt;/p&gt;

&lt;p&gt;Aptly put by Cloudflare:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;The Internet Protocol (IP) is a protocol, or set of rules, for routing and addressing packets of data so that they can travel across networks and arrive at the correct destination.&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Essentially, it is pretty much saying that it's a set of rules that define how a piece of data (packet) is sent across the internet.&lt;/p&gt;

&lt;p&gt;Now you might be thinking - is that where an "IP Address" comes from? And you'd be right.&lt;/p&gt;

&lt;p&gt;IP protocol basically tells computers how to get a packet of data from one IP address to another.&lt;/p&gt;

&lt;p&gt;However, it isn't quite that simple.&lt;/p&gt;

&lt;p&gt;To illustrate. Let's say, for example, you wanted to send a letter to your friend Bob.&lt;/p&gt;

&lt;p&gt;Now Bob lives on the other side of the country, and your mail system can only allow letters 5cm by 5cm to be delivered.&lt;/p&gt;

&lt;p&gt;Unfortunately, the letter you've written is much larger. Hence, you decide to cut up the letter into three parts and mail each piece individually.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--W-RBhc7G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F43cb2b80-e5d6-4b80-a6eb-1b3f1940a19b_2388x1668.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--W-RBhc7G--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F43cb2b80-e5d6-4b80-a6eb-1b3f1940a19b_2388x1668.png" alt="diagram showing letter being cut up and sent to destination"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now when you send your letter, it gets sent with three different mailmen.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Mailmen 1&lt;/strong&gt; - has a few other deliveries to do on the way, so it takes him a bit longer to reach your friend.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Mailmen 2&lt;/strong&gt; - can take the letter straight there.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Mailmen 3&lt;/strong&gt; - unfortunately, get's into an accident and so the third part of the letter doesn't make it.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Now Bob has got 2 parts to a 3 part letter. Even worse, Bob isn't the brightest of the lot and can't figure out how to put pieces 1 and 2 back together in the right order. Since part 2 arrived before part 1, he reads in that order.&lt;/p&gt;

&lt;p&gt;So here the IP is what tells you how to get a letter from A -&amp;gt; B. It says that you must use a mailman, you must give the mailman an address and you must only send small pieces of data at a time. You need to trust that they will get there time.&lt;/p&gt;

&lt;p&gt;However, as we have trust seen, this isn't always that reliable. In fact, it's turned into a bit of a mess.&lt;/p&gt;

&lt;p&gt;To illustrate the above example using actual packets (pieces of a letter), imagine you want to send some data from LA -&amp;gt; Melbourne.&lt;/p&gt;

&lt;p&gt;One packet might get routed from LA -&amp;gt; LONDON -&amp;gt; MELBOURNE.&lt;/p&gt;

&lt;p&gt;Another might got straight from LA -&amp;gt; MELBOURNE.&lt;/p&gt;

&lt;p&gt;And the last packet might get dropped along the way.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--QRCFKcmA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fe25fd0bb-8027-45a3-b5ea-9cacb9394ba0_1529x1096.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--QRCFKcmA--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fe25fd0bb-8027-45a3-b5ea-9cacb9394ba0_1529x1096.png" alt="Packets being sent via different paths around the world."&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Clearly I struggle with drawing countries.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Now because of this, if the receiving server attempts to read the packets as they come in, they will get B -&amp;gt; A and no C.&lt;/p&gt;

&lt;p&gt;Basically, they will get rubbish and have no idea what it means.&lt;/p&gt;

&lt;p&gt;Because of this, we call IP an unreliable protocol. It will try to get your data from A -&amp;gt; B as best it can. Still, it makes no guarantees about the order or deliverability of those packets.&lt;/p&gt;

&lt;p&gt;So how does the internet work at all? How do we make this unreliable protocol, reliable?&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Enter TCP&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--T6ePB33O--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F9bdcfecd-7bbc-4496-a457-a475e636e7ef_848x490.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--T6ePB33O--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F9bdcfecd-7bbc-4496-a457-a475e636e7ef_848x490.png" alt="veggie tales allow us to introduce ourselves memo"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;TCP (Transmission Control Protocol) is a protocol built on top of the IP protocol (yes, I am aware that's the same as saying ATM machine, no, I am not changing).&lt;/p&gt;

&lt;p&gt;It attempts (and does a reasonably solid job) at making IP reliable.&lt;/p&gt;

&lt;h2&gt;
  
  
  ♤ Digging Deeper
&lt;/h2&gt;




&lt;p&gt;So how does TCP/IP work?&lt;/p&gt;

&lt;p&gt;Well, let's go back to the letter example.&lt;/p&gt;

&lt;p&gt;So to start with, before we actually even send the data, with TCP, we have to open a connection. We do this to tell the receiver we are going to send some data.&lt;/p&gt;

&lt;p&gt;So in our example, instead of just sending the letter with our message, we instead send him a letter telling him we are going to send a letter. Bit meta right. We also ask him to send a confirmation that he got this letter.&lt;/p&gt;

&lt;p&gt;This tells us a few things. If Bob sends us a confirmation back:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;We know that his address was correct&lt;/li&gt;
&lt;li&gt;We know his mailbox works and he can receive letters.&lt;/li&gt;
&lt;li&gt;We know he has the basic writing skills of a 5 year old.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Now if Bob doesn’t reply we know:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;He can’t receive letters or his address was wrong.&lt;/li&gt;
&lt;li&gt;We shouldn’t bother sending him our real letter because he probably won’t receive it.&lt;/li&gt;
&lt;li&gt;Or he just doesn’t want to hear from us.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Md3WGJ9p--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Ff8fc59b8-8e9a-41a2-84da-951709fa6419_2388x1668.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Md3WGJ9p--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Ff8fc59b8-8e9a-41a2-84da-951709fa6419_2388x1668.png" alt="3 way handshake TCP"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This lets Bob know how to put the letters back in the same order as they were sent. Now it doesn't matter how slow the letters were or which order they arrived, Bob would still be able to reconstruct the original letter.&lt;/p&gt;

&lt;p&gt;This solves one problem. We still have to figure out a way to handle the case of missing letters.&lt;/p&gt;

&lt;p&gt;To do this, we also tell Bob that every time he receives a letter, he again needs to send us a letter back confirming what number-letter he received.&lt;/p&gt;

&lt;p&gt;Now from when you send a letter, you start a timer. You know it will take a maximum of 3 days to send a letter to Bob and for him to send one back.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--us-yxMA3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F97be3bf1-b149-4934-a4b7-465869e3a7b6_2388x1668.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--us-yxMA3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F97be3bf1-b149-4934-a4b7-465869e3a7b6_2388x1668.png" alt="sending a letter TCP style"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;So if after three days, you don't receive a letter from Bob confirming he received it, then you will resend that part of the letter again.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--SVkS55mp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fbaf7afa7-a326-4677-b4fb-9291c8ed357e_480x270.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--SVkS55mp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fbaf7afa7-a326-4677-b4fb-9291c8ed357e_480x270.gif" alt="Simpsons Bart and Lisa saying its done."&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;That's the general gist. Obviously, there is much more that goes on in the internals. Still, for now, you and Bob have a working system for delivering messages.&lt;/p&gt;

&lt;p&gt;The first part of any TCP connection is the handshake.&lt;/p&gt;

&lt;p&gt;With a TCP connection, this handshake is comprised of three distinct parts.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Syn (short for synchronize)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Syn-Ack(short for Acknowledgement)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Ack&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Because it's three parts, this is often referred to as a three-way handshake.&lt;/p&gt;

&lt;p&gt;Essentially what goes on during the handshake is synchronization of sequence numbers (syn) and a set of acknowledgments (ack). This lets the other party know how to arrange the packets. It will also allow it to know if there is a packet missing.&lt;/p&gt;

&lt;p&gt;For example, if you open a connection to a server and tell it that your sequence number starts at 123. When it acknowledges with 124, you can know that the server has received all packets up to, but not including, packet 124.&lt;/p&gt;

&lt;p&gt;The server will also send you it's synchronization number, for example, 432. Now to let the server know you have received all messages up to 432, you send and ack with 433.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--6PHgdCRC--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F85a68ff3-5391-4479-bf3d-8bd7aee2632e_2388x1668.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--6PHgdCRC--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F85a68ff3-5391-4479-bf3d-8bd7aee2632e_2388x1668.png" alt="TCP 3 way handshake with client and server"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now that everyone is on the same page, the transmission of data can begin.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--AemZmITs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F0f766b6b-165e-4396-a76a-8ba7dc63ae0a_500x240.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--AemZmITs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F0f766b6b-165e-4396-a76a-8ba7dc63ae0a_500x240.gif" alt="an akin saying this is when the fun begins"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now the client and server can communicate, using seq numbers and acknowledgments, to transmit packets reliably.&lt;/p&gt;

&lt;p&gt;The sequence numbers aren't actually incremented by 1 each time, however, and instead by the number of bytes being sent. This adds another level of reliability. Now not only do you know the order of the packets being received, but you can also tell if any bytes are missing.&lt;/p&gt;

&lt;p&gt;Of course, there are still going to be many issues along the way. Still, there is a reasonably robust framework in place for dealing with and mitigating a lot of these errors.&lt;/p&gt;

&lt;h2&gt;
  
  
  🤷‍♂️ When would you use it?
&lt;/h2&gt;




&lt;p&gt;Most likely, you are already using TCP/IP.&lt;/p&gt;

&lt;p&gt;TCP is the best used where reliability is needed. Where, if any missing pieces of data can have a negative effect on the experience of the client.&lt;/p&gt;

&lt;p&gt;For example, if you missed 10% of packets when loading a webpage - then chances are you are going to receive a hot mess, and the page will fail to render.&lt;/p&gt;

&lt;p&gt;However, there are cases where reliability and error checking isn't really vital. In fact, it can be detrimental.&lt;/p&gt;

&lt;p&gt;Gaming and Video streaming are two areas where TCP isn't actually the best choice. Instead, UDP is a much better option because UDP has a stronger focus on speed then reliability. Ensuring every single packet in a video call is received is nowhere near as important as making sure the participants can see and hear each other.&lt;/p&gt;

&lt;p&gt;Does it really matter if 5 pixels in the corner are missing for 1 frame? Will anyone really notice? Most likely not. Here speed is king, and a few dropped packets aren't going to be a big deal.&lt;/p&gt;

&lt;h2&gt;
  
  
  💯 Gimme More
&lt;/h2&gt;




&lt;p&gt;Hopefully, you now know a bit more about TCP then before you started reading. If you want to dive deeper and not only increase your breadth but also your depth then check out the below resources 👇&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://youtu.be/AAssk2N_oPk"&gt;Computerphile TCP Meltdown&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.cloudflare.com/learning/ddos/glossary/tcp-ip/"&gt;Cloudflare - What is TCP&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.cloudflare.com/learning/ddos/glossary/internet-protocol/"&gt;Cloudflare - What is IP&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://youtu.be/HCHFX5O1IaQ"&gt;Chris Greer Video series on how TCP works&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  This weeks puzzle
&lt;/h2&gt;




&lt;p&gt;This weeks puzzle is based around the Collatz conjecture.&lt;/p&gt;

&lt;p&gt;The Collatz conjecture is quite simple. It states that:&lt;/p&gt;

&lt;p&gt;Given a number (n):&lt;/p&gt;

&lt;p&gt;If (n) is === 1 👉 return 1 and finish&lt;/p&gt;

&lt;p&gt;If (n) is even 👉 return n / 2&lt;/p&gt;

&lt;p&gt;If (n) is odd 👉 return 3n + 1&lt;/p&gt;

&lt;p&gt;Repeat&lt;/p&gt;

&lt;p&gt;This simple set of rules will always return 1 (well maybe not always but it hasn’t been proven otherwise).&lt;/p&gt;

&lt;p&gt;The path from N -&amp;gt; 1 is called the sequence. E.g.&lt;/p&gt;

&lt;p&gt;n = 20&lt;/p&gt;

&lt;p&gt;20 -&amp;gt; 10 -&amp;gt; 5 -&amp;gt; 16 -&amp;gt; 8 -&amp;gt; 4 -&amp;gt; 2 -&amp;gt; 1&lt;/p&gt;

&lt;p&gt;So if n = 20, the sequence is 8 numbers long.&lt;/p&gt;

&lt;p&gt;Your challenge is to find the longest sequence where n &amp;lt; 1,000,000.&lt;/p&gt;

&lt;p&gt;Please let me know if you come up with a solution in by responding to this tweet:&lt;/p&gt;


&lt;blockquote class="ltag__twitter-tweet"&gt;

  &lt;div class="ltag__twitter-tweet__main"&gt;
    &lt;div class="ltag__twitter-tweet__header"&gt;
      &lt;img class="ltag__twitter-tweet__profile-image" src="https://res.cloudinary.com/practicaldev/image/fetch/s--eOVqg13g--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://pbs.twimg.com/profile_images/1264175095855153152/Za3WBrcG_normal.png" alt="Breadth profile image"&gt;
      &lt;div class="ltag__twitter-tweet__full-name"&gt;
        Breadth
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__username"&gt;
        @getbreadth
      &lt;/div&gt;
      &lt;div class="ltag__twitter-tweet__twitter-logo"&gt;
        &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--52oNvK_0--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/twitter-ff4bdab814039c4cb172a35ea369e0ea9c6a4b59b631a293896ae195fa26a99d.svg" alt="twitter logo"&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__body"&gt;
      Our first article is out 💯 This one explains what TCP/IP is and why we use it to power well... nearly everything.&lt;br&gt;&lt;br&gt;Check it out here 👇&lt;br&gt;&lt;br&gt;&lt;a href="https://t.co/k8Ogvtus9k"&gt;breadth.substack.com/p/the-low-down…&lt;/a&gt;&lt;br&gt;&lt;br&gt;We also have first  puzzle at the bottom - this ones to do with the Collatz Conjecture &lt;a href="https://twitter.com/hashtag/100DaysOfCode"&gt;#100DaysOfCode&lt;/a&gt; &lt;a href="https://twitter.com/hashtag/programming"&gt;#programming&lt;/a&gt;
    &lt;/div&gt;
    &lt;div class="ltag__twitter-tweet__date"&gt;
      19:16 PM - 25 May 2020
    &lt;/div&gt;


    &lt;div class="ltag__twitter-tweet__actions"&gt;
      &lt;a href="https://twitter.com/intent/tweet?in_reply_to=1264998881013698566" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="/assets/twitter-reply-action.svg" alt="Twitter reply action"&gt;
      &lt;/a&gt;
      &lt;a href="https://twitter.com/intent/retweet?tweet_id=1264998881013698566" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="/assets/twitter-retweet-action.svg" alt="Twitter retweet action"&gt;
      &lt;/a&gt;
      0
      &lt;a href="https://twitter.com/intent/like?tweet_id=1264998881013698566" class="ltag__twitter-tweet__actions__button"&gt;
        &lt;img src="/assets/twitter-like-action.svg" alt="Twitter like action"&gt;
      &lt;/a&gt;
      0
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/blockquote&gt;


&lt;p&gt;Alternatively if you liked this article and want to show some love then above tweet is the place to do it ☝️&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;If you want to subscribe to Breadth and get posts the like above straight to your mail box - &lt;a href="https://breadth.substack.com/subscribe"&gt;then click here.&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>career</category>
      <category>programming</category>
    </item>
    <item>
      <title>What is Breadth?</title>
      <dc:creator>Harry Lucas</dc:creator>
      <pubDate>Sat, 23 May 2020 17:21:09 +0000</pubDate>
      <link>https://forem.com/harryblucas/what-is-breadth-opk</link>
      <guid>https://forem.com/harryblucas/what-is-breadth-opk</guid>
      <description>&lt;p&gt;&lt;em&gt;This article was originally posted on &lt;a href="https://breadth.substack.com/subscribe"&gt;Breadth&lt;/a&gt; a weekly newsletter aimed at helping you increasing your technical (and non-technical) knowledge to help you become a more effective engineer&lt;/em&gt;&lt;/p&gt;




&lt;p&gt;One of the worst qualities a software engineer can possess is &lt;strong&gt;complacency&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Software engineering is a complex minefield, with ever changing goal posts.&lt;/p&gt;

&lt;p&gt;You can literally take a nap and miss 5 new waves of front end frameworks.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/IdQc6gB1B9iDu/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/IdQc6gB1B9iDu/giphy.gif" alt="Guy failing to hit tennis balls"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Being complacent as a software engineer is the same as being ignorant. One of the biggest mistakes you can make is telling yourself that “You know what, I know every thing I need to know to do my job”.&lt;/p&gt;

&lt;p&gt;Why is this such a problem?&lt;/p&gt;

&lt;p&gt;Because once you start being complacent, you stop learning. When you stop learning you slowly keep out of touch with the industry. You accept that the knowledge and tools you have today are all you are going to ever need to do your job.&lt;/p&gt;

&lt;p&gt;Never will you find a better way to perform X task, use new abstractions, solve problems in different ways, increase productivity, improve communication and most importantly progress as an engineer.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--7kBoW8ax--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F887bda12-cc97-4b0e-ad86-f98786c0938a_2048x1480.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--7kBoW8ax--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252F887bda12-cc97-4b0e-ad86-f98786c0938a_2048x1480.jpeg" alt="Complacent person only halfway up a mountain"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Breadth ↔️
&lt;/h2&gt;

&lt;p&gt;So what is breadth? Breadth is the opposite to depth.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Breadth is the extent of how broad or wide your knowledge base spans in a particular area.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Whereas depth on the other hand is &lt;strong&gt;the extent or expertise you know about a particular topic in that area.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;For example, breadth might be about how much you know about the automotive industry.&lt;/p&gt;

&lt;p&gt;You might know a little bit about cars, the sales process, the manufacturing process, who the big players are - you get the picture.&lt;/p&gt;

&lt;p&gt;That’s the breadth of your knowledge - you might not know a lot about all those things, but you know enough about them to hold a conversation or understand their basics.&lt;/p&gt;

&lt;p&gt;Depth on the other hand, would be how much you knew about anyone of those individual topics. For example, you might have a great deal of depth on the manufacturing process of cars. You might be an industry expert.&lt;/p&gt;

&lt;p&gt;But on the other hand you might have a small amount of depth of knowledge on the sales process.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--bmu5khuL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fe38f5ded-2b0e-40b1-9bef-77a9e1849096_1817x1323.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--bmu5khuL--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://cdn.substack.com/image/fetch/c_limit%2Cf_auto%2Cq_auto:good/https%253A%252F%252Fbucketeer-e05bbc84-baa3-437e-9518-adb32be77984.s3.amazonaws.com%252Fpublic%252Fimages%252Fe38f5ded-2b0e-40b1-9bef-77a9e1849096_1817x1323.png" alt="image showing breadth on x axis and depth on y axis"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Why is breadth important?
&lt;/h2&gt;

&lt;p&gt;Now obviously as an engineer depth is important, but I’d argue that breadth is equally, if not more important.&lt;/p&gt;

&lt;p&gt;Depth is probably what got you the job in the first place write. Your ability to write code in a particular environment.&lt;/p&gt;

&lt;p&gt;It might be backend node.js web applications, it might be a react engineer or a C++ embedded device engineer. Most of that is going to be depth.&lt;/p&gt;

&lt;p&gt;But what really helps you shine as an engineer is breadth.&lt;/p&gt;

&lt;p&gt;To put it simply - your ability to solve a problem is limited by the amount of solutions you know. If you only know one tool, one language or one solution exists, then you are going to most likely use that.&lt;/p&gt;

&lt;p&gt;As the famous quote goes - &lt;em&gt;‘Everything is going to look like a nail if all you have is a hammer’.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Knowing a lot about one small subset of an area is great. But that is the only time you will be useful. Outside of your comfort zone you’ll be lost.&lt;/p&gt;

&lt;h3&gt;
  
  
  A contrived analogy
&lt;/h3&gt;

&lt;p&gt;Let’s there’s a guy named Bob. Now bob is quite the node.js + postgres aficionado. He’s been using them for years and knows them inside out.&lt;/p&gt;

&lt;p&gt;Now Bob has gotten a task, implement a full text search for their entire catalogue of medical records. Just a measley 840gb of data.&lt;/p&gt;

&lt;p&gt;Now as someone with a single hammer at his disposal (postgres) he’s most likely going to jump at using it’s full text search capabilities to solve the problem. Whilst he know’s it doesn’t really scale that well at those volumes - it’s all he knows so it’s all he goes for.&lt;/p&gt;

&lt;p&gt;Had he had greater breadth of knowledge - he’d probably realise that hey - there is a better tool for solving this problem. In fact, he might have been aware of 5 seperate tools, and the tradeoffs associated with each.&lt;/p&gt;

&lt;p&gt;Now he can evaluate each of these tools and come to the conclusion of the best tool for the job.&lt;/p&gt;

&lt;p&gt;Suddenly he’s not trying to put humpty dumpty back together with a hammer, but instead tape and glue.&lt;/p&gt;

&lt;h3&gt;
  
  
  So to answer the original question - why is breadth important?
&lt;/h3&gt;

&lt;p&gt;Because it gives you more options.&lt;/p&gt;

&lt;p&gt;The more you step outside of your comfort zone, the more you learn and expand your technological breadth the more effective of an engineer you’ll be.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>career</category>
      <category>programming</category>
    </item>
    <item>
      <title>There's more than code</title>
      <dc:creator>Harry Lucas</dc:creator>
      <pubDate>Sat, 16 May 2020 12:45:07 +0000</pubDate>
      <link>https://forem.com/harryblucas/there-s-more-than-code-l2j</link>
      <guid>https://forem.com/harryblucas/there-s-more-than-code-l2j</guid>
      <description>&lt;p&gt;&lt;em&gt;I would love your feedback if you have any on what other topics you'd like to see - you can reach me on twitter: &lt;a href="https://twitter.com/@harryblucas"&gt;@harryblucas&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;




&lt;p&gt;Let me paint you a picture.&lt;/p&gt;

&lt;p&gt;Imagine Bob. Friendly guy, knows his stuff. Knows how to get things done.&lt;/p&gt;

&lt;p&gt;Lone wolf type. Headphones on. Slack = Do not disturb.&lt;/p&gt;

&lt;p&gt;Moves tickets from to do -&amp;gt; in progress -&amp;gt; review before you've even finished you're coffee.&lt;/p&gt;

&lt;p&gt;You give him a feature and you know it's going to get done. And done well. Pull requests are a bit big and his Git hub profile is showing a strong gravitation towards the commit axis, but hey, it's all worth it in the end.&lt;/p&gt;

&lt;p&gt;Dream developer right?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;✅ Finishes features on time&lt;/li&gt;
&lt;li&gt;✅ Focuses throughout the day&lt;/li&gt;
&lt;li&gt;✅ Quality code&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/uKPkgG7Utcd6E/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/uKPkgG7Utcd6E/giphy.gif" alt="Thats a lie"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Whilst Bob seems to be doing some solid, A+ "pat on the back" work, he needs to realise there is more to being a good developer than just pumping out features.&lt;/p&gt;

&lt;p&gt;Developers work in teams. Teams move together.&lt;/p&gt;

&lt;p&gt;For every 700+ line PR he pumps out, he's just taken an hour out of a team mates day.&lt;/p&gt;

&lt;p&gt;Every PR he doesn't review, has just fallen onto the lap of another team member. Now they can't focus on their features.&lt;/p&gt;

&lt;p&gt;Whilst the team is discussing an important architectural change, Bob's got his headphones on.&lt;/p&gt;

&lt;p&gt;Worst of all, is the opportunity cost that's lost with the way Bob works. By himself he can contribute 2x as any other team member. That's fantastic.&lt;/p&gt;

&lt;p&gt;But what if Bob spent time &lt;em&gt;helping&lt;/em&gt; and &lt;em&gt;leveling up&lt;/em&gt; is other team members. Helping them fill in gaps in their knowledge. Showing them better patterns, abstractions. Setting up tools to help them work faster, leaving &lt;strong&gt;insightful&lt;/strong&gt; feedback on their PRs.&lt;/p&gt;

&lt;p&gt;What if Bob helped his &lt;em&gt;whole&lt;/em&gt; team become just as effective as him. Suddenly, instead of 1 person contributing 2x, we have 5 people contributing 2x.&lt;/p&gt;

&lt;p&gt;Now you don't have a 10x developer.&lt;/p&gt;

&lt;p&gt;You've got a 10x team, and that is 10x more valuable.&lt;/p&gt;

&lt;h1&gt;
  
  
  Take aways
&lt;/h1&gt;




&lt;p&gt;Think of your team like a rowboat. When someone stops rowing (PR reviews, stuck without help etc.) the boat slows and goes in circles.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Understand that there is more than just number of lines your write. Being apart of a team means exactly that, &lt;em&gt;being apart of a team&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;Smaller PRs are exponentially faster to review than larger once. Reduce the burden on your team.&lt;/li&gt;
&lt;li&gt;Review your team members PRs as soon as soon as you get a chance. Get them rowing again.&lt;/li&gt;
&lt;li&gt;Become a force multipler for your team. One person being 3x is less effective than 2 x 2x person.&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>softskills</category>
      <category>productivity</category>
      <category>motivation</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Explained - Function composition</title>
      <dc:creator>Harry Lucas</dc:creator>
      <pubDate>Mon, 04 May 2020 14:06:58 +0000</pubDate>
      <link>https://forem.com/harryblucas/explained-function-composition-nkj</link>
      <guid>https://forem.com/harryblucas/explained-function-composition-nkj</guid>
      <description>&lt;p&gt;&lt;em&gt;I would love your feedback if you have any on what other topics you'd like to see - you can reach me on twitter: &lt;a class="comment-mentioned-user" href="https://dev.to/harryblucas"&gt;@harryblucas&lt;/a&gt;
&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  What is it?
&lt;/h3&gt;

&lt;p&gt;This is another one of those terms that sounds fancy, but really isn't.&lt;/p&gt;




&lt;p&gt;Function composition is process of &lt;strong&gt;combining two or more functions together&lt;/strong&gt; into a &lt;strong&gt;single function&lt;/strong&gt;, that produces the same result as if the functions were called independently and the result was passed from one to another.&lt;/p&gt;




&lt;p&gt;That's it.&lt;/p&gt;

&lt;p&gt;To break it down - we take two (or more) functions, and pass the result of calling the first function with the supplied argument to the second function and so forth.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;func3&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;func2&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;func1&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;h3&gt;
  
  
  An Example
&lt;/h3&gt;

&lt;p&gt;To simplify it, you can think of a function as an individual Lego block.&lt;/p&gt;

&lt;p&gt;Function composition is then the process of combining one or more of these Lego blocks in to a larger structure.&lt;/p&gt;

&lt;p&gt;For an example, let's pretend we want to take a string, and count how many words start with the letter &lt;code&gt;s&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;First we  create our individual Lego blocks (functions) that we are going to use to build the bigger block (function).&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--w7JD3JDh--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/r56TUSw.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--w7JD3JDh--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/r56TUSw.jpg" alt="Split Lego blocks"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Which in code would be defined as:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;split&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;split&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt; &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;downCase&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;list&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;list&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;map&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;s&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;s&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;toLowerCase&lt;/span&gt;&lt;span class="p"&gt;())&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;countS&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;list&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;list&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;reduce&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;word&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;word&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;s&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Since these blocks are all the same shapes and have matching side - we can combine them together 💪&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--X4TPCG5u--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/Cs3VyOQ.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--X4TPCG5u--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://i.imgur.com/Cs3VyOQ.jpg" alt="Combined Lego blocks"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;To do this in code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;wordsStartWithS&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;countS&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;downcase&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;split&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)))&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;To read a function composed like this, you read it inside out.&lt;/p&gt;

&lt;p&gt;However this isn't as clear as it could be, so instead to make it a bit clearer, what a lot of functional programmers will do is introduce a &lt;code&gt;compose&lt;/code&gt; or &lt;code&gt;pipe&lt;/code&gt; function, which is super simple and makes the above, even clearer. To read an example of what a pipe function is you can &lt;a href="https://struggling.dev/pipe-functions-explained"&gt;click here&lt;/a&gt;.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;pipe&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(...&lt;/span&gt;&lt;span class="nx"&gt;fns&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;initValue&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;fns&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;reduce&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;val&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;func&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;func&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;val&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt; &lt;span class="nx"&gt;initValue&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Then we would use it like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;wordsStartWithS&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;pipe&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="nx"&gt;split&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;downcase&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;countS&lt;/span&gt;
&lt;span class="p"&gt;)(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Which is now a very readable function declaration that reads like a recipe when cooking (split then downcase then count), &lt;strong&gt;all without a variable assignment&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Again just to reiterate what we've done here is combine multiple, smaller functions, into a single larger function.&lt;/p&gt;

&lt;p&gt;Now of course this isn't the most robust example, but it is a start for getting your head around exactly what function composition is.&lt;/p&gt;

&lt;h3&gt;
  
  
  When should I use it?
&lt;/h3&gt;

&lt;p&gt;You can use function composition to compose your entire application together. You can take your smallest functions and combine them together into larger business cases, you can then combine these functions together with other business cases to build a use case -  you get the picture - it's just functions all the way down.&lt;/p&gt;

&lt;p&gt;The great thing about adopting more of a function composition mindset is that it forces you to break apart your functions into their smallest component pieces.&lt;/p&gt;

&lt;p&gt;This promotes composability, reuse and is in my opinion much easier to read.&lt;/p&gt;

&lt;p&gt;For example, if we wrote this the traditional way:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;wordsStartWithS&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;split&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt; &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;map&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;s&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;s&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;toLowerCase&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;reduce&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;word&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;word&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;s&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Whilst we have gained the benefit of having it all in one line, we have:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Made it harder to read (lots of extra noise)&lt;/li&gt;
&lt;li&gt;Harder for the reader to grok intent (they have to parse every single method call to figure out what it's doing)&lt;/li&gt;
&lt;li&gt;Removed any possibility of reusing those component parts (which leads&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>functional</category>
      <category>basics</category>
      <category>softwareengineering</category>
    </item>
  </channel>
</rss>
