<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:atom="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/" version="2.0">
    <channel>
        
        <title>
            <![CDATA[ learning to code - freeCodeCamp.org ]]>
        </title>
        <description>
            <![CDATA[ Browse thousands of programming tutorials written by experts. Learn Web Development, Data Science, DevOps, Security, and get developer career advice. ]]>
        </description>
        <link>https://www.freecodecamp.org/news/</link>
        <image>
            <url>https://cdn.freecodecamp.org/universal/favicons/favicon.png</url>
            <title>
                <![CDATA[ learning to code - freeCodeCamp.org ]]>
            </title>
            <link>https://www.freecodecamp.org/news/</link>
        </image>
        <generator>Eleventy</generator>
        <lastBuildDate>Thu, 21 May 2026 04:58:30 +0000</lastBuildDate>
        <atom:link href="https://www.freecodecamp.org/news/tag/learning-to-code/rss.xml" rel="self" type="application/rss+xml" />
        <ttl>60</ttl>
        
            <item>
                <title>
                    <![CDATA[ How to Make Flowcharts and Bring Joy to your Coding ]]>
                </title>
                <description>
                    <![CDATA[ Coding can be intense. Especially when you are knee-deep in debugging or trying to map complex projects. For many developers — novice and pros alike — it is not uncommon to spend hours staring at code, looking for answers that won’t come. You may hav... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/how-to-make-flowcharts-with-mermaid/</link>
                <guid isPermaLink="false">67852099c122b063bd5743eb</guid>
                
                    <category>
                        <![CDATA[ flow diagrams ]]>
                    </category>
                
                    <category>
                        <![CDATA[ coding tips ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Learning Journey ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ effective coding ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ evaristo.c ]]>
                </dc:creator>
                <pubDate>Mon, 13 Jan 2025 14:18:01 +0000</pubDate>
                <media:content url="https://cdn.hashnode.com/res/hashnode/image/upload/v1736777856399/98a5d535-280e-4496-b0fb-67ad5a1b401d.png" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>Coding can be intense. Especially when you are knee-deep in debugging or trying to map complex projects. For many developers — novice and pros alike — it is not uncommon to spend hours staring at code, looking for answers that won’t come.</p>
<p>You may have tried every trick you know but still feel lost. But have you tried creating a visual representation of the problem so you can see how the code actually works?</p>
<p>I’m talking about using a <strong>flowchart</strong>.</p>
<p>In this article, you’ll learn how flowcharts work along with some common symbols and labels you can use in your flowcharts. We’ll also discuss some popular diagramming tools you can use to create flowcharts more easily. Finally, we’ll walk through how to actually build a flowchart so you can start using them in your projects.</p>
<h3 id="heading-table-of-contents">Table of Contents</h3>
<ul>
<li><p><a class="post-section-overview" href="#heading-what-is-a-flowchart">What is a Flowchart?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-a-flowcharts-symbology-the-limitations-of-symbols-and-solutions">A Flowchart’s Symbology, the Limitations of Symbols, and Solutions</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-common-symbols-and-labels-used-in-flowcharts">Common Symbols and Labels Used in Flowcharts</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-add-shapes-to-your-flowchart-generalization-vs-refinement">How to Add Shapes to Your Flowchart: Generalization vs Refinement</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-popular-diagramming-tools-for-creating-flowcharts">Popular Diagramming Tools for Creating Flowcharts</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-build-a-flowchart-methodology-and-example">How to Build a Flowchart – Methodology and Example</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-conclusion">Conclusion</a></p>
</li>
</ul>
<h2 id="heading-what-is-a-flowchart">What is a Flowchart?</h2>
<p>Simply put, a flowchart is a diagrammatic representation of an algorithm. It’s called a <em>flow</em>chart because it not only represents the steps but also depicts the direction the “job” flows as tasks are transferred to the next entity.</p>
<p>In many cases, a flowchart is considered part of a larger family of diagrams, usually referred to as <strong>flow diagrams</strong>. And although both names are commonly used, we’ll stick to the use of flowcharts to represent algorithms for now.</p>
<p>Here’s an example of a flowchart:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1732568840505/37302d26-7815-468c-86cf-45fbae2e843a.webp" alt="An example of a flow diagram from https://www.visual-paradigm.com/tutorials/flowchart-tutorial/" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>You’ll notice that it uses certain different shapes and colors – we’ll discuss these further below.</p>
<h3 id="heading-how-common-are-flowcharts-these-days">How Common Are Flowcharts These Days?</h3>
<p>“<em>Aren’t they from the time of, like, Cobol?</em>” you might ask. Well, yes they are – and from even before that. Flow diagrams were quite popular from their introduction in the 1920’s all the way to the 1970’s. But their use started to fall off soon after that.</p>
<p>So you might wonder: are developers actually using flowcharts – or any kind of diagram – nowadays? I did some quick research across different developer community chats. I found that while not all devs say they use flowcharts, many of them mentioned that they were important in helping them <em>sketch a vizualization</em> of the code or the system.</p>
<p>I also found that senior developers were less interested in the use of diagrams because they usually knew the algorithms or the codebase almost by heart. But newer developers who were exposed to a codebase for the first time, revisiting a forgotten algorithm, or those needing to share some code with others tended to use flowcharts more often.</p>
<h3 id="heading-why-do-devs-use-flowcharts">Why Do Devs Use Flowcharts?</h3>
<p>Here are some of the most common reasons developers use flowcharts these days:</p>
<ul>
<li><p><strong>Focus</strong>: A visual resource to help you think about a problem.</p>
</li>
<li><p><strong>Planning</strong>: Map out your steps before diving in.</p>
</li>
<li><p><strong>Sharing standard processes</strong>: As a tool to facilitate the reading of standard processes.</p>
</li>
<li><p><strong>Communicating and teaching</strong>: Explaining your code to both technical and non-technical people.</p>
</li>
<li><p><strong>Documenting</strong>: Keep track of your work in a way that’s easy to follow.</p>
</li>
<li><p><strong>Analysing existing code</strong>: Break down your code and others’ to see what’s really going on.</p>
</li>
</ul>
<p>Of course, there are other methods you could use to cope with the situations listed above. But there are advantages to using flowcharts over other methods that have to do with the way we process information in our brain.</p>
<p>Still, making flowcharts is an intellectual process that entails some risks, particularly when it comes to clarifying information. So we need the right tools and a methodology to work with them.</p>
<p>In the following sections, we will go through all those points in more detail:</p>
<ul>
<li><p>The semiotic of the flowchart – that is, the use of symbols to convey information. We’ll also discuss the role of the flowchart as an information tool, its limitations, and how to address them.</p>
</li>
<li><p>The most common symbols, their meanings, and how to use them</p>
</li>
<li><p>The intellectual processes of constructing flowcharts and their risks</p>
</li>
<li><p>A methodology to help you reduce those risks</p>
</li>
<li><p>The available tools to create flowcharts with a quick introduction to the one we will use for our examples</p>
</li>
</ul>
<h2 id="heading-a-flowcharts-symbology-the-limitations-of-symbols-and-solutions">A Flowchart’s Symbology, the Limitations of Symbols, and Solutions</h2>
<p>Earlier, I defined a flowchart as a diagram of sequences of steps, or <strong>workflow</strong>, of an algorithm. But we can also understand the flowchart as a “language”: when using a flowchart, we are translating the description of an algorithm from a verbal / textual language to a more symbolic one.</p>
<p>In other words, we can define a flowchart as a visualization of a streamlined workflow where we identify steps and relations by substituting meaningful symbols for verbal / textual descriptions.</p>
<h3 id="heading-how-symbols-work">How Symbols Work</h3>
<p>What are the advantages of using a visualization based on symbols to understand an algorithm?</p>
<p>Physically, our brain has to make more of an effort to extract meaning from either text or numbers than it does from visual attributes and shapes. For example, after some learning and under the relevant context, it is easy to get the meaning of this street sign:</p>
<p><img src="https://media-studies.com/wp-content/uploads/2021/07/barthes-road-sign-268x225.jpg" alt="children crossing road sign from https://media-studies.com/triadic-model-semiotics/" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>This sign may work better than writing a board explaining that drivers should be careful as there are kids crossing the road.</p>
<p>In our example, if you have to pause to read the explanatory board, by the time you learn what the message is it could be too late. But our brain makes a faster evaluation of the situation when presented with the sign after some training.</p>
<p>Also, visual attributes and shapes can not only refer to concrete, tangible objects, but also to <em>concepts and actions</em>. For example, if you have done arithmetics before, you’ll know the meaning of the following symbols:</p>
<p><img src="https://b2990823.smushcdn.com/2990823/wp-content/uploads/2021/11/86-860869_math-math-symbol-math-clip-art-1-300x251.png?lossy=1&amp;strip=1&amp;webp=1" alt="Math arithmetic operators like multiplication, subtraction, division, and so on (Image from https://onlinemathcenter.com/blog/math/math-symbols-and-their-meanings-part-i-arithmetic-operators/)" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>When we use a symbol to convey meaning, whether concrete or intangible, we usually talk about <a target="_blank" href="https://en.wikipedia.org/wiki/Semiosis"><strong>semiosis</strong></a>. Semiosis is the process of producing and interpreting signs and symbols to convey meaning. It involves the interaction between a symbol, its meaning, and the person or machine interpreting it. This process is central to the communication, understanding, and creation of knowledge in both people and machines.</p>
<p>Symbolic communication takes advantage of our innate visual processing skills. This helps reduce the need for long-winded explanations because the observer has learned somehow what the sign means. Instead of “semiosis”, some people prefer the term <strong>abstraction</strong> to refer to the same process.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736344070987/cede4eac-ca8c-4fa9-9a76-280d08f655d7.png" alt="Model of Semiotics Theory, from https://opentext.wsu.edu/theoreticalmodelsforteachingandresearch/chapter/semiotic-theory/" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>That it is what we do with flowcharts: abstracting meanings through symbols.</p>
<p>The value of semiotics in a visualization is substantial. Using meaningful symbols in a visualization such as a flowchart allows you and your audience to <em>focus on patterns</em> that written text, such as code or a script, can’t easily tell or describe.</p>
<p>And that is where the power of visualizations like flowcharts resides.</p>
<p>But flowchart symbols are not operators like you’d find in mathematics. Rather, they’re <em>representations.</em> In fact, they might represent something <em>specific to the person who draws them</em>.</p>
<p>Because of this, the symbols alone are often insufficient to fully convey abstract concepts. For example, the term "database” can represent many types of systems or technologies, and can have many different setups and uses. Also, as technology evolves, some symbols may lose their relevance.</p>
<p>To address this, clear textual explanations should accompany the shapes, ensuring the flowchart remains meaningful and avoids vagueness. You can also add styling and even images to strengthen the symbols’ meaning.</p>
<h2 id="heading-common-symbols-and-labels-used-in-flowcharts">Common Symbols and Labels Used in Flowcharts</h2>
<p>When creating a flowchart, you can use custom symbols, but it’s typically a good idea to stick to certain conventions. Conventions ensure better communication as well as consistency of messaging across different flowcharts.</p>
<p>The <a target="_blank" href="https://the9000store.com/articles/iso-9000-tips-iso-9001-flowchart-basics/">ANSI/ISO standards</a> list more than 30 recognized flowchart <strong>shapes</strong>, though their usage isn’t strictly regulated. This allows vendors and developers to agree on best practices.</p>
<p>Since these symbols require textual and styling support anyway, some devs argue that you can reduce the number of shapes to a “necessary few” versatile symbols instead. I refer to these as "wildcards”. Wildcards can represent broader abstractions when paired with clear text and or styling. But don’t hesitate to use other standard symbols if you think that they bring more clarity to your flowchart.</p>
<p>For our example, we will focus on the most common shapes. Some of the most common and most versatile shapes are:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1733765176295/06d45bcd-38c1-4c88-854d-c91bdb7e0a7c.jpeg" alt="Main flowchart shapes table. Image from https://www.smartdraw.com/flowchart/flowchart-symbols.htm" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>As you can see in the table above, we have the following shapes:</p>
<ul>
<li><p>Oval (a start or end point)</p>
</li>
<li><p>Arrow (a connector that shows relationships between shapes)</p>
</li>
<li><p>Parallelogram (an input or output)</p>
</li>
<li><p>Rectangle (a process)</p>
</li>
<li><p>Diamond (a decision)</p>
</li>
</ul>
<p>Let’s go through each of these now and examine how they work and how to use them.</p>
<h3 id="heading-the-terminator-oval-shape">The Terminator (Oval) Shape</h3>
<p>This is the oval shape, called the start/end shape. It marks the starting and ending points of the process/system. The oval indicates the beginning or end result of the workflow, and the potential outcomes of a path.</p>
<p>Many devs use the oval shape, along with the words “start” and “end/stop/finish” for clarity.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736344293041/43e89861-4443-4335-9b56-8db1f35955a1.jpeg" alt="Start and Stop points using ovals" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>Some people prefer to use a single circle to represent the start and a double circle to represent the end of a flowchart:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736354321682/7d3639b1-bba8-4708-9d3b-2ea401d20973.jpeg" alt="Start and End points using circles" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>I personally prefer the circle – but it’s up to you. Just make sure you pick one and stick with it for consistency.</p>
<h3 id="heading-the-arrow-or-flowline-shape">The Arrow or Flowline Shape</h3>
<p>Also called the link or the edge by vendors and practitioners, this shape represents the connection between two steps. Also depending on its shape, it might indicate if that flow is broken, failed, or if it is an alternate path or process, and more.</p>
<p>The most common representation is the <strong>arrow</strong>, which indicates the direction of the workflow between two steps. The arrow points in the direction of the next step in the process.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736354396382/0f2d6f70-3f8c-426f-8231-fab1f3db599e.jpeg" alt="Flowline as arrow shape" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>When working with flowcharts, I accompany arrow flowlines and any other flowline with concise descriptions about the next step, sometimes with information about variables and, when it makes sense, the current state.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736354505571/78beea08-63bb-4149-952a-960c4a7756f1.jpeg" alt="An arrow shape with labelling" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h3 id="heading-the-process-rectangle-shape">The Process (Rectangle) Shape</h3>
<p>You can represent a process using a rectangle in a flowchart. It’s also referred to as a box:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736355468300/d159a2b0-92fa-4df2-abaa-4402953208a5.jpeg" alt="Process shape" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>A box can represent a <strong>single step</strong>, like an expression (for example, <code>x = y*x²</code>), a <strong>entire block statement</strong>, like “<code>loop through array and update values by multiplying by 2</code>”, or an <strong>entire sub-process</strong>, like an existing function or even a module.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736355653833/3d88a287-7966-45ef-9a65-460422d4c2f9.jpeg" alt="Process shapes with different labels" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>The process shape is a proper wildcard and it can morph into many things, so it’s important to add a label to it and using text or other resources like formatting to clarify its meaning.</p>
<h3 id="heading-the-decision-diamond-shape">The Decision (Diamond) Shape</h3>
<p>The decision is represented by a diamond. It is an abstraction for a <strong>condition’s test</strong>, a YES/NO, or TRUE/FALSE question. It is the equivalent of an IF/ELSE statement in coding.</p>
<p>The text accompanying this shape is a question formulating a comparison between an entering value and a control value. The flowchart usually splits into different branches depending on the answer or consequences after you use the decision shape:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736355725641/90042033-abc1-42a2-9c06-883d8f09e686.jpeg" alt="Decision shape with two branches" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>The result of the decision box determines the next step in the process workflow. It’s usually declared to only answer a simple question, but you can abstract the question so it looks similar to an IF/ELSE IF/ … /ELSE control statement in coding, with lines representing different decisions.</p>
<p>When one of the flows returns to the decision shape from where it left, we are talking about <strong>a loop</strong>:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736355864209/0f4b5cb4-b81c-482c-8d22-74854bf28d64.jpeg" alt="Decision shape with two branches, one of them in a loop" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>The interpretation is like asking to test the condition again after going through some steps along a specific workflow branch, then checking if the answer has changed.</p>
<h3 id="heading-the-inputoutput-parallelogram-shape">The Input/Output (Parallelogram) Shape</h3>
<p>You can use the parallelogram shape as an abstraction for data that’s available for input or output or for resources used or generated. It indicates that some information is required at this point in the workflow.</p>
<p>The input/output shape is typically accompanied by the following text:</p>
<ul>
<li><p>Either “input” or “output”, so you know which is being represented. You can also write other similar words like “get” / “put”, “in” / “out”, and so on.</p>
</li>
<li><p>An input or an output could be related to a variable that you are planning or you already have in your code. If that variable should have an expected type when either entering as input or output, I would also add the type.</p>
</li>
<li><p>Its corresponding state, as long as it provides more clarity to the flowchart.</p>
</li>
<li><p>Optionally, it would be also useful to mention the source of the input / output. Is it a dataset? A manual entry? A form? Will it be printed in the console?</p>
</li>
</ul>
<p>Notice that the whole point of the use of this shape is to trace the entry or the exit of data into or out of the process. Therefore, this shape is valuable when you want to have at least an idea of data exchange.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736355986275/e19e64b8-0b85-4ee8-aff7-333b1d0fd6e5.jpeg" alt="Input / Output shape with label" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>Finally, a less common symbol, but one that I use often is…</p>
<h3 id="heading-the-preparation-hexagon-symbol">The Preparation (Hexagon) Symbol</h3>
<p>The preparation symbol is represented by an hexagon and it abstracts the setup for the following step. I usually use this shape to declare all the initial conditions when the workflow begins. I accompany this shape with a list of variables, their types, and even functions or initial event settings, like event listeners, together with their initial values.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736356077330/05e0e186-ddf8-40e7-bfc5-ea859e7d86ae.jpeg" alt="Preparation shape with label" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h2 id="heading-how-to-add-shapes-to-your-flowchart-generalization-vs-refinement">How to Add Shapes to Your Flowchart: Generalization vs Refinement</h2>
<p>Now that you understand the basics of the symbols, you may be wondering how to insert them into the diagram.</p>
<p>Especially for large diagrams, you’ll want to be very intentional about adding shapes. You’ll need to make careful decisions about placing and the number of shapes you’ll use, otherwise your flowchart could become unreadable.</p>
<p>You’ll need to make decisions about things like:</p>
<ul>
<li><p>where to place the shapes so it results in a tidy flowchart.</p>
</li>
<li><p>which of those shapes are essential to the understanding of the workflow, and which are not.</p>
</li>
</ul>
<p>Placing is perhaps the most difficult task of making a flowchart. If you are manually constructing your flowchart, unfortunately there’s not a simple formula that instructs you where to place the shapes in order to prevent overlapping. It’s up to you to visually resolve the placement and to decide when any overlap makes your diagram unreadable.</p>
<p>As you’ll see later, there are computationally-based solutions for the placing of shapes. But there is a simple rule that applies to all cases: the smaller the flowchart, the easier it is to place the shapes. So reducing the number of shapes and only including the key shapes is key to creating a clear flowchart.</p>
<p>Keep in mind that I’m not suggesting that you try to create the most minimalistic flowchart you can. Just that you try to make the simplest one that conveys enough information to help you understand the workflow.</p>
<h3 id="heading-how-to-choose-which-shapes-to-use">How to Choose Which Shapes to Use</h3>
<p>Deciding which shapes to use can turn into an iterative process of adding, moving, or removing text or symbols into or out of the flowchart.</p>
<p>There are two competing tendencies here: <strong>generalization</strong> and <strong>refinement</strong>.</p>
<p>For example, the next figure shows three different flowcharts that demonstrate how to use a coffee machine:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736368833320/b2e7ad79-8726-4e2d-b114-e0c36520044c.jpeg" alt="Three levels of generalization / refinement of flowcharts of how to use a coffee machine" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>In the image above, you can see that the example on the left is the one with less explanations and fewer shapes, while the one on the right has more details.</p>
<p>In the same way, depending on your needs and the specific details you want to get out of the visualization, the flowchart can be more generalized or it can be more refined. In fact, it might acquire some elements of subjectivity, which usually rely on the <strong>amount of information and knowledge</strong> you have about the process <strong>before</strong> looking at the flowchart.</p>
<h4 id="heading-generalization">Generalization:</h4>
<p>In the case of flowcharts, <strong>generalization</strong>, also known as <em>lifting</em>, is when you enclose several steps into a few words and / or symbols. There are two reasons to use a more generalized approach:</p>
<ol>
<li><p>You and your audience are competent enough to complete the information not provided by the flowchart.</p>
</li>
<li><p>You and your audience don’t know much about that specific step.</p>
</li>
</ol>
<p>In the second case, there are two situations you might be dealing with:</p>
<ol>
<li><p>Even if you don’t know much about that part of the process, you can keep that step generalized because that step plays a small role in providing information that’s essential to you. Or,</p>
</li>
<li><p>The point is critical for you to understand the process, but you and your audience simply don’t know more.</p>
</li>
</ol>
<p>It’s in the second situation when you have to try to “open the box”. And this is done through refinement.</p>
<h4 id="heading-refinement">Refinement:</h4>
<p><strong>Refinement</strong> consists of adding more steps and more words and symbols in order to add more detail to a procedure. It usually follows researching and studying.</p>
<p>When you’re refining your flowchart, this doesn’t necessarily mean that you know absolutely nothing about the procedure. What you’re looking for is something that allows you to point to specific details, and what comes before and what comes next.</p>
<p>But how much generalization is helpful? And how much refinement?</p>
<p>When your flowchart is too general, it results in a simpler visualization but it doesn’t contain much information. You might have to use more words or rely on inner knowledge in order to explain what the chart or a step means. The first flowchart in the previous image is the most generalized of all of them.</p>
<p>The risk of over-generalization is <em>non-information</em>.</p>
<p>The process of refinement involves the opposite risk, and is, in my view, more dangerous. If you don’t control the refinement process, you might end up with an absolute mess, like this:</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1732788718770/657328f7-93b2-40a3-839f-f87bd47c9e76.jpeg" alt="A very messy and overly complex diagram" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>The above diagram isn’t a flowchart, but the risk is the same. The risk of excessive refinement is <em>noise</em>.</p>
<p>There are several rules and mechanisms that help you prevent reaching an unnecessary level of either refinement or abstraction. This is what we are going to learn in the next sections. But first, let’s take a quick look at the available tools you can use to make diagrams and flowcharts.</p>
<h2 id="heading-popular-diagramming-tools-for-creating-flowcharts">Popular Diagramming Tools for Creating Flowcharts</h2>
<p>Now that you know the shapes, what they are for, and have some idea about how to use them, you can start building a flowchart.</p>
<p>But before doing so, I’m going to make a short detour to talk about the tools you can use to build flowcharts.</p>
<p>Nowadays, the options are many. You can use online as well as offline resources. Some are specialized for building diagrams, while others are more general. Some you can access for free, and others are more for enterprise operations and come with high fees.</p>
<p>Below, you’ll find a quick table categorizing some of the dedicated tools I have used in the past or that I have been investigating recently.</p>
<div class="hn-table">
<table>
<thead>
<tr>
<td><strong>Dedicated Solutions for Drawing Flowcharts</strong></td></tr>
</thead>
<tbody>
<tr>
<td></td></tr>
</tbody>
</table>
</div><div class="hn-table">
<table>
<thead>
<tr>
<td>CATEGORY</td><td>HOW</td><td>EXAMPLES (free)</td></tr>
</thead>
<tbody>
<tr>
<td>Drag and Drop</td><td>Shapes are manually dragged into a editor screen, linked with connectors and filled with relevant text.</td><td>draw.io</td></tr>
<tr>
<td>Scriptable</td><td>A script is written with a dedicated syntax for shapes, relationships, and text. The flowchart is automatically rendered and updated after changing the script.</td><td>Mermaid, PlantUML</td></tr>
<tr>
<td>AI-based</td><td>A descriptive prompt or even code is provided to the AI. The AI analyzes the content, usually recoding into a scriptable diagram before rendering it.</td><td>codetoflow.ai, ChatGPT plugins</td></tr>
<tr>
<td>Parser</td><td>Map (binary) code into dedicated graphical solutions based on established syntax rules.</td><td>drgarbagetools for Java in Eclipse, graphdracula for JQuery</td></tr>
</tbody>
</table>
</div><h4 id="heading-no-code-or-low-code-tools">No-code or low code tools:</h4>
<p>The large majority of the existing specialized diagramming tools are designed to help people without coding skills.</p>
<p>When using these types of tools, you have to manually construct the diagram by <strong>dragging-and-dropping</strong> shapes into an (online) editor: you select the shape and move it around until you find your preferred place for it on the screen. There are functionalities to draw the flowlines (“connectors”) also by a dragging action, and you can always edit the shapes to add text or styling.</p>
<h4 id="heading-script-based-tools">Script-based tools:</h4>
<p>But there are also some less well-known tools that have been around for a while that are rising in popularity now: the <strong>script-based</strong> options. With these kinds of tools, you describe the shapes and relationships by scripting them according to the syntax of the tool.</p>
<p>These kinds of tools have the relative advantage that the diagram will be drawn for you on a rendering screen or image. An algorithm will try to find the best place for your shapes on the screen without you having to place them manually.</p>
<h4 id="heading-ai-tools">AI tools:</h4>
<p>Then there are the <strong>AI</strong> tools. Many of those tools are based on the scripting tools. Some of them work as follows:</p>
<ol>
<li><p>the AI interprets either a descriptive prompt or the code itself</p>
</li>
<li><p>Then it translates the prompt into a script using a scriptable diagramming tool</p>
</li>
<li><p>The diagram renders according to the AI-generated code.</p>
</li>
</ol>
<p>I’ve found that these AI tools are still not quite up to the task for more complex projects – but they can come handy if you just want a quick solution. One that I have used is codetoflow.io, but there are also (guess what…) ChatGPT plugins you can use.</p>
<h4 id="heading-parsers">Parsers</h4>
<p>Even before the AI tools came around, there were the parsers. They map steps and relationships into shapes based on well-established syntax rules. Some of those parsers are turning to AI instead, as the AI generators are easier to program and require less maintenance. But sometimes the rule-based parsers can be more precise if the rules they are based on remain without changes.</p>
<p>Some of those tools read on binary code, which is a better proxy to follow the full workflow, something that popular AI tools are not capable of. Some IDEs, like Eclipse, allow you to add plugins to draw a flowchart of your code based on binaries. One example is <a target="_blank" href="https://sourceforge.net/projects/drgarbagetools/">drgarbagetools</a> which works only for Java in Eclipse.</p>
<h4 id="heading-general-purpose-tools">General-purpose tools:</h4>
<p>Apart from those dedicated tools, you can always use others that are not specifically built for diagramming. I have used PowerPoint and Google Slides in the past, and there are other presentation applications that support the ANSI / ISO shapes’ catalogue. You can also use tools like Figma, Miro, or others. There are too many others to list here.</p>
<p>And finally, there is always pen a paper.</p>
<h3 id="heading-our-example-using-mermaidjs">Our Example: Using Mermaid.js</h3>
<p>For the example in this tutorial, I’ll be using one of the scripting tools called Mermaid. One reason for using a script-based tool is the ease with which you can update the flowchart along the way. And this will come in handy when we reach the generalization / refinement step.</p>
<p>Although other tools do not hinder the generalization/refinement process, the fact that you might find yourself redoing the whole flowchart manually could become quite time consuming. With a script-based tool, you can focus mostly on writing down the right relationships and shapes, while you let the program place the shapes for you.</p>
<p>Although I’m using Mermaid here, I’m not prescribing the use of any particular tool for the examples ahead. You can use the one that suits your needs and with which you feel the most comfortable. None of them are perfect, and they all have their own merits.</p>
<p>But if you want to learn more about Mermaid, <a target="_blank" href="https://www.freecodecamp.org/news/use-mermaid-javascript-library-to-create-flowcharts">I’ve written another tutorial for you</a> that’ll give you a general overview of the tool and how to use it. I will also provide the syntax I am using to create the examples so you can try it yourself.</p>
<h2 id="heading-how-to-build-a-flowchart-methodology-and-example">How to Build a Flowchart – Methodology and Example</h2>
<p>When building a flowchart, you can follow these steps:</p>
<ol>
<li><p>Define the scope of your flowchart</p>
</li>
<li><p>Find the start of the workflow</p>
</li>
<li><p>Trace the workflow to the end while using high levels of generalization for the steps</p>
</li>
<li><p>Select what should be refined and what can be left generalized</p>
</li>
<li><p>Iterate: Research. Refine. Test. Research. Refine or Generalize. Test. Research. Refine or Generalize…</p>
</li>
<li><p>Enhance</p>
</li>
<li><p>Extend (optional)</p>
</li>
</ol>
<h3 id="heading-step-1-define-the-scope-of-your-flowchart">Step 1: Define the Scope of Your Flowchart</h3>
<p>It’s important to be clear about what you want to do with your flowchart. Is it representing a full codebase or just a fragment of a script? Is it an algorithm that you want to study or is it an analysis of some existing code? Do you want a detailed explanation of a workflow or just look at the relationships?</p>
<p>Having a clear goal for your flowchart will help you guide its construction.</p>
<p>For this example, we are going to use an exercise from freeCodeCamp’s curriculum:</p>
<pre><code class="lang-javascript"><span class="hljs-keyword">const</span> character = <span class="hljs-string">"#"</span>;
<span class="hljs-keyword">const</span> count = <span class="hljs-number">8</span>;
<span class="hljs-keyword">const</span> rows = [];

<span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">0</span>; i &lt; count; i = i + <span class="hljs-number">1</span>) {
  rows.push(character.repeat(i + <span class="hljs-number">1</span>))
}

<span class="hljs-keyword">let</span> result = <span class="hljs-string">""</span>

<span class="hljs-keyword">for</span> (<span class="hljs-keyword">const</span> row <span class="hljs-keyword">of</span> rows) {
  result = result + row + <span class="hljs-string">"\n"</span>;
}

<span class="hljs-built_in">console</span>.log(result);
</code></pre>
<p>Our purpose here is to understand this code, particularly to gain more insights about the for-loops.</p>
<h3 id="heading-step-2-find-the-start-of-the-workflow">Step 2: Find the Start of the Workflow</h3>
<p>Once you have an idea of what you want to do with your flowchart, try to figure out the point from where the workflow begins. If it involves analyzing existing code, bear in mind that the start of the workflow might not be at the start of your target code. Just keep in mind that whatever triggers the whole procedure, that is an indication that the “start” is there.</p>
<p>The workflow usually starts with the setting of the initial declarations and values, so we could say that our flowchart could start like this for this example:</p>
<pre><code class="lang-mermaid">flowchart TD
start((start)) --&gt; |variable declaration| varDeclaration{{"*character*(str) 
                                          *count*(num) 
                                          *rows*(list) 
                                          *result*(str)"}}
varDeclaration -.-&gt; C["..."]
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736356220066/242c2201-6a0f-45b0-802c-fe5b71551291.jpeg" alt="Step 2: finding the start point" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h3 id="heading-step-3-trace-the-workflow-to-the-end-and-use-high-levels-of-generalization-in-each-step">Step 3: Trace the Workflow to the End and Use High Levels of Generalization in Each Step</h3>
<p>Once you’ve found the starting point, try to systematically trace the workflow steps from start to end. If there are procedures along the way, you can compact them into more generalized steps using no more than two shapes.</p>
<p>The most common shape for depicting a generalized step is the <strong>process shape</strong>. Candidates to keep generalized are functions, control statement blocks like loops or if-statements, modules, or even libraries. Labels of those steps should consist of general descriptions of the things that are happening or should happen at that step.</p>
<p>For our example, we can represent our workflow and in particular the for-loops at a general level like this:</p>
<pre><code class="lang-mermaid">flowchart TD
start((start)) --&gt; |variable declaration| varDeclaration{{"*character*(str) 
                                          *count*(num) 
                                          *rows*(list) 
                                          *result*(str)"}}
varDeclaration --&gt;|"Use *character* and *count* to fill the *rows* list through a for-loop with strings"| forloop01["for-loop01 with *count* as control: str.repeat(*character*) --&gt; *rows*.push(str)"]
forloop01 --&gt; |"Use the updated *rows* list to create a new *result* string"| forloop02["for-loop02 along *rows* items: 
*row* --&gt; 
*result* = *result* + *row* + '\n'"]
forloop02 --print output to the console--&gt; consolelog["console.log(*result*)"]
consolelog --&gt; stop(((stop)))
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736358790514/7416bcdf-bbc4-4386-97f7-27bca59e61d8.jpeg" alt="Step 3: finding the end point and adding general steps" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h3 id="heading-step-4-determine-what-requires-refinement-and-what-to-leave-generalized">Step 4: Determine What Requires Refinement and What to Leave Generalized</h3>
<p>Stop for a while and review the schema you’ve created. Once you have a picture of the whole workflow, you’ll want to decide which sections might require more details.</p>
<p>In our case, we’ll refine the parts of the flowchart that deal with the two for-loops. Describing a for-loop is a typical example when learning to create flowcharts, but I also realized that the two for-loops in our exercise are not of the same type. So I thought it would be interesting to see if the flowchart can reveal how they compare.</p>
<h3 id="heading-step-5-time-to-iterate-research-refine-or-generalize-test-repeat">Step 5: Time to Iterate (Research, Refine or Generalize. Test. Repeat.)</h3>
<p>What you’ve prepared up to Step 4 is a general sketch of the workflow. Now it’s time to dig into the areas where more detail is required. During this process, sometimes you’ll find yourself coming back to an abstraction while looking for the clearest way forward with your flowchart.</p>
<p>There are two things that will help you in this process:</p>
<ol>
<li><p><strong>New Shapes</strong>: this is the time when you may want to use some other shapes. Start with the most common ones. Use other shapes as long as you can give them a clear role in your flowchart and they help you reduce a long explanation about what the replaced shape does.</p>
</li>
<li><p><strong>Text</strong>: Extend the use of text to explain the workflow. It should be more specific to the algorithm itself.</p>
</li>
</ol>
<p>This process ends when you are satisfied with the clarity and level of detail of your flowchart. But there are a best practices that allow you to control the process:</p>
<ul>
<li><p>Try to keep everything to a single page.</p>
</li>
<li><p>Keep the number of shapes to around 20 per page.</p>
</li>
<li><p>Avoid line-crossing more than 4 times. Use connectors when that happens. Having to explain 5 or more connections is likely not a good thing.</p>
</li>
</ul>
<p>After any change, test your flowchart. <strong>Testing</strong> is the most subjective aspect of the methodology. There might not be a way to test the flowchart result against a tangible outcome.</p>
<p>If that makes you uncomfortable, try to think in the following way: the flowchart can be seen as a sort of ordered TODO list or brainstorm notes describing what the code or system should do in order to accomplish a desired task.</p>
<p>A flowchart is similar to this TODO list. But instead of writing all those steps as comments or even pseudo-code, you are using (conventional) symbols.</p>
<p>But barring the advances of AI or any use of <a target="_blank" href="https://en.wikipedia.org/wiki/No-code_development_platform">flow-based programming</a>, comments are not code, no matter how detailed they are.</p>
<p>So the decision of whether the flowchart is working or not is left to you and your audience. The most important question to resolve here is: is the information provided by the flowchart enough to understand what you need to understand about the process? Is it revealing something new? Is it helping you organize your ideas more clearly?</p>
<p>If you are still not satisfied, then repeat the process. But don’t feel like you have to stick to this process alone. You can always stop this effort and look for another way to explain your procedures if you find that a flowchart won’t work for you.</p>
<p>You could facilitate the refining and the clarity of the output by doing some additional research. Try to find how other people describe the procedure you are about to work on. Is there something about the language that you should keep in mind? Whenever possible, don’t start from scratch.</p>
<p>Also, try to be faithful as much as possible to the actual way in which the procedure should be coded, especially if you are refining. But don’t forget that it’s a representation. Feel free to work on a draft when not enough information is available.</p>
<p>Let’s go back to our example. I did some quick research to find out how others might interpret a for-loop in a flowchart. I found <a target="_blank" href="https://en.wikipedia.org/wiki/For_loop#/media/File:For_loop_example.svg">this reference useful</a> to guide my own description:</p>
<p><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d1/For_loop_example.svg/220px-For_loop_example.svg.png" alt="220px-For_loop_example.svg" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>This approach seems to be fairly standard and I will try to include some of those steps in my flowchart. I also found that according to JavaScript documentation, the kind of for-loop we are about to represent repeats <a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">until a specified condition evaluates to false</a>, just like in the flowchart above.</p>
<p>Let’s start by working on the first for-loop only:</p>
<pre><code class="lang-mermaid">flowchart TD
    start((start)) --&gt; |variable declaration| varDeclaration{{"`*character*(str)
    *count*(num)
    *rows*(list)
    *result*(str)`"}}
    varDeclaration --&gt; |**Start First Loop**: entering initial values of *i* and *count*| inputToLoop01[/"`input: 
                                                                                                            *count* = 8
                                                                                                            *i* = 0
                                                                                                            `"/] 
    inputToLoop01 --&gt; forLoop01{"`Is *i* &lt; *count*?`"}
    forLoop01 -.NO: something happens..-&gt; stop(((stop)))
    forLoop01 --&gt; |YES| inputI[/"`input: *i*`"/]
    inputI --&gt; |"`create strings of length (*i* + 1) from *character*`"| repeatStr["**new string** = character.repeat(i+1)"]
    repeatStr --&gt; |"`add newly created string 
            at the end of *rows* list`"| pushToRows["`rows.push(**new string**)`"]
    pushToRows --&gt; |"`bottom of the block: update *i*`"| updateI[/i = i+1/]
    updateI --&gt; |evaluate condition| forLoop01
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736358955713/d7693d1f-1f47-417f-b147-d6f23f7f74c6.jpeg" alt="Step 5: refining; first for-loop" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>Perfect.</p>
<p>Let’s now focus on the second for-loop. It turns out that it’s syntactically different from the previous one. And in fact, there are <a target="_blank" href="https://en.wikipedia.org/wiki/For_loop">different kinds of loops in programming</a>. The one we refined earlier is usually known as the “traditional” one, or better a <em>numeric range</em> type for-loop. The second one is an <em>iterator</em> type for-loop.</p>
<p>An <a target="_blank" href="https://refactoring.guru/design-patterns/iterator">iterator</a> is a functionality that moves incrementally along a group of values or <em>items</em>. That functionality can have subprocesses to initialize the iterator – one to get the current value the iterator is pointing to, as well as a subprocess to go to the next one.</p>
<p>Also, remember that a for-loop stops repeating a workflow branch as soon as the condition evaluates to <code>false</code>.</p>
<p>Let’s try to reflect all this knowledge when refining the second for-loop. I will generalize the first for-loop for the sake of clarity:</p>
<pre><code class="lang-mermaid">flowchart TD
    start((start)) --&gt; |variable declaration| varDeclaration{{"`*character*(str)
    *count*(num)
    *rows*(list)
    *result*(str)`"}}
    varDeclaration --&gt; |**Start Range-Based Loop**: entering initial values of *i* and *count*| forLoop01["Range-Based For-Loop"]
    forLoop01 -- enter Iterator-Based For-Loop --&gt; inputToLoop02[/"`INPUT:
                                                                *rows* (list of str of size *count*)
                                                                *result* (empty str)`"/]
    something --&gt; stop(((stop)))
    inputToLoop02 --&gt; forLoop02{"`Are there still *rows*' items?`"}
    forLoop02 --&gt; |YES: get the current one| row[/"GET: *row* = currentItem(*rows*)"/]
    row --&gt; |"concatenate the current *row* item plus a line (\n) to the current value of *result*"| newStr["**new string** = *result* + *row* + '\n'"]
    newStr --&gt; |change the value of *result* for **new string**|newRes[*result* = **new string**]
    newRes --&gt; |"`bottom of the block: move to next item`"| updateR[/"nextItem(*rows*)"/]
    updateR --&gt; forLoop02
    forLoop02 --&gt; |NO: we exhausted all the items| something
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736363492801/fe1199c8-edba-4e5b-9874-3bf151cc0d48.jpeg" alt="Step 5: refining; second for-loop" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<p>Now we have a clear flowchart for each of the for-loops! We had to first understand what the loops were about, and then had to find a way to represent them. We used refinement and generalization to expand / contract the information rendered by the flowchart.</p>
<p>At the end, we just have to accept that these are still approximations — in order to get how those for-loops <em>really</em> work, we would have to go learn more about JavaScript, probably looking through the JavaScript source code, or even closer to the machine by analysing binaries. But I’m personally satisfied with the information I got from the analysis.</p>
<p>Now after making these changes, we can come back and merge both flowcharts (for each of the for-loops) to complete the full representation of the code:</p>
<pre><code class="lang-mermaid">flowchart TD
    start((start)) --&gt; |variable declaration| varDeclaration{{"`*character*(str)
    *count*(num)
    *rows*(list)
    *result*(str)`"}}
    varDeclaration --&gt; |**Start Range-Based For-Loop**: entering initial values of *i* and *count*| inputToLoop01[/"`INPUT: 
                                                                                                            *count* = 8
                                                                                                            *i* = 0
                                                                                                            `"/] 
    inputToLoop01 --&gt; forLoop01{"`Is *i* &lt; *count*?`"}
    forLoop01 --&gt; |YES| inputI[/"`GET: *i*`"/]
    inputI --&gt; |"`create strings of length (*i* + 1) from *character*`"| repeatStr["**new string** = character.repeat(i+1)"]
    repeatStr --&gt; |"`add newly created string 
            at the end of *rows* list`"| pushToRows["`rows.push(**new string**)`"]
    pushToRows --&gt; |"`bottom of the block: update *i*`"| updateI[/i = i+1/]
    updateI --&gt; |evaluate condition| forLoop01
    forLoop01 --&gt;|NO| outputRows[/"`OUTPUT: *rows* list of string items of size *count*`"/]
    outputRows --&gt; |**Start Iterator-Based For-Loop**: entering initial values of *rows* and *result*| inputToLoop02[/"`INPUT:
                                                                *rows* (list of str of size *count*)
                                                                *result* (empty str)`"/]
    inputToLoop02 --&gt; forLoop02{"`Are there still *rows*' items?`"}
    forLoop02 --&gt; |YES: get the current one| row[/"GET: *row* = currentItem(*rows*)"/]
    row --&gt; |"concatenate the current *row* item plus a line (\n) to the current value of *result*"| newStr["**new string** = *result* + *row* + '\n'"]
    newStr --&gt; |change the value of *result* for **new string**|newRes[*result* = **new string**]
    newRes --&gt; |"`bottom of the block: move to next item`"| updateR[/"nextItem(*rows*)"/]
    updateR --&gt; forLoop02
    forLoop02 --&gt; |NO: we exhausted all the items| outputResult[/"`OUTPUT: *result* (str)`"/]
    outputResult --&gt; |"`display *result* on the console`"|displayResult["`console.log(*result*)
            fa:fa-display`"]
    displayResult --&gt; stop(((stop)))
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736364028135/12ea16c2-69ea-4a1d-9eb4-57025b3aa205.jpeg" alt="Step 5: complete flowchart of the example code" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h3 id="heading-step-6-enhance-the-flowchart">Step 6: Enhance the Flowchart</h3>
<p>Sometimes, specially with large flowcharts, the repeated use of similar shapes requires additional enhancement to provide more clarity. Normally you won’t quite know what you need to enhance until you have the full picture of something more final.</p>
<p>One way to do this is by grouping sections of the workflow. For that, you can use styling, like coloring the shapes, to highlight similar or related steps. It can also be helpful to highlight elements in the workflow that are really playing a fundamental role in the analysis.</p>
<p>You can also create groups of sub-procedures by boxing them (that is, placing a box around related elements of the flowchart).</p>
<p>Let’s apply some enhancements to our final flowchart by boxing and coloring:</p>
<pre><code class="lang-mermaid">flowchart TD
    start((start)) --&gt; |variable declaration| varDeclaration{{"`*character*(str)
    *count*(num)
    *rows*(list)
    *result*(str)`"}}
    varDeclaration --&gt; |**Start Range-Based For-Loop**: entering initial values of *i* and *count*| inputToLoop01[/"`INPUT: 
                                                                                                            *count* = 8
                                                                                                            *i* = 0
                                                                                                     `"/]:::input 
    subgraph RANGE_BASED_LOOP
    inputToLoop01 --&gt; forLoop01{"`Is *i* &lt; *count*?`"}
    forLoop01 --&gt; |YES| inputI[/"`GET: *i*`"/]:::get
    inputI --&gt; |"`create strings of length (*i* + 1) from *character*`"| repeatStr["**new string** = character.repeat(i+1)"]
    repeatStr --&gt; |"`add newly created string 
            at the end of *rows* list`"| pushToRows["`rows.push(**new string**)`"]
    pushToRows --&gt; |"`bottom of the block: update *i*`"| updateI[/i = i+1/]:::input
    updateI --&gt; |evaluate condition| forLoop01
    end
    forLoop01 --&gt;|NO| outputRows[/"`OUTPUT: *rows* list of string items of size *count*`"/]:::output
    outputRows --&gt; |**Start Iterator-Based For-Loop**: entering initial values of *rows* and *result*| inputToLoop02[/"`INPUT:
                                                                *rows* (list of str of size *count*)
                                                                *result* (empty str)`"/]:::input
    subgraph ITERATOR_BASED_LOOP
    inputToLoop02 --&gt; forLoop02{"`Are there still *rows*' items?`"}
    forLoop02 --&gt; |YES: get the current one| row[/"GET: *row* = currentItem(*rows*)"/]:::get
    row --&gt; |"concatenate the current *row* item plus a line (\n) to the current value of *result*"| newStr["**new string** = *result* + *row* + '\n'"]
    newStr --&gt; |change the value of *result* for **new string**|newRes[*result* = **new string**]
    newRes --&gt; |"`bottom of the block: move to next item`"| updateR[/"nextItem(*rows*)"/]:::input
    updateR --&gt; forLoop02
    end
    forLoop02 ---&gt; |NO: we exhausted all the items| outputResult[/"`OUTPUT: *result* (str)`"/]:::output
    outputResult --&gt; |"`display *result* on the console`"|displayResult[/"`console.log(*result*)
            fa:fa-display`"/]
    displayResult --&gt;|finish| stop(((stop)))

    style start fill:black, color:#fff
    style displayResult fill: #DFFF73
    style stop fill:grey, color:#fff, stroke: white
    classDef input fill:#F8D192
    classDef get fill:#F8D062
    classDef output fill:#ECF892
</code></pre>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1736364525277/56399b5f-c967-425e-8a74-bd33c98e8411.jpeg" alt="Step 6: Flowchart after styling" class="image--center mx-auto" width="600" height="400" loading="lazy"></p>
<h3 id="heading-step-7-extend-the-flowchart">Step 7: Extend the Flowchart</h3>
<p>This step is optional. If you have done what you can to keep the flowchart as clear as possible – but you are finding that it still needs more refinement – you may be dealing with a complex process.</p>
<p>In this case, it’s time to think about a separate flowchart to continue or extend the one you are working on. There are ways to indicate the connection between pages. You can also show a section of a flowchart as a generalization and show a more refined flowchart on a separate pages using references.</p>
<p>I won’t go into the details of how to do that here, as this article is long enough as it is. And in this case, I think we can keep our flowchart to just one page, so I won’t go further with creating new pages for it.</p>
<p>So we are done!</p>
<h2 id="heading-conclusion">Conclusion</h2>
<p>When making a flowchart, we are not looking to imitate our code. Rather, we’re looking to <em>understand it</em>. This means that the flowchart has to be <em>clear</em>.</p>
<p>And if you use your flowcharts correctly, along with the right tools, they can help you reveal patterns and hidden operations, as well as stay organized, reduce overwhelm, and ultimately make coding feel more manageable. This will ultimately improve your coding skills and your state of mind.</p>
<p>So give flowcharts a try — you might be surprised at how much they can help you out.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ Practice Your Coding Skills by Building a Program in Different Ways ]]>
                </title>
                <description>
                    <![CDATA[ While we have 365 days in other years, this year (2024) is special because it has one ‘extra’ day.  So in the spirit of Leap Day, let's practice some coding to understand various aspects of programming. We'll focus on the same program but from differ... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/practice-coding-skills-by-building-a-program-different-ways/</link>
                <guid isPermaLink="false">66c37466159a4cde589f8ce0</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ General Programming ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Niladri S. Jyoti ]]>
                </dc:creator>
                <pubDate>Mon, 04 Mar 2024 15:39:55 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2024/03/Build-A-Leap-Year-Program-in-Many-Different-Ways-1.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>While we have 365 days in other years, this year (2024) is special because it has one ‘extra’ day. </p>
<p>So in the spirit of Leap Day, let's practice some coding to understand various aspects of programming. We'll focus on the same program but from different perspectives. </p>
<p>Our example program will explore different ways you can code a program that determines whether a given year is a leap year. On other days, we code. But today, let’s decode what we do and get some extra knowledge out of that process.</p>
<h3 id="heading-table-of-contents">Table of Contents</h3>
<ul>
    <li><a href="#program-requirements">Program Requirements &amp; Prerequisites</a></li>
    <li><a href="#logical-approaches">Logical Approaches to Solving the Problem</a></li>
    <ul>
        <li><a href="#naive-approach">My Naïve Approach</a></li>
        <li><a href="#single-return">Reassignments and a Single Return Statement</a></li>
        <li><a href="#switch-case">Switching to Switch-Case from If-Else</a></li>
        <li><a href="#logical-deduction">Logical Deduction &amp; Subsets for Better Structure</a></li>
        <li><a href="#combine-conditions">Logical Operators Combining All True Conditions</a></li>
        <li><a href="#ternary-operator">Applying Nitro with the Ternary Operator</a></li>
        <li><a href="#arrow-function">Making it a Single Line Arrow Function</a></li>
    </ul>
    <li><a href="#programming-paradigm">Paradigm Shift: Declarative Programming</a></li>
    <ul>
        <li><a href="#side-effects">Functions with Side Effects</a></li>
        <li><a href="#functional-programming">More About Functional Programming</a></li>
        <li><a href="#short-circuiting">Side-Tracking: Short-Circuiting!</a></li>
        <li><a href="#declarative-programming">Encapsulation and Declarative Programming</a></li>
    </ul>
    <li><a href="#code-quality">Going Above &amp; Beyond with Code Quality</a></li>
    <ul>
        <li><a href="#validations">Validations: Beyond the Basic Specifications</a></li>
        <li><a href="#unit-testing">Testing it Out From the Outside</a></li>
    </ul>
    <li><a href="#end-note">End Note</a></li>
</ul>

<h2 id="program-requirements">Program Requirements &amp; Prerequisites</h2>

First, let’s discuss the requirements and set the specifications. The program should be able to get a year (expects a number, an integer to be specific) as an argument and returns either true or false (a boolean) depending on if it is a leap year or not. 

Through the examples, we will focus on the program logic (semantics) rather than the language (syntax). 

Over the years, I have used JavaScript most frequently so we'll use this language for the project. If you use a different language, no worries because many concepts are common between programming languages. For example, in this article, we would use arrow function which is similar to lambda function used in some other programming languages, such as Python.

So, as prerequisites, you should have a basic knowledge of programming and should be comfortable with the concepts of functions (different ways to define and call functions, return values, and so on) and conditional logic (if-else, switch-case, and so on). That would be enough to follow along, for the most part, if you want to read and try the code for yourself.

Just in the last bit, we also do unit testing of our code. If you aren't familiar with unit testing, here is a good refresher on <a target="_blank" href="https://dev.to/dstrekelj/how-to-write-unit-tests-in-javascript-with-jest-2e83">how to write unit tests in JavaScript with Jest</a>. 

<h2 id="logical-approaches">Logical Approaches to Solving the Problem</h2>

<h3 id="naive-approach">My Naïve Approach</h3>

<p>This is based on the pedagogical style of determining a leap year that I learned as a kid who knew how to divide numbers. If a year ( the number representing it) is divisible by 4, it is generally a leap year. But not always. When that year ends with two zeroes (meaning when the number is divisible by 100), it must also be divisible by 400 to be a leap year.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2024/02/FlowChart-LeapYear.jpg" alt="Image" width="600" height="400" loading="lazy">
<em>How to determine if a year is a leap year - as described above</em></p>
<p>As a beginner programmer, my thoughts flowed like you can see in the above flowchart. As a result, I converted that logic into my program like so:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span>) {
      <span class="hljs-keyword">if</span> (year % <span class="hljs-number">100</span> == <span class="hljs-number">0</span>) {
          <span class="hljs-keyword">if</span> (year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
              <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
          } <span class="hljs-keyword">else</span> {
              <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
          }
      } <span class="hljs-keyword">else</span> {
          <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
      }
  } <span class="hljs-keyword">else</span> {
   <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>
  }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>This makes the program easily understandable. But with time, as I have moved farther in my programming journey, this type of code looks ugly because of so many nested conditional checks. It's not bad, but because of the nested levels, my brain has to work extra hard to get the logic from the code snapshot quickly.</p>
<h3 id="single-return">Reassignments and a Single Return Statement</h3>

<p>To avoid nested loops, many programmers follow the strategy of consecutive if conditions, avoiding the else conditions (like how Kyle Cook of Web Dev Simplified shows in this <a target="_blank" href="https://www.youtube.com/watch?v=EumXak7TyQ0">video with examples</a>). It definitely improves readability. </p>
<p>Also, it lets us use only one return statement at the end while reassigning the returnable value. Let's not discuss it too much more when you can better see the code itself:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">let</span> isLeap = <span class="hljs-literal">false</span>;
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">true</span>;
  }
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">100</span> == <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">false</span>;
  }
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">true</span>;
  }
  <span class="hljs-keyword">return</span> isLeap;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>The above code looks shorter and quicker to interpret. But it does affect the efficiency of the code, as now you have to go through all of the if conditions in all cases. </p>
<p>In contrast, in our previous naïve approach, due to the if-else construct, if a year is not divisible by 4 (like the year 2023), it would just be checked against one if condition. It’s true, of course, that for small programs such as this one, you don’t have to be overly concerned with efficiency.</p>
<p>The pitfall in this approach, though, is that you need to be cautious to apply all the if conditions one after another — using ‘else if’ would create trouble, as that would skip some if condition checks if the previous if condition test passed.</p>
<p>Another important fact is that the order matters. Since you started with the more generic cases of years not being a leap year (that is, let isLeap = false;), you have to go from relatively generic to relatively more specific cases. </p>
<p>So if, out of your three condition checks, the check of divisibility by 4 comes at the end, it would make ‘isLeap’ true even for years that are divisible by 100 but not divisible by 400 (like years 1700, 1800, 1900, and so on). </p>
<p>The same logical error would occur if you interchange the order of divisibility checks involving 100 and 400.</p>
<p>One last point I must mention is that some beginner programmers may think that you can not use multiple return statements and you must return only once in a program (and that you can do reassignments until that point). But experienced programmers can only call that notion a beginners’ myth!</p>
<h3 id="switch-case">Switching to Switch-Case from If-Else</h3>

<p>While the if-else structure is used to choose between two options, you can also use switch-case to choose one from multiple options. You can compare it to nested if-else blocks (as in the first approach) or a series of if blocks (as in the second approach). </p>
<p>The benefit of the switch-case structure is that it is more efficient because it can find the matching success criteria in one go. </p>
<p>Note that there is one quirky thing with switch-case. When using switch-case, once a case is matched, all subsequent cases will also execute unless you are using break statements. So, the following program will not be correct even if it looks very similar to our previous version of the code.</p>
<p><strong>Incorrect code: to show problems with missing break statements </strong></p>
<p>```js example-bad
function isLeapYear(year) {
  let isLeap = false;
  switch (true) {
    case year % 4 == 0:
      isLeap = true;
    case year % 100 == 0:
      isLeap = false;
    case year % 400 == 0:
      isLeap = true;
  }
  return isLeap;
}</p>
<pre><code>
If we must use a <span class="hljs-keyword">switch</span>-<span class="hljs-keyword">case</span> structure, we need to use <span class="hljs-keyword">break</span> statements. We also need to go <span class="hljs-keyword">from</span> specific cases first to generic cases next. While not all <span class="hljs-keyword">if</span>-<span class="hljs-keyword">else</span> logic can be converted into a <span class="hljs-keyword">switch</span>-<span class="hljs-keyword">case</span> logic, we can successfully convert the previous <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">like</span> <span class="hljs-title">so</span>:

```<span class="hljs-title">js</span>
<span class="hljs-title">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">let</span> isLeap = <span class="hljs-literal">false</span>;
  <span class="hljs-keyword">switch</span> (<span class="hljs-literal">true</span>) {
    <span class="hljs-keyword">case</span> year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>:
      isLeap = <span class="hljs-literal">true</span>;
      <span class="hljs-keyword">break</span>;
    <span class="hljs-keyword">case</span> year % <span class="hljs-number">100</span> == <span class="hljs-number">0</span>:
      isLeap = <span class="hljs-literal">false</span>;
      <span class="hljs-keyword">break</span>;
    <span class="hljs-keyword">case</span> year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span>:
      isLeap = <span class="hljs-literal">true</span>;
      <span class="hljs-keyword">break</span>;
  }
  <span class="hljs-keyword">return</span> isLeap;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre><p>Notice that in the above, we don't have a 'default' case. And this is because we have initialized the isLeap variable with false. Had we just declared the variable without initialization with a value, we could've written a default case which would assign the value false to isLeap.</p>
<p>Also, the above version of switch-case code is slightly longer because we wanted to use one return statement in the end and used assignments until then. But if we refactor it, a shorter and more organized code would be this:   </p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">switch</span> (<span class="hljs-literal">true</span>) {
    <span class="hljs-keyword">case</span> (year % <span class="hljs-number">400</span> === <span class="hljs-number">0</span>):
      <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
    <span class="hljs-keyword">case</span> (year % <span class="hljs-number">100</span> === <span class="hljs-number">0</span>):
      <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
    <span class="hljs-keyword">case</span> (year % <span class="hljs-number">4</span> === <span class="hljs-number">0</span>):
      <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
    <span class="hljs-keyword">default</span>:
      <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
  }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>Notice that since execution of a return statement in a function automatically ends the function call, the program does not read lines that follow that statement. So, in this example, we don't have to use the break statements necessarily. </p>
<h3 id="logical-deduction">Logical Deduction &amp; Subsets for Better Structure</h3>

<p>Switching back from switch-case to if-else logic, let's do some logical deduction. In our previous if-else logic, we went from generic cases to specific cases. What if we go in reverse order? We consider that a given year will be a leap year unless negated. </p>
<p>So, we start with the narrower cases of centenary years — for them, the rule is simple: to be negated, they need to be divisible by 100 but not by 400 (like years such as 1700, 1800, 1900). </p>
<p>In this process, since we've already accepted years like 2000 (or years divisible by 400) to be a leap year, we won’t test them for divisibility by 4 (because a number divisible by 400 would anyway be divisible by 4 as well). </p>
<p>In the next step, as we consider only the non-centenary years, we would simply negate the cases where the year is not divisible by 4 (years like 2023, 1996, and so on). </p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">let</span> isLeap = <span class="hljs-literal">true</span>;
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">100</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">400</span> != <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">false</span>;
  } <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (year % <span class="hljs-number">4</span> != <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">false</span>;
  }
  <span class="hljs-keyword">return</span> isLeap;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>Here you see, we first consider the centenary years and then non-centenary years — so they are mutually exclusive — and that’s why we use ‘else-if’ instead of if in the second conditional check. And in that process, we gain some efficiency over consecutive if blocks.</p>
<p>As this approach is about breaking the possible routes of being a leap year (or for that matter, not being a leap year) into subsets of years, depending upon how we break the possible years into subsets, we can construct the program alternatively as shown below:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">let</span> isLeap = <span class="hljs-literal">false</span>;
  <span class="hljs-keyword">if</span> (year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">true</span>;
  } <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span>) {
      isLeap = <span class="hljs-literal">true</span>;
  }
  <span class="hljs-keyword">return</span> isLeap;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>So, in brief, our deduction from the leap year rule is that  years divisible by 400 (like 1600, 2000) are leap years, and out of all the other years they must be divisible by 4 but not divisible by 100 to be a leap year.</p>
<p>In taking this approach, we have combined conditions and that’s why we involved logical operators (&amp;&amp;, the logical AND operator). This has helped us reduce the length of the function. Instead of three conditional blocks, we are currently using two blocks — an if block and then an else (where we further check the condition, and thus we call it else-if rather than just else).</p>
<p>But now that we are just using almost a single ‘if-else’ construct and we are also delving into logical operators, let's unleash more power from the logical operators in the following approach.</p>
<h3 id="combine-conditions">Logical Operators Combining All True Conditions</h3>

<p>This time let's just reorganize the logic from the previous approach (two subsets) to group all positive conditions together and then accept a year as a leap year. If that’s not met, then call it a non-leap year. </p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
    <span class="hljs-keyword">if</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
        <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
    } <span class="hljs-keyword">else</span> {
        <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
    }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>This one looks good because it increases readability by organizing the positive conditions together. The only cost we incur here is that the condition in the if block is longer. </p>
<p>But with logical operators, it looks visually shorter and not complex (at least to programmers habituated to combining logical operators like this).</p>
<p>Dissecting further, since in the previous approach we said we could break the subsets in two different ways, we can have two corresponding two versions for this approach as well. The second one is the following:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> ((year % <span class="hljs-number">100</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">400</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">4</span> != <span class="hljs-number">0</span>) {
      <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
  } <span class="hljs-keyword">else</span> {
      <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
  }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<h3 id="ternary-operator">Applying Nitro with the Ternary Operator</h3>

<p>As you progress in your programming-learning journey, at some point or other, you must have been elated to discover the possibility of writing ultra-short programs. </p>
<p>While logical operators help us do that, to activate the ‘Nitro’ mode, we must use a Ternary Operator — which basically makes our if-else blocks a single line.</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">return</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) ? <span class="hljs-literal">true</span> : <span class="hljs-literal">false</span>;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>By now, as a pro programmer, you must be pitying your rookie self. You think of those times when you used to declare and initialize a variable with a default value first and then reassign it with the value you wanted to return, and finally return the value held by that variable. </p>
<p>It has been a long time since you shunned that practice, and you now return what you need to return, and don’t consume unnecessary memory space for useless variables.</p>
<h3 id="arrow-function">Making it a Single Line Arrow Function</h3>

<p>Now that you have been boosted with Nitro, your programming technique is advancing like an arrow, on a mission to tear away the remnants of ES5 and boldly fly into the post-ES6 world. So you welcome arrow functions with open arms.  </p>
<pre><code class="lang-js"><span class="hljs-keyword">const</span> isLeapYear = <span class="hljs-function"><span class="hljs-params">year</span> =&gt;</span> (year % <span class="hljs-number">4</span> === <span class="hljs-number">0</span> &amp;&amp; (year % <span class="hljs-number">100</span> !== <span class="hljs-number">0</span> || year % <span class="hljs-number">400</span> === <span class="hljs-number">0</span>));

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>Previously, you skipped variables, and you skipped ‘if-else’ blocks. And now, you can even skip the return statement thanks to the arrow function having a single statement in its body. You also skip the parentheses around your argument as it is a single argument.</p>
<p>While singing the saga of shorter code, a point must be made that the shorter code is not necessarily the better code. It all depends on your users of the code (people who might read it and possibly collaborate/improve upon it). </p>
<p>If you are working with experienced programmers, this level of concision is fine. Just make sure you don’t exceed the line width beyond a certain number of spaces (80 characters recommended) so you don't trouble your coworkers with the need to handle horizontal scrollbars. </p>
<p>But if you are working with team members with varying levels of experience, or you are a teacher working with learners, then you must be conscious of the readability of your code for everyone.</p>
<h2 id="programming-paradigm">Paradigm Shift: Declarative Programming</h2>

<p>Anyway, we have discussed the logic of determining the leap year in the above examples. But let’s now dissect further to find more nuances of programming. And in that process let's move from imperative programming (as we have used so far) towards declarative programming (which is the end goal in this section).</p>
<h3 id="side-effects">Functions with Side Effects</h3>

<p>Functions are said to have side effects when they modify non-local variables. In addition, a function that prints (logs) in the console is also considered a function with some side effects. That is because if a function does not have a side effect, a call to it can be replaced by its return value. </p>
<p>Functional Programming is a paradigm which dictates that our program should be like a pure function without side effects. A pure function means a function which always returns the same output given the same input. So, in its body, it depends on only the input parameter given from outside and no other global variable. Additionally, it should just return the output value without side effects or trying to modify anything outside its scope.</p>
<p>But consider the following variation of the program which does not specifically return any value representing the result. Instead, it logs the result as a statement (string) in the console. This is an example of a side effect. </p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
      <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"leap year."</span>);
  } <span class="hljs-keyword">else</span> {
      <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"not leap year."</span>);
  }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-keyword">let</span> someValue = isLeapYear(<span class="hljs-number">2024</span>); <span class="hljs-comment">// Output: leap year.</span>
<span class="hljs-built_in">console</span>.log(someValue); <span class="hljs-comment">// Output: undefined</span>
</code></pre>
<p>Evidently, it does not follow the specification, as it needs to return a value of boolean type. A function can, of course, do both — printing and returning, like an alternative form of the above function. </p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
      <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"leap year."</span>);
      <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
  } <span class="hljs-keyword">else</span> {
      <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"not leap year."</span>);
      <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
  }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-keyword">let</span> someValue = isLeapYear(<span class="hljs-number">2024</span>); <span class="hljs-comment">// Output: leap year.</span>
<span class="hljs-built_in">console</span>.log(someValue); <span class="hljs-comment">// Output: true</span>
</code></pre>
<p>But the mere fact that it is doing two things — returning a value and printing in the console —  is the problem. A function should be made to do one thing for proper reusability. The ‘isLeapYear’ function should just determine if a year is a leap year. If we need to print anything about it, let that onus of doing the side effects lie with some other logger function(s).</p>
<pre><code class="lang-js"><span class="hljs-comment">// pure function</span>

<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
    <span class="hljs-keyword">if</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) {
        <span class="hljs-keyword">return</span> <span class="hljs-literal">true</span>;
    } <span class="hljs-keyword">else</span> {
        <span class="hljs-keyword">return</span> <span class="hljs-literal">false</span>;
    }
}

<span class="hljs-comment">// functions with side effect</span>

<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">simpleLeapYearLogger</span>(<span class="hljs-params">isLeap</span>) </span>{
    <span class="hljs-keyword">if</span> (isLeap) {
        <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"Yes, a leap year!"</span>);
    } <span class="hljs-keyword">else</span> {
        <span class="hljs-built_in">console</span>.log(<span class="hljs-string">"Sorry, not a leap year."</span>);
    }
}

<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">advancedLeapYearLogger</span>(<span class="hljs-params">year, isLeap</span>) </span>{
    <span class="hljs-keyword">if</span> (isLeap) {
        <span class="hljs-built_in">console</span>.log(<span class="hljs-string">`The year <span class="hljs-subst">${year}</span> is a leap year!`</span>);
    } <span class="hljs-keyword">else</span> {
        <span class="hljs-built_in">console</span>.log(<span class="hljs-string">`The year <span class="hljs-subst">${year}</span> is not a leap year!`</span>);
    }
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-keyword">let</span> currYear = <span class="hljs-number">2024</span>;
<span class="hljs-keyword">let</span> check2024 = isLeapYear(currYear); <span class="hljs-comment">// No Output/Side Effect, just retuned value.</span>
simpleLeapYearLogger(check2024); <span class="hljs-comment">// Output: Yes, a leap year!</span>
advancedLeapYearLogger(currYear, check2024); <span class="hljs-comment">// Output: The year 2024 is a leap year!</span>
</code></pre>
<p>As you can see above, the function ‘isLeapYear’ is more reusable — with two different use cases in two separate logger functions. Also, had there been any mistake in the logic for the ‘isLeapYear’ function, it would have been easier to fix without touching the logger functions’ code. </p>
<p>Similarly, if you need to display the string logged in the console differently, you could modify the respective logger function without touching the leap year’s logic function. Thus, a function doing just one thing that it was supposed to do increases the reusability and maintainability of that function.</p>
<h3 id="functional-programming">More About Functional Programming</h3>

<p>In the above section, you have already ventured into the space of functional programming. And now is the time to delve deeper. </p>
<p>If I search the term ‘Functional Programming’ in Wikipedia, the first line states</p>
<blockquote>
<p>“functional programming is a programming paradigm where programs are constructed by applying and <a target="_blank" href="https://en.wikipedia.org/wiki/Function_composition_%28computer_science%29">composing</a> <a target="_blank" href="https://en.wikipedia.org/wiki/Function_%28computer_science%29">functions</a>.”</p>
</blockquote>
<p>The phrase ‘composing function’ means building complex functions from simple ones. In our example, the leap year function is quite simple already. But to showcase the mechanism of function composition, let's create it out of component functions.</p>
<pre><code class="lang-js"><span class="hljs-comment">// component function</span>
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">divisible</span>(<span class="hljs-params">dividend, divisor</span>) </span>{
    <span class="hljs-keyword">return</span> dividend % divisor == <span class="hljs-number">0</span>
}

<span class="hljs-comment">// composed function</span>
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
    <span class="hljs-keyword">let</span> isLeap = <span class="hljs-literal">false</span>;
    divisible(year, <span class="hljs-number">4</span>) &amp;&amp; (isLeap = <span class="hljs-literal">true</span>);
    divisible(year, <span class="hljs-number">100</span>) &amp;&amp; (isLeap = <span class="hljs-literal">false</span>);
    divisible(year, <span class="hljs-number">400</span>) &amp;&amp; (isLeap = <span class="hljs-literal">true</span>);
    <span class="hljs-keyword">return</span> isLeap;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">1900</span>)); <span class="hljs-comment">// Output: false</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2000</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<h3 id="short-circuiting">Side-Tracking: Short-Circuiting!</h3>

<p>Above, you are using a function to build another function — a component-based approach that you also follow in the React JavaScript-based front-end library.</p>
<p>But wait, before we go further into React, what is that ‘&amp;&amp;’ doing in those three lines in the 'isLeapYear' function when we are not using any if-else statements there? </p>
<p>Welcome to the short-circuit evaluation of logical operators. In that process, an expression stops being evaluated as soon as its outcome is determined. So if two sides contain a logical AND (&amp;&amp;) in between, if the first side is false, this makes the whole expression false – so it does not read (not execute) the second side. </p>
<p>But if the first side is evaluated to be true, it further reads (executes) the second side for evaluation. And in that process, it does that assignment on the right-hand side of &amp;&amp; in our example.</p>
<p>Similarly, the process when logical OR (||) is involved is such that if the left-hand side is evaluated as true, the whole expression is true (it needs one condition evaluated as true for || for the whole expression to be true). Then, the second side is ignored. The second side is read or executed only when the first side is evaluated as false.</p>
<p>You can use this kind of evaluation logic as a replacement for the ‘if’ condition checks. For more examples of how it works in different scenarios, read the section ‘Short-Circuiting of Logical Operators (&amp;&amp; and ||)’ in my blog post where I have discussed <a target="_blank" href="https://codenil.medium.com/javascript-operators-some-nuances-57300eb2c354">some nuances of JavaScript Operators</a>.</p>
<h3 id="declarative-programming">Encapsulation and Declarative Programming</h3>

<p>Returning to REACT and components, the idea of building composing functions or components is rooted in the need for encapsulation. With encapsulation, you can hide the complex details, like in a capsule, and use it repeatedly without bothering much about its underlying complexity. </p>
<p>Essentially, you just proclaim (declare) what you need rather than straining yourself with the workload and headache of how you can make it happen step-by-step with ‘do-this’ and ‘do-that’ type statements (imperatives). </p>
<p>That, briefly, is declarative programming for you.</p>
<h2 id="code-quality">Going Above &amp; Beyond with Code Quality </h2>

<p>So far, we have covered the logical structures and the programming paradigms, but now, let’s look at the third aspect: code quality.</p>
<h3 id="validations">Validations: Beyond the Basic Specifications</h3>

<p>The requirements that we laid out at first just considered valid inputs. What if the function is called with arguments that are not the ideal ones — like a non-number, or even if a number but a non-integer? </p>
<p>To address that, we can build validation logic. To build validation logic, you need to think about all the different ways in which the input value (the argument passed to your function) may not be workable for you. </p>
<p>If one of those non-workable ways does come along, you need to return something that makes more sense — you can not give a verdict like true or false in that case. You may return something more neutral (like undefined or null) to indicate that the function encountered an invalid entry.</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> (<span class="hljs-keyword">typeof</span> year!=<span class="hljs-string">"number"</span> || year % <span class="hljs-number">1</span> != <span class="hljs-number">0</span> || year &lt;= <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">undefined</span>;
  <span class="hljs-keyword">return</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) ? <span class="hljs-literal">true</span> : <span class="hljs-literal">false</span>;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-string">"TwentyTwentyFour"</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023.99</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">0</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">-1</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-string">"2024"</span>)); <span class="hljs-comment">// Output: undefined</span>
</code></pre>
<p>But if you noticed carefully, in our leap year logic check, we have evaluated just ordinary equality (==) instead of strict equality (===). We can't reap the benefit of that for a string format entry for a year like "2024". </p>
<p>If our intention is to strictly accept a number, the kind of validation we wrote is fine, and it would then be even more proper to use ===. </p>
<p>But if, on the other hand, we want to accept values like "2024", we must enhance our validation logic like so:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> (<span class="hljs-built_in">isNaN</span>(<span class="hljs-built_in">Number</span>(year)) || year % <span class="hljs-number">1</span> != <span class="hljs-number">0</span> || year &lt;= <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">undefined</span>;
  <span class="hljs-keyword">return</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) ? <span class="hljs-literal">true</span> : <span class="hljs-literal">false</span>;
}

<span class="hljs-comment">// Example usage:</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2024</span>)); <span class="hljs-comment">// Output: true</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-string">"TwentyTwentyFour"</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">2023.99</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">0</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-number">-1</span>)); <span class="hljs-comment">// Output: undefined</span>
<span class="hljs-built_in">console</span>.log(isLeapYear(<span class="hljs-string">"2024"</span>)); <span class="hljs-comment">// Output: true</span>
</code></pre>
<h3 id="unit-testing">Testing it Out From the Outside</h3>

<p>In the above two code blocks, we write our code and test it in the same place. But the code that goes into production will not have the opportunity to include such console logs that we have used extensively for demonstrating 'example usage' in the above code blocks. </p>
<p>This is where unit testing comes in. In unit testing, we first export the function for use in other places (files), then import that function in a test file. In that test file is where we run the test, build our cases, and finally run that test file to execute those tests.</p>
<p>I have used the Jest package to do this unit testing, and here is the code from my index file and test script file:</p>
<p><strong>index.js</strong></p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">isLeapYear</span>(<span class="hljs-params">year</span>) </span>{
  <span class="hljs-keyword">if</span> (<span class="hljs-built_in">isNaN</span>(<span class="hljs-built_in">Number</span>(year)) || year % <span class="hljs-number">1</span> != <span class="hljs-number">0</span> || year &lt;= <span class="hljs-number">0</span>) <span class="hljs-keyword">return</span> <span class="hljs-literal">undefined</span>;
  <span class="hljs-keyword">return</span> ((year % <span class="hljs-number">4</span> == <span class="hljs-number">0</span> &amp;&amp; year % <span class="hljs-number">100</span> != <span class="hljs-number">0</span>) || year % <span class="hljs-number">400</span> == <span class="hljs-number">0</span>) ? <span class="hljs-literal">true</span> : <span class="hljs-literal">false</span>;
}

<span class="hljs-built_in">module</span>.exports = isLeapYear;
</code></pre>
<p><strong>index.test.js</strong></p>
<pre><code class="lang-js"><span class="hljs-keyword">const</span> isLeapYear = <span class="hljs-built_in">require</span>(<span class="hljs-string">'./index.js'</span>);

describe(<span class="hljs-string">'Test isLeapYear'</span>, <span class="hljs-function">() =&gt;</span> {
  it(<span class="hljs-string">'should return true for leap year'</span>, <span class="hljs-function">() =&gt;</span> {
    expect(isLeapYear(<span class="hljs-number">2020</span>)).toBe(<span class="hljs-literal">true</span>);
  });
  it(<span class="hljs-string">'should return false for non-leap year'</span>, <span class="hljs-function">() =&gt;</span> {
    expect(isLeapYear(<span class="hljs-number">2023</span>)).toBe(<span class="hljs-literal">false</span>);
  });
  it(<span class="hljs-string">'should return undefined for invalid input'</span>, <span class="hljs-function">() =&gt;</span> {
    expect(isLeapYear(<span class="hljs-string">'TwentyTwentyFour'</span>)).toBe(<span class="hljs-literal">undefined</span>);
    expect(isLeapYear(<span class="hljs-string">'2023.99'</span>)).toBe(<span class="hljs-literal">undefined</span>);
    expect(isLeapYear(<span class="hljs-string">'0'</span>)).toBe(<span class="hljs-literal">undefined</span>);
    expect(isLeapYear(<span class="hljs-string">'-1'</span>)).toBe(<span class="hljs-literal">undefined</span>);
  });
  it(<span class="hljs-string">'should return true for a leap year in string format'</span>, <span class="hljs-function">() =&gt;</span> {
    expect(isLeapYear(<span class="hljs-string">"2024"</span>)).toBe(<span class="hljs-literal">true</span>);
  });
});
</code></pre>
<p>I installed Jest using the command <code>npm i jest</code>. Then, I added <code>jest</code> as a value for <code>test</code> in the <code>scripts</code> object inside my package.json file. Then, as I ran <code>npm test</code>, it passed all my test cases, like so:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2024/02/Screenshot-2024-02-29-05.25.03.png" alt="Image" width="600" height="400" loading="lazy">
<em>testing output</em></p>
<p>If you want to tweak and try this unit testing code, you can use and fork this <a target="_blank" href="https://replit.com/@nil-sj/UnitTestingExample">replit project</a>.</p>
<h2 id="end-note">End Note</h2>

<p>We've reviewed many programming concepts in the above exercise. And one key takeaway is that a program can be written in multiple ways. </p>
<p>There are typically many correct solutions to a programming problem. So beginner programmers should, therefore, think of the logic part of it (the algorithm) more than the exact execution steps when starting to solve a problem.</p>
<p>And by the way, if you're wondering why we have leap years, then this is for you: the time Earth takes to complete one revolution around the sun is not exactly 365 days (or 365 x 24 hours) but approximately one-quarter of a day extra. </p>
<p>This process may remind you of the modulus operator, represented by the symbol %, which returns the remainder of a division operation. Here, the approximate time (in hours) taken for one revolution of earth is being divided by 24 hours (that is, a day). It gives a remainder of about 6 hours. </p>
<pre><code class="lang-js"><span class="hljs-keyword">const</span> approxTimeHrsRev = <span class="hljs-number">8766</span>;
<span class="hljs-keyword">const</span> hrsPerDay = <span class="hljs-number">24</span>;
<span class="hljs-keyword">let</span> completedDaysEachYear;

<span class="hljs-keyword">let</span> remainderHrsPerYear = <span class="hljs-number">8766</span> % hrsPerDay;
completedDaysEachYear = (approxTimeHrsRev - remainderHrsPerYear) / hrsPerDay;

<span class="hljs-built_in">console</span>.log(<span class="hljs-string">`After <span class="hljs-subst">${completedDaysEachYear}</span> complete days, there is still about <span class="hljs-subst">${remainderHrsPerYear}</span> hours left out each year.`</span>);
<span class="hljs-comment">// Output: After 365 complete days, there is still about 6 hours left out each year.</span>
</code></pre>
<p>To account for those missed hours, we must adjust our calendars once every four years when those left-out portions add up to make — again approximately — a day. </p>
<p>Finally, because it is not exactly 6 hours, and a tiny bit more than that, we have to adjust every 100 and 400 years further.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ How to Start Learning to Code – Handbook for Beginners ]]>
                </title>
                <description>
                    <![CDATA[ In this handbook, I'll address a question you may be asking yourself: should you learn how to code? After explaining why you definitely should, I'll cover some of the benefits and challenges of being a software developer. I'll also discuss some key s... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/learn-coding-for-everyone-handbook/</link>
                <guid isPermaLink="false">66d45eff246e57ac83a2c769</guid>
                
                    <category>
                        <![CDATA[ handbook ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learn to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ software development ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Fatos Morina ]]>
                </dc:creator>
                <pubDate>Fri, 08 Dec 2023 17:07:46 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/12/How-to-Start-Learning-to-Code-cover--1-.png" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>In this handbook, I'll address a question you may be asking yourself: should you learn how to code?</p>
<p>After explaining why you definitely should, I'll cover some of the benefits and challenges of being a software developer. I'll also discuss some key strategies for approaching learning to code to help you succeed.</p>
<p>By the end, you should have a more developed mental model of what it takes to learn programming and how you can start or continue your journey.</p>
<h1 id="heading-table-of-contents">Table of Contents</h1>
<ul>
<li><p><a class="post-section-overview" href="#heading-what-is-programming">What is programming?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-should-you-still-learn-to-code-answer-yes">Should you still learn to code [Yes]?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-why-you-should-consider-coding-as-a-career">Why you should consider coding as a career</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-potential-challenges-of-a-programming-job">Potential challenges of a programming job</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-why-do-software-engineers-get-paid-so-well">Why do software engineers get paid so well</a>?</p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-prepare-for-your-coding-journey">How to prepare for your coding journey</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-your-ego-is-your-enemy">Your ego is your enemy</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-take-responsibility-for-your-learning">Take responsibility for your learning</a></p>
</li>
<li><p><a class="post-section-overview" href="#i-am-afraid-to-start-programming-what-should-i-do">I am afraid to start programming. What should I do?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-strategies-and-tips-for-learning-to-code">Strategies and tips for learning to code</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-can-you-learn-coding-in-a-single-night">Can you learn coding in a single night?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-avoid-tutorial-hell">Avoid tutorial hell</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-understand-complex-topics-by-using-the-feynman-technique">How to understand complex topics by using the Feynman Technique</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-dont-memorize-the-syntax">Don't memorize the syntax</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-keep-a-to-learn-list">Keep a To-Learn list</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-practical-aspects-of-coding">Practical aspects of coding</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-deal-with-overwhelming-projects">How to deal with overwhelming projects</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-choose-projects-to-build">How to choose projects to build?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-learn-by-building-things-from-scratch">Learn by building things from scratch</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-learn-by-building-things-from-scratch">Build something that already exists</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-beyond-the-basics">Beyond the basics</a></p>
</li>
<li><p><a class="post-section-overview" href="#develop-a-love-of-learning">Develop a love of learning</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-look-at-the-bigger-picture">Look at the bigger picture</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-embrace-lifelong-learning-in-software-engineering">Embrace lifelong learning</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-get-the-pdf-version-of-the-book">Get the PDF version of the book</a></p>
</li>
</ul>
<h1 id="heading-introduction-to-programming">Introduction to Programming</h1>
<h2 id="heading-what-is-programming">What is Programming?</h2>
<p>Before we start with the advice, let's learn what computer programming is.</p>
<p>First of all, remember that a computer is not only a laptop or desktop. It's also your phone, tablet, and any other device that is capable of performing logical and arithmetic operations that we program into it.</p>
<p>This includes your car's navigation system, the ATM where you withdraw or deposit money, the systems that allow you to order food digitally, and so on.</p>
<p>Computer programming is the process of designing and building instructions (a "program") that the computer can execute.</p>
<p>As an example, we can take a calculator that performs arithmetic operations such as addition, subtraction, multiplication, and division.</p>
<p>Instead of doing all this with a pencil on paper – but instead, we have a calculator on our phones. And this calculator is a computer program that helps us find the result quickly.</p>
<p>Other programs that you may use every day include Facebook, WhatsApp, Instagram, YouTube, TikTok, and many others.</p>
<p>Writing a program is sort of like cooking a meal. You may have an idea for a delicious meal, but you need to buy the necessary ingredients beforehand.</p>
<p>Once you have what you need, you prepare that food, put it in the oven, and then wait while it cooks. After that, you serve the food at the table and eat it.</p>
<p>Things work similarly with programming: first, you have an idea and the knowledge to turn that idea into a program (or maybe you learn while you're building the program – just like how you can watch someone cooking food on YouTube and learn how to make that recipe).</p>
<p>Then, you start to put the ingredients of the program into place, piece by piece, until the entire program is ready to be served to users.</p>
<p>Unlike cooking, where dishes are consumed, programs remain intact and reusable even after being used.</p>
<p>This unique aspect means that a single program can serve multiple users simultaneously and over time.</p>
<p>There are costs associated with creating and maintaining software, but once developed, a program like a website can be accessed by numerous people at the same time without diminishing in availability or quality.</p>
<p>So to summarize, programming is the process of turning an idea into a computer program that other people can use. And this is something you can learn how to do yourself.</p>
<p>In the ever-evolving landscape of software engineering, many people are wondering about the impact AI will have.</p>
<p>Should you still learn how to code? (Short answer: yes.) Let's delve into this concern, especially for anyone who's skeptical about the future demand for coding skills.</p>
<h2 id="heading-should-you-still-learn-to-code-answer-yes">Should You Still Learn to Code? [Answer: Yes]</h2>
<p>We use software all the time – to chat with others, stay informed about the latest news, and even for our alarm clocks that help us wake up on time.</p>
<p>Even the browser or the PDF reader that you use to read documents are pieces of software. These words were even typed in a software program.</p>
<p>Programming is something that's ever-evolving, and many things that we're currently doing manually may get automated in the future.</p>
<p>But software is deeply embedded in our daily lives, powering tools and applications across various professions and personal activities.</p>
<p>The more we integrate into the digital world, the more central software becomes. It's reshaping our work, learning, and social interactions, with its importance only set to increase.</p>
<h3 id="heading-the-future-of-building-software">The Future of Building Software</h3>
<p>Imagine a world where building software was as simple as having a conversation with a highly advanced AI, like a future ChatGPT. You describe your needs, and the AI creates the entire software for you – no coding required.</p>
<p>So you may wonder: why should I learn coding when ChatGPT can code an entire app for me in seconds? Well, here's something I want you to understand: AI is not here to replace us, but to <strong>help us become more productive</strong>.</p>
<p>Sure, AI can help you save time and energy by performing certain basic, repetitive tasks for you. But grasping the basics of software development remains crucial, especially for the more complex problems that require your creative, experience-based solutions.</p>
<p>You need to be able to harness AI's power while continuing to learn and adapt. This will help make sure that we're steering the course in our rapidly evolving digital landscape.</p>
<p>As you can probably tell, I want to emphasize the irreplaceable role of software engineers and coders, even in an AI-dominated future. Here are a few reasons why:</p>
<ol>
<li><p><strong>Understanding Over Automation</strong>: Coding isn't just about executing tasks – it's about grasping complex logic and structures. Our human ability to analyze and solve intricate problems goes beyond AI's automation.</p>
</li>
<li><p><strong>Maintenance and Flexibility</strong>: Deep coding knowledge provides insights vital for software maintenance and adaptation. This knowledge is invaluable when AI-generated programs encounter issues.</p>
</li>
<li><p><strong>Safety and Reliability</strong>: Similar to understanding basic car mechanics for safety, knowing coding basics is essential for addressing software malfunctions.</p>
</li>
<li><p><strong>The Creative Element</strong>: AI lacks human creativity and innovation, which is crucial for envisioning and realizing novel software solutions.</p>
</li>
</ol>
<p>The rise of AI in coding doesn't signal the end for human coders. Rather, I believe it just signals a collaborative future. AI's automation of mundane tasks gives human coders more space for creativity and innovation in software development.</p>
<p>Learning to code transcends mere programming. It's about understanding how various technologies work, honing problem-solving skills, and nurturing creativity. These skills remain invaluable, even as AI reshapes the landscape.</p>
<p>So I encourage you to embrace coding as it opens doors to a future where human intelligence and AI collaboratively push the boundaries of innovation.</p>
<h2 id="heading-why-you-should-consider-coding-as-a-career">Why You Should Consider Coding as a Career</h2>
<p>Maybe when you were a kid (or now as an adult) you liked a computer game so much that you played it all the time.</p>
<p>And maybe you had the idea that someday you could develop a game like it.</p>
<p>I know people who started programming precisely for this reason: to be able to develop different computer games.</p>
<p>So, because of the pleasure you may have experienced, you may have decided to become a programmer yourself.</p>
<p>Over time, your reasons may change – and this certainly doesn't mean that everyone gets into coding only because of game development.</p>
<p>After all, there are many reasons why you might consider programming as an option for your career. Let's discuss some of these reasons now (and indeed there are many more).</p>
<h3 id="heading-you-have-the-opportunity-to-develop-something-for-fun">You have the opportunity to develop something for fun</h3>
<p>I mentioned the case of game development, but you don't have to start programming by building games.</p>
<p>Maybe you are an accountant, or you have a shop and want to register your goods through a program that you develop yourself...and so on.</p>
<p>Here are some practical projects that might inspire someone to learn to code:</p>
<ul>
<li><p>A custom note-taking application tailored to your specific needs.</p>
</li>
<li><p>A personalized inventory management system for your shop.</p>
</li>
<li><p>An app for organizing and tracking your daily tasks and goals.</p>
</li>
<li><p>A scheduler for managing your college or university timetable.</p>
</li>
<li><p>A problem-solving assistant for tackling challenging tasks.</p>
</li>
<li><p>A daily weather update tool that sends forecasts to your email.</p>
</li>
<li><p>A health app that suggests potential illnesses based on symptoms.</p>
</li>
<li><p>A focus enhancer that limits access to social media during work hours.</p>
</li>
</ul>
<p>There are many other programs that you could develop. In short, you can start programming because you like to solve the problems you face in your daily life.</p>
<p>And once you learn to code and can build these programs, then you can share them with your friends and family (and beyond).</p>
<h3 id="heading-you-can-solve-problems-for-people-all-over-the-world">You can solve problems for people all over the world</h3>
<p>Here's something that might make you happy: having the opportunity to help someone else (or a lot of people). I am sure that when you have been able to help a family member or a colleague, you've felt happy and satisfied.</p>
<p>Now, imagine how good you'd feel if you had the opportunity to solve a problem that people are facing all over the world.</p>
<p>For example, you may have an idea to start a Facebook group for residents of your neighborhood asking each other for household tools that you may need.</p>
<p>Or maybe you want to propose that everyone pitch in on maintaining the common spaces in your neighborhood.</p>
<p>You could also use this group to bring up problems as well as solutions that you aim to realize.</p>
<p>If you know how to code, you can create your own tool and share it with your neighbors. You can make your platform tailored to the specific needs of your neighborhood.</p>
<p>And if it works in your community, you can then share it with people from other neighborhoods.</p>
<p>You can take things a step further and work on projects that help people working in different fields.</p>
<p>So, for example, in addition to helping residents of your neighborhood, you can help farmers be better informed about the weather conditions by building a weather reporting app.</p>
<p>Or you can come up with a recommendation system that helps them determin how to work the land and what crops to plant when.</p>
<p>Or maybe you want to help a barber who wants to visualize the hair styles of his clients before cutting their hair. Or you could even build programs to help a private medical clinic better manage their patients' records.</p>
<p>As I hope you're beginning to see, the possibilities are pretty much endless.</p>
<h3 id="heading-you-can-work-on-interesting-challenges">You can work on interesting challenges</h3>
<p>A major advantage of programming is that you can use the knowledge you acquired to solve all different kinds of problems.</p>
<p>Often you may start to read a book, or watch a movie that you may not like, and you have the opportunity to leave that book or that movie unfinished and start another one.</p>
<p>The same thing applies to programming projects. You may not be very motivated to work on a side project, so usually you have the opportunity to switch and deal with another project.</p>
<p>You can do that even at work from time to time where you ask can ask your manager to assign you to a different project.</p>
<h3 id="heading-you-can-also-learn-during-work-hours">You can also learn during work hours</h3>
<p>Many companies offer programmers space and the opportunity to learn during work hours when there is no work that needs to be done at the moment.</p>
<p>In fact, some companies cover the expenses for training, books, and various courses that qualify and prepare workers.</p>
<p>And at some companies, when you complete a certification, you'll get a reward of some type, whether financial or otherwise.</p>
<p>Skilled, prepared, and trained programmers are valuable resources for a company. In addition to being able to work on more complex projects, they also often have the opportunity to get better clients and offers. The company can also invest in these highly-skilled devs by promoting them.</p>
<h3 id="heading-you-can-work-from-home">You can work from home</h3>
<p>The good thing about programming is that you can work from home (or anywhere) and be employed remotely. This means you don't have to physically move somewhere to engage in more interesting work or get a better offer.</p>
<p>During the pandemic, many companies offered the opportunity to work from home, and many companies will continue to offer this opportunity even after the pandemic.</p>
<p>This is a great relief for many people, as it saves them from the need to travel every day to the office, pay additional rent, live away from family members, and so on.</p>
<h3 id="heading-you-can-have-a-flexible-schedule">You can have a flexible schedule</h3>
<p>Different people have different obligations outside of work, including family needs, medical appointments, or various commitments at certain times, which cannot be postponed for later.</p>
<p>So for many, having a flexible schedule, or even getting to leave work at certain times, is necessary. And many developers are able to have this flexiblity in their work schedules.</p>
<h3 id="heading-you-can-collaborate-with-and-learn-from-intelligent-people">You can collaborate with and learn from intelligent people</h3>
<p>If you're on a team, there will likely be people who have studied many different fields/areas of tech than you have. They'll also likely have rich experiences with various previous projects. This will present to you many opportunities for learning and collaborating with these team members. So take advantage of those opportunities when you can.</p>
<p>You may have team members in Germany, Singapore, or Brazil, or anywhere else in the world. And by working on the same project, you have the opportunity to benefit from their knowledge, their approach to problems, and their creative solutions.</p>
<h3 id="heading-the-salary-is-often-very-good">The salary is often very good</h3>
<p>Programmers often enjoy higher salaries compared to many other professions.</p>
<p>This isn't just a slight difference – in most countries, if not all, the average salary for programmers significantly exceeds the national average.</p>
<p>This trend reflects the high demand and value placed on programming skills in the global job market.</p>
<p>In addition to the opportunity for good compensation, there is also the opportunity to get raises or other financial incentives/benefits depending on your work.</p>
<p>Also, many tech companies implement bonus schemes for their employees. These bonuses are given for achieving business goals, exceptional performance, or extremely dedicated work.</p>
<p>They can be awarded to individuals or teams, depending on the company's policies.</p>
<p>Thus, based on individual or team achievements, securing big clients, or completing successful projects, employees may receive additional compensation in the form of bonuses.</p>
<p>This can be a significant motivational factor for many in the programming field.</p>
<h3 id="heading-you-can-often-take-paid-leave">You can often take paid leave</h3>
<p>As much as we may be motivated to work and enthusiastic about turning our ideas into code and thus reality, we are human and need rest and relaxation. So make sure to take the time to disconnect from daily work.</p>
<p>In other words, rest is beneficial for everyone, especially for programmers, who may be stressed and engaged all day with work and pressure.</p>
<p>In general, developers get fairly generous paid leave, allowing them to take vacations throughout the year. There are also companies that offer the opportunity for long periods of leave, as long as it does not harm the project and the work of the entire team.</p>
<p>Taking vacations isn't always easy for people of other professions, who often have much less flexibility or less generous paid time off.</p>
<p>Those are just some of the reasons programming may be a good fit career-wise for you.</p>
<p>But to be fair, let's also consider some of the downsides to see if any of them are dealbreakers for you.</p>
<h2 id="heading-potential-challenges-of-a-programming-job">Potential Challenges of a Programming Job</h2>
<p>Perhaps you did not expect this issue to be addressed in this book which is aimed to inspire you to consider becoming a developer.</p>
<p>But I thought it was important to share potential downsides as well to help you make an informed decision.</p>
<p>Here, I'll discuss only some of the disadvantages that come from a career in programming. You might not experience all these specifically, and this may not reduce the chances of them happening to you. But if you're aware of them, perhaps you can avoid them more easily.</p>
<h3 id="heading-programming-can-be-stressful">Programming can be stressful</h3>
<p>Perhaps you have had the chance to speak with other developers and they told you that coding is stressful. Well, this can be the result of many situations.</p>
<p>For example, if you're fixated on solving a particular problem at work, you may hesitate to get up from your chair and walk around, which helps relieve stress. But you don't want to stop until you solve the problem. This can contribute to your stress.</p>
<p>So what can you do to help relieve stress, or release the emotional burden of an issue? Well first of all, it's good to do physical movement, including getting up from your chair, taking a little walk around the office (or your house, or wherever you're working), going out in the fresh air, and changing your environment for a few moments.</p>
<p>Remember: stress can be harmful both in keeping you from thinking clearly (which would help you more easily find a solution to the problem), and in consuming all your energy. All this can lead to a deterioration of your mental and emotional state.</p>
<h3 id="heading-you-need-to-learn-continuously">You need to learn continuously</h3>
<p>Learning is the only way to advancement. So if you always feel pressure to learn new things either directly or indirectly, this is a great opportunity you can use to advance your career.</p>
<p>New tech tools, programming languages, and platforms come out continuously. And you may be busy dealing with commitments outside of work that may also take your time and energy.</p>
<p>It doesn't matter how much experience you have so far in programming. The only thing that remains unchanged is the need to learn continuously. Learning new things helps you keep up with the job market, know what's required by your clients, and develop your own products.</p>
<p>But perhaps you don't enjoy the pressure to learn new skills all the time.</p>
<p>You might be someone who, as soon as you get into a job, want to feel comfortable and secure. This is ok, but it may result in having lower ambitions and fewer or less exciting goals.</p>
<p>So if you're someone who doesn't always want to be learning new skills, this could be a negative side of tech and an unsuitable burden. But I hope that you, instead of seeing this as a negative side or disadvantage of programming, will embrace it as a worthy challenge.</p>
<h3 id="heading-you-have-a-lot-of-responsibility">You have a lot of responsibility</h3>
<p>Your work as a developer may be used by many people. It may have a positive impact on them and make their lives easier.</p>
<p>But with this great power comes great responsibility. You may unintentionally cause negative consequences that may affect many people if you fail to catch an error in a program, for example.</p>
<p>It is not the same as making a mistake when designing a wristwatch, for example, that comes out with some problem like a scratched face or cracked leather band. If you release an application used by tens of thousands (or more!) of people – say, a medical device – that contains a mistake, it may risk people's lives.</p>
<p>This may seem a bit exaggerated, but it is worth remembering that many programs on hospital computers used by doctors and medical staff may have errors or bugs in them. As a result, this mistake could cause a doctor to make an incorrect diagnosis diagnosis and the wrong therapy which can be very harmful, even fatal to the patient.</p>
<p>So it's important to take your responsibilities as a developer seriously and complete your work carefully and thoughtfully.</p>
<h3 id="heading-you-may-need-to-work-after-hours">You may need to work after hours</h3>
<p>This is not unique only to programmers, since people who work in other jobs often need to work after work hours. But this can be hard for devs, especially those with additional responsibilities in their lives.</p>
<p>As a developer, you may need to stay late at work for many reasons, such as:</p>
<ul>
<li><p>You have a short deadline for finishing a new task, new feature, or just for fully completing the project for your client.</p>
</li>
<li><p>Some service that you have programmed has failed which needs an immediate fix so the client's service or tool doesn't go down. And you may need to be at your computer to fix it even though it might be after work hours, during a weekend, or during an official holiday.</p>
</li>
<li><p>A security issue has arisen in a programming library that you use and you need to resolve it so that your clients and users are not affected by this problem. Mistakes are inevitable, especially in programming, but errors vary, and some can be very harmful, while some may not even be noticed.</p>
</li>
</ul>
<p>Just make sure that you set boundaries and expectations with your team, your clients, and your manager so you don't end up working overtime all the time.</p>
<h3 id="heading-you-have-to-sit-for-long-periods-in-front-of-the-computer">You have to sit for long periods in front of the computer</h3>
<p>Developers often sit for long periods in a chair and often don't do enough physical activity. This can cause you to start experiencing back or joint pain, numbness, weight gain, or other potentially harmful health issues.</p>
<p>Or as you concentrate really hard on debugging a problem, you may have times when you even forget to close your eyes while working at your computer. This, of course, is not healthy, as it can damage your eyes.</p>
<p>Also, sitting such a short physical distance from your computer, which is usually less than a meter away, you may fixate your eyes in the same position for a long time, which can be harmful to your eyes as well.</p>
<p>To avoid these things, you can workout at a gym, do light exercises at home by following instructions on YouTube, and by generally moving your body more often like by getting up from your chair, walking around the office, eating healthy foods, stretching, and so on.</p>
<h3 id="heading-your-body-mass-may-increase">Your body mass may increase</h3>
<p>Many programmers feel stress during work. As a result, they eat more than they need to reduce stress – and they may not even notice that they are overeating due to stress.</p>
<p>And again, since you may be spending long periods sitting and eating more than you need, you may start gaining some weight and losing muscle.</p>
<p>To avoid unwanted weight gain, try to be conscious of what you eat and how much. You can try to eat less unhealthy fat and reduce your sugar intake. You can also do some physical exercises, and make sure to eat little but often.</p>
<p>These are just some of the challenges programmers can face. But hopefully, now that you're aware of them, you can figure out how to avoid or deal with them.</p>
<h2 id="heading-why-do-software-engineers-get-paid-so-well">Why Do Software Engineers Get Paid So Well?</h2>
<p>One of the reasons we work is to make money to cover expenses and ensure that we can live a pleasant and dignified life.</p>
<p>Since we were kids, we've had to learn, complete our education, and gain experience so that we can more easily get a good job and make good money.</p>
<p>Since you are reading this, you have probably heard that software engineers are paid pretty well compared to many other professions.</p>
<p>The average salary of programmers – even those without formal education and relatively little work experience – is often much higher than that of people with jobs in other fields.</p>
<p>There are many reasons for this, but here I'll discuss what I consider to be some of the main ones.</p>
<h3 id="heading-increased-need-for-software-engineers">Increased need for software engineers</h3>
<p>In our world today, almost every company needs software engineers. This is because technology is a big part of our daily lives.</p>
<p>We use technology in our phones, cars, and at work. Companies in many areas like health, education, and fun activities need software engineers to make and look after their computer programs.</p>
<p>Because so many companies need these skills, there are a lot of jobs for software engineers. This makes companies offer big salaries to get the best software engineers to work for them.</p>
<p>Also, being a software engineer is not easy. It takes a lot of learning and practice.</p>
<p>Technology keeps changing, so software engineers have to keep learning new things. Not many people can do this well, so there are not too many software engineers.</p>
<p>This means that because so many companies want software engineers and there are not enough of them, they get paid a lot.</p>
<p>In simple words, software engineers make a lot of money because they are needed a lot and there are not enough of them who can do the job well.</p>
<h3 id="heading-you-help-turn-ideas-into-reality">You help turn ideas into reality</h3>
<p>When you want to build a house, first you seek the help of an architect who comes to your land, analyzes the environment, and then, after some time, comes up with a detailed plan for every part of the house.</p>
<p>Then, this plan is taken by a building engineer who manages a team of workers and the entire construction process until the construction of the house is completed and the house is ready.</p>
<p>This is highly skilled work that requires a lot of training and expertise. It's the same with being a developer. You get paid relatively a lot because it reflects the high level of skill you have and the amount of effort and work it takes to do your job.</p>
<p>Software engineers are able to turn an idea that a client has into a computer program which then can bring benefits to people all over the world. This is a very valuable skill, and such it is rewarded accordingly.</p>
<h3 id="heading-your-solutions-can-connect-people-all-over-the-world">Your solutions can connect people all over the world</h3>
<p>When you think about a major highway, consider how it connects regions and transforms travel and commerce.</p>
<p>For instance, a major road might link two major cities, greatly increasing the flow of tourists and business travel between them.</p>
<p>Building such a highway requires a massive investment and a lot of effort, but once completed, it saves people significant time and opens up new opportunities.</p>
<p>This concept is similar to the creation of computer programs.</p>
<p>When a program is developed, it has the potential to connect millions of people worldwide who aren't in the same country or even on the same continent.</p>
<p>Take social media apps, for example. They're computer programs designed for global use, helping people like you, your family, and friends communicate, meet new people, or stay updated with the latest news.</p>
<p>Or consider Google's search engine, which processes over 3.5 billion queries daily on a variety of topics. It can help people anywhere, as long as they have an internet connection, solve their problems and learn new things.</p>
<p>These programs, much like a well-constructed highway, facilitate connections and interactions, making life more efficient and connected for countless individuals.</p>
<h3 id="heading-software-engineers-work-in-many-areas">Software Engineers work in many areas</h3>
<p>A special thing about software engineers is that they can work in many different areas. They are not just stuck in one kind of job.</p>
<p>This is really important and one of the reasons they get paid a lot.</p>
<p>Imagine a software engineer making a program for a doctor's office to keep track of patients.</p>
<p>Then, maybe the next week, they might make a system for a hotel to book rooms, or help a school manage its information.</p>
<p>Software engineers can help lots of different businesses by making computer programs that solve problems and make things easier.</p>
<p>Different companies, like those in health, hotels, or schools, might not know much about technology. But they know it helps them do better.</p>
<p>So, they pay software engineers well to make good technology for them.</p>
<p>This is because software engineers can do a lot to change and improve how different businesses work.</p>
<p>It's more than just writing code; it's about making tools that really help businesses in many ways.</p>
<h3 id="heading-you-are-constantly-improving-your-skills">You are constantly improving your skills</h3>
<p>Many developers constantly work to develop new tools to facilitate their daily work and make it easier or less time-consuming.</p>
<p>They write programs to do repetitive tasks for them, so they can then spend that saved time implementing logic and more complex solutions things for their projects.</p>
<p>So as a programmer, you'll always be improving your skills and getting faster at providing solutions to problems. You'll adopt the most powerful tools that help you perform your job faster and get more done.</p>
<p>A project that might have taken much longer, you can now finish in less time by using these new tools you have learned. This means that businesses who use your services as a programmer are able to go to market faster with useful products that serve customers better.</p>
<p>In other words, software engineers are paid so well because they have such specialized and valuable skills that allow them to help many people around the world.</p>
<h1 id="heading-how-to-prepare-for-your-coding-journey">How to Prepare for Your Coding Journey</h1>
<h2 id="heading-your-ego-is-your-enemy">Your Ego is Your Enemy</h2>
<p>When you begin thinking about starting your journey into coding, it's easy to feel overwhelmed.</p>
<p>You might envision complex systems and software like those at Google or Amazon and wonder how you could ever understand such complexities.</p>
<p>Often, when we set out to become proficient coders, we find that our biggest obstacle isn't the code itself, but our own egos.</p>
<p>Here, by ego, I mean an unhealthy belief in our own importance: our arrogance and our self-centered ambition.</p>
<p>It's like a stubborn voice inside us that insists on being the best without considering the collaborative, challenging, and iterative nature of learning to code.</p>
<p>Ego can mislead us into thinking we're more knowledgeable than we are, hindering our ability to learn and collaborate effectively.</p>
<p>It stands in the way of truly mastering coding, building productive relationships with fellow learners, and recognizing or creating opportunities for growth.</p>
<p>Ego is a constant threat, not just in professional life but as we embark on learning something new like coding.</p>
<p>It can prevent us from building great software, advancing in our learning goals, and recovering from setbacks.</p>
<p>To guard against ego, we need to be aware of its influence at every stage of our learning journey.</p>
<blockquote>
<p>“If you know the enemy and know yourself, you need not fear the result of a hundred battles. If you know yourself but not the enemy, for every victory gained you will also suffer a defeat. If you know neither the enemy nor yourself, you will succumb in every battle.” — Sun Tzu</p>
</blockquote>
<h3 id="heading-how-to-overcome-ego-in-the-early-stages-of-learning-to-code">How to Overcome Ego in the Early Stages of Learning to Code</h3>
<p>You might be starting with high enthusiasm, perhaps influenced by the success stories of self-taught coders or the allure of becoming a tech prodigy.</p>
<p>In such cases, ego might convince you that success will come easily, that you'll quickly master programming languages or skip the usual learning curves.</p>
<p>Remember, the most impressive achievements in coding come from dedication and hard work. Consider the builders behind WordPress, Microsoft, and Google, for example.</p>
<p>Their success stories are marked by relentless effort, not just innate talent or luck.</p>
<p>When starting your coding journey, don't fall into the trap of overestimating your abilities. Commit to the process, dedicate time to practice, and embrace the grind of learning.</p>
<p>Collaboration is key, as many groundbreaking projects are the result of team efforts.</p>
<p>Consider how major tech innovators worked together: Google’s founders met at Stanford’s computer science department, Microsoft began with Bill Gates and Paul Allen working together, and WhatsApp was a collaborative creation.</p>
<p>Learning to code is similar – it's about joining a community, sharing knowledge, and growing together.</p>
<h3 id="heading-ego-and-ongoing-learning">Ego and Ongoing Learning</h3>
<p>Even after landing your first coding job or completing a few projects, don't let ego convince you that you've learned all there is to know.</p>
<p>The tech field is ever-evolving, and continuous learning is vital.</p>
<p>Remember, the journey in coding doesn't have an endpoint. It's a continual process of growth and adaptation.</p>
<p>Your ego might make you resist new challenges, shy away from learning new languages or frameworks, or avoid seeking help when stuck.</p>
<p>Yet, these are the very experiences that enrich your coding journey and lead to true mastery.</p>
<p>History is full of examples where initial failures or setbacks led to great success.</p>
<p>Bill Gates and Paul Allen had a failed venture before Microsoft, and many successful apps and platforms were born out of earlier unsuccessful attempts.</p>
<h3 id="heading-embracing-humility-and-persistence">Embracing Humility and Persistence</h3>
<p>To thrive in your coding journey, humility and persistence are your greatest allies. Accept that failures and challenges are part of the process. Use them as stepping stones, not roadblocks.</p>
<p>Be open to continuous learning, seek feedback, and remember that collaboration enhances your growth.</p>
<p>As you progress, remember that ego is the enemy of learning. Stay grounded, focus on the process, and cherish the journey of becoming a skilled coder.</p>
<p>Your unique contribution to the world of coding lies not in being the best from the start but in being open to growth and learning from every experience along the way.</p>
<blockquote>
<p>“The first principle is that you must not fool yourself — and you are the easiest person to fool.”— Richard Feynman</p>
</blockquote>
<p>In learning to code, let your curiosity and passion for the craft be your guide, not your ego.</p>
<p>Keep your focus on the work, the learning process, and the joy of coding.</p>
<p>Identify the whispers of ego early on and counter them with discipline, humility, and a commitment to lifelong learning.</p>
<h2 id="heading-take-responsibility-for-your-learning">Take Responsibility for Your Learning</h2>
<p>Do not blame others for your lack of understanding or struggles when learning to code. Simply accept that you are the common denominator of all the problems and difficulties in your life.</p>
<h3 id="heading-are-you-not-understanding-a-particular-lesson">Are you not understanding a particular lesson?</h3>
<p>Do not blame the course, the book, or the instructor. Learning is your responsibility.</p>
<p>Every teacher tries their best, and we live in a time when you have plenty of options to choose and learn from.</p>
<p>So there is no excuse. If you work hard, you'll get there.</p>
<h3 id="heading-have-you-recently-found-that-a-piece-of-code-you-wrote-isnt-functioning-as-expected-in-your-project">Have you recently found that a piece of code you wrote isn't functioning as expected in your project?</h3>
<p>Even though this may be a rare occasion or something that you may not predict that could happen, you should still take responsibility.</p>
<p>First, admit that you made a mistake. Then, go and figure out how to fix the problem.</p>
<p>Use this as an opportunity to learn and document what went wrong and what you could do better in the future.</p>
<h3 id="heading-do-you-feel-that-you-arent-able-to-keep-up-the-pace-with-learning-new-things">Do you feel that you aren't able to keep up the pace with learning new things?</h3>
<p>I believe you already know that you are responsible for that as well.</p>
<p>It can be hard and very time consuming, especially if you have kids or other family to look after and also want to have a social life.</p>
<p>Still, your growth is your responsibility.</p>
<p><strong>You have to own that.</strong></p>
<p>You should try to carve out time a few times a week to improve your skills, whether that’s during your day job when there are no tasks to work on and you are free to learn, before leaving for work, in the evenings, or whenever is realistic for you.</p>
<p>You could try to wake up one hour earlier before work and invest that period of time in learning new things, or you could also set aside a few hours on a Sunday morning to do that.</p>
<h2 id="heading-im-afraid-to-start-programming-what-should-i-do">I'm Afraid to Start Programming. What Should I Do?</h2>
<p>Starting your journey in programming can be daunting, and it's natural to feel fear or self-doubt. But remember, even the most successful figures in tech and science have faced these challenges.</p>
<p>Consider Sergey Brin, the co-founder of Google. He achieved remarkable success but has spoken about feeling like an impostor, experiencing doubts about his contributions to the tech industry. His story shows that such feelings are normal, even at high levels of achievement.</p>
<p>Sheryl Sandberg, former COO of Facebook and a tech industry leader, also discussed her struggles with impostor syndrome. Despite her significant accomplishments, she's talked about moments of self-doubt and questioning her abilities. This highlights that everyone, regardless of their success, can experience these feelings.</p>
<p>Astrophysicist Neil deGrasse Tyson has been candid about his own experiences with impostor syndrome, reflecting on moments of self-doubt in his science career. His openness helps demystify the fears associated with stepping into new, challenging fields.</p>
<p>Dr. Maya Angelou, an esteemed author and poet, also expressed similar feelings. Despite her numerous accolades, she felt doubts about her worthiness and achievements. Her journey is an inspiring example of overcoming self-doubt to achieve greatness.</p>
<p>Wayne Gretzky's famous quote, "You miss 100% of the shots you don’t take," resonates deeply here. If fear holds you back, you'll never discover your potential in programming.</p>
<p>Starting in programming can be intimidating, and fears of failure are common. However, it's crucial to begin despite these fears. Remember, the tech experts and leaders you look up to started as beginners, just like you. They faced fears, made mistakes, and learned from them.</p>
<p>So, if your goal is to excel in programming or software engineering, embrace the challenge. Start learning and don't let fear or self-doubt deter you.</p>
<p>Everyone's journey starts with a single step, and feeling uncertain is simply a part of the process towards becoming skilled and confident in your abilities.</p>
<h1 id="heading-strategies-and-tips-for-learning-to-code">Strategies and Tips for Learning to Code</h1>
<h2 id="heading-can-you-learn-coding-in-a-single-night">Can you Learn Coding in a Single Night?</h2>
<p>A software bug in a Therac-25 radiation therapy machine <a target="_blank" href="https://www.newscientist.com/gallery/software-bugs/">caused the death</a> of five patients after receiving a massive dose of X-rays.</p>
<p>Knight Capital <a target="_blank" href="https://www.newscientist.com/gallery/software-bugs/">lost half a billion dollars</a> in half an hour when a software bug allowed computers to sell and buy millions of shares with no human oversight.</p>
<p>These and many other stories tell how seemingly unimportant bugs can actually cause disasters.</p>
<p>Software is becoming more and more important – which means that developers have more and more responsibility to be very careful and really good at what they do.</p>
<h3 id="heading-so-is-it-possible-to-learn-programming-in-just-one-night">So is it possible to learn programming in just one night?</h3>
<p>As funny as it sounds, there was a similar question asked on Quora more than 5 years ago.</p>
<p>Unfortunately, I cannot find that exact question anymore, but it stuck in my memory since then.</p>
<p>Maybe, the person who asked the question was trolling, or had an exam the next day and was hoping to get encouraging answers to pull an all-nighter and study before the exam.</p>
<p>I don’t remember the other answers, but I read one answer there which was really wise and quite funny.</p>
<p>The answer was something along these lines:</p>
<blockquote>
<p><em>Take a laptop and go to the north pole. A night there lasts 6 months. That’s how you can increase your chances of learning programming in one night.</em></p>
</blockquote>
<p>We live in a time where we want everything in a matter of seconds.</p>
<p>We want fast food, fast cars, six-pack abs in 6 days, and so on.</p>
<p>That’s the mindset that we have most of the time, and we expect the same thing in other areas as well.</p>
<p>But true mastery comes from a lot of work and dedication.</p>
<p>Take, for example, Peter Norvig, the director of research at Google, who <a target="_blank" href="https://norvig.com/21-days.html">suggests</a> that you to learn to program over the course of 10 years because rushing isn’t going to be worth it:</p>
<blockquote>
<p><em>“In 24 hours you won’t have time to write several significant programs, and learn from your successes and failures with them. You won’t have time to work with an experienced programmer and understand what it is like to live in a C++ environment. In short, you won’t have time to learn much.</em></p>
<p><em>So the book can only be talking about a superficial familiarity, not a deep understanding. As Alexander Pope said, a little learning is a dangerous thing.”</em></p>
</blockquote>
<p>If you mention that to people, they may not like it, but that’s the actual reality.</p>
<p>You cannot just jump from printing a few “Hello World” statements in the console to building the next Google a few days later.</p>
<p>I am not denying the fact that you could implement a really nice application in a few hours – but the ability to do that doesn’t come that fast.</p>
<p>Sure, you might have heard of the developer who <a target="_blank" href="https://dev.to/florinpop17/10-javascript-projects-in-10-hours-coding-challenge-316d">implemented 10 applications in 10 hours in one sitting</a>. But that’s not the result of one-night of learning. He worked hard and learned a lot before he managed to pull that off.</p>
<p>It takes time to learn something really well.</p>
<p>The more you do something, the more likely you are to get better at it. The more you practice, the more you'll be able to improve your performance – and the cycle repeats.</p>
<p>Now that you've read and hopefully internalized that, do not get too overwhelmed with the long journey ahead of you.</p>
<p>Will Smith describes it really well:</p>
<blockquote>
<p>“You don’t set out to build a wall. You don’t say ‘I’m going to build the biggest, baddest, greatest wall that’s ever been built.’ You don’t start there. You say, ‘I’m going to lay this brick as perfectly as a brick can be laid.’ You do that every single day. And soon you have a wall.”</p>
</blockquote>
<p>Now, instead of asking yourself whether you can learn programming in 1 night, a better question would be:</p>
<p><strong>What is one small but valuable thing that I could learn tonight?</strong></p>
<h2 id="heading-avoid-tutorial-hell">Avoid Tutorial Hell</h2>
<p>Have you ever spent hours watching tutorial videos and then felt like an expert, only to realize you couldn't actually do what the tutorial showed?</p>
<p>This is a common trap, and it's called "Tutorial Hell." It refers to the false sense of learning you may get when you read through a bunch of tutorials without actually trying to build something yourself.</p>
<p>When you watch tutorials without practicing, you might think you're learning, but you're really not getting the full experience.</p>
<p>Just watching something passively is not the same as truly understanding and being able to use that knowledge.</p>
<h3 id="heading-learn-to-code-by-coding">Learn to Code by Coding</h3>
<p>Learning to code is something that many people try to do just by watching videos or reading articles.</p>
<p>But if you really want to learn how to code, you have to get your hands dirty with the actual code.</p>
<p>It's not enough to sit back and watch someone else do it. <strong>You need to write the code yourself.</strong></p>
<p>This is the only way to turn the theoretical knowledge from videos into practical skills.</p>
<h3 id="heading-move-beyond-passive-learning">Move Beyond Passive Learning</h3>
<p>When diving into a specific framework or technology, it's easy to fall into the trap of passively watching or reading about it.</p>
<p>Instead, take an active approach.</p>
<p>Think of a project that you find interesting and would like to create. This could be anything from a simple website to a small app. The key is to choose something that excites you and motivates you to learn.</p>
<p>The project you choose will become your testing ground. It's where you'll apply everything you've learned from watching tutorials.</p>
<p>This hands-on practice is invaluable.</p>
<p>As you work on your project, you'll encounter real problems and challenges.</p>
<p>Solving these will deepen your understanding of the coding concepts and techniques you've learned about. You'll learn so much from googling, researching, trying and failing, and trying again.</p>
<p>It's in facing and overcoming these challenges that true learning happens.</p>
<p>Remember, the path to mastering any skill, especially coding, lies in active participation.</p>
<p>Watching tutorials is a great start, but it's the practice that makes you proficient. Learning by doing.</p>
<p>Your personal project is not just a test, but a journey towards deep understanding and skill development.</p>
<p>So, close the video player, open your code editor, and start building.</p>
<p>Your journey of true learning begins with the first line of code you write.</p>
<h2 id="heading-how-to-understand-complex-topics-by-using-the-feynman-technique">How to Understand Complex Topics by Using the Feynman Technique</h2>
<p>In the world of software engineering, there's a vast difference between simply knowing the name of something and truly understanding how it works.</p>
<p>You might know what a certain machine or a piece of software is called, but do you really grasp how it operates and accomplishes tasks?</p>
<p>This distinction is crucial in a field as complex and ever-evolving as software engineering.</p>
<p>One effective way to bridge this gap between superficial knowledge and deep understanding is through the 'Teach-Back' Technique.</p>
<p>This method, often associated with the famous physicist Richard Feynman, revolves around the idea of teaching what you learn to someone else.</p>
<h3 id="heading-what-is-the-teach-back-technique">What is the 'Teach-Back' Technique?</h3>
<p>Imagine you're explaining a new concept or tool you've learned in software engineering to a friend or a colleague who isn't familiar with it. This could be a programming concept, a coding language, or an advanced topic like blockchain or machine learning.</p>
<p><strong>First, begin with an explanation</strong>: start by breaking down the topic into simple terms. Your goal is to make it understandable to someone with little to no background in the subject. This exercise forces you to clarify your thoughts and solidify your understanding.</p>
<p><strong>Next, identify any gaps in your knowledge</strong>: as you explain, pay attention to moments where you stumble or feel uncertain. These are indicators of areas where your understanding is still shallow. Return to your study materials, whether they are books, articles, or online resources, and delve deeper into these topics.</p>
<p><strong>Remember that simplicity is key</strong>: in your explanation, avoid jargon and complex language. The ability to simplify a concept without losing its essence is a sign of true understanding. This approach not only benefits your learner but also reinforces your grasp of the subject.</p>
<p><strong>Sharing helps you solidify your knowledge</strong>: once you're comfortable with your explanation, consider sharing your newfound knowledge more broadly. Writing a blog post, creating notes, or even recording a video can further solidify your understanding and benefit others.</p>
<p><strong>Reaping the benefits</strong>: this technique of teaching others not only deepens your knowledge but also enhances your effectiveness as a software engineer. It's a powerful tool for learning and a testament to the saying, "To teach is to learn twice."</p>
<p>Remember, the true test of understanding in software engineering is your ability to convey complex ideas in simple, accessible terms.</p>
<p>The more effectively you can explain a concept, the better you understand it.</p>
<p>Embrace the role of being a teacher, even if your student is just an imaginary one, and watch as your understanding and proficiency grow.</p>
<p>This approach is not just about gaining knowledge – it's about mastering it.</p>
<h2 id="heading-dont-memorize-the-syntax">Don't Memorize the Syntax</h2>
<p>Say you move to a new city and you don’t know where the nearest grocery store is. You don’t beat yourself up — this is expected. You just use Google Maps to find it.</p>
<p>After you’ve been there several times, it’s highly likely that you won’t need to use Google Maps anymore (unless you want to check traffic or see if there are any accidents on your route – things like that).</p>
<p>So you naturally, over time, learn where things are – but it’s not that you’re intentionally <em>trying</em> to memorize every road, every possible path to a certain destination.</p>
<p>There may be cases when you're only interested in going to a certain place once.</p>
<p>It’s the same with certain methods that you may need to use in a programming language. New software developers may feel bad that they’re not memorizing sufficient syntax — that they still need to refer to the documentation.</p>
<p>They see this as a sign that they’re bad developers.</p>
<p>Here are a couple of common questions you may have when you're starting your journey into programming:</p>
<ul>
<li><p>How will I be able to learn all this syntax?</p>
</li>
<li><p>How long will it take for me to master it and write code without referring to the documentation?</p>
</li>
</ul>
<p>Then when you’re able to memorize some frequently used syntax, you may think that you’ve become good at programing.</p>
<p>You get the impression that it’s the amount of a language or the number of programming languages and frameworks you are able to memorize that really matters.</p>
<p>To put things in perspective, let’s compare the syntax of finding the length of a string in different programming languages:</p>
<ul>
<li><p><code>seq.length</code>, JavaScript lists, Java arrays.</p>
</li>
<li><p><code>seq.size()</code>, Java sequences, jQuery expressions (deprecated).</p>
</li>
<li><p><code>len(seq)</code>, Python.</p>
</li>
<li><p><code>seq.count()</code>, Django querysets.</p>
</li>
<li><p><code>SeqType'Length</code>, Ada arrays.</p>
</li>
<li><p><code>length seq</code>, Haskell.</p>
</li>
<li><p><code>(count seq)</code>, Clojure.</p>
</li>
<li><p><code>sizeof(seq)/sizeof(seq[0])</code>, C, statically allocated.</p>
</li>
<li><p><code>strlen(seq)</code>, C, null-terminated.</p>
</li>
</ul>
<p>As you can see, each language or technology has its own version of finding the length of a string. This should show you that it’s really difficult to memorize the same function in 12 different ways.</p>
<p>It’s very unlikely that a developer who’s used multiple programming languages can memorize all the syntax that they have used in the past. They may even not bother trying to learn it in the first place. So why is this? How does anyone actually write code?</p>
<h3 id="heading-is-syntax-so-important-that-i-have-to-memorize-it">Is Syntax So Important That I Have to Memorize It?</h3>
<p>To answer this, let’s see what some senior developers say.​</p>
<p>Here's a <a target="_blank" href="https://twitter.com/tdierks/status/835912924329836545">comment</a> from a senior dev at Google:</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/tdierks/status/835912924329836545&amp;image=https%3A//i.embed.ly/1/image%3Furl%3Dhttps%253A%252F%252Fabs.twimg.com%252Ferrors%252Flogo46x38.png%26key%3Da19fcc184b9711e1b4764040d3dc5c07#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​​And here's one from a developer who works on commercial airline control systems:</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/jp10k/status/835942380163457024&amp;image=#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​​And JP went on to further comment on that previous tweet:</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/jp10k/status/835944649487437826&amp;image=https%3A//i.embed.ly/1/image%3Furl%3Dhttps%253A%252F%252Fpbs.twimg.com%252Fprofile_images%252F905797472232103936%252F5TFnAP4Q_400x400.jpg%26key%3Da19fcc184b9711e1b4764040d3dc5c07#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​​Jon, a lead Android dev at Phunware, says he can't read an input stream without copying and pasting code from Stack Overflow:</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/jonfhancock/status/834178169980678144&amp;image=#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​​Another Tim commented on the original Tim's post:​​​</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/timbray/status/835933619344429056&amp;image=https%3A//i.embed.ly/1/image%3Furl%3Dhttps%253A%252F%252Fpbs.twimg.com%252Fprofile_images%252F421637246%252FTim_400x400.jpg%26key%3Da19fcc184b9711e1b4764040d3dc5c07#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​Lastly, I'll leave you with Umer's comment:</p>
<blockquote>
<p>I wrote 255 lines of code that included a working server and a client. I queried google 23 times mostly landing on StackOverflow, Netty 4 website, GitHub, and JavaDocs. If you do the math, that averages out to 1 query every 10 lines of code! I had no idea. — <a target="_blank" href="https://tiantiankan.me/a/5cb4c6c2f4b9a5fab76893b2">Umer Mansoor</a></p>
</blockquote>
<p>These insights should give you courage — you don’t have to be ashamed that you can’t remember every detail of the syntax.</p>
<p>This is something that many junior developers may be concerned about. The truth is, you really do not have to memorize everything as you go.</p>
<p>Not even tech recruiters care about that. Here’s the response that an engineering director at Google gave regarding this:​</p>
<p><a target="_blank" href="https://cdn.embedly.com/widgets/media.html?type=text%2Fhtml&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;schema=twitter&amp;url=https%3A//twitter.com/tdierks/status/836014459055443968&amp;image=https%3A//i.embed.ly/1/image%3Furl%3Dhttps%253A%252F%252Fpbs.twimg.com%252Fprofile_images%252F867170721423908865%252FReXcZP2R_400x400.jpg%26key%3Da19fcc184b9711e1b4764040d3dc5c07#__hrp=eyJtdXRlciI6ZmFsc2UsIndhaXRGb3JEb2N1bWVudEJvZHkiOnRydWUsIndhaXRGb3JEb2N1bWVudFJlYWR5IjpmYWxzZSwibm9QYXRjaGVzIjp0cnVlLCJ3aWR0aCI6IjEwMCUiLCJoZWlnaHQiOiIxMDAlIiwiZW5naW5lTmFtZSI6ImVuZ2luZS0wLjEuMCIsImZyYW1lTmFtZSI6ImVuZ2luZS0wLjEuMDoxMTE2OTAxNjk0In0=">Embedded content</a></p>
<p>​</p>
<p>Here’s another quote from a <a target="_blank" href="https://news.ycombinator.com/item?id=11603078">comment</a> on Hacker News:</p>
<blockquote>
<p>I not only use Google frequently, I use it to search for things I myself have written in the past.</p>
<p>I can’t count the number of times I’ve Googled for a programming question where the answer is found on a Stack Overflow page I’ve written. If it’s a particularly old answer that I’ve completely forgotten, I’ve even thought to myself, “Wow this genius sounds just like me!” as well as “This idiot has no clue what he’s talking about!” .</p>
</blockquote>
<p>A couple of years ago, I read a post on a Facebook group from a senior developer mentioning that when recruiters ask him whether he has experience with a particular technology for which he hasn’t, he responds, “That’s just another tool.”</p>
<p>He means that he may not have had the chance to work with it in the past but he has the confidence that he can learn it.</p>
<p>You might not need to spend months before you're able to work with a new tool. You may only need a few hours to read its documentation and then learn more as needed along the journey without the need to memorize everything.</p>
<p>You do not expect to have all green lights on when you start your journey to your destination. You pass through the current green light and stop at a red light. You wait until the green light is on before proceeding.</p>
<p>Nowadays, we get new languages and frameworks, or considerable changes to existing ones, so that trying to memorize the syntax is both difficult and not that important. As one commentator on a blog post brilliantly <a target="_blank" href="http://disq.us/p/17uk3bk">put</a> it:</p>
<blockquote>
<p>“Great engineers know how to formulate good queries. Yet interviewers expect walking dictionaries.”</p>
</blockquote>
<p>So, to sum it all up: <a target="_blank" href="https://www.freecodecamp.org/news/how-to-search-google-like-a-pro/">get really good at googling</a> and learning as you go :)</p>
<h2 id="heading-keep-a-to-learn-list">Keep a To-Learn List</h2>
<p>You might have heard of to-do lists for keeping track of daily chores or tasks.</p>
<p>But as a software engineer, where learning is as important as doing, a "to-learn" list becomes your roadmap to growth and discovery.</p>
<p>Think of a "to-learn" list as your personal guide in the world of technology.</p>
<p>Just as a to-do list reminds you to buy groceries or pay bills, a to-learn list keeps track of all the exciting things in technology you want to explore.</p>
<p>This could be a new programming language that's taking the world by storm, a revolutionary tool that can change the way you code, or the latest trends in fields like artificial intelligence.</p>
<p>Your to-learn list is more than just a collection of cool things – it's a set of goals.</p>
<p>It's like having a bucket list for your professional development, full of adventures waiting to be embarked upon.</p>
<p>Whether it's mastering a new coding language, diving into insightful books, or enrolling in online courses, this list is your ticket to a world of endless learning.</p>
<p>A to-learn list keeps your curiosity alive. It's like having a treasure map where X marks the spot for new knowledge.</p>
<p>Each item on the list is a stepping stone to understanding the deeper workings of technology, beyond just using it.</p>
<p>This list also acts as a motivator. Imagine each new skill you learn as a level-up in a game, making you more capable and skilled in your job.</p>
<p>It's a reminder that your journey in software engineering is filled with exciting milestones waiting to be achieved.</p>
<p>Remember, there's always more to learn, and that's a good thing.</p>
<p>It keeps you humble and open-minded, acknowledging that the tech world is vast and ever-evolving, and no one knows it all.</p>
<p>This perspective is vital for continuous growth.</p>
<p>As you check off items on your to-learn list, you'll find yourself becoming a problem-solving wizard.</p>
<p>Each new skill or piece of knowledge adds to your ability to tackle complex challenges, making you an invaluable asset to your team.</p>
<p>The more you learn, the more valuable you become as a software engineer. This means being able to handle tasks more efficiently and creatively, boosting your productivity and making you a star performer in your field.</p>
<p>Your "to-learn" list is a powerful tool in your journey as a software engineer.</p>
<p>It's a living document that grows and changes with you, reflecting your aspirations and curiosity.</p>
<p>By maintaining and updating this list, you ensure that your journey in software engineering is always moving forward, filled with continuous learning and personal growth.</p>
<p>So, embrace your "to-learn" list, and let it guide you to new heights in your career, keeping you curious, motivated, and ever-evolving in the dynamic world of technology.</p>
<h1 id="heading-practical-aspects-of-coding"><strong>Practical</strong> A<strong>spects of</strong> C<strong>oding</strong></h1>
<h2 id="heading-how-to-deal-with-overwhelming-projects">How to Deal with Overwhelming Projects</h2>
<p>Big software projects, like those of Google, Amazon, or WhatsApp, often seem like modern marvels.</p>
<p>They can be awe-inspiring, reflecting complex engineering and innovative ideas.</p>
<p>If you ever consider the teams behind these giants, it's natural to feel a mix of awe and intimidation. The scale and impact of such projects can seem overwhelming.</p>
<p>Remember, the builders of these platforms likely faced similar feelings at the outset. But they didn't allow apprehension to hinder their progress.</p>
<p>Instead, they channeled it into productive action, laying brick by brick the foundation of what would become technological milestones.</p>
<p>As a software engineer, you might not be tasked with building the next global tech phenomenon right away, but every project, no matter its size, can feel daunting at the start.</p>
<p>Here's a roadmap to help you tackle even the most intimidating software engineering projects.</p>
<h3 id="heading-vision-seeing-the-end-from-the-start">Vision: Seeing the End from the Start</h3>
<p>One of the most critical steps in managing a large project is to have a clear vision. This means having a well-defined picture of the end goal. The clearer this vision, the easier it will be to navigate towards it.</p>
<p>Try to articulate this vision in simple terms, maybe through a diagram or a straightforward description.</p>
<p>Your goal should be to make this vision so understandable that anyone, regardless of their technical background, can grasp it.</p>
<p>For instance, if you're developing a complex web application, outline its core functionalities. Envision the user experience, the interface, and the key features that will define your application.</p>
<h3 id="heading-breaking-it-down-the-art-of-reverse-engineering">Breaking It Down: The Art of Reverse Engineering</h3>
<p>With your end goal vividly pictured, the next step is reverse engineering this vision into actionable steps.</p>
<p>This process involves deconstructing your final goal into smaller, manageable tasks. These tasks should be quantifiable, allowing you to plan and schedule them effectively.</p>
<p>In plotting your course, set clear milestones. These are significant checkpoints that signal progress towards your ultimate objective.</p>
<p>Take a web application as an example: begin by charting out the various stages of development. This could include initial design, front-end development, back-end setup, integration of functionalities, testing phases, and final deployment. Then you can tackle each one, one at a time.</p>
<h3 id="heading-starting-point-the-first-small-step">Starting Point: The First Small Step</h3>
<p>Every monumental project begins with a single, often small, step.</p>
<p>Do not fall into the trap of believing you can conquer the entire project in one go. Large-scale projects demand time, effort, and persistence.</p>
<p>Start with a manageable task or component of the project. Completing this initial task will provide a sense of accomplishment and momentum.</p>
<p>Progress, however incremental, is a powerful motivator. It propels you forward, fueling your drive to tackle the subsequent phases of your project.</p>
<p>If you find yourself hesitating to start, it might be because the task at hand seems too daunting. In such cases, break down the task further into smaller, more approachable segments.</p>
<h3 id="heading-reflective-progress-the-importance-of-review">Reflective Progress: The Importance of Review</h3>
<p>Regularly step back and review your progress.</p>
<p>This practice is essential for ensuring that you're on the right path toward your goal.</p>
<p>It’s easy to get caught up in the minutiae and lose sight of the broader objective. A periodic review helps you realign your efforts with your initial vision.</p>
<p>This review process is not merely a check-in. It's a strategic evaluation of your direction and methods. It might lead to course corrections, refinements of strategies, or even a reassessment of your goals.</p>
<h3 id="heading-the-path-through">The Path Through</h3>
<p>It’s common in software engineering to encounter phases of doubt and to feel stuck in a cycle of inaction.</p>
<p>Waiting for the perfect moment or for challenges to ease on their own is a futile approach. Instead, the key to conquering large projects lies in embracing responsibility and actively engaging with the tasks at hand.</p>
<p>No matter the size of the project, its completion is always achievable through careful planning, dedication, and unwavering focus.</p>
<p>Remember, in the realm of software engineering, <em>the only way out is the way through</em>.</p>
<p>Each step, no matter how small, is a move towards the realization of your project. Embrace each phase of the journey with commitment and resolve, and watch as your ambitious projects turn into accomplished realities.</p>
<h2 id="heading-how-to-choose-projects-to-build">How to Choose Projects to Build</h2>
<p>As you start learning and trying to apply your skills, you'll likely have a lot of project ideas that you're eager to start building.</p>
<p>Maybe you've listed them in a project management tool or jotted them down in your notebook. You have various app concepts, software solutions, or coding experiments you're excited about. But there's a common challenge: deciding which project to tackle first.</p>
<p>This indecision can lead to procrastination. You might find yourself opting for activities that are more immediately gratifying, avoiding the commitment to a single project.</p>
<p>"Perhaps there's something more crucial I should be working on?" you wonder. "Should I start this app or that automation script? Maybe I should brainstorm more ideas and something will click."</p>
<p>Let's pause for a moment and consider an old fable that might shed some light on this predicament.</p>
<h3 id="heading-learning-from-buridans-donkey">Learning from Buridan's Donkey</h3>
<p>There's a story about a donkey that was exactly in the middle of some hay and water. It couldn't decide whether to eat or drink first, so it didn't do either and got really hungry and thirsty.</p>
<p>The donkey didn't think about just picking one thing first and then doing the other thing next.</p>
<p>As software engineers, we often face a similar dilemma with our projects. We have numerous ideas and concepts, but none of them will come to fruition without action.</p>
<p>It's essential to recognize that we can't work on every project simultaneously. Just as we can't be in two places at once, we can't simultaneously code different applications. And this physical limitation shouldn't hinder our progress towards our goals.</p>
<h4 id="heading-just-start-with-one-project">Just start with one project</h4>
<p>Is it the perfect choice? Maybe, maybe not. But that's not what's critical at this moment.</p>
<p>The project you choose to work on probably isn't a life-or-death decision. Pick one and begin. You can always return to your other ideas later.</p>
<p>Start by outlining the features of the app or software. Code the first function or interface. Celebrate this progress, however small. Then, continue developing piece by piece.</p>
<p>Repeat this process for your other projects.</p>
<p>Don't let a plethora of choices impede your progress. Over-analysis leads to paralysis, stifling your movement towards completing your projects.</p>
<p>Stop overthinking. Start coding.</p>
<p>Let the world benefit from your work, one completed project at a time.</p>
<h3 id="heading-how-to-overcome-procrastination">How to overcome procrastination</h3>
<p>This is a common challenge for software engineers: "I know I need to start coding, but I just can't seem to begin."</p>
<p>"The blank IDE screen is intimidating. I can't get my fingers to start typing."</p>
<p>Consider how Ernest Hemingway, a renowned writer, dealt with writer's block:</p>
<blockquote>
<p>“Sometimes when I was starting a new story and could not get it going, I would sit in front of the fire and squeeze the peel of the little oranges into the edge of the flame and watch the sputter of blue that they made.</p>
<p>I would stand and look out over the roofs of Paris and think, ‘Do not worry. You have always written before and you will write now. All you have to do is write one true sentence. Write the truest sentence that you know.’</p>
<p>So finally I would write one true sentence, and then go on from there.”</p>
</blockquote>
<p>Adapt this approach to your coding. Start with a simple feature or function.</p>
<p>If that's all you accomplish for the day, so be it. Consistent small steps lead to significant progress.</p>
<p>Even a modest amount of coding each day maintains consistency. And often, once you start on a small task, you'll find yourself naturally progressing to more substantial parts of the project.</p>
<h3 id="heading-inspiration-from-history">Inspiration from History</h3>
<p>Consider Isaac Newton, who, during the bubonic plague lockdown in 1666, retreated to his family home from the University of Cambridge.</p>
<p>Without modern tools or online classes, Newton used this time to delve into complex mathematical problems, eventually laying the groundwork for calculus.</p>
<p>His focus and dedication led to groundbreaking discoveries.</p>
<p>In software engineering, it's easy to get caught up in finding the perfect tool or environment.</p>
<p>But remember, the real work comes from dedication and effort, not from having the latest technology or software.</p>
<blockquote>
<p>“Real professionals don’t hide behind their tools — real professionals use what’s around them. It’s the amateurs who try to nerd out about their tools — it’s all a distraction from really doing the work.” — Derek Sivers</p>
</blockquote>
<p>Let's move beyond excuses. Let's get back to coding.</p>
<h2 id="heading-learn-by-building-things-from-scratch">Learn by Building Things from Scratch</h2>
<p>Every time you start a new project, think of it as adding a brick to your knowledge fortress.</p>
<p>You'll encounter the essential elements of software – like algorithms, data structures, and design patterns. These are the ABCs of software, and grasping them deeply turns you into a more skilled and versatile engineer.</p>
<p>When you build from scratch, you're the architect and the builder. You get to decide every detail, customizing your project to fit your interests and needs.</p>
<p>It's like cooking a meal where you choose every ingredient to suit your taste, making the entire process deeply personal and satisfying.</p>
<p>Starting from zero means you'll walk through every stage of creating software – from the first sketch of your idea to making it work and showing it to the world.</p>
<p>This complete journey is like reading a book from cover to cover, giving you a full picture of how software comes to life.</p>
<p>Building from the ground up often means exploring the depths of the technologies you're using. Imagine diving into the ocean to discover what's underneath – that's what you do with each technology, understanding its secrets and subtleties.</p>
<p>As you build, you'll face various puzzles and challenges. Each problem you solve sharpens your mind, not just in coding but in finding smart, elegant solutions to tricky situations.</p>
<p>There's a special kind of pride and confidence that comes from seeing a project evolve from a simple idea to a working program.</p>
<p>It's like climbing a mountain – with every step, you feel stronger and more capable.</p>
<p>The hurdles you overcome while crafting software from scratch are similar to those you'll face in the professional world.</p>
<p>Be it fixing an unexpected error, adding a complex feature, or managing your time – these experiences are like rehearsals for the real-world stage of software engineering.</p>
<p>Embarking on a project from scratch is a cornerstone of your journey as a software engineer. It's an exercise in patience, persistence, and creativity.</p>
<p>Remember, it's not just about the software you build. It's about the skills you hone, the knowledge you acquire, and the confidence you develop.</p>
<p>Each project is a step towards becoming not just a coder, but a true artisan in the realm of technology. So, begin with an empty file and a spark of an idea, and let the magic of creation unfold.</p>
<h2 id="heading-build-something-that-already-exists">Build Something that Already Exists</h2>
<p>In the thrilling journey of software development, starting a new project often feels like opening a treasure chest filled with endless possibilities.</p>
<p>While it's tempting to dive into creating something unique and complex, the path of learning often calls for a simpler, more familiar approach.</p>
<p>Now, we'll explore the idea that not every project must be groundbreaking. Sometimes, the best learning comes from simplicity and familiarity.</p>
<p>Imagine starting with a blank canvas. Instead of painting a complex masterpiece right away, you first practice with simple strokes and familiar patterns. This is the essence of learning in software development.</p>
<p>By keeping projects simple and manageable, you avoid the trap of overwhelming complexity, allowing you to focus on the fundamentals of coding and problem-solving.</p>
<p>Think of existing open-source projects as a library filled with books you can learn from. These projects, created by others and shared on platforms like GitHub, are like guides offering valuable lessons.</p>
<p>They're a starting point, showing you how things are built and encouraging you to explore further.</p>
<p>Picture yourself as an apprentice painter, learning by replicating the works of masters. Similarly, in software development, <a target="_blank" href="https://www.freecodecamp.org/news/javascript-game-tutorial-stick-hero-with-html-canvas/">cloning an existing project</a> is a <a target="_blank" href="https://www.freecodecamp.org/news/learn-how-to-create-an-instagram-clone-using-react/">hands-on way to learn coding and problem-solving</a>.</p>
<p>After recreating the project, compare your work with the original. This comparison acts as a mirror, reflecting your strengths and areas for improvement.</p>
<p>Think about an app or a website you use daily. What if you tried to build a version of it yourself? This approach makes learning fun and relevant.</p>
<p>Working on something you're familiar with keeps you engaged and helps you understand the project's intricacies more deeply.</p>
<p>In your learning journey, focus on projects that challenge and enhance your skills, rather than trying to invent something entirely new. It's like practicing scales in music – they may not be glamorous, but they're essential for growth.</p>
<p>Prioritize learning and skill development over the pursuit of a groundbreaking idea. As you embark on new software projects, remember that your primary goal is to grow as a developer. It's not just about building something novel – it's about building your capabilities and confidence.</p>
<p>By replicating existing projects and focusing on the learning process, you turn each project into a valuable step in your journey.</p>
<p>This approach not only enriches your understanding but also lays a strong foundation for your future as a skilled software engineer.</p>
<p>So, grab your tools and start building – not just software, but a path to mastery in the art of development.</p>
<h1 id="heading-beyond-the-basics">Beyond the Basics</h1>
<h2 id="heading-develop-a-love-learning">Develop a Love Learning</h2>
<p>Software development is one of the most in-demand professions of our time.</p>
<p>There are constantly new job openings, which attract both youngsters and already employed people from a wide range of professions.</p>
<p>They know that you can get a really good salary working as a software engineer, and so they start their careers with great ambitions.</p>
<p>Even if you get a job in software development, if you really want to become great, it helps to love learning and programming.</p>
<p>It is one of the few professions in which you constantly have to learn something new. It’s not just the existing concepts you need to know. You have to adapt to the constant influx of new technologies.</p>
<p>You have to adapt to the changes in the market and learn whatever new things are currently considered as valuable. In short, you will have to consistently learn a lot.</p>
<p>In order to keep your brain constantly engaged in learning, you will have to be curious and stay humble.</p>
<p>Often, programmers get employed on the basis of their existing knowledge and start to think they don’t need to learn new things anymore. But you will only be able to excel as a software engineer if you are curious and love learning, as the need to learn never ceases.</p>
<p>In November 1915, after writing only two pages of what he referred to as “one of the most beautiful works of my life,” Einstein sent his 11-year-old son Hans Albert a letter.</p>
<p>He praised his son for his learning efforts, saying, “That is the way to learn the most…When you are doing something with such enjoyment that you don’t notice the time passes.”</p>
<p>“Curiosity has its own reason for existing,” Einstein explains. “One cannot help but be in awe when one contemplates the mysteries of eternity, of life, of the marvelous structure of reality.”</p>
<p>Become curious about how a framework works and is structured. When you learn something thoroughly, you gain a clear picture of its mechanisms and functionalities.</p>
<p>For example, don't simply accept that scikit-learn is a great framework for machine learning — learn how it works, behind the curtains. And consider the possibility of contributing to and improving it, as it is open source.</p>
<p>Also, try not to be overly concerned with money. Of course, we all need money to pay our bills and buy food for ourselves and our family. These are basic needs, and we need to meet them – so money is critical. But try to cultivate a passion for learning and developing for the sake of it. This will make the financial compensation all the more rewarding.</p>
<p>Try to develop a love of programming and feel grateful that you have the opportunity to positively impact the lives of millions of people with the lines of code that you write.</p>
<p>Einstein believed that “love is a better teacher than a sense of duty.”</p>
<p>What we can learn from this as software engineers is the importance of not just working for a good salary but working because we love learning and our work in general. If we can develop an intrinsic curiosity and drive that keeps us engaged after work or during the weekends when our boss is not watching, all the better.</p>
<h2 id="heading-look-at-the-bigger-picture">Look at the Bigger Picture</h2>
<p>In the fast-paced and exciting world of software engineering, it's crucial to understand that being a software engineer is about much more than just writing code.</p>
<p>Imagine you're not just a builder, but also an architect and a visionary. Your role is like being a key player in a big team, where your ideas and work help the team win.</p>
<h3 id="heading-understand-your-impact">Understand your impact</h3>
<p>When you're a software engineer, you might spend a lot of time working on specific coding tasks – like solving a puzzle piece by piece.</p>
<p>But, it's important to remember that you're actually helping to complete a much larger puzzle.</p>
<p>Let's say your company is like a big ship, and you're not just fixing parts of the ship – you're helping it reach its destination.</p>
<p>Imagine you're making an app for a local bakery. Instead of just focusing on making the buttons work, you should also think about how your app will help the bakery get more customers and make their life easier.</p>
<h3 id="heading-seeing-the-whole-not-just-the-parts">Seeing the whole, not just the parts</h3>
<p>As you grow in your career, you'll start to see not just the lines of code you write, but the whole project, like looking at a whole forest instead of just one tree.</p>
<p>This means you'll start to understand how your work affects everything else and can make decisions that help the entire business.</p>
<p>Think of a puzzle game on your phone. If you only focus on one small part, you might miss a better solution that solves more puzzles at once.</p>
<h3 id="heading-from-coding-to-contributing">From coding to contributing</h3>
<p>When you start focusing on the most important tasks, you become more than just someone who writes code. You become someone who solves big problems.</p>
<p>This is like moving from being a player in a game to being the one who helps plan the strategy of the game.</p>
<p>Imagine your company is like a garden. At first, you might be planting individual flowers (writing code). But later, you start to plan where to plant trees and how to make the garden more beautiful (strategic thinking).</p>
<h3 id="heading-more-than-a-coder">More than a coder</h3>
<p>By aligning your work with what the business really needs, you become a key player on your team. Your work starts to have a big impact, and you become someone everyone relies on.</p>
<p>It's like being a star player on a sports team who not only scores goals but also helps the team win championships.</p>
<p>If you're working on a website, don't just make it look good. Think about how it functions, how it can attract more visitors, and how it can help the business grow.</p>
<p>Being a software engineer is an amazing journey. It's not just about writing code, but about using your skills to help the business and its customers.</p>
<p>When you start to see your role in this bigger way, you grow not just as a programmer, but as a key member of your team.</p>
<p>This approach will help you develop both personally and professionally in the exciting world of software engineering.</p>
<p>Remember, you're not just building software – you're building success stories.</p>
<h2 id="heading-embrace-lifelong-learning-in-software-engineering">Embrace Lifelong Learning in Software Engineering</h2>
<p>Think of the field of software engineering not as a one-time race but as an ongoing marathon with new and exciting paths to explore at every turn.</p>
<p>Your formal education, whether you got a college degree or participated in a bootcamp or taught yourself to code – it's just the starting line.</p>
<p>What lies ahead is a thrilling adventure of continuous learning and growth.</p>
<p>Picture yourself as a detective in the world of technology. Each new challenge is a mystery waiting to be solved.</p>
<p>At first, these puzzles may seem daunting, but as you learn more, you'll find joy in piecing together the solutions. This journey enhances your confidence and turns complex problems into exciting quests.</p>
<p>In the fast-paced tech landscape, what's hot today might be forgotten tomorrow. So while it's important to stay up-to-date and aware of the latest trends, don't forget to work on the fundamentals and learn the mainstay technologies.</p>
<p>So while you'll want to learn new programming languages and frameworks, and get comfortable with the latest software, be practical about what you focus on.</p>
<p>As you learn and grow, your value as a software engineer will skyrocket.</p>
<p>This isn't just about earning a bigger paycheck – it's about getting your hands on more exciting and challenging projects.</p>
<p>Just like a sought-after artist, your up-to-date skills and knowledge can help make you a hot commodity in the tech world.</p>
<p>Imagine each new skill you learn as a key. The more keys you have, the more doors you can open. This could lead to better job offers, working on groundbreaking projects, or even guiding a team.</p>
<p>Your knowledge and experience are like a map, guiding you to a rewarding and dynamic career.</p>
<h2 id="heading-good-luck">Good Luck!</h2>
<p>Thank you for reading this handbook! I hope you now feel better equipped to break into the world of tech, grow your skills, and work towards your first – or next – developer job.</p>
<h3 id="heading-get-the-pdf-version-of-the-book">Get the PDF version of the book</h3>
<p>You can read this book as a PDF by downloading it <a target="_blank" href="https://fatosmorina.gumroad.com/l/coding-for-everyone">here</a>.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ How to Come Up With Good Coding Project Ideas ]]>
                </title>
                <description>
                    <![CDATA[ By Erin Borders If you're a developer looking to improve your coding skills, building projects is a great way to do that. But coming up with project ideas that actually make you eager to start can be tough. That's why I wrote this article: to help yo... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/how-to-come-up-with-coding-project-ideas/</link>
                <guid isPermaLink="false">66d45e3c38f2dc3808b79091</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ projects ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Fri, 07 Jul 2023 17:57:52 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/07/steve-johnson-lPX6-ee-1zU-unsplash.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Erin Borders</p>
<p>If you're a developer looking to improve your coding skills, building projects is a great way to do that. But coming up with project ideas that actually make you eager to start can be tough.</p>
<p>That's why I wrote this article: to help you learn how to come up with fun and interesting projects you can build.</p>
<h2 id="heading-the-process">The Process</h2>
<p>I come up with my project ideas through the content that I consume and the problems that I experience. </p>
<p>For example, you can keep a notebook handy and jot down:</p>
<ol>
<li>Problems you come across in your day to day work or life</li>
<li>Desires or interests you've had on the back burner</li>
</ol>
<p>Don't limit yourself in this phase – anything you come across is fair game. I'll give you some of my examples.</p>
<p><strong>Problems</strong>:</p>
<ul>
<li>Forgetting to reach out to my long distance friends</li>
<li>People calling me about buying my property</li>
<li>Forgetting to text people when I get home safely</li>
<li>Sites that constantly ask if I want to accept or reject cookies</li>
</ul>
<p><strong>Desires</strong>:</p>
<ul>
<li>Conversation partner in a language I'm learning</li>
<li>Finding foreclosed houses</li>
<li>Finding pop ups in my city quickly and easily</li>
</ul>
<p>Then, after I have a list of problems and desires, I start looking into whether or not I can make a coding project out of it. I'll demonstrate by walking through my latest project from concept to finish.</p>
<h2 id="heading-language-partner-project">Language Partner Project</h2>
<p>I've always been interested in becoming fluent in another language, with dreams of holding deep conversations with native speakers. I've tried for several years to turn my rudimentary Spanish knowledge into fluency, reading all sorts of books and watching videos to see different techniques and recommended tools. </p>
<p>Then I read <em><a target="_blank" href="https://www.scotthyoung.com/blog/ultralearning/">Ultralearning by Scott Young</a></em>. It's an interesting book, but I mostly bring it up because it reminded me of the most important thing: while I'm going back and forth over how to best study vocabulary and grammar, I'm not practicing the one thing that would most greatly improve my speaking ability – speaking. </p>
<p>Speaking is the quickest way to improve my conversational skills, but it's also the most painfully awkward. I don't love the idea of stumbling over my words with strangers for weeks on end, even if that person was a tutor experienced in deciphering beginner Spanish. So I began to think: what if I could program a language partner?</p>
<p>And so my project was born. From that initial concept, I verified that what I wanted to do was possible. My background is in web development, so that meant checking what the web was capable of (using <a target="_blank" href="https://whatwebcando.today">https://whatwebcando.today</a>, which I found on a great <a target="_blank" href="https://app.pluralsight.com/paths/skill/building-progressive-web-applications">Pluralsight course about Progressive Web Apps</a>) then tackling it as best I can. </p>
<p>When I run into tools or concepts that I don't know, I go to the documentation or YouTube – whichever can explain it to me in a way I actually understand (and don't forget ChatGPT here too. Asking it to explain a concept to you like you're five comes in really handy.). </p>
<p>I try to do at least one Getting Started tutorial from whatever resource I chose to make sure I actually understand the concept. Then I go right back to my project. I try to document what I learn as I learn it.</p>
<p>For an extra challenge, I sometimes like to find apps that are similar to the idea that I had and try to think of ways that I can differentiate my app to push myself even more. If I can't think of anything, that's fine – the project is still worth doing. But I feel it's good preparation to think about the market when creating a product anyways.</p>
<p>All of this to say, a great coding project is often found in the gap between wanting something and not being able to find anything already out there to suit your specific needs. I also find this particularly helpful because the ideas that arise this way are custom tailored to my interests. </p>
<p>While I do think that learning about cloud services or software engineering best practices is important, that in and of itself would bore me to tears and I don't stick with projects when they're boring. It's more important to me that the project revolve around interests that I already have so that I stay engaged and creative. </p>
<h3 id="heading-caveat">Caveat</h3>
<p>The number one issue I see with having a process like this is that it can feel like you're butchering a golden idea. For instance, if I'm only just beginning to grasp how to use mic audio from the web browser, my language partner project might not be as sleek as I'd dreamed, and that can make the project seem like it's not worthwhile. </p>
<p>Or worse yet, it can trick me into thinking it's better if I put it off until I'm ready.<br>That's why I love the diagram below from <a target="_blank" href="https://austinkleon.com/steal/">Austin Kleon's Steal Like an Artist.</a></p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/07/projectlife.jpeg" alt="Image" width="600" height="400" loading="lazy">
<em>The Life of a Project from Steal Like an Artist by Austin Kleon</em></p>
<p>It's both a reminder of the big picture and a call to action. No, your first time tackling the project probably won't be your best. But it'll be worth it. </p>
<p>More importantly, any truly great idea is iterative. The first iteration is never what's sold on the shelf. The sooner you get through this rough draft, the sooner you can get to the second, the third, so on and so forth until you have your finished product. </p>
<h2 id="heading-wrapping-up">Wrapping Up</h2>
<p>Thank you for taking the time to read this article! If you found it helpful, please consider leaving me a star on <a target="_blank" href="https://github.com/erinborders">GitHub</a> or consider endorsing me for relevant skills on <a target="_blank" href="https://www.linkedin.com/in/erin-borders/details/skills/">LinkedIn</a>. </p>
<p>And if you'd like a tutorial on the language learning partner that I'm working on, or a more in depth walkthrough of anything I've mentioned here, please let me know!</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ How to Supercharge Your Studying with Python, Anki, and ChatGPT ]]>
                </title>
                <description>
                    <![CDATA[ By Otavio Ehrenberger You may have heard how students can use ChatGPT to cheat on assignments. But we should also talk about what a fantastic study tool it can be.  In this article we'll discuss how you can use ChatGPT to help you study and learn new... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/supercharged-studying-with-python-anki-chatgpt/</link>
                <guid isPermaLink="false">66d851f98e0f1545d498f487</guid>
                
                    <category>
                        <![CDATA[ chatgpt ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Python ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Tue, 25 Apr 2023 20:35:46 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/04/pexels-pixabay-256302.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Otavio Ehrenberger</p>
<p>You may have heard how students can use <a target="_blank" href="https://chat.openai.com">ChatGPT</a> to cheat on assignments. But we should also talk about what a fantastic study tool it can be. </p>
<p>In this article we'll discuss how you can use ChatGPT to help you study and learn new skills.</p>
<p>You'll see how to instruct ChatGPT to give you a nicely formatted list of information that you should memorize. You'll then see how to input it into a Python program that will output an Anki package. Finally, you'll load the package into Anki to help you remember the concepts through memory triggers.</p>
<p>I'll show you how to create Anki cards programmatically using Python and the <a target="_blank" href="https://github.com/kerrickstaley/genanki">Genanki</a> library. We will create an Anki deck for learning the Linux filesystem directories and their descriptions. The deck will contain basic and reverse type cards for each directory.</p>
<h1 id="heading-what-is-anki">What is Anki?</h1>
<p><a target="_blank" href="https://apps.ankiweb.net/">Anki</a> is a powerful open-source flashcard application that helps users memorize information more efficiently using spaced repetition. It is available on multiple platforms, including Windows, macOS, Linux, iOS, and Android. </p>
<p>Anki allows users to create their own decks of flashcards containing text, images, audio, and even LaTeX equations.</p>
<p>Learning how to properly use Anki is a skill in itself. <a target="_blank" href="https://www.youtube.com/watch?v=7K2StK7e3ww&amp;t=6s">Here is a good video to get you started</a>. In this program we will use the concepts of Anki models, cards, notes, decks and packages to create our card set. But first, let's learn a bit more about how Anki works.</p>
<h3 id="heading-anki-models">Anki Models</h3>
<p>An Anki model, also known as a note type, defines the structure and layout of a set of cards. Each model consists of a set of fields, which store the information to be learned, and a set of card templates, which determine how that information is displayed on the cards. </p>
<p>Models allow users to create different types of cards and layouts for various learning needs, such as basic cards, reverse cards, and cloze deletion cards.</p>
<h3 id="heading-anki-cards">Anki Cards</h3>
<p>An Anki card is a digital flashcard containing information to be learned. Each card has a front side, which usually contains a question or a prompt, and a back side, which contains the answer or additional information related to the front side. </p>
<p>Anki cards can contain text, images, audio, and even LaTeX equations. Cards are generated from models and their associated fields, which determine the content and layout of the cards.</p>
<h3 id="heading-anki-notes">Anki Notes</h3>
<p>An Anki note is a single piece of information that is used to generate one or more flashcards or Anki cards. </p>
<p>Each note is based on a specific model (also known as a note type), which defines the structure, layout, and fields for that note. Fields store the actual content of the note, such as questions, answers, or prompts, while the model determines how that content is displayed on the generated cards.</p>
<h3 id="heading-anki-decks">Anki Decks</h3>
<p>An Anki deck is a collection of cards on a specific topic or subject. Decks are used to organize cards into meaningful groups, making it easier for users to focus on a particular area of study. </p>
<p>Anki allows users to create and customize their own decks, which can be shared with others, imported, or exported. Users can study one deck at a time or multiple decks simultaneously, depending on their learning goals and preferences.</p>
<h3 id="heading-anki-packages">Anki Packages</h3>
<p>An Anki package is a single file containing one or more decks, along with their associated cards, models, media files, and other related data. Anki packages have the file extension ".apkg" and can be easily shared, imported, or exported between users and devices. </p>
<p>Anki packages are a convenient way to distribute decks and related content, as they bundle all necessary information in a single file. When importing an Anki package, the decks, cards, and models it contains are added to the user's existing collection.</p>
<h1 id="heading-how-to-use-chatgpt-as-a-study-aid">How to Use ChatGPT as a Study Aid</h1>
<p>You can think of ChatGPT like a humanoid Google. It won't do the work for you and it certainly won't do the thinking for you. But if you know how to phrase your questions, it can give you some pretty good answers, and in the format you would like them to be. This makes inserting these answers in a program that much easier.</p>
<p>In this example, I'm going to ask a question regarding the Linux filesystem. I expect the answer to be a list of the directories accessible from the root folder, with an explanation of why they are there. If it doesn't give you the answer you want, remember to be more specific.</p>
<p><img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rufulo3vzyby3ueost53.png" alt="Chat GPT answer on the Linux filesystem" width="962" height="988" loading="lazy"></p>
<p>This is a partial screenshot – the answer goes all the way to 14, the <code>/var</code> directory used to store fluid data files that are supposed to change during a system use session, and the last one in alphabetical order.</p>
<p>So far, so good. But if we want to insert this information into a program, we need to have it formatted. This is an area where Chat GPT shines. </p>
<p>If you receive, say, a paragraph as an answer, you can just ask the robot to rephrase it as an ordered list. Then you can ask it to send each item as an array of tuples, for instance. Here's an example based on the last answer:</p>
<p><img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5tosze6su9fq8ieswu56.png" alt="Image description" width="962" height="1500" loading="lazy"></p>
<p>Remember to always review the answers before uploading them to Anki, as you'll hammer the returned information into your brain. You don't want to sabotage your learning during your studies.</p>
<p>This is enough for now, let's get to coding.</p>
<h1 id="heading-how-to-install-genanki">How to Install Genanki</h1>
<p>To get started, you'll need to install the <code>genanki</code> library, which is a Python library for creating Anki decks and cards programmatically. You can install it using <code>pip</code>:</p>
<pre><code class="lang-bash">pip install genanki
</code></pre>
<h1 id="heading-how-to-create-anki-cards-and-decks">How to Create Anki Cards and Decks</h1>
<p>Now that we have the <code>genanki</code> library installed, let's create a Python script that generates the Anki cards and deck for Linux filesystem directories.</p>
<h2 id="heading-preparations">Preparations</h2>
<p>Here we'll import the library and paste in the ChatGPT answer. It will be used as a parameter to the functions provided by <code>genanki</code>.</p>
<pre><code class="lang-python"><span class="hljs-keyword">import</span> genanki

<span class="hljs-comment"># List of Linux directories and their descriptions</span>
linux_dirs = [
    (<span class="hljs-string">'/'</span>, <span class="hljs-string">'Root directory, starting point of the filesystem hierarchy.'</span>),
    (<span class="hljs-string">'/bin'</span>, <span class="hljs-string">'Contains essential system command executables.'</span>),
    (<span class="hljs-string">'/sbin'</span>, <span class="hljs-string">'Contains essential system administration command executables.'</span>),
    (<span class="hljs-string">'/boot'</span>, <span class="hljs-string">'Contains files needed to start the boot process.'</span>),
    (<span class="hljs-string">'/etc'</span>, <span class="hljs-string">"Contains system-wide configuration files and scripts."</span>),
    (<span class="hljs-string">'/dev'</span>, <span class="hljs-string">'Contains device files representing hardware devices.'</span>),
    (<span class="hljs-string">'/home'</span>, <span class="hljs-string">'Contains personal directories for each user.'</span>),
    (<span class="hljs-string">'/lib'</span>, <span class="hljs-string">'Contains shared libraries and kernel modules.'</span>),
    (<span class="hljs-string">'/opt'</span>, <span class="hljs-string">'Optional directory for storing third-party software.'</span>),
    (<span class="hljs-string">'/proc'</span>, <span class="hljs-string">'Virtual filesystem providing an interface to kernel internal data structures.'</span>),
    (<span class="hljs-string">'/sys'</span>, <span class="hljs-string">'Virtual filesystem providing an interface to kernel internal data structures for devices, drivers, and other components.'</span>),
    (<span class="hljs-string">'/tmp'</span>, <span class="hljs-string">'Temporary directory for storing files deleted after a system reboot.'</span>),
    (<span class="hljs-string">'/usr'</span>, <span class="hljs-string">'Contains user-related files, shared libraries, header files, documentation, and non-essential software binaries.'</span>),
    (<span class="hljs-string">'/var'</span>, <span class="hljs-string">'Contains variable data files, such as logs, databases, and mail spools.'</span>),
]
</code></pre>
<p>Here we have to generate a model ID for the cards we are creating, which has to be unique. You will also have to give a name to your model, create fields to be populated by content, and then declare a template for your note using these fields. </p>
<p>Remember that a note is basically a form for cards associated with that note. We will have two cards for each note, since the directory name is a memory trigger for the directory description and vice-versa.</p>
<pre><code class="lang-python"><span class="hljs-comment"># Define Anki note model</span>
model_id = <span class="hljs-number">1607392319</span>
model = genanki.Model(
    model_id,
    <span class="hljs-string">'Linux filesystem folders'</span>,
    fields=[
        {<span class="hljs-string">'name'</span>: <span class="hljs-string">'Directory'</span>},
        {<span class="hljs-string">'name'</span>: <span class="hljs-string">'Description'</span>},
    ],
    templates=[
        {
            <span class="hljs-string">'name'</span>: <span class="hljs-string">'Card 1'</span>,
            <span class="hljs-string">'qfmt'</span>: <span class="hljs-string">'{{Directory}}'</span>,
            <span class="hljs-string">'afmt'</span>: <span class="hljs-string">'{{Description}}'</span>,
        },
        {
            <span class="hljs-string">'name'</span>: <span class="hljs-string">'Card 2'</span>,
            <span class="hljs-string">'qfmt'</span>: <span class="hljs-string">'{{Description}}'</span>,
            <span class="hljs-string">'afmt'</span>: <span class="hljs-string">'{{Directory}}'</span>,
        },
    ])
</code></pre>
<p>We'll finally create the deck and give it an ID (which, you guessed it, must be unique) and also give it a name. We will then iterate through our list of tuples and create a note for each tuple, declaring the note's model and inputting our content as fields ('Directory' and 'Description' respectively).</p>
<p>We'll finally write a package containing our single deck. If you have an Anki installation, just double click on the generated file and it should open in the program, ready for studying.</p>
<pre><code class="lang-python"><span class="hljs-comment"># Generate Anki cards and add them to a deck</span>
deck_id = <span class="hljs-number">2059400110</span>
deck = genanki.Deck(deck_id, <span class="hljs-string">'Linux Filesystem'</span>)

<span class="hljs-keyword">for</span> dir_name, description <span class="hljs-keyword">in</span> linux_dirs:
    note = genanki.Note(model=model, fields=[dir_name, description])
    deck.add_note(note)

<span class="hljs-comment"># Save the deck to an Anki package (*.apkg) file</span>
genanki.Package(deck).write_to_file(<span class="hljs-string">'linux_filesystem.apkg'</span>)
</code></pre>
<h1 id="heading-full-script">Full Script</h1>
<pre><code class="lang-python"><span class="hljs-keyword">import</span> genanki

<span class="hljs-comment"># List of Linux directories and their descriptions</span>
linux_dirs = [
    (<span class="hljs-string">'/'</span>, <span class="hljs-string">'Root directory, starting point of the filesystem hierarchy.'</span>),
    (<span class="hljs-string">'/bin'</span>, <span class="hljs-string">'Contains essential system command executables.'</span>),
    (<span class="hljs-string">'/sbin'</span>, <span class="hljs-string">'Contains essential system administration command executables.'</span>),
    (<span class="hljs-string">'/boot'</span>, <span class="hljs-string">'Contains files needed to start the boot process.'</span>),
    (<span class="hljs-string">'/etc'</span>, <span class="hljs-string">"Contains system-wide configuration files and scripts."</span>),
    (<span class="hljs-string">'/dev'</span>, <span class="hljs-string">'Contains device files representing hardware devices.'</span>),
    (<span class="hljs-string">'/home'</span>, <span class="hljs-string">'Contains personal directories for each user.'</span>),
    (<span class="hljs-string">'/lib'</span>, <span class="hljs-string">'Contains shared libraries and kernel modules.'</span>),
    (<span class="hljs-string">'/opt'</span>, <span class="hljs-string">'Optional directory for storing third-party software.'</span>),
    (<span class="hljs-string">'/proc'</span>, <span class="hljs-string">'Virtual filesystem providing an interface to kernel internal data structures.'</span>),
    (<span class="hljs-string">'/sys'</span>, <span class="hljs-string">'Virtual filesystem providing an interface to kernel internal data structures for devices, drivers, and other components.'</span>),
    (<span class="hljs-string">'/tmp'</span>, <span class="hljs-string">'Temporary directory for storing files deleted after a system reboot.'</span>),
    (<span class="hljs-string">'/usr'</span>, <span class="hljs-string">'Contains user-related files, shared libraries, header files, documentation, and non-essential software binaries.'</span>),
    (<span class="hljs-string">'/var'</span>, <span class="hljs-string">'Contains variable data files, such as logs, databases, and mail spools.'</span>),
]

<span class="hljs-comment"># Define Anki note model</span>
model_id = <span class="hljs-number">1607392319</span>
model = genanki.Model(
    model_id,
    <span class="hljs-string">'Simple Model'</span>,
    fields=[
        {<span class="hljs-string">'name'</span>: <span class="hljs-string">'Directory'</span>},
        {<span class="hljs-string">'name'</span>: <span class="hljs-string">'Description'</span>},
    ],
    templates=[
        {
            <span class="hljs-string">'name'</span>: <span class="hljs-string">'Card 1'</span>,
            <span class="hljs-string">'qfmt'</span>: <span class="hljs-string">'{{Directory}}'</span>,
            <span class="hljs-string">'afmt'</span>: <span class="hljs-string">'{{Description}}'</span>,
        },
        {
            <span class="hljs-string">'name'</span>: <span class="hljs-string">'Card 2'</span>,
            <span class="hljs-string">'qfmt'</span>: <span class="hljs-string">'{{Description}}'</span>,
            <span class="hljs-string">'afmt'</span>: <span class="hljs-string">'{{Directory}}'</span>,
        },
    ])

<span class="hljs-comment"># Generate Anki cards and add them to a deck</span>
deck_id = <span class="hljs-number">2059400110</span>
deck = genanki.Deck(deck_id, <span class="hljs-string">'Linux Filesystem'</span>)

<span class="hljs-keyword">for</span> dir_name, description <span class="hljs-keyword">in</span> linux_dirs:
    note = genanki.Note(model=model, fields=[dir_name, description])
    deck.add_note(note)

<span class="hljs-comment"># Save the deck to an Anki package (*.apkg) file</span>
genanki.Package(deck).write_to_file(<span class="hljs-string">'linux_filesystem.apkg'</span>)
</code></pre>
<h1 id="heading-limitations-of-this-method">Limitations of this Method</h1>
<p>This script is pretty good, and I use it very often – but let's not pretend it is perfect. You will have to generate the deck every time you want to add stuff programatically. </p>
<p>You can also get the Deck ID and generate more cards to a new package with the same ID and add them, but this can lead to errors if you are not careful.</p>
<p>Also, the input method is currently an array of tuples. You will have to edit the script every time to update the array with a new deck.</p>
<p>You could also copy and paste it to a text file and read the input from there. And you could also randomly generate a model ID so you can just paste the card contents to your text file and have the package generate from a single script run. This is somewhat subjective so I left it out on purpose.</p>
<h1 id="heading-conclusion">Conclusion</h1>
<p>Anki has many types of cards, the main ones being the basic (memory trigger + answer) and cloze (one or more memory triggers embedded in an outline). This example uses the basic and reversed card, because both the 'question' and 'answer' can be a memory trigger for each other. If you want a simple, basic card you should consult the example at <a target="_blank" href="https://github.com/kerrickstaley/genanki">Genanki</a>'s README.</p>
<p>I hope this script serves as at least a starting point for your own applications of programmable Anki. It is probably my main study method nowadays, and it got a whole lot more powerful after ChatGPT. Have fun with your coding.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ How to Learn Different Tech Stacks IRL ]]>
                </title>
                <description>
                    <![CDATA[ By Liz Johnson Over the last couple years, I've learned that being a consultant means you have to be able to learn new things quickly.   At first, this was really scary to me. Now, as someone who has had to learn several new tech stacks over the last... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/how-to-learn-different-tech-stacks/</link>
                <guid isPermaLink="false">66d460143a8352b6c5a2aaa4</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ self-improvement  ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Sat, 25 Mar 2023 17:11:53 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/03/ilya-pavlov-OqtafYT5kTw-unsplash-1.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Liz Johnson</p>
<p>Over the last couple years, I've learned that being a consultant means you have to be able to learn new things quickly.  </p>
<p>At first, this was really scary to me. Now, as someone who has had to learn several new tech stacks over the last year, it’s still a little scary to me. But I’ve also learned several strategies about how to learn things effectively. And that's what we'll cover here.</p>
<h2 id="heading-learn-the-frameworks-supporting-language">Learn the Framework's Supporting Language</h2>
<p>Frameworks are written to speed up development in specific languages. Many times, engineers who are learning a new tech stack on a fast paced project will learn the framework before they really learn or understand the language that it’s built for. It makes sense, though, because if you can learn the framework and a little bit of syntax you can usually start operating in the codebase faster. </p>
<p>When you have deadlines approaching and you need to get stuff out the door quickly, the tendency is to learn exactly what you need to deliver.  “What exactly you need to deliver” is probably open to interpretation and existential debates, but in general, it seems that when engineers figure out the framework they can write enough code to get the thing working.</p>
<p>You will quickly hit a ceiling with this approach, though. I realized this when learning Ruby on Rails. I “learned” Rails before I really learned Ruby. </p>
<p>Ruby is pretty different from other languages I had operated in before, but because I could find the patterns in the framework I was able to operate in Ruby on Rails ok for a while. Until I couldn't.  </p>
<p>When it came to really understanding Rails so I could get more creative in how I used the framework to fit non-basic needs, I realized that if I didn't know Ruby then I didn't know Rails. Without understanding Ruby, I couldn’t follow the source code to really understand how Rails was built.</p>
<p>In order to learn Ruby, I got a book and started reading. Things started clicking that hadn’t before, and I quickly moved from just being able to “operate” in Rails to actually understanding the parts of Rails I was in. </p>
<p>I could read and follow the source code because I could read the language it was written in. This meant I could solve less standard problems in clean and effective ways.  </p>
<h2 id="heading-read-the-docs">Read the Docs</h2>
<p>Recent framework and library documentation seems to generally be pretty well-written. There’s great descriptions of the things that you can do and then code examples of how to do it. Why would you not want to read that?   </p>
<p>Well, it may be because we all have 40 hours in our week that get filled with meetings, code, bugs, failing tests, random machine restarts, deadlines, weird system behavior, and so on. </p>
<p>It also could be because when we read documentation it doesn’t seem to stick as much as we might hope. We don’t read it and then feel like we can teach it. And after one pass we usually don’t feel like we know everything to write the code we need to deliver by next week.  </p>
<p>But reading the documentation will let you know the things that you <em>can</em> do with the framework. You won’t absorb it all and come out an expert, but you can go back to the code you are supposed to write and have some idea of how you might accomplish your task.  </p>
<p>You will likely get stuck again (even though you just read about that thing) and you will go back to the docs again. Then you will read them again, but this time focused on a particular section and you will read them more slowly. You’ll think through each sentence this time and let it sink in. </p>
<p>Then you’ll go back to your code and know everything! Just kidding. You might still be stuck, but you will try a few things, and then maybe read that one section one more time. And then it will click. It will work. The documentation was right, you CAN do that thing it promised :) And next time you have to do that thing it will seem easy.</p>
<p>If you don't read the docs, you'll develop the tendency to hack at the thing until it works. You will model your patterns not off the patterns that the framework has built and established but rather the patterns that you know from previous experience in other things you think are similar.  </p>
<p>Instead of using the framework to your advantage, you are making more work for yourself (and likely a bigger mess) than if you had never used it at all.</p>
<h2 id="heading-dont-pretend-you-get-it">Don’t Pretend You Get It</h2>
<p>If you happen to be lucky enough to get to work with an expert in the framework, don’t ever pretend that you understand things you don’t. This expert probably doesn't have an infinite amount of time to answer your questions, but don’t let yourself settle for “I think it makes sense” if it doesn't. </p>
<p>With a limited amount of their time, I recommend you take notes on the things that they say and listen as carefully as possible. Re-explain back to them the things that they explain to you and try not to get too shaken up when you ask “Is that right?” and they respond “no”.  It’s better to know that you don’t know right then, rather than wasting time thinking the thing works only to have it not work when you need it the most.</p>
<p>If you don’t have time to re-explain ideas or concepts back, take their recommendations and capture the key words from the things they proposed. Then you should read at greater length about those topics and ideas. Finally, take what you read, the problem that you had, and the things they said and see if you can succinctly summarize the problem and the solution and why you landed on that solution. </p>
<p>If you feel comfortable, and your explanation is indeed succinct, send that explanation in a message to them asking them to confirm your understanding. I’ve yet to find a person who doesn’t receive that well enough to at least respond “yes you got it” or “no not quite”.</p>
<p>If you aren’t lucky enough to have the expert, have the same resistance to “just sort of getting it” as you read about the framework or look through the source code. You won’t be able to ask someone “Is that right?” but you can still check your understanding. </p>
<h2 id="heading-find-the-debugger-and-the-repl">Find the Debugger and the REPL</h2>
<p>If you can figure out how to run the application and set a breakpoint, you have just set yourself up to be able to learn so much more so much faster! </p>
<p>Breakpoints let you stop the flow of execution in what you think is the flow of the application. If you want to validate that a function is getting hit, and that its input is equal to a certain value on a certain iteration, setting a breakpoint in the function can tell you if you things are flowing the way you expect. Breakpoints let you run the code one line at a time and inspect the outputs so that you can understand each step. </p>
<p>Print statements aren’t as good, but can suffice if you need them. Breakpoints will change your life in the best way and it’s really important you figure out how to get a hold of them.</p>
<p><a target="_blank" href="https://en.wikipedia.org/wiki/Read%E2%80%93eval%E2%80%93print_loop">REPL’s</a> are also your friend. REPL stands for Read-Eval-Print Loop. These are small environments set up to run commands in the language or framework that you are working in.  </p>
<p>I used this a lot when I was learning list comprehensions in Python. I could run a simple example to assess my understanding that looked something like this:</p>
<pre><code>&gt; my_list = [<span class="hljs-number">1</span>, <span class="hljs-number">3</span>, <span class="hljs-number">5</span>]
&gt; doubled_values = [ num*<span class="hljs-number">2</span> <span class="hljs-keyword">for</span> num <span class="hljs-keyword">in</span> my_list ]
&gt; print(doubled_values)
&gt; [<span class="hljs-number">2</span>, <span class="hljs-number">6</span>, <span class="hljs-number">10</span>]
</code></pre><p>If what you are trying to test requires a lot of data setup a unit test would be better. But if you think you understand how something works but want to check your understanding, it's a great idea to fire up the REPL and build a small example.  </p>
<p>Think about what you expect to happen when you run certain commands and then run them to see if what you expected was what ended up happening. If the result was totally unexpected then you essentially just asked “Is that right?” and the computer told you “no”. </p>
<h2 id="heading-learn-how-to-test-it">Learn How to Test It</h2>
<p>This one feels really hard when you are learning a new framework/language because the test framework is yet again different and new. But if you can write good tests for the thing you are trying to deliver, then you can fumble through the implementation and feel confident that you are still getting what you need. </p>
<p>Tests are especially helpful when operating a new tech stack because you will not write your code the best way the first time (this is probably always true but definitely true in new frameworks). You will want to give yourself space to rework things and refactor as you go.  </p>
<p>Solid tests will allow you that flexibility. They will give you more space to try things, break things, and fix things while you get yourself more comfortable in the code.</p>
<h2 id="heading-and-repeat">And Repeat</h2>
<p>I’ve wished a million and two times that “I knew it all by now”. Because every single step above will likely make you feel uncomfortable. You may go through all of the above steps and learn how to do one thing in the framework really well. The next time you have to do it you won’t even think about it. You’ll just do it.</p>
<p>And then you will need to do the next thing. And then you will have learned enough things that you get by for a while feeling pretty good. Until you hit the next thing you have to learn and you need to feel uncomfortable again. And it will happen again and again and again for a really long time (or maybe forever? I haven’t reached the end yet).</p>
<p> But each time it seems to feel a little easier and a little quicker to get to the information you need. It used to take you several days to get one small thing working and now it takes you half a day. But you were so busy learning and delivering that you forgot that it used to take you 4 days to do what you can now do in 4 hours. </p>
<p>So the last, and perhaps most important, thing in learning new tech stacks (and learning new anything) is to remember where you started. It’s easy for the sea of things to learn to feel infinite. It’ll feel like you’re never making progress unless you look backwards. You’ll remember how far you’ve come and you’ll feel like you can keep moving forward doing more. </p>
<p>Slowly you will realize that you can enter unknown situations and feel confident that you can build not only a solution but the best solution. And this feeling is worth the hours you poured over the docs and banged your head against the wall on things that wouldn’t work. You can build amazing things and that’s so awesome!</p>
<p>As you get closer to that version of you that can build anything, remember to thank the co-workers or friends who have taught you and cheered you on as you learned. You wouldn’t be building these things without them.</p>
<p>And as you continue, you’ll start teaching others. And when they ask you “Is that right?” you will kindly respond “no” and re-explain it in all its complexities just one more time. 🙂</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ Tips for Learning to Code – How to Stay Consistent and Enjoy Yourself ]]>
                </title>
                <description>
                    <![CDATA[ By Justice Ekemezie Starting out on a new career path or picking up a new skill is an exciting and ambitious endeavour. But maintaining consistency can be a challenge. It's easy to get lost in the excitement of setting goals and creating strategies, ... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/learning-to-code-tips/</link>
                <guid isPermaLink="false">66d46171868774922c885025</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ self-improvement  ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Mon, 20 Mar 2023 14:34:43 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/03/7-Ways-to--1-.png" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Justice Ekemezie</p>
<p>Starting out on a new career path or picking up a new skill is an exciting and ambitious endeavour. But maintaining consistency can be a challenge. It's easy to get lost in the excitement of setting goals and creating strategies, but staying on track when no one is watching can be a daunting task.</p>
<p>That's why I have put together this article to help you stay consistent in your tech pursuits. Whether you're striving to become a web developer, a Python expert, or a graphic designer, these actionable tips will help you stay motivated and focused on achieving your goals. </p>
<p>So, let's dive in and explore how you can remain consistent in your tech journey.</p>
<h2 id="heading-1-sharpen-your-skills-by-helping-others">1. Sharpen Your Skills by Helping Others</h2>
<p>One of the most fulfilling ways to improve your skills is by helping others who are on the same journey as you. </p>
<p>Not only does it give you a sense of satisfaction and fulfillment, but it also helps you consolidate your own knowledge and become a better problem solver. You can mentor someone who is just starting out or share your expertise with others who have similar goals.</p>
<p>For instance, if you are learning web development, you can help a friend or colleague who is struggling with HTML or CSS. Or, if you are studying Python programming, you can volunteer to tutor a high school student who is just beginning to learn the language. </p>
<p>Sharing your knowledge and expertise can also help you build a network of peers and mentors who can support you throughout your career. By helping others, you can not only improve your skills, but also create a sense of community and belonging in the tech industry.</p>
<h2 id="heading-2-talk-about-your-work">2. Talk About Your Work</h2>
<p>Sharing your experiences and talking about what you do is another great way to stay motivated and enjoy the learning process. When you talk about your work, you not only sharpen your communication skills but also get valuable feedback and insights from others.</p>
<p>One way to do this is through writing. Whether it's starting a blog or writing about your experiences in a journal, putting your thoughts and ideas into words can help you reflect on your progress and solidify your knowledge. Plus, the act of researching and organising your thoughts can help you learn even more.</p>
<p>Another way to talk about your work is by sharing your accomplishments with friends who are supportive and encouraging. When you complete a cool project or reach a milestone, don't be afraid to share it with those who will motivate and inspire you to keep going.</p>
<p>For example, if you're working on a web development project, you can share your progress and ask for feedback from your peers, or post your work on a community forum. This not only helps you stay accountable but also gives you an opportunity to learn from others and build valuable connections in the industry. By talking about what you do, you can enjoy the journey and remain consistent in your tech pursuits.</p>
<p>Talking about what you do helps you stay accountable, learn from others, and build valuable connections in your field.</p>
<h2 id="heading-3-build-real-projects">3. Build Real Projects</h2>
<p>Learning by practise is one of the most effective ways to improve your skills and stay consistent in your tech pursuits. Building real projects as you learn can help you solidify your knowledge and apply what you've learned in a practical way.</p>
<p>To get started, try recreating tutorial examples or coding challenges. For example, if you're learning how to use the useReducer hook in React, you can start by re-creating the example you see in the documentation or in an online tutorial. This will not only help you understand the concept better, but also challenge your problem-solving skills and keep the lessons fresh in your mind.</p>
<p>Another way to enjoy your learning process is by building real projects that either showcase your skills for your portfolio or benefit other users. This can be anything from creating a simple website or app to contributing to an open-source project. The key is to focus on building things as you learn, rather than just passively consuming information.</p>
<p>For instance, if you're interested in web development, you can start by building a simple personal website or a blog using HTML, CSS, and JavaScript. As you progress, you can add more features and functionalities to make it more advanced. By building real projects, you not only get hands-on experience but also gain valuable portfolio pieces that can help you stand out to potential employers.</p>
<h2 id="heading-4-network-and-make-new-friends">4. Network and Make New Friends</h2>
<p>Networking and making new friends are crucial parts of growth in any field, including tech. But it's important to be intentional about the kind of connections you make. Instead of just making friends with anyone, try to connect with experts and mentors who can help you grow and learn.</p>
<p>One way to do this is to be active on social media. Follow them on social media platforms like Twitter and LinkedIn, and engage with their content by commenting and sharing your thoughts. Attend online events like webinars, conferences, and Twitter spaces where they're speaking or participating. </p>
<p>By being active in their social circles, you'll have more opportunities to interact with them and learn from their experiences.</p>
<p>When you network with experts and mentors, you have the opportunity to remain motivated and inspired in your learning journey. They can offer valuable advice and feedback, introduce you to new tools and resources, and even provide job opportunities. By building lasting relationships with like-minded individuals, you can enjoy the process of learning and stay consistent in your tech pursuits.</p>
<h2 id="heading-5-set-realistic-goals">5. Set Realistic Goals</h2>
<p>Setting realistic goals is essential for anyone starting out in any field. It's easy to get excited about the possibilities of what you can achieve, but it's important to set goals that are challenging yet achievable.</p>
<p>When setting goals, make sure they are specific, measurable, attainable, relevant, and time-bound. This means that your goals should be clear, have defined metrics for success, and be realistic given your current abilities and resources. Additionally, your goals should be relevant to your overall career objectives and have a specific timeline for completion.</p>
<p>For example, if your goal is to become a proficient Python programmer, a realistic goal might be to complete an online course on Python within the next three months rather than aiming to become an expert in a week. </p>
<p>As you achieve your goals, set new ones that continue to challenge you but remain within your abilities.</p>
<p>Setting realistic goals can help you remain consistent in your tech journey by providing a roadmap for your learning and progress. When you achieve your goals, you gain a sense of accomplishment and motivation to keep going. But be prepared to adjust your goals if you encounter unexpected challenges or if your priorities change.</p>
<h2 id="heading-6-learn-one-thing-at-a-time">6. Learn One Thing at a Time</h2>
<p>Learning one thing at a time can be a powerful way to remain consistent in tech. It can be tempting to try to learn everything at once, especially when you are excited about a new career or skill. But this can quickly become overwhelming and may cause you to lose motivation.</p>
<p>To avoid this, it is important to set realistic goals and focus on one thing at a time. This means breaking down larger concepts into smaller, more manageable pieces. </p>
<p>For example, if you are learning a new programming language, start with the basics, such as syntax and data types, before moving on to more advanced topics like algorithms and data structures.</p>
<p>Learning one thing at a time not only helps you avoid feeling overwhelmed, but it also allows you to fully understand and master each concept before moving on to the next. This can help build your confidence and motivation as you see yourself making progress.</p>
<h2 id="heading-7-listen-to-podcasts">7. Listen to Podcasts</h2>
<p>Yes, it's true – listening to podcasts can be a great way to enjoy the learning process and remain consistent with your goals. You can find podcasts that are specific to your interests and learn from experts in your field. This is an excellent way to stay motivated, especially during times when you may feel stuck or uninspired.</p>
<p>Podcasts also allow you to hear about the experiences of others, which can help you avoid common mistakes and gain insights into how to achieve success in your field. You can listen to podcasts while you work, exercise, or commute, which makes it a convenient way to learn while you go about your daily activities.</p>
<p>The world of tech has a plethora of informative and engaging podcasts to choose from. One such podcast is the "<a target="_blank" href="https://nodegree.fm/">No Degree Podcast</a>," which is aimed at individuals who do not have a college degree but are looking to explore opportunities in the tech industry. This podcast provides career guidance, advice, and insights from successful people who do not hold a college degree.</p>
<p>Other popular tech podcasts include "CodeNewbie," which focuses on inspiring people who are just starting out in the world of programming. "Software Engineering Daily" is another informative podcast that covers a wide range of topics related to software engineering. And the list goes on and on.</p>
<h3 id="heading-thank-you-for-reading">Thank you for reading!</h3>
<p>Did you find this article helpful? <a target="_blank" href="https://twitter.com/ttebify">Follow me on Twitter at @ttebify</a> for more tech discussions and resources. Let's connect and stay motivated!  </p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ What Are CSS Pseudo-Classes? ]]>
                </title>
                <description>
                    <![CDATA[ By Deborah Kurata To make sense of CSS pseudo-classes, we need to understand state. In this context, the word state means a situation or condition that something is in at a particular point in time. Take the state of a stoplight, for example. At any ... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/what-are-pseudo-classes-css/</link>
                <guid isPermaLink="false">66d45e177df3a1f32ee7f80b</guid>
                
                    <category>
                        <![CDATA[ beginner ]]>
                    </category>
                
                    <category>
                        <![CDATA[ CSS ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Web Development ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Mon, 23 Jan 2023 14:00:00 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/01/pseudo-classes-thumbnail.png" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Deborah Kurata</p>
<p>To make sense of CSS pseudo-classes, we need to understand state. In this context, the word <strong>state</strong> means a situation or condition that something is in at a particular point in time.</p>
<p>Take the state of a stoplight, for example. At any point in time it has one of three states:</p>
<ul>
<li>Red state: Stop</li>
<li>Yellow state: Accelerate ... oh no! ... it's caution</li>
<li>And green state: Go</li>
</ul>
<p>When we talk about the "state of the stoplight", we're referring to one of these three possibilities.</p>
<p>How is state related to pseudo-classes? Let's look at an example.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-1.png" alt="Web page showing default anchor element link styles." width="600" height="400" loading="lazy">
<em>Figure 1. Default link styles</em></p>
<p>On the web page in Figure 1, notice that the links to GitHub and LinkedIn are currently blue and underlined. Mouse down on a link and you see that it turns red as shown in Figure 2.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-2.png" alt="Web page showing default anchor element link active style." width="600" height="400" loading="lazy">
<em>Figure 2. Default link active style</em></p>
<p>Click on the link, and it turns purple as you can see in Figure 3.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-3.png" alt="Web page showing default anchor element link visited style." width="600" height="400" loading="lazy">
<em>Figure 3. Default link visited style</em></p>
<p>We add links to an HTML page using anchor elements, denoted with an "a".</p>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"http://www.github.com"</span>&gt;</span>GitHub<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"#"</span>&gt;</span>LinkedIn<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>
</code></pre>
<p>As you saw in the figures, by default the anchor element has multiple states: blue when it's not yet clicked, red when it's active, and purple when it has been clicked.</p>
<p>If we simply style an anchor element, using a CSS element selector as shown below, the link won't have any of that additional coloring for the different states.</p>
<pre><code class="lang-css"><span class="hljs-selector-tag">a</span> {
  <span class="hljs-attribute">color</span>: darkslategray;
}
</code></pre>
<p>How do we style these anchor states? You guessed it! With pseudo-classes. Let's examine what pseudo-classes are and walk through two examples. You can view the associated video here:</p>
<div class="embed-wrapper">
        <iframe width="560" height="315" src="https://www.youtube.com/embed/-zWasID5o9M" style="aspect-ratio: 16 / 9; width: 100%; height: auto;" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen="" loading="lazy"></iframe></div>
<h2 id="heading-what-is-a-pseudo-class"><strong>What Is a Pseudo-class?</strong></h2>
<p>A CSS <strong>pseudo-class</strong> is a fancy name for a keyword added to a CSS selector that identifies the HTML element's state. We can then style the element when it is in that particular state.</p>
<p>To add a pseudo-class to a selector, add a colon and the pseudo-class name:</p>
<pre><code class="lang-css"><span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:active</span> {
  <span class="hljs-attribute">color</span>:orange;
}
</code></pre>
<p>The a:active adds the active pseudo-class to the anchor element selector. We can then style the anchor link to look a certain way when it's in its active state.</p>
<p>Let's look at two examples using pseudo-classes.</p>
<h2 id="heading-how-to-style-anchor-states">How to Style Anchor States</h2>
<p>An anchor element has four states:</p>
<ul>
<li>link: when the link has not yet been clicked.</li>
<li>visited: when the link has been clicked (clicking a link "visits" that linked page, hence the name "visited").</li>
<li>hover: When the mouse is hovered over the link.</li>
<li>active: for the moment the mouse is clicked down on the link</li>
</ul>
<p>We style these states using pseudo-classes. In the below example, we specify the "a" (or anchor) element selector, a colon, and the name of the anchor state.</p>
<pre><code class="lang-css"><span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:link</span> {
  <span class="hljs-attribute">color</span>: slategray;
}
<span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:visited</span> {
  <span class="hljs-attribute">color</span>: darkslategray;
}
<span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:hover</span> {
  <span class="hljs-attribute">color</span>: yellow;
}
<span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:active</span> {
  <span class="hljs-attribute">color</span>:orange;
}
</code></pre>
<p>It's recommended that you declare these pseudo-classes in the stylesheet in this order because of the CSS precedence rules. Find more information about CSS <a target="_blank" href="https://youtu.be/8qLTN5TKdcA">precedence rules here</a>. In short, styles declared later override those declared earlier. For the anchor element, we want the active state to take precedence, which is why it's last.</p>
<p>Use these states as needed when you style your anchors.</p>
<p>To see these states in action and try your own custom styles, check out <a target="_blank" href="https://stackblitz.com/edit/pseudo-classes-deborahk">this project</a>.</p>
<p>Now let's look at another type of HTML element, the input element checkbox.</p>
<h2 id="heading-how-to-style-a-checkbox-checked-state">How to Style a Checkbox Checked State</h2>
<p>Here we have a checkbox for "Add me to your mailing list". It's currently in an "unchecked" state.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-4.png" alt="Display of a default checkbox with the text: &quot;Add me to your mailing list&quot;" width="600" height="400" loading="lazy">
<em>Figure 4. Default checkbox</em></p>
<p>Here is the same checkbox in the "checked" state with default styling. We want to style the "checked" state to add our own custom look.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-5-1.png" alt="Default checkbox check style with blue background color" width="600" height="400" loading="lazy">
<em>Figure 5. Default checkbox checked style</em></p>
<p>Let's say we want to change the background color, maybe the blue clashes with our design. And we want to change the border by removing the existing border and adding our own outline color. Like this:</p>
<h3 id="heading-html">HTML</h3>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">input</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"checkbox"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"mailing-list"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">label</span> <span class="hljs-attr">for</span>=<span class="hljs-string">"mailing-list"</span>&gt;</span>Add me to your mailing list<span class="hljs-tag">&lt;/<span class="hljs-name">label</span>&gt;</span>
</code></pre>
<h3 id="heading-css">CSS</h3>
<pre><code class="lang-css"><span class="hljs-selector-id">#mailing-list</span><span class="hljs-selector-pseudo">:checked</span> {
  <span class="hljs-attribute">border</span>: none;
  <span class="hljs-attribute">accent-color</span>: white;
  <span class="hljs-attribute">outline</span>: <span class="hljs-number">2px</span> solid  orange;
}
</code></pre>
<p>Here we use a CSS id selector and a pseudo-class to style a checkbox's checked state. We remove the border, set the background color (called <code>accent-color</code>), and provide our own orange outline.</p>
<p>The resulting checked state looks like this:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/Figure-5.png" alt="Custom checkbox check style with no background color and an orange border" width="600" height="400" loading="lazy">
<em>Figure 6. Custom checkbox checked style</em></p>
<p>Use this technique to give your webpages a custom look.</p>
<p>To see these states in action and try your own custom styles, check out <a target="_blank" href="https://stackblitz.com/edit/pseudo-classes-deborahk">this project</a>.</p>
<h2 id="heading-wrapping-up">Wrapping Up</h2>
<p>A pseudo-class is a keyword added to a selector that styles an element's state. We saw how to add pseudo-classes for anchor element states and for the checked state of a checkbox.</p>
<p>Many other HTML elements also have states, and we can style those states using pseudo-classes. For a list of these pseudo-classes, see the <a target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes">Mozilla Developer Network (MDN) Web Docs</a>.</p>
<p>For more information on styling with CSS, check out my course: <a target="_blank" href="https://www.youtube.com/playlist?list=PLErOmyzRKOCptjkM-mOfveYlgKQEx1AAf">"Gentle Introduction to CSS for Beginners"</a> and subscribe to <a target="_blank" href="https://www.youtube.com/@deborah_kurata">my YouTube channel</a>.</p>
<p>Green light ... go! Now let's go out there and style our element states.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ How to Organize Your Code with Functions ]]>
                </title>
                <description>
                    <![CDATA[ By Deborah Kurata Functions are a fundamental building block of programming. They help us organize our code into manageable and reusable pieces.  Let's explore the basics of functions by way of a burger joint. A burger joint may seem like an odd plac... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/organizing-code-with-functions/</link>
                <guid isPermaLink="false">66d45e10f855545810e93429</guid>
                
                    <category>
                        <![CDATA[ beginner ]]>
                    </category>
                
                    <category>
                        <![CDATA[ coding ]]>
                    </category>
                
                    <category>
                        <![CDATA[ functions ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ General Programming ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Web Development ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Thu, 19 Jan 2023 17:29:50 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/01/organizing-code-with-functions-thumbnail.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Deborah Kurata</p>
<p>Functions are a fundamental building block of programming. They help us organize our code into manageable and reusable pieces. </p>
<p>Let's explore the basics of functions by way of a burger joint.</p>
<p>A burger joint may seem like an odd place to learn about code organization...but let's see where this goes. And you can view the associated video here.</p>
<div class="embed-wrapper">
        <iframe width="560" height="315" src="https://www.youtube.com/embed/3f4g8RwELC4" style="aspect-ratio: 16 / 9; width: 100%; height: auto;" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen="" loading="lazy"></iframe></div>
<p>Are you hungry for some knowledge? Or maybe a burger?</p>
<p>Tackling any large set of tasks requires some amount of organization. Say we work at a burger restaurant. We could define a simplified view of the process as shown below:</p>
<ol>
<li>Take a customer's order</li>
<li>If the customer ordered fries, make fries:<ul>
<li>Dump fries into the fryer</li>
<li>Set a timer</li>
<li>Etc.</li>
</ul>
</li>
<li>If the customer ordered a burger, make the burger:<ul>
<li>Select the appropriate type of patty (veggie, chicken, fish, beef)</li>
<li>Fry the burger</li>
<li>Toast the bun</li>
<li>Etc.</li>
</ul>
</li>
<li>Put the items in a box</li>
<li>Repeat at step 1</li>
</ol>
<p>A worker takes a customer's order. If the customer ordered fries, they make fries. Notice the "sub-list" describing how to make the fries. And if the customer ordered a burger, they make the burger. And there's another "sub-list" describing how to make the burger.</p>
<p>To keep our main list of instructions straightforward and easier to follow, we can move these sub-lists to separate sets of instructions.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/figure3.jpg" alt="Make Fries sub-steps shown in one box. Make a Burger sub-steps shown in a second box. Steps without the sub-steps shown on the right." width="600" height="400" loading="lazy">
<em>Figure 1. Defining functions</em></p>
<p>The left side of Figure 1 shows the list of steps for making fries, and the list for making a burger. We reference those instructions in the main flow, as shown on the right side of Figure 1. </p>
<p>The result is that each separate list of instructions is clearly defined. And the main flow on the right is easier to see without all of the sub-lists.</p>
<p>In programming, we call each of these self-contained sets of instructions a <strong>function</strong>.</p>
<p>Let's stop at this point and think about this. What are some benefits of breaking out some of the instructions into functions? Thoughts?</p>
<p>Separating our code into functions has several advantages:</p>
<ul>
<li>When building or maintaining the function, we can focus just on that function: what information it needs, what steps it performs, and what result it provides.</li>
<li>We can simplify the main set of instructions, making it easier to read and maintain over time.</li>
<li>It helps us separate work for a team, assigning each independent function to a member of the team. Jesse can be making fries, Chris making the burgers, and Sandhya follows the main flow, taking orders.</li>
<li>And we can more easily reuse the function in multiple places in the application.</li>
</ul>
<p>Did you think of other benefits?</p>
<h2 id="heading-what-is-a-function">What Is a Function?</h2>
<p>In programming:</p>
<ul>
<li>A <strong>function</strong> is a self-contained set of instructions to accomplish a chunk of a larger task.</li>
<li>A function separates responsibilities for a specific part of a task, making the main task easier to work with and read.</li>
<li>Functions add structure to our programs, and make them easier to read and modify over time.</li>
</ul>
<p>Here is a tip: Code is often read much more often than it's written, so make your code readable.</p>
<h2 id="heading-anatomy-of-a-function">Anatomy of a Function</h2>
<p>When writing code, functions look something like this:</p>
<h3 id="heading-make-fries">Make Fries</h3>
<pre><code><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">makeFries</span>(<span class="hljs-params">fries</span>) </span>{
  ... instructions go here ...
  return cookedFries
}
</code></pre><h3 id="heading-make-a-burger">Make a Burger</h3>
<pre><code><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">makeBurger</span>(<span class="hljs-params">patty, bun, condiments</span>) </span>{
  ... instructions go here ...
  return cookedBurger
}
</code></pre><p>Note that the details of the functions may look a bit different depending on the programming language you use.</p>
<p>A function often takes in some information, performs the set of instructions using that information, and gives back (or "returns") a result. At the burger joint we can say: "Hey Chris, here is a patty, bun, and condiments, go make the burger, and bring it back to me when it's done."</p>
<p>Functions are often named with the task they perform following a verbObject style naming convention: makeFries and makeBurger.</p>
<p>The name is followed by a list of the information that the function needs. In this example, this information is enclosed in parenthesis and separated with commas. For our makeFries, we need the fries. And for the burger, we need a patty, bun, and condiments.</p>
<p>The function body contains the set of instructions required for this function.</p>
<p>In many cases, a function performs its set of steps and returns a result. So lastly, we return that result. The result is often indicated with a return statement. In this example, when the fries are made or the burger is done, we pass them back to the main flow and they are boxed for the customer.</p>
<h2 id="heading-how-to-create-a-function">How to Create a Function</h2>
<p>Let's look at another example from a simple virtual pet adoption website as shown in Figure 2.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/figure5.jpg" alt="Screen shot of a web page that asks for the type of pet (cat) and how many (3), then displays &quot;meow&quot; three times." width="600" height="400" loading="lazy">
<em>Figure 2. Virtual pet adoption website</em></p>
<p>The user enters the type and number of pets, and clicks Adopt. The application then displays a message and a greeting from each of the virtually adopted pets.</p>
<p>When writing the code for this website, we want to simplify the main set of instructions by separating out the feature that prepares the pet greeting. We define a function for those instructions like this:</p>
<pre><code class="lang-js"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">prepareGreeting</span>(<span class="hljs-params">typeOfPet, numberOfPets</span>) </span>{ 
  <span class="hljs-keyword">var</span> greeting = <span class="hljs-string">''</span>;
  <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">0</span>; i &lt; numberOfPets; i++) {
    <span class="hljs-keyword">if</span> (typeOfPet === <span class="hljs-string">'cat'</span>) { 
      greeting += <span class="hljs-string">'meow'</span> + <span class="hljs-string">'&lt;br/&gt;'</span>;
    }
    <span class="hljs-keyword">if</span> (typeOfPet === <span class="hljs-string">'dog'</span>) { 
      greeting += <span class="hljs-string">'woof'</span> + <span class="hljs-string">'&lt;br/&gt;'</span>;
    }
  }
  <span class="hljs-keyword">return</span> greeting;
}
</code></pre>
<p>This function is named "prepareGreeting" following our verbObject convention. It's best practice to give every function a meaningful name.</p>
<p>For a function to perform its set of instructions, it often needs some information. In this case, it needs the type of pet and the number of pets. When creating a function, we identify that needed information using parameters. </p>
<p>A <strong>parameter</strong> is a placeholder for the information the function needs. We give each placeholder a descriptive name, such as typeOfPet and numberOfPets. We add the parameters after the function name, often within parentheses and separated with commas.</p>
<p>The function name with its set of parameters is called a <strong>function signature</strong>. The function signature uniquely identifies the function.</p>
<p>The <strong>function body</strong> is where we write the code to perform the set of instructions. In this example, it's where we prepare the greeting. </p>
<p>In programming languages that use curly braces, the function body is defined between the first and last curly brace. In some languages, the function body is defined simply by its indentation.</p>
<p>In this function body, we prepare the pet's greeting. First, we initialize a greeting variable to an empty string. This ensures that we have a string (or text) variable we can use for the greeting text.</p>
<p>Then we loop for each pet. We use a counter represented by "i", repeat the loop while our counter is less than the total number of pets, and increment "i" at the end of each loop. Notice that in most programming languages, counting is zero-based, meaning it counts the iterations of the loop starting at 0: 0, 1, 2 for three pets.</p>
<p>Within the loop, if the passed-in pet type is a cat, we add a "meow" for each pet to the greeting variable. If the passed in pet type is a dog, we append "woof" for each pet. We then return that resulting greeting to the main set of instructions.</p>
<h2 id="heading-how-to-call-a-function">How to Call a Function</h2>
<p>Code in a function won't do anything until we call that function from some other code, such as our main set of instructions. The exact syntax for calling a function depends on the programming language you use. But it will look something like this:</p>
<pre><code class="lang-js">greetingForDisplay = prepareGreeting(<span class="hljs-string">"cat"</span>, <span class="hljs-number">3</span>)
</code></pre>
<p>We use the name of the function to identify which function we want to call. Then pass a value in for each parameter placeholder. In this example, we pass in a string (or text) using quotation marks and a number.</p>
<p>The result of the function's instructions are returned to the code that called it. In this example, the value is assigned to the greetingForDisplay variable. The main code could then display the contents of this variable to the user.</p>
<p>When working with functions, be sure to keep these two terms clear:</p>
<ul>
<li><strong>Parameter</strong>: The placeholder in the function signature where we define what kind of information the function needs.</li>
<li><strong>Argument</strong>: The value(s) passed in when calling the function, giving the function the information it needs to perform its instructions</li>
</ul>
<h2 id="heading-wrapping-up">Wrapping Up</h2>
<p>We use a function to define a self-contained set of instructions for a chunk of a larger task. Using functions helps break up long code into manageable pieces. Just like building blocks, we combine functions to create simple to complex applications and websites.</p>
<p>For more information on general programming concepts, check out my course: <a target="_blank" href="https://www.youtube.com/playlist?list=PLErOmyzRKOCrO9bwM1931IY8S3iWfhrr8">"Gentle Introduction to Programming for Beginners"</a>. And for information on web development, GitHub, Angular, and C#, subscribe to <a target="_blank" href="https://www.youtube.com/@deborah_kurata">my YouTube channel</a>.</p>
<p>Now, let's go order that burger!</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ Review of CS50 – Harvard's Introduction to Computer Science Course ]]>
                </title>
                <description>
                    <![CDATA[ Are you considering taking the CS50 Introduction to Computer Science course, but wondering if it's the right fit for you? As someone who doesn’t have a computer science degree and was looking to learn the fundamentals of the field, I was in the same ... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/cs50-course-review/</link>
                <guid isPermaLink="false">66d4608c230dff016690584d</guid>
                
                    <category>
                        <![CDATA[ Computer Science ]]>
                    </category>
                
                    <category>
                        <![CDATA[ cs50 ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Phoebe Voong-Fadel ]]>
                </dc:creator>
                <pubDate>Mon, 09 Jan 2023 22:20:27 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2023/01/this-is-cs50-1.jpeg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>Are you considering taking the <a target="_blank" href="https://www.freecodecamp.org/news/harvard-cs50/">CS50</a> Introduction to Computer Science course, but wondering if it's the right fit for you?</p>
<p>As someone who doesn’t have a computer science degree and was looking to learn the fundamentals of the field, I was in the same boat. That's why I decided to enrol on the course and document my experience in this article.</p>
<p>I'll provide an overview and review of CS50 to help you decide if it's the right course for you.</p>
<h2 id="heading-what-is-cs50">What is CS50?</h2>
<p>CS50 is a ten week online and on-campus course which serves as an introduction to computer science. It's taught at Harvard and Yale University.</p>
<p>The course leader is Professor David J. Malan. He’s supported by the CS50 team, which consists of Senior Preceptors and an entire production team. The course runs from 1 January to 31 December.</p>
<h2 id="heading-why-choose-cs50">Why choose CS50?</h2>
<p>There are several reasons why CS50 might be a good choice for you. Here are a few:</p>
<ul>
<li><p>It's a highly respected course offered by Harvard University. This means that you'll be learning from experienced instructors and getting access to a top-quality course.</p>
</li>
<li><p>It covers a wide range of topics, including computer science fundamentals, algorithms, data structures, and programming languages such as C, Python, and SQL. This means that you'll have a well-rounded introduction to the field.</p>
</li>
<li><p>It's self-paced, which means that you can work through the course at your own pace and fit it into your schedule. You can watch the lectures on various platforms, including EdX and freeCodeCamp's YouTube channel. For me this was important as I didn’t have a lot of spare time.</p>
</li>
<li><p>It's free! You’ll have access to the lectures and course materials.</p>
</li>
</ul>
<h2 id="heading-what-is-the-format-of-the-course">What is the Format of the Course?</h2>
<p>There are ten weeks worth of lectures, labs, and problem sets, which must be completed. At the end of the course, there’s a final project.</p>
<h3 id="heading-is-this-a-course-for-beginners">Is this a course for beginners?</h3>
<p>Yes. In fact, around two thirds of students who enroll in CS50 have never taken a computer science course before. So if you're new to the field and looking to learn the basics, you'll be in good company.</p>
<p>That being said, don't expect the course to be easy. While the lectures are designed to be accessible and engaging, the problem sets and labs can be challenging. On average, students should expect to spend around 12 hours per week on the course.</p>
<h3 id="heading-do-i-get-a-certificate-at-the-end-of-the-course">Do I get a certificate at the end of the course?</h3>
<p>You can choose to receive a free CS50 certificate or pay for a verified certificate from <a target="_blank" href="https://www.edx.org/verified-certificate">edX</a>.</p>
<h3 id="heading-what-if-you-dont-finish-the-course-by-31-december">What if you don’t finish the course by 31 December?</h3>
<p>You can roll over any submissions into the following year. I did this and the process was straightforward. The course content is pretty much the same with some updates to the course materials.</p>
<h2 id="heading-cs50-walkthrough-week-by-week">CS50 Walkthrough, Week by Week</h2>
<h3 id="heading-week-0-learn-scratch">Week 0: Learn Scratch</h3>
<p>In the first week of the course, you'll be introduced to the world of computer science and learn about how numbers, text, and images are represented in binary.</p>
<p>You'll also learn about algorithms and pseudo code, and get a hands-on introduction to <a target="_blank" href="https://scratch.mit.edu/">Scratch</a>, a graphical programming language.</p>
<p>For your first problem set, you'll create a Scratch project. This week is a fun way to ease you into the course and get a taste of programming.</p>
<p>If you’re interested, this is <a target="_blank" href="https://scratch.mit.edu/projects/500624784">my Scratch project</a>, which was inspired by my son who’s fascinated by space.</p>
<h3 id="heading-week-1-learn-c">Week 1: Learn C</h3>
<p>In the second week of the course, you'll dive into <a target="_blank" href="https://www.freecodecamp.org/news/learn-c-programming-classic-book-dr-chuck/">C, a low-level programming language</a>.</p>
<p>You'll learn programming fundamentals such as functions, conditionals, boolean expressions, loops, and variables.</p>
<p>For the problem set, you'll create a program that outputs a pyramid of hashes like at the end of a level in a Super Mario game.</p>
<h3 id="heading-week-2-introduction-to-arrays">Week 2: Introduction to Arrays</h3>
<p>You'll continue learning about programming in C and delve into topics such as how your program compiles, debugging, arrays, characters, strings, and command-line arguments.</p>
<p>For the lab, you'll write a <a target="_blank" href="https://www.freecodecamp.org/news/how-to-code-the-caesar-cipher-an-introduction-to-basic-encryption-3bf77b4e19f7/">Caesar's cipher</a> program, and for the problem set, you'll work on a scrabble-type challenge. If you’ve completed the <a target="_blank" href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/">JavaScript Algorithm and Data Structures</a> certificate on freeCodeCamp, this should be familiar as this is one of the coding challenges.</p>
<h3 id="heading-week-3-introduction-to-algorithms">Week 3: Introduction to Algorithms</h3>
<p>In week three, you'll learn about different types of search (linear and binary) and different types of sort (selection and bubble), as well as recursion.</p>
<p>You'll also learn about <a target="_blank" href="https://www.freecodecamp.org/news/big-o-notation/">big O notation</a>, which can be challenging but is an important concept in computer science. Thankfully, the course provides additional short videos on more difficult concepts, which provide a more detailed explanation with examples.</p>
<h3 id="heading-week-4-computer-memory">Week 4: Computer Memory</h3>
<p>Week four focuses on memory, including topics such as pointers, addresses, memory allocation and freeing memory, detecting memory leaks, and explaining how a stack overflow occurs.</p>
<p>The lab and problem set involve manipulating audio and image files. Below is an example of a filter I created in C.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/tweet-week-4.png" alt="Screenshot of tweet with an image of a church that is colour. Next to it an image of the same church in grayscale" width="600" height="400" loading="lazy"></p>
<h3 id="heading-week-5-data-structures">Week 5: Data Structures</h3>
<p>In the final week of programming in C, you'll learn about how pointers can be used to store the addresses in memory for linked lists.</p>
<p>The lab consolidates your knowledge of pointers, and the problem set involves creating a spell checking program. This was a particularly tricky exercise and it’s worth taking your time to understand the starter files provided before delving in.</p>
<h3 id="heading-week-6-learn-python-basics">Week 6: Learn Python Basics</h3>
<p>Week six marks the transition from C to <a target="_blank" href="https://en.wikipedia.org/wiki/Python_\(programming_language\)">Python</a>, a popular programming language that is easier to learn and use than C. You'll work on problem sets that involve translating previous programs written in C to Python.</p>
<h3 id="heading-week-7-sql-and-relational-databases">Week 7: SQL and Relational Databases</h3>
<p>In week seven, you'll learn about relational databases and <a target="_blank" href="https://en.wikipedia.org/wiki/SQL">SQL</a> (Structured Query Language), using SQLite to execute queries on the command line and in Python.</p>
<p>The problem set is a fun one, as you’ll have to solve a mystery of who stole the CS50 duck through a series of SQL queries!</p>
<h3 id="heading-week-8-html-css-and-javascript">Week 8: HTML, CSS, and JavaScript</h3>
<p>Week eight covers the basics of the internet and the web, including HTML, CSS, and JavaScript on the client side.</p>
<p>For the problem set you’ll create a home page about yourself.</p>
<h3 id="heading-week-9-flask">Week 9: Flask</h3>
<p>In week nine, you'll learn about <a target="_blank" href="https://en.wikipedia.org/wiki/Flask_\(web_framework\)">Flask</a>, a Python framework that is used to build web applications. You'll cover topics such as forms, layouts and templating using <a target="_blank" href="https://en.wikipedia.org/wiki/Jinja_\(template_engine\)">Jinja</a>, POST and GET requests, and how to email from a Flask application. You'll also walk through the process of building a full-stack application.</p>
<p>For the problem set, you'll put your skills to the test by implementing a full-stack finance application that brings together everything you've learned throughout the course. This is a challenging but rewarding project that will give you a taste of what it's like to build a real-world web application.</p>
<h3 id="heading-week-10-wrap-up-lecture">Week 10: Wrap up lecture</h3>
<p>No exercises this week. There’s a guest lecturer and a wrap up from Prof Malan.</p>
<h3 id="heading-the-final-project">The final project</h3>
<p>The last part of the course is the final project. The brief is to:</p>
<blockquote>
<p>“build something of interest to you, that you solve an actual problem, that you impact your community, or that you change the world.”</p>
</blockquote>
<p>This is deliberately vague, so you have the freedom to choose any programming language and project you like. You'll also have to record a three minute video demoing your app.</p>
<p>I built a baby tracking app. On the backend I developed a REST API with Python and Flask. For my database I used SQLite. On the client side, I used React.js.</p>
<p>This is a substantial piece of work. From conception, to designing my application through to developing the app, I probably spent over 30 hours on this.</p>
<p>Your final project would make a great addition to your personal portfolio so have fun with it! Below are some screenshots of my application.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2023/01/My-project.png" alt="screenshots of baby tracking app" width="600" height="400" loading="lazy"></p>
<h2 id="heading-what-are-the-benefits-of-taking-cs50">What Are the Benefits of Taking CS50?</h2>
<ul>
<li><p>The lectures are high quality, in terms of content and production. Professor Malan is animated, enthusiastic, and is very passionate about teaching computer science and programming. The visual examples on the stage and on the interactive screens are helpful for understanding difficult concepts.</p>
</li>
<li><p>The problem sets are well-structured and provide detailed walkthrough videos, specifications, and starter code with comments to help guide you through the tasks. You can also test your code to see if it meets all the requirements before submitting.</p>
</li>
<li><p>Setting up your integrated development environment (IDE) is straightforward, thanks to a modified version of GitHub Codespaces, which allows you to code in the browser.</p>
</li>
<li><p>The <a target="_blank" href="https://manual.cs50.io/">CS50</a> library is a helpful resource with great documentation. The library provides functions such as <code>get_string</code>, which prompts a user for a string in the command line interface (CLI). These functions act like training wheels during the early weeks of the course, helping you to focus on familiarising yourself with the programming language.</p>
</li>
<li><p>For some of the problem sets, there are two options: one for when you're "feeling less comfortable" and one for when you're "feeling more comfortable." This allows you to choose the level of difficulty that is right for you.</p>
</li>
<li><p>The course is structured in a way that builds on your knowledge from previous lectures and problem sets. You'll start with C, a low-level language, and then move on to how to implement the same things in Python and JavaScript later in the course.</p>
</li>
<li><p>There is a large and active online CS50 community on various platforms such as Facebook, Twitter, Discord, and LinkedIn, where you can connect with other students and get help with problem sets and labs.</p>
</li>
<li><p>The course is free and accessible to anyone with a computer and an internet connection.</p>
</li>
</ul>
<h3 id="heading-what-are-the-drawbacks-of-cs50">What are the drawbacks of CS50?</h3>
<p>The course is challenging. It can have a steep learning curve. I found I had to do additional reading around subjects I was not familiar/comfortable with.</p>
<p>Most people don't finish the course, but even if you don't complete it, you can still benefit from what you learn. In the words of Prof Malan:</p>
<blockquote>
<p>“What ultimately matters in this course is not so much where you end up relative to your classmates but where you end up relative to yourself when you begin.”</p>
</blockquote>
<h2 id="heading-summary">Summary</h2>
<p>CS50 is a comprehensive and highly respected course that provides a strong foundation in computer science.</p>
<p>As a self-taught frontend developer with no computer science degree, I found that the course was an excellent way to fill in knowledge gaps and strengthen my understanding of the fundamentals of the field.</p>
<p>The lectures are engaging and well-produced, and the problem sets are challenging but provide a valuable opportunity to apply what you've learned.</p>
<p>The course covers a wide range of topics, making it an excellent introduction to computer science. Overall, it is a standout course and one of the best online learning experiences I've had.</p>
<p>I hope you’ve found this article useful and it’s helped you with making the decision on whether to take CS50.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ Learn to Code RPG Version 1.5 is Now Playable with Hours of New Gameplay ]]>
                </title>
                <description>
                    <![CDATA[ Hello from the Learn to Code RPG dev team! We are Lynn, KayLa, and Nielda. And we've been hard at work building out new adventures for our characters. I'm excited to announce the launch of Learn to Code RPG v1.5, a year after the launch of Learn to C... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/learn-to-code-rpg-1-5-update/</link>
                <guid isPermaLink="false">66d4601f3a8352b6c5a2aaaa</guid>
                
                    <category>
                        <![CDATA[ freeCodeCamp.org ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Game Development ]]>
                    </category>
                
                    <category>
                        <![CDATA[ GameDev ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Python ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Lynn Zheng ]]>
                </dc:creator>
                <pubDate>Fri, 23 Dec 2022 02:43:43 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2022/12/splash-2-lowres-1.png" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>Hello from the Learn to Code RPG dev team! We are Lynn, KayLa, and Nielda. And we've been hard at work building out new adventures for our characters.</p>
<p>I'm excited to announce the launch of <strong>Learn to Code RPG v1.5</strong>, a year after the launch of Learn to Code RPG v1. (Fun fact: we're calling it v1.5 instead of v2 because we have grand plans for v2, which we plan to release in early 2023.)</p>
<h2 id="heading-what-is-learn-to-code-rpg">What is Learn to Code RPG?</h2>
<p><strong>Learn to Code RPG</strong> is an interactive visual novel game where you will teach yourself to code, make friends in the tech industry, and pursue your dream of working as a developer. 🎯</p>
<p>The game features:</p>
<ul>
<li><p>Hours of gameplay 🎮</p>
</li>
<li><p>Original art and music 🎨</p>
</li>
<li><p>1,000+ Computer Science quiz questions 📚</p>
</li>
<li><p>50+ achievements you can unlock 🏆</p>
</li>
<li><p>6 different endings 👀</p>
</li>
<li><p>10+ characters you can make friends with, and an adorable cat 🐱</p>
</li>
<li><p>Minigames 👾</p>
</li>
<li><p>A renown system, a money system, and fun items you can buy for your cat and to customize your room 🏠</p>
</li>
</ul>
<h2 id="heading-learn-to-code-rpg-v15-game-trailer">Learn to Code RPG v1.5 Game Trailer</h2>
<p>You can also watch the game trailer below and share the YouTube video with your friends:</p>
<div class="embed-wrapper">
        <iframe width="560" height="315" src="https://www.youtube.com/embed/vDfcMD99Kdg" style="aspect-ratio: 16 / 9; width: 100%; height: auto;" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen="" loading="lazy"></iframe></div>
<p> </p>
<h2 id="heading-you-can-download-the-game-and-play-it-for-free-its-available-for-pc-mac-and-linux-on-itchiohttpsfreecodecampitchiolearn-to-code-rpg-and-on-android-from-the-google-play-storehttpsplaygooglecomstoreappsdetailsidorgfreecodecamplearntocoderpgamphlenusampglusamppli1">You can download the game and play it for free. It's available for PC, Mac, and Linux on <a target="_blank" href="https://freecodecamp.itch.io/learn-to-code-rpg">itch.io</a>. And on Android from the <a target="_blank" href="https://play.google.com/store/apps/details?id=org.freecodecamp.learntocoderpg&amp;hl=en_US&amp;gl=US&amp;pli=1">Google Play Store</a>.</h2>
<p>If you'd like to learn more about the game itself and the development process, read on.</p>
<p>We'll walk you through the story, characters, graphics, and code. I'm sure you'll enjoy it. And it may even inspire you to code your own video game.</p>
<h2 id="heading-how-learntocoderpg-went-from-v1-to-v15">How LearnToCodeRPG Went From v1 to v1.5</h2>
<h3 id="heading-the-team">The Team</h3>
<p>When Lynn created v1, she was working solo on the game, juggling writing, coding, and some asset creation.</p>
<p>With this release, to give Lynn more time to focus on coding, KayLa took care of the writing. Nielda helped brainstorm features and create art assets.</p>
<p>Want to see a teamwork showcase? Here's one for the item shop. After purchasing furniture from the shop, the player will see the furniture in their room.</p>
<ul>
<li><p>Lynn programmed the shop, the items, and the room customization</p>
</li>
<li><p>KayLa and Nielda came up with ideas for the items</p>
</li>
<li><p>KayLa wrote fun flavor text for the items</p>
</li>
<li><p>Nielda created all the assets – the room and the items – by tracing over 3D assets and applying textures over them</p>
</li>
</ul>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/room.gif" alt="Image" width="600" height="400" loading="lazy"></p>
<h3 id="heading-the-learn-to-code-rpg-main-story">The Learn to Code RPG Main Story</h3>
<p>In v1 (or what we call the Prologue), the story started as our protagonist, Lydia, decided to get a job in the tech industry. She needed to learn to code, make friends in the industry, find mentors, tackle technical interviews, and eventually arrive at her goal – a shiny new developer job.</p>
<p>Building from the Prologue story, in v1.5 (or what we call Arc I) Lydia starts working as a full-stack developer. She now needs to interact with her new colleagues on a day-to-day basis and react to events that arise.</p>
<p>She will be faced with all the things a real-world software engineer faces – changes in project requirements, communicating with project managers, learning from senior developers, and so on.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/Screen-Shot-2022-12-20-at-18.37.09.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p><em>Does this look like a familiar scene from working in tech to you?</em></p>
<p>Outside of work, Lydia can also go hang out at Hacker Space with friends she made back when she was first learning to code.</p>
<p>At Hacker Space, Lydia might run into old acquaintances who are also looking for a job. She can decide whether or not to give them a referral.</p>
<p>She can also give back to the community by mentoring high school students with their projects.</p>
<p>There is never a shortage of fun things to do at Hacker Space. 😄</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/itch2.png" alt="Image" width="600" height="400" loading="lazy"></p>
<h3 id="heading-the-characters">The Characters</h3>
<p>To give the characters more depth, we brainstormed using the character card format shown below. Here's the character card for Lydia:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/Screen-Shot-2022-12-20-at-19.46.02.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>Lydia meets many new colleagues in this arc and our character list has been greatly expanded.</p>
<p>When designing the characters, sometimes our artist Noa will experiment with hair color and style variations until we land on a design that we are happy with:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/mala-3.jpg" alt="Image" width="600" height="400" loading="lazy"></p>
<p><em>Mala's different designs. Which is your favorite?</em></p>
<p>Here's also a sneak peek into one of the many characters and their many expressions:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/darius-4.jpg" alt="Image" width="600" height="400" loading="lazy"></p>
<p><em>Darius's many faces</em></p>
<p>Of course, everyone's favorite, Mint the kitty, is still the key emotional support for this story arc. 🐱</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/mint_small.gif" alt="Image" width="600" height="400" loading="lazy"></p>
<h3 id="heading-the-graphics">The Graphics</h3>
<p>Now moving on to other graphics besides character sprite art. Just like in v1, we again created background images by applying a watercolor-like filter to real-world images.</p>
<p>Since a lot of story takes place at the company Lydia is working at, we also tried to find stock images that are coherent in color scheme, like the ones below:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/12/Untitled-design.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p><em>Background images for the company Lydia's working at</em></p>
<h3 id="heading-the-code">The Code</h3>
<p>Just like in v1, I used the game engine that I'm most familiar with, <a target="_blank" href="https://www.renpy.org/">the Ren'Py Visual Novel Engine</a>.</p>
<p>During this year of development, a really exciting piece of news for the Ren'Py community is that Ren'Py 8 now supports Python 3. This is exciting to me.</p>
<p>Compared to Python 2.7 (which we used in Ren'Py 7.4 when we developed Learn to Code RPG v1), Python 3 brings in a lot of new features that positively impact our development.</p>
<p>This also means that I had to spend a little time to migrate from Python 2.7 to Python 3 in our project. (It was a small Git commit, trust me 🤓).</p>
<p>Now some exciting stats – Ren'Py's built-in linter is perfect for gathering stats for comparisons between v1 and v1.5:</p>
<pre><code class="lang-pgsql"># v1
Ren<span class="hljs-string">'Py 7.4.8.1895 lint report, generated at: Fri Dec 17 22:11:43 2021
Statistics:
The game contains 1,335 dialogue blocks, containing 15,390 words and 85,105 characters, for an average of 11.5 words and 64 characters per block.
The game contains 40 menus, 20 images, and 49 screens.

# v1.5
Ren'</span>Py <span class="hljs-number">8.0</span><span class="hljs-number">.3</span><span class="hljs-number">.22090809</span> lint report, <span class="hljs-keyword">generated</span> at: Tue <span class="hljs-type">Dec</span> <span class="hljs-number">20</span> <span class="hljs-number">19</span>:<span class="hljs-number">22</span>:<span class="hljs-number">05</span> <span class="hljs-number">2022</span>
<span class="hljs-keyword">Statistics</span>:
The game contains <span class="hljs-number">3</span>,<span class="hljs-number">339</span> dialogue blocks, containing <span class="hljs-number">41</span>,<span class="hljs-number">214</span> words <span class="hljs-keyword">and</span> <span class="hljs-number">220</span>,<span class="hljs-number">501</span>
characters, <span class="hljs-keyword">for</span> an average <span class="hljs-keyword">of</span> <span class="hljs-number">12.3</span> words <span class="hljs-keyword">and</span> <span class="hljs-number">66</span> characters per block.
The game contains <span class="hljs-number">68</span> menus, <span class="hljs-number">19</span> images, <span class="hljs-keyword">and</span> <span class="hljs-number">51</span> screens.
</code></pre>
<p>From the stats we can see that we've nearly tripled the story content. Woohoo! 🤩</p>
<h2 id="heading-next-steps-for-learntocoderpg-from-v15-to-v2">Next Steps for LearnToCodeRPG: From v1.5 to v2</h2>
<p>Hooray! After a whole year of development, we've taken v1 to new heights and are now presenting you with <strong>Learn to Code RPG v1.5</strong>.</p>
<p>What's more exciting: we are only just getting started. Just as Quincy always likes to say, the sky is the limit. ✈️</p>
<p>Here are some things you can look forward to in v2, or even sooner, between v1.5 and v2:</p>
<ul>
<li><p>🌎 Localization: All the text in v1 has been fully translated into Portuguese, and we have an active community working on translating the game into other world languages. You can help too, by starting <a target="_blank" href="https://contribute.freecodecamp.org/#/how-to-translate-files?id=translate-the-learntocode-rpg">here</a>.</p>
</li>
<li><p>🎭 More story and characters (shhh... we have 10+ characters planned and some drawn already)</p>
</li>
<li><p>📚 Expanded bank of quiz questions and spaced repetition to help you learn more efficiently.</p>
</li>
<li><p>💻 Auto-update from inside the game so that you can stay up-to-date with the latest bug fixes, features, and storylines.</p>
</li>
<li><p>... and more on our holiday wishlists! 🎁</p>
</li>
</ul>
<p>Last but not least, we hope you enjoy playing this game as much as we enjoyed developing it! 🥳</p>
<h3 id="heading-links">Links</h3>
<p>You can find the game on itch.io here:</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://freecodecamp.itch.io/learn-to-code-rpg">https://freecodecamp.itch.io/learn-to-code-rpg</a></div>
<p> </p>
<p>And here's the GitHub repo with all the code:</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://github.com/freeCodeCamp/LearnToCodeRPG">https://github.com/freeCodeCamp/LearnToCodeRPG</a></div>
<p> </p>
<p>If you haven't read about how v1 of the game took shape, here's an article for you:</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://www.freecodecamp.org/news/learn-to-code-rpg/">https://www.freecodecamp.org/news/learn-to-code-rpg/</a></div>
<p> </p>
<p>And here's the official press kit for the game:</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://www.freecodecamp.org/news/learn-to-code-rpg-press-kit/">https://www.freecodecamp.org/news/learn-to-code-rpg-press-kit/</a></div>
<p> </p>
<p>If you are interested in building a Visual Novel Game yourself, check out this article of mine:</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://www.freecodecamp.org/news/use-python-to-create-a-visual-novel/">https://www.freecodecamp.org/news/use-python-to-create-a-visual-novel/</a></div>
<p> </p>
<p>We hope you enjoy learning what it's like to work in tech by playing the Learn to Code RPG. 🧑‍💻</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ The Best Programming Language to Learn – Beginners Guide to Coding ]]>
                </title>
                <description>
                    <![CDATA[ Technology is changing how we live. We use and rely on web applications and electronic devices daily to complete various tasks. And behind these modern-day software programs are thousands of lines of code. Coding is one of the most valuable skills to... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/the-best-programming-language-to-learn-beginners-guide-to-coding/</link>
                <guid isPermaLink="false">66b1e4bda48ebbb08ba2089a</guid>
                
                    <category>
                        <![CDATA[ beginners guide ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ programming languages ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Dionysia Lemonaki ]]>
                </dc:creator>
                <pubDate>Fri, 28 Oct 2022 21:03:55 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2022/10/pexels-christina-morillo-1181677.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>Technology is changing how we live. We use and rely on web applications and electronic devices daily to complete various tasks. And behind these modern-day software programs are thousands of lines of code.</p>
<p>Coding is one of the most valuable skills to learn today. You can not only build any idea you have and see it come to life, but you can also improve your future.</p>
<p>Knowing how to code increases your chances of getting a higher-paying job.</p>
<p>According to the <a target="_blank" href="https://www.bls.gov/ooh/computer-and-information-technology/software-developers.htm">U.S. Bureau of labor statistics</a>, software engineers earned a median annual salary of $109,020 in 2021.</p>
<p>In addition, the computer programming and software engineering industry is growing fast, and coding jobs are in high demand.</p>
<p>According to the <a target="_blank" href="https://www.bls.gov/ooh/computer-and-information-technology/software-developers.htm">U.S. Bureau of labor statistics</a>, the anticipated change for 2021-2031 is a 25% growth, which is much faster than average.</p>
<p>All the data above sound great, but with hundreds of programming languages available today, choosing the best one to learn can leave you confused, intimidated, or even overwhelmed.</p>
<p>The truth is, there is no one correct answer to the question 'What is the <em>best</em> programming language to learn?'.</p>
<p>The language you choose to learn will depend on many things, such as what you want to build, what projects you want to work on, your individual career goals, the desired path you want to take, or even how much you want to challenge yourself.</p>
<p>In this article, I first explain what programming languages are and go over the differences between programming, scripting, and markup languages.</p>
<p>I also list some of the most popular languages that beginners choose to learn according to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#most-popular-technologies-language-learn">Stack Overflow Developer Survey for 2022</a>.</p>
<p>Here is what we will cover:</p>
<ol>
<li><a class="post-section-overview" href="#programming-language">What are programming languages?</a><ol>
<li><a class="post-section-overview" href="#differences">Programming languages vs scripting languages vs markup languages - what's the difference?</a></li>
</ol>
</li>
<li><a class="post-section-overview" href="#list">The most popular programming languages to learn</a><ol>
<li><a class="post-section-overview" href="#html+css">HTML and CSS</a></li>
<li><a class="post-section-overview" href="#js">JavaScript</a></li>
<li><a class="post-section-overview" href="#python">Python</a></li>
<li><a class="post-section-overview" href="#sql">SQL</a></li>
<li><a class="post-section-overview" href="#c++">C++</a></li>
<li><a class="post-section-overview" href="#java">Java</a></li>
</ol>
</li>
</ol>
<p>Let's dive in.</p>
<h2 id="heading-what-are-programming-languages">What Are Programming Languages? <a></a></h2>
<p>Coding involves telling a computer what to do how to do it. You do this by providing it with a sequence of instructions using a language both humans and machines understand.</p>
<p>The machine interprets the instructions and carries them out to achieve a specific result.</p>
<p>Computers do not understand human languages. They only speak binary – a language consisting of <code>0</code>s and <code>1</code>s.</p>
<p>In binary, <code>0</code> represents off, and <code>1</code> represents on.</p>
<p>It makes perfect since that binary is the primary language of all machines since electronic devices have thousands of transistors (or tiny switches) inside them. And the switches turn on or off depending on the flow of electricity.</p>
<p>But coding in binary is time-consuming and very error-prone. So, humans invented computer programming languages that are readable, easier to learn and understand, and much more human-friendly.</p>
<p>Computer programming languages fall into one of two groups: low-level and high-level.</p>
<p>Low-level programming languages have little or no abstraction from the machine's instruction set. Essentially, their instructions are close to the machine's processor's instructions.</p>
<p>Binary code (or machine code) and assembly language are considered low-level programming languages.</p>
<p>High-level programming languages are more human-friendly.</p>
<p>They are similar to human languages and look a lot like English. They offer a shorter, more precise, and less verbose way to create instructions that the computer can understand.</p>
<h3 id="heading-programming-languages-vs-scripting-languages-vs-markup-languages-whats-the-difference">Programming Languages VS Scripting Languages VS Markup Languages - What's the Difference? <a></a></h3>
<p>At this point, it is worth mentioning that every language fits into a specific category.</p>
<p>There are three categories of languages:</p>
<ul>
<li>Programming languages</li>
<li>Scripting languages</li>
<li>Markup languages</li>
</ul>
<p><strong>Programming languages</strong> are used for writing logical sets of instructions for computers to execute and solve a problem.</p>
<p>Programming languages are written in a human-readable form but get converted to machine code (binary). </p>
<p>And this conversion happens with the help of a <a target="_blank" href="https://www.freecodecamp.org/news/what-is-a-compiler-in-c/">compiler</a>, which fully translates at once all the instructions written in a high-level programming language into something the computer's <a target="_blank" href="https://www.freecodecamp.org/news/what-is-cpu-meaning-definition-and-what-cpu-stands-for/">CPU</a> can easily understand.</p>
<p>Once the instructions are in a machine-readable form, the computer executes them, and they can run on the machine.</p>
<p><strong>Scripting languages</strong> go hand in hand with programming languages – you can think of them as a subset or subcategory of programming languages.</p>
<p>The main difference between programming and scripting languages is how each gets compiled.</p>
<p>Scripting languages get <a target="_blank" href="https://www.freecodecamp.org/news/compiled-versus-interpreted-languages/">intrerpreted rather than compiled</a>.</p>
<p>Scripting languages use an interpreter which translates each instruction, executes it, and then moves on to the next instruction and continues to do the same line by line instead of all at once as a compiler does.</p>
<p><strong>Markup languages</strong> are presentational languages and <em>not</em> programming or scripting languages. They are entirely different since they don't involve logical processing.</p>
<p>Markup languages are languages used for defining, describing, and structuring data on a web page. They also lay out and style data on a page.</p>
<h2 id="heading-the-most-popular-programming-languages-to-learn">The Most Popular Programming Languages to Learn <a></a></h2>
<p>In the following sections, I list some of the most popular languages that beginners choose to learn. I also list their use cases and some resources for you to get started learning them.</p>
<h3 id="heading-html-and-css">HTML and CSS <a></a></h3>
<p>HTML and CSS are <em>not</em> technically programming languages, but according to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#technology-most-popular-technologies">Stack Overflow developer survey for 2022</a>, they rank first as the most popular languages for people learning to code.</p>
<p>HTML and CSS are markup languages, and you use them to create static web pages.</p>
<p>They are two languages you need to learn if you are interested in becoming a frontend developer. You can also learn them alongside JavaScript to add interactivity to the static pages you create.</p>
<p>HTML (which stands for HyperText Markup Language) defines the structure and content of a web page. So, the paragraphs, headings, lists, forms, and links you see on a page, along with their hierarchies, are all HTML code.</p>
<p>And thanks to the latest version of HTML, HTML5, you can embed images, videos, and audio in web pages eliminating the need to use extra plugins like you had to in the past.</p>
<p>CSS (short for Cascading Style Sheets) styles HTML elements. It is responsible for presenting content in a visually appealing way.</p>
<p>CSS code enables all the different colors and fonts. The sizing of elements and how those elements get displayed on the page. The page layout and how items get arranged next to one another.</p>
<p>To learn HTML and CSS, check out the following resources:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-html-beginners-course/">Learn HTML – Beginner's Course</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-css-in-this-free-6-hour-video-course/">Learn CSS in this free 6-hour video course</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/html-css-11-hour-course/">Learn HTML and CSS with this free 11 hour course</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-html-and-css-in-spanish-course-for-beginners/">Learn HTML and CSS in Spanish – Course for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/learn/2022/responsive-web-design/">Responsive Web Design Certification</a></li>
</ul>
<h3 id="heading-javascript">JavaScript <a></a></h3>
<p>According to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#technology-most-popular-technologies">Stack Overflow developer survey for 2022</a>, JavaScript has ranked first as the most commonly used programming language for ten consecutive years. And it is the second most popular language for people learning to code.</p>
<p>JavaScript (not to be confused with Java) is a scripting language that lets you add interactivity and dynamic behaviors to otherwise static web pages. </p>
<p>Some interactive features JavaScript can add are:</p>
<ul>
<li>A map with a user’s current location</li>
<li>A message shown to a user once they land on the page</li>
<li>A change on the page based on user input</li>
<li>An animation when a user clicks a button</li>
<li>A smooth scroll effect when there is a button to scroll back up to the top of the page.</li>
<li>Mouseover effects</li>
</ul>
<p>One of JavaScript's strengths as a language is that you don't need to compile your code to see the results of your work.</p>
<p>Javascript is built in and runs in browsers, meaning you don't need to install it on your local machine and go through a complicated and error-prone installation process.</p>
<p>JavaScript is used primarily for client-side programming and server-side scripting. </p>
<p>Specifically, JavaScript is used for frontend web development and even backend web development with the help of Node.js, a JavaScript runtime environment for running JavaScript on a server and not just the browser.</p>
<p>Knowing JavaScript is a must if you want to work as a frontend developer, and it is a popular language of choice for backend and full stack web development roles.</p>
<p>To learn more about the differences between frontend and backend web development, give <a target="_blank" href="https://www.freecodecamp.org/news/frontend-vs-backend-whats-the-difference/">this article</a> a read. And to learn what the job of a full stack web developer entails, give <a target="_blank" href="https://www.freecodecamp.org/news/what-is-a-full-stack-developer-full-stack-engineer-guide/">this article</a> a read.</p>
<p>Besides creating complex web applications, JavaScript is also used for creating browser games.</p>
<p>To learn JavaScript, check out the following resources:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/full-javascript-course-for-beginners/">Full JavaScript Course for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-javascript-in-spanish-full-course-for-beginners/">Learn JavaScript in Spanish – Full Course for Beginners</a></li>
<li><a target="_blank" href="https://www.youtube.com/watch?v=ec8vSKJuZTk&amp;t=82s">Learn JavaScript by Building 7 Games - Full Course</a></li>
<li><a target="_blank" href="https://www.youtube.com/watch?v=8xPsg6yv7TU">JavaScript Tutorial: Build Flappy Bird and Doodle Jump</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/">JavaScript Algorithms and Data Structures certification</a></li>
</ul>
<h3 id="heading-python">Python <a></a></h3>
<p>Python is a general-purpose server-side scripting language. And according to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#most-popular-technologies-language-learn">Stack Overflow Developer Survey for 2022</a>, it is the third most popular language for people learning to code.</p>
<p>Python is a great language for beginners thanks to its readable, intuitive, concise, and beginner-friendly syntax.</p>
<p>It is a popular language when working with large amounts of data, so it's often used for machine learning, data science, data analysis, and data processing.</p>
<p>It is also the language of choice for web scraping. Web scraping is an automated technique that extracts, collects, and processes large amounts of raw data from the web.</p>
<p>You can also use Python for backend web development to create web applications with the help of frameworks such as Django and Flask.</p>
<p>In addition, Python is a popular language for test automation.</p>
<p>Instead of writing all the tests for your programs manually, you can rely on automation tools, Python libraries, and Python scripts to get the job done.</p>
<p>To get started learning Python, check out the following recourses:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/freecodecamp-python-courses-ranked-from-best-to-worst/">Python For Beginners Courses Ranked from Best to Worst – freeCodeCamp Edition</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/20-beginner-python-projects/">How to Code 20 Beginner Python Projects</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-how-to-build-12-python-projects-in-one-course/">Learn Python by Building 12 Projects in This 3-Hour Course</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/backend-web-development-with-python-full-course/">Backend Web Development with Python - Full Course</a></li>
</ul>
<h3 id="heading-sql">SQL <a></a></h3>
<p>SQL is short for Structured Query Language.</p>
<p>You will likely hear it pronounced one of two ways – "S. Q. L." (ess-kew-ell) or "sequel" (like a sequel to a movie).</p>
<p>Either way, SQL is a language used for working with databases and any job that involves storing, managing, accessing, and analyzing data. It is one of the languages of choice for data scientists, data analysts, statisticians, and marketers.</p>
<p>Specifically, with SQL, you can access, query, manipulate and interact with data stored in relational databases.</p>
<p>A database is an electronic storage localization for data. In databases, you can easily retrieve and search through your data.</p>
<p>And a relational database stores data in a structured and tabular format. That is, it stores information in tables (which you can think of as storage containers for the data) organized in columns and rows. All data items stored have pre-defined relationships with each other.</p>
<p>With SQL, you can write database queries to perform any CRUD (Create, Read, Update, Delete) operations on the data.</p>
<p>It is worth mentioning that SQL is not technically a programming language - you cannot build web applications or software tools using it. It is a query language and a tool used for managing relational databases and performing operations on the data stored in them.</p>
<p>And although it ranks fifth as the most popular language for people learning to code according to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#most-popular-technologies-language-prof">Stack Overflow Developer Survey for 2022</a>, it ranks third as the most popular language for professional developers. </p>
<p>So, it is a good idea to learn SQL as you may need to use it in a professional setting.</p>
<p>To learn SQL, check out the following resources:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-sql-free-relational-database-courses-for-beginners/">Learn SQL – Free Relational Database Courses for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-sql-in-10-minutes/">SQL Commands Cheat Sheet – How to Learn SQL in 10 Minutes</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/sql-recipes/">Learn SQL with These 5 Easy Recipes</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/sql-and-databases-full-course/">SQL and Databases - A Full Course for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/learn/relational-database/">Relational Database Certification</a></li>
</ul>
<h3 id="heading-c">C++ <a></a></h3>
<p>In the early 1980s, Bjarne Stroustrup created a language influenced by the C programming language. It could get close to the machine hardware and do demanding low-level computational tasks, but it also provided a higher level of abstraction without losing the low-level efficiency of C. </p>
<p>So, the language 'C with classes' was created, and in 1984 'C with classes' was renamed C++.</p>
<p>C++ is a superset of C and provides additional capabilities to the C language. </p>
<p>C++ allows the programmer close access to and manipulation of the machine while providing efficiency and high performance for large-scale systems. At the same time, it is higher level with enough abstraction away from the machine.</p>
<p>C++ is both a procedural and an object oriented programming language. OOP  divides a program into objects.</p>
<p>Everything gets organized and divided into smaller groups of related parts or objects, which are an instance of a class, following a bottom-up approach.</p>
<p>This programming style creates more readable and usable code that is easier to maintain while providing better data security.</p>
<p>C++ is a popular language for:</p>
<ul>
<li>creating game engines</li>
<li>creating computer graphics</li>
<li>creating applications</li>
<li>creating VR applications</li>
<li>creating web browsers such as Google Chrome, Mozilla Firefox, Safari</li>
<li>creating web browser extensions - the Google Search Engine is built in C++ </li>
</ul>
<p>According to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#technology">Stack Overflow Developer Survey for 2022</a>, it ranks sixth as the most popular programming language for people learning to code. And it is a great language if you want to get a software engineering job and develop programs and applications.</p>
<p>To learn C++, check out the following resources:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/how-to-learn-the-c-programming-language/">How to Learn the C++ Programming Language</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-c-with-free-31-hour-course/">Learn C++ Programming for Beginners – Free 31-Hour Course</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-object-oriented-programming-oop-in-c-full-video-course/">Learn Object Oriented Programming (OOP) in C++ | Full Video Course</a></li>
</ul>
<h3 id="heading-java">Java <a></a></h3>
<p>Java is an object-oriented, general-purpose programming language whose syntax is based on the C and C++ programming languages.</p>
<p>One of the language's advantages is its portability. Portability in computing means that programs get written once on one machine and can be transferred and run smoothly on another.</p>
<p>The Java Virtual Machine lets Java run on any device and operating system.</p>
<p>Java is used for:</p>
<ul>
<li>Building mobile applications for the Android Operating System</li>
<li>Backend web development</li>
<li>Game development</li>
<li>Creating embedded systems</li>
<li>Building desktop applications</li>
<li>Building enterprise-level software tools for the banking industry</li>
<li>Building artificial intelligence and Internet of Things (or IoT) devices</li>
</ul>
<p>Keep in mind that Java is not the same as JavaScript – they are in no way related to each other despite having the word 'Java' in their names.</p>
<p>JavaScript is an interpreted scripting language that runs in the browser and doesn't need to be compiled.</p>
<p>Java uses a combination of a compiler and an interpreter and runs on machines - not in browsers.</p>
<p>According to the <a target="_blank" href="https://survey.stackoverflow.co/2022/#technology">Stack Overflow Developer Survey for 2022</a>, Java ranked 4th as the most popular language for people learning to code. </p>
<p>Java coding skills can help you get a job as a software engineer, a web developer, and an android developer.</p>
<p>To start learning Java, check out the following resources:</p>
<ul>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-java-free-java-courses-for-beginners/">Learn Java – Free Java Courses for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/the-java-handbook/">The Java Handbook – Learn Java Programming for Beginners</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/learn-java-programming/">Learn Java Programming (version 17)</a></li>
<li><a target="_blank" href="https://www.freecodecamp.org/news/build-a-sudoku-java-desktop-application/">How to Build a Sudoku Game Java Desktop Application – A Free 2-hour Course</a></li>
</ul>
<h2 id="heading-conclusion">Conclusion</h2>
<p>Hopefully, this guide was helpful and gave you some insight into some of the best languages to learn as a beginner programmer.</p>
<p>Thank you for reading, and happy coding!</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ My Developer Journey – How I Learned to Code with Dyslexia and ADHD ]]>
                </title>
                <description>
                    <![CDATA[ By Jalmari Ikävalko Hi everyone, I'm Jalmari Ikävalko, a software developer in my early 30s. In this article, I’ll share my whole journey from my first contact with code to becoming the professional developer I am today.  I'll start from my childhood... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/developer-journey/</link>
                <guid isPermaLink="false">66d45f31182810487e0ce1a4</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Life lessons ]]>
                    </category>
                
                    <category>
                        <![CDATA[ self-improvement  ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ freeCodeCamp ]]>
                </dc:creator>
                <pubDate>Fri, 14 Oct 2022 16:01:31 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2022/10/1.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>By Jalmari Ikävalko</p>
<p>Hi everyone, I'm Jalmari Ikävalko, a software developer in my early 30s. In this article, I’ll share my whole journey from my first contact with code to becoming the professional developer I am today. </p>
<p>I'll start from my childhood when I first got interested in programming.</p>
<h2 id="heading-my-introduction-to-programming">My Introduction to Programming</h2>
<p>I was around 12 years old – give or take a year – when an unexpected summer storm was keeping us stuck indoors in the otherwise sunny Costa del Sol of southern Spain. It was the only time I was properly abroad as a kid, as the financial situation of my family wouldn’t typically allow a vacation beyond the confines of our home country.</p>
<p>My cousins and I were in our grandfather’s tiny apartment – as his operated-on lungs did not agree with the Finnish winter – and there he had a computer. The computer had no internet access, but at the time Microsoft Word happened to include a Visual Basic editor and compiler.</p>
<p>Then it was that my cousin, older by a year or two, showed me some basics of programming, in Visual Basic.</p>
<p><img src="https://lh3.googleusercontent.com/OIhqY3CnammPwR8XbxclxdHGxoDOtHdkIlEbH7dnJzjwPgiGSoq3u58CMVAmmD0ALJq0sH_O9yRsSnNJE_icaPoqH_dfANmKKwlKgNhX8lMotC1YzGmNzDKFUS9KP2Dtd_E39Cf5YesLnrQ-lJA7umWya6uXI8don5Yz2IIhuTIiJDfkaobp1JihgQ" alt="Image" width="850" height="560" loading="lazy">
<em>A screenshot of Microsoft Visual Basic editor</em></p>
<p>As far back as I can remember, I’ve been interested in computers and enjoyed spending my time on them. </p>
<p>At my mom’s place, where I lived most of the time, we didn’t have all that many video games, and the computers tended to be a few generations behind the current crest of the wave. Still, I could spend a lot of time just exploring what the computer was able to do. Trying out DOS commands, going through random files I found, and so forth.</p>
<p>So when I realized that anyone could program these machines and create new applications on them, I was of course immediately intrigued.</p>
<h2 id="heading-how-i-started-learning-to-code-as-a-kid">How I Started Learning to Code as a Kid</h2>
<p>My journey started off pretty bumpy. At the time, I had no idea where a little kid with poor English skills could find usable resources for learning to code. I bugged my dad, who had done some websites and had some general understanding of programming as a phenomenon, and he showed me some HTML, CSS, and JavaScript. </p>
<p>JavaScript, at the time, was relatively new and hadn’t yet properly established itself as the de-facto language of the web. In fact, most websites avoided relying on it.</p>
<p>I went through the books in our small local library, but most of them were completely unintelligible to me (the librarians there were awesome, though. They’d suggest books to me while I hung there after school and there was a computer available with good Internet access). </p>
<p>I got my mom to buy me a book on C++ and I trudged through it, mostly not understanding what I was reading.</p>
<h2 id="heading-challenges-of-dyslexia-and-adhd">Challenges of Dyslexia and ADHD</h2>
<p>In those first years of learning to program, I didn’t really focus on learning very consistently and wasn’t really able to finish any projects – not even the tiniest of projects.</p>
<p>I would often feel very frustrated when I was trying to make something work and just couldn’t understand why it didn’t work like I imagined it should. </p>
<p>At the same time, school was not going very well. I was diagnosed with dyslexia in the first years of elementary school and was in remedial education for English. I also struggled with motivation – and bullying – and ended up only barely getting through without having to repeat a grade.</p>
<p>When I was around 15, I discovered IRC (a text-based chat system) and a Finnish programming community with its own website and an IRC channel. At the time we finally had gotten a broadband internet connection, which let me spend most of my days online. Having people to talk to and having resources in my native language accelerated my learning process. </p>
<p>I also got interested in demoscene – a scene of computer artists revolving around what is known as demos. These are programs that programmatically generate video and audio at runtime, without the video and audio being pre-recorded and stored inside the program. I got interested in creating visual effects programmatically.</p>
<p>Still, I was struggling with understanding graphics programming and how more advanced visual effects were created. I was stuck creating some pretty simple ones, like a basic tree fractal.</p>
<p><img src="https://lh4.googleusercontent.com/CAV1ecmtb0XlzU28pp4_M7hq1IcWbib-OXY5qipcDYALR7b2k5fNJ1xOXCIZIC-0TGD7J7Io2BiybMSq4CSvnTGjxr7-iQF2RvraR_qF068-M72WHxi183r8bcerMatL19jJmCXRWVZGx7qpjBwQKn_1zrC-X3XwIS_gUjDmmeQY1Yu7GrNCONRTeQ" alt="Image" width="600" height="300" loading="lazy">
<em>A simple tree fractal</em></p>
<p>Meanwhile, I had some peers, not necessarily any older than I was, who were doing complex 3D effects, full-duration demos, fully playable games, and more.</p>
<p>I often felt pretty dumb in comparison, as I wasn’t nearly as quick a learner as they were, and I struggled with making sense of complex code. </p>
<p>In retrospect, it’s not too surprising – my dyslexia and the ADHD I was later diagnosed with definitely affected, and continue to affect, my ability to discern symbols from each other. They also make it difficult to make sense of long lines of text, whether the text is in a human or a programming language. </p>
<p>Even still I get mentally exhausted from reading text with sentences that are too long. The first ten or so pages of Dostoevsky’s Crime and Punishment, to me, felt like reading a full book on advanced algebraic geometry.</p>
<p>Still, I pushed on, motivated by the thought that one day I would be able to create visual effects, games, physic simulations, and so on.</p>
<h2 id="heading-my-first-job">My First Job</h2>
<p>I did some small demos and some physics demonstrations, nothing very special, and overall they were pretty crude, but somehow they still managed to land me a trainee job in a small local company working on a 3D engine for phones. </p>
<p>This was in 2008 or so when I was 18. At the time I didn’t even own a smartphone. The first iPhone had just come out a year earlier and I’ve always been a bit behind with the latest tech.</p>
<p>I was pretty sure that a 3D engine for a phone made no sense – who would want to be looking at 3D content from that tiny screen? And I was, of course, completely right! Well, okay, I wasn’t, but worse though – and somewhat to my horror – I was completely out of my depth. </p>
<p>I had managed to fake some sort of an impression of skill in the interview, but in truth, I had no idea about how to properly program shaders or improve and optimize a rendering engine. </p>
<p>I wasn’t able to do the job and my contract wasn’t continued – I felt embarrassed enough to never have included that short stint in my future job applications.</p>
<h2 id="heading-getting-involved-in-open-source">Getting Involved in Open Source</h2>
<p>Around that time, I also made some small contributions to a couple of open source games and 3D engines. It wasn't anything very special, or mathy, or bleeding edge – just adding minor features like copy-pasting constant values to a list from some specification or adding a feature for picking up multiple items at the same time instead of just one item. Stuff like that.</p>
<p>I was still learning quite slowly and wasn’t able to finish complex tasks on my own. This was frustrating, since I'd been aware of programming for around six years and had more actively practiced it for two years. The people involved were very helpful though, and I did learn a lot of small things from everyone helping me.</p>
<h2 id="heading-my-university-experience">My University Experience</h2>
<p>The year I turned 19 I applied to university. I did not have the formal prerequisites for enrolling in a Finnish university, as I hadn’t completed the Finnish matriculation exams (roughly comparable to SAT in the USA and the A-levels in the UK). </p>
<p>Still, I wrote them a letter asking for special permission to participate in the exams for computer science. I was granted permission and scored high enough in the exams to enroll.</p>
<p>Unfortunately, I still wasn’t a very good student. On one hand, I was a bit too proud and felt the beginner courses were somehow too menial for me. On the other hand, if a course got hard, I quickly lost the motivation to study. </p>
<p>After a few years of finishing only a few courses and without having learned much of anything, I got kicked out.</p>
<p>I was around 21, out of school, jobless, and back to living at my mom’s place. I still kept to programming as a hobby. Writing minor features for open source software, trying out a few short gigs (and failing them all). Then I noticed someone on one of my IRC channels looking for help with their startup. I volunteered and ended up getting hired.</p>
<h2 id="heading-working-at-a-startup">Working at a Startup</h2>
<p>I remotely knew the person, as they were partially involved in the same communities as I, though we hadn’t directly talked before I joined his company. </p>
<p>It was a bit of an unusual setup. We shared an apartment, which was kind of unofficially part of the pay, and my salary was something like half of what the company I now work in would pay for trainees and juniors in their first job. </p>
<p>I would generally not recommend these sorts of contracts to people, but in my case, it didn’t work out too badly. I was finally able to be somewhat useful, could live on my own, and was making at least a little bit of money – not that any of it was ever left at the end of the month.</p>
<p>I still wasn’t very good at finishing tasks on my own and the quality of my code was rather bad. But with that pay level, my friend’s startup didn’t truly have all that many options. Mostly, I was doing minor feature improvements, fixing bugs, and adding some new functionality to the software.</p>
<p>A year or two later I met my then-future wife. We moved together, I changed cities, and left that startup behind.</p>
<h2 id="heading-junior-game-developer">Junior Game Developer</h2>
<p>I then applied to another startup, with a slightly better salary, and with more than 2-3 people working for them. My assignment for the technical interview was to add a mirror effect to a 3D scene with a skater on ice. </p>
<p>Typically, you do reflections by placing a virtual camera on where the reflection is and then render the scene from the perspective of that camera. I had never done that, though, and ended up using another hack that I had done previously. </p>
<p>I simply rendered the scene again, just flipped on the X-axis. It’s an imperfect technique but was commonly used in older games and works well enough for flat surfaces that are underneath the camera by a sufficient distance.</p>
<p>The job was a bit all over the place, in regard to the skills needed. The fact that I had contributed – even if insignificantly – to a large bunch of diverse projects finally paid dividends. </p>
<p>Over the same day, I might be coding shaders for graphics effects. I might be fixing up a web backend, configuring installers, or maintaining servers (having run Linux through much of my teens was worth it! Though it had never made me as popular in school as I was told it would).</p>
<h2 id="heading-from-junior-dev-to-cto">From Junior Dev to CTO</h2>
<p>When I started, I was a junior game developer by title. Over time we got more and more projects, the work got more challenging, and then one day our CTO left. With no one else to replace him, I became the replacement. </p>
<p>At roughly the same time, good ol’ Adobe Flash was dying and its support was ending, and our products happened to be mostly in Flash. So I ended up leading a major rewrite of our main products from Flash to the Unity game engine. </p>
<p>At the same time, we expanded our repertoire of web products, and I led the development for those, too – sometimes more successfully, sometimes less. I still wonder how exactly I managed to keep up with it all and not crumble under the stress, but I suppose that when you give someone responsibility, they just might rise to the occasion.</p>
<p><img src="https://lh3.googleusercontent.com/X-K_XtDjg9gDeR9A3QzopdrG8_pPh4zUNY44qP-US1eIM73txS0M1qF4eg9KWcxsnHheUtPo44gPqqx8SmY5Bk8N6bQYaNouugGcl-KWwGSJ0WQif5DrWvI-k8d4XsXuuiop9u_hiQCnrf9QQF1t7RnrRVC4Gd7g9f3b2uQwUrOne7E5PhsqMN9rkQ" alt="Image" width="565" height="308" loading="lazy">
<em>A noise meter &amp; crowd camera product of a startup I worked for (from Uplause promotional materials)</em></p>
<p>I ended up working at that company for six years. But at some point, I started to feel that my chances for professional development were exhausted. We had trainees and juniors coming by, staying half a year to a year, and a lot of the time I was the only experienced full-time developer. </p>
<p>I also didn’t feel very invested in the projects anymore. They were fun enough to do, but I didn’t own any of the company and my salary wasn’t at the level where it would have been elsewhere.</p>
<p>At the time, I wasn’t very well aware of the wider Finnish IT scene. I mostly knew about our biggest game companies – which weren’t and still aren’t that many – but I didn’t really know what the big consulting or product companies were. </p>
<p>So, I ended up applying for a new job by simply googling for job openings and finding a company with a stated mission and values that seemed like a good fit for me.</p>
<p>I didn’t know it at the time, but that company had actually won a bunch of awards for being one of the best places to work at. And it was, in a sense, somewhat prestigious to work at. </p>
<p>I arrived at the interview woefully underprepared, but the cultural fit was good and my technical skills were deemed decent enough to proceed through the interview rounds and I ended up getting hired.</p>
<h2 id="heading-from-startups-to-software-consulting">From Startups to Software Consulting</h2>
<p>So, around three years ago, I moved away from the startup world to become a software consultant.</p>
<p>When I joined my current company, I was quite self-assured in my skills and considered myself to have grown into a very good and clever programmer. I wasn’t completely wrong, but it did turn out that I went from being the large fish in a small pond to being, at best, an average fish in a much larger pond.</p>
<p>My old enemies, concentration and focus (or the lack of them) were again orchestrating quite the discord to deal with. I doubt I’ll ever be fully free from having to regularly repeat the struggle of finding motivation and keeping my discipline up. </p>
<p>There were also parts of my technical skillset that I had badly overlooked. In the first year and a half, I ended up significantly improving my functional coding skills and my ability to write easily testable code. </p>
<p>I also needed to modernize a lot of my knowledge. Getting used to newer continuous integration tools, cloud services testing tools, and libraries, was quite the process. (At the small barely-getting-by type startups, we typically used virtual private servers since they were cheaper and cloud services weren’t yet quite as mature as they are right now.)</p>
<p>Practical work is one of the best ways to improve, though, and improve I did – and at a pretty decent pace, in my opinion.</p>
<p>Today, our company isn’t much for titles and we sometimes use purposefully inflated titles just for the cheap laughs. But if I have to give a title to a client, I’m typically a senior software consultant. It’s a descriptive enough title.</p>
<p>And after an arduously long journey to become a developer who can kickstart projects, lead feature development, participate in all stages of software development, and whose help and feedback others can rely on, I think I’ve finally matured enough to check all the boxes for what’s expected from a senior developer.</p>
<p>I’m still constantly learning new things. Lately, I’ve started to feel like I would like to try out working on data engineering, data analysis, and machine learning tasks.</p>
<p>Since I mostly ended up skipping school, I’ve been taking statistics courses at the open university of Helsinki to better understand the terminology and methodologies that data analysts are using. </p>
<p>On the other side, I’ve also started to study for key cloud certificates, like data administrator and data engineer certificates, to further up my credentials in client offerings.</p>
<p>And, funnily enough, after finally having had some success in studying through difficult courses, I’ve also started to feel that maybe a Bachelor's Degree wouldn’t be impossible for me either. Though I am not sure if after all this time I still want it in Computer Science!</p>
<h2 id="heading-luck-is-what-happens-when-preparation-meets-opportunity">"Luck is What Happens When Preparation Meets Opportunity"</h2>
<p>So that was my journey, from the first time I saw code to what I am doing today. It was at times a frustrating and bumpy road, and I know many people have had an easier time learning to program than I had. Still, I consider myself pretty lucky overall. </p>
<p>One ex-coworker used to have a quote by the Roman philosopher Seneca as their signature, “Luck is what happens when preparation meets opportunity”. But there’s a lot more to it than just that. Your childhood environment affects your preparation and the opportunities you get are down to statistical chance. </p>
<p>I consider myself lucky for having had so many opportunities despite also failing them due to lacking preparation. </p>
<p>And I consider myself lucky for having had supportive parents and a smart, programming-aware cousin to show me stuff. </p>
<p>Today I am lucky for having some pretty amazing, extremely skilled co-workers and a work environment where neurodivergence is accepted.</p>
<p>Yet, there is a bit of truth to the quote. If preparation is what you get as a product of hard work, I did put in the work even when the work was mostly hitting my head against the wall. </p>
<p>The truth is that if you have a disadvantage like dyslexia or ADHD, things can take a lot longer for you to learn than for someone else. But that doesn’t mean it’s impossible to learn. The end result just might be all the sweeter, too. The skills you end up with will be hard-earned, a testament to your ability to overcome difficulties.</p>
<p>Today, it is absolutely awesome how much better resources fresh learners have available to them. When I was younger, the quality of free resources – when they were available at all – was often dubious at best, and many tutorials didn’t teach things well, if even correctly at all. </p>
<p>We have the likes of the University of Helsinki’s MOOC.fi available for everyone, for free. And we of course have freeCodeCamp. There are many learning communities spread over Reddit, Discord, and so on. </p>
<p>Make good use of these services and, one day, after having made it, perhaps look back and see how you could contribute to them in turn.</p>
<p>One last piece of advice I’d like to give to people new to programming: Programming is at its best when it’s fun. If you’re bored with your current courses and don’t feel like you’re enjoying your time, try out something different. </p>
<p>Generate sine waves and combine them into chords. Create some fractals programmatically. Try making the most annoying website possible, with flashing lights and sound effects when clicking buttons. </p>
<p>Make programming fun. You’ll also learn surprisingly much while doing it.</p>
<p>In addition to the freeCodeCamp editorial team, I'd like to credit Liisa Toivonen for helping out with proofreading and some suggestions.</p>
<p>Thanks for reading!</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ What I Learned Teaching 20 High School Girls How to Code ]]>
                </title>
                <description>
                    <![CDATA[ On day 1, they barely knew what a float was. On day 14, they had programmed a game of minesweeper, a cipher decoder, or a zombie apocalypse simulation. And I helped teach them how to do it. Each summer, MIT hosts a program called WTP, or Women's Tech... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/what-i-learned-teaching-20-hs-girls-to-code/</link>
                <guid isPermaLink="false">66b0c4587abc6e46174eea11</guid>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ teaching ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Kylie Ying ]]>
                </dc:creator>
                <pubDate>Wed, 14 Sep 2022 14:46:14 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2022/09/pexels-pixabay-207691.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>On day 1, they barely knew what a <em>float</em> was. On day 14, they had programmed a game of minesweeper, a cipher decoder, or a zombie apocalypse simulation. And I helped teach them how to do it.</p>
<p>Each summer, MIT hosts a program called WTP, or Women's Technology Program. </p>
<p>In the program's own words, its goal is:</p>
<blockquote>
<p>"to spark interest in the future study of engineering and computer science among high school rising seniors". </p>
</blockquote>
<p>The program fosters a collaborative, women-focused community for those who have not had opportunities to explore engineering and technology.</p>
<p>This year, I had the privilege of being the Computer Science Instructor for the EECS (Electrical Engineering and Computer Science) track of WTP. This meant I would be teaching 20 high school girls how to code – none of whom had any prior exposure to programming.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-362.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>In two short weeks, I, along with four brilliant tutors from MIT, would teach them the foundations of programming in Python: data types, variables, conditionals, loops, functions, classes, and even inheritance. The last week of the program would be reserved for working on a programming project of their choice, putting their new skills to the test.</p>
<p>As the instructor, I spent over a month preparing the materials for the class. During the course (no pun intended) of the class, I spent three hours a day running lectures and one hour a day running office hours for the students. Here's what I learned along the way:</p>
<h2 id="heading-1-anyone-can-learn-to-code">1) Anyone Can Learn to Code</h2>
<p>Yes, anyone.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-366.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>On day 1, I handed everyone a Python cheat sheet. They looked at it with horror and intimidation (I will admit, the formatting was a little scary). But by day 8, we discussed the cheat sheet and the general consensus was that they understood almost everything!</p>
<p>The girls I taught came from all over the country, all with varying backgrounds and access to resources. By the end of the class, all the students felt like they understood the basics and simply needed more repetition.</p>
<p>Perhaps some students with more access to math and science resources grasped concepts <em>faster</em>, but those without the same background were still able to understand those topics eventually. It <em>did</em> take extra work.</p>
<p>These students often sought extra help with assignments, or voluntarily spent their time reviewing additional problems. Nonetheless, at the end of the day, they were able to complete the same tasks and projects as their accelerated peers.</p>
<h2 id="heading-2-community-matters">2) Community Matters</h2>
<p>When you learn with other people, it makes all the difference. A supportive, inviting community can help you answer questions, explain a concept from a different perspective, and remind you that the road ahead is tough, but you are all in this together.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-368.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>Often, my students formed their own problem-solving groups to discuss approaches tackling different assignments. In fact, this collaboration is encouraged by MIT policies. </p>
<p>In these groups, when you discuss different solutions and weigh the pros and the cons of each solution, you are exposing yourself to new ideas and new concepts.</p>
<p>Ultimately, these will build problem-solving skills. At the core of programming, is problem-solving.</p>
<p>WTP created a unique community of supportive women, led by women in STEM. I noticed that the key to building a supportive and welcoming community is patience, understanding, and open dialogue–ensuring that nobody feels alienated, ridiculed, or belittled.</p>
<h2 id="heading-3-coding-takes-practice">3) Coding Takes Practice</h2>
<p>At the beginning of the course, I asked my students if anyone knew or was learning another language. Ten hands went up. Then, I asked my students if they could write a book in that language. No hands were in the air.</p>
<p>Learning a programming language is much like learning any other language. While it is critical to understand grammar, vocabulary, and syntax, these become intuitive with practice. </p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-369.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>But programming a script is much like writing a book (or maybe an essay). The idea and structure are as important as the language itself.</p>
<p>Words alone do not write a book. Ideas write the book, and language simply expresses those ideas. Similarly, conditionals and loops alone do not make up a script. Logic writes the backbone, and conditionals/loops tell the computer how to execute it.</p>
<p><em>How do I keep track of used letters in hangman? How do I find the index of the smallest number in a list? How should I represent this polynomial?</em></p>
<p>For a beginner programmer, these are daunting questions. For someone who has experience, these come with intuition. The only difference between the beginner and the expert is the time spent on practicing the skill.</p>
<h2 id="heading-4-teaching-is-rewarding">4) Teaching is Rewarding</h2>
<p>I could have spent my summer relaxing on the California coast. Instead, I chose to teach. I have no regrets.</p>
<p>Teaching is difficult. There is a saying along the lines of: <em>if you can't teach it, you don't know it</em>. Teaching forces you to fully understand a concept so that you can explain it in multiple ways to others. It is exhausting to repeat yourself over and over, hoping that maybe the concept finally clicks.</p>
<p>However, when a student has that <em>AHA!</em> moment when something finally makes sense, it is the best feeling in the world. To know that you have passed on your knowledge to someone who desired to learn it means you have given a priceless gift.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-371.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>I have been extremely privileged to go through an education system that values learning and to be able to attend one of the most renowned colleges in America. I attribute much of this to the teachers I had growing up. This is proof that teachers can have a huge impact.</p>
<p>At the end of the course, some of the students were excited to show their friends what they learned and to help then learn to code as well.</p>
<p>The act of teaching is exponential.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/09/image-370.png" alt="Image" width="600" height="400" loading="lazy"></p>
<h2 id="heading-in-reflection">In Reflection</h2>
<p>Initially, I was hesitant to be the instructor. It meant three weeks of my summer after graduation occupied by teaching. Twenty high school girls' introduction to programming through me, their thoughts about STEM influenced by how I taught my course. I was nervous.</p>
<p>However, reflecting upon the summer, I am extremely grateful to have had this once-in-a-lifetime opportunity to interact with and teach these students. I helped them learn not just how to program in Python, but also how to think like a computer scientist. It inspired me to continue teaching, especially in interactive environments where I could ask real-time questions.</p>
<p>At the very end of the program, the students created a monthbook and wrote cute notes to one another and the staff. Upon reading the messages addressed to me, I felt honored to be part of their introduction to computer science. They were just as inspirational to me as I was to them.</p>
 ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ My First Year as a Professional Developer – Tips for Getting into Tech ]]>
                </title>
                <description>
                    <![CDATA[ Hi everyone! In this article I'll share my thoughts on my first year of professional experience as a software developer. It's almost been two years since I got into coding and a year since I became a full-time dev. I started writing this article mere... ]]>
                </description>
                <link>https://www.freecodecamp.org/news/my-first-year-as-a-professional-developer-tips-for-getting-into-tech/</link>
                <guid isPermaLink="false">66d45f15182810487e0ce19c</guid>
                
                    <category>
                        <![CDATA[ career advice ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Career Change ]]>
                    </category>
                
                    <category>
                        <![CDATA[ learning to code ]]>
                    </category>
                
                    <category>
                        <![CDATA[ personal development ]]>
                    </category>
                
                    <category>
                        <![CDATA[ self-improvement  ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ German Cocca ]]>
                </dc:creator>
                <pubDate>Mon, 15 Aug 2022 20:24:37 +0000</pubDate>
                <media:content url="https://www.freecodecamp.org/news/content/images/2022/05/jiangxulei1990-feX-KFWRR5o-unsplash.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>Hi everyone! In this article I'll share my thoughts on my first year of professional experience as a software developer.</p>
<p>It's almost been two years since I got into coding and a year since I became a full-time dev.</p>
<p>I started writing this article merely as a self-reflection exercise. But I thought maybe someone who's in a similar position as I am or is just starting to code right now might find some of my experiences useful or interesting.</p>
<p>I plan on talking about a lot of things here. I'll go over everything from my background and how I switched careers at almost thirty to how I learned to code and chose my tech stack.</p>
<p>I'll also discuss what I plan on learning in the future and why, along with some general advice and my overall feelings and thoughts about this first year of professional work.</p>
<p>The way I'm going to structure this is that first I'm going to tell you the story of how I became a developer. Then I'm going to list the main thoughts and concepts that have helped me get to where I am now.</p>
<p>This article is going to be <a target="_blank" href="https://www.freecodecamp.org/news/author/gercocca/">a bit different from what I usually write</a>, in the sense that it won't be too technical and it might get too self-referential at some points. But the idea is to take you through my experience and thought process so you can get an idea of how things could be if you walked the same path.</p>
<p>Although always remember my opinions and experiences don't necessarily extend to everyone else. And I don't claim that my choices and preferences are necessarily the best. So you know... if you read through it all, just take whatever is useful to you and ignore the rest. :)</p>
<p>Enough cháchara, let's go!</p>
<h2 id="heading-table-of-contents">Table of Contents</h2>
<ul>
<li><p><a class="post-section-overview" href="#heading-my-background">My background</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-i-learned-to-code">How I learned to code</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-my-first-job-as-a-developer">My first job as a developer</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-present-tense-and-future">Present tense and future</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-tips-and-thoughts">Tips and thoughts</a></p>
<ul>
<li><p><a class="post-section-overview" href="#heading-learn-how-to-learn">Learn how to learn</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-try-to-find-a-path">Try to find a path</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-do-you-need-a-college-degree-to-work-in-technology">Do you need a college degree to work in technology?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-what-kind-of-developer-do-you-want-to-become">What kind of developer do you want to become?</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-pick-a-tech-stack">How to pick a tech stack</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-dont-jump-around-too-much">Don't jump around too much</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-dont-be-too-comfortable-or-get-ahead-of-yourself">Don't be too comfortable or get ahead of yourself</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-how-to-know-when-youre-job-ready">How to know when you're job ready</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-sometimes-not-coding-is-the-best-way-to-learn-about-code">Sometimes not coding is the best way to learn about code</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-diversify-your-learning-sources">Diversify your learning sources</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-keep-in-mind-that-nobody-knows-everything">Keep in mind that nobody knows everything</a></p>
</li>
<li><p><a class="post-section-overview" href="#heading-therere-good-and-bad-things-too">There're good and bad things too</a></p>
</li>
</ul>
</li>
<li><p><a class="post-section-overview" href="#heading-wrapping-up">Wrapping up</a></p>
</li>
</ul>
<h1 id="heading-my-background">My Background</h1>
<p>I'm a 29 year old guy from Buenos Aires, Argentina.</p>
<p>I grew up here, and once I finished high school I had no idea what to do with my life. I knew I had to go to college because that's what everybody else was doing. And according to "general knowledge", that was what was going to give me the best chances at life. So I started investigating around different career paths...</p>
<p>I was a shy and introverted adolescent in high school, so in this new chapter of my life I decided to change that and get more in contact with people and society in general.</p>
<p>I was attracted to social sciences studies such as philosophy, psychology and history. But It worried me that these professions weren't very in demand in the labor market. So I ended up choosing a major in human resources, as I thought it was a good match between social sciences and business.</p>
<p>I made this decision completely by myself, as I was part of the first generation of college students in my family. I didn't really know anyone who could guide me in this situation. I just made the best guess I could with the information I had.</p>
<p>Fast-forward a couple of years and I was starting to heavily regret my choice. I wasn't interested at all in what I was studying. The rigid structure and bureaucracy of college bored me to death and I had the feeling that I was wasting all my youth hearing people I didn't respect giving me meaningless lectures.</p>
<p>I started analyzing again what other career paths could I take, but nothing seemed to convince me enough. I even consulted with a group of vocational orientation professionals who charged me a ton of money for telling me that I was going to be a great HR manager in the future and that I should "just keep going".</p>
<p>This together with the fact that I had already put two years into this college thing convinced me to "just keep going".</p>
<p>Fast-forward another couple of years and I still felt the same way, but at least I was close to graduation and I was also working. So I was still bored to death but at least I was making money out of it.</p>
<p>I finally graduated and exited college with the feeling of having learned almost nothing, just happy that I was finally going to have more free time.</p>
<p>Regarding work, I started climbing the corporate ladder. Switching jobs every once in a while, making a tiny bit more money, and working for big and well known companies.</p>
<p>At this point I somehow got convinced that I liked this life, and even though I never enjoyed my job or being in the office environment, this was part of the deal.</p>
<p>In 2017 I was working for a very big industrial company and was offered the chance to move almost a thousand miles away from Buenos Aires, in exchange for a salary raise and the promise of future professional growth. I thought about it and accepted, as at the moment it seemed like too much of a great opportunity to pass by.</p>
<p>The work environment in this new position was terrible. I had to deal with crappy tasks, crappy leaders, and crappy people in general. I was learning nothing and the promises of future professional growth ended up being BS.</p>
<p>Things kept going the same direction for a few years, and when the pandemic arrived I was working harder than ever, often putting in nights and weekends, but somehow my leaders weren't happy with my effort.</p>
<p>I was feeling stuck and bitter. I left my family back in Buenos Aires in order to grow my career, and even though I was working as hard as I could, I wasn't collecting any profits and I was disliking my job more than ever.</p>
<p>At this point I finally opened my eyes and realized I couldn't be there anymore. I didn't know what to do next but I definitely knew I had to get out of there.</p>
<p>Then I saw an ad somewhere about a programming course and started investigating coding. I was always interested in technology, and at the moment it just felt right to occupy my mind with something new.</p>
<p>I didn't think about it as a way to get a new job, but as a hobby, a way to get my brain to think about something else.</p>
<h1 id="heading-how-i-learned-to-code">How I Learned to Code</h1>
<p>So after seeing this add and getting interested in coding, I did what most people do when looking for information: I Googled things, opened a ton of browser tabs, and watched a million YouTube videos.</p>
<p>I remember at the time I often couldn't understand a single thing about those videos. So many strange terms where used and people related each of those terms to other topics I had no idea about.</p>
<p>I didn't really know how computers worked, much less how the internet worked. I didn't know what a programming language was, why there were so many of them, what was the difference between front and back-end, what a function was, what a variable was, what on earth was SQL ... So many concepts and all of them completely new.</p>
<p>I just didn't know where to start. Learning to code felt <a target="_blank" href="https://www.youtube.com/watch?v=kGcKOXk9Qbs">like staring at the wall of Game of thrones</a>.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/08/image-1.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p><em>I was feeling like the recruiter here...</em></p>
<p>Here's where I got back to freeCodeCamp (I had done a bit of a basic HTML and CSS course a few years ago) and also downloaded an app called <a target="_blank" href="https://getmimo.com/">Mimo</a> (which helps you learn to code in a <a target="_blank" href="https://duolingo.com/">Duolingo</a> kind of way).</p>
<p>These structured courses helped me organize my learning and grasp the basics of things before moving onto more complex topics. I dedicated a few hours every day to these two resources, and after a few months I was able to build a very very simple HTML and CSS page.</p>
<p>After that I felt I needed to interact with other people who were in the same learning path I was. I wanted to share knowledge with others, hear from other people's experiences, and check if what I was doing and learning made sense compared to what everyone else was doing.</p>
<p>The way I got to this was by signing up for a few online bootcamp courses. I liked that classes were live with a professor and a bunch of other students. This meant that I had the chance to ask questions, hear other people's questions too, and compare myself to others.</p>
<p>Four months went by and at that point I was completely into coding. I'd become comfortable with HTML and CSS, and also learned basic programming concepts with JavaScript. I was dedicating absolutely all my free time to this and even though slowly, I felt like I was making progress each day.</p>
<p>By this time luckily I was able to switch jobs (still within the human resources field) and get back to Buenos Aires. I was working in a much nicer environment and I was happy with my job and the team I had. But I still kept coding and learning about it every day. I just liked it a lot and felt I could be good at it some day.</p>
<p>A few more months went by, I completed more bootcamp courses, and got comfortable with React as well. I was able to build some more interesting and "complex" projects on my own and with the passing of time I got more and more curious about how could it feel to do this for a living.</p>
<p>I could somehow picture myself as a developer, and after doubting a lot I decided to give it a try and started applying for jobs.</p>
<p>I got rejected A LOT and struggled BIG TIME with the few interviews I was able to get (you can read more about that in <a target="_blank" href="https://www.freecodecamp.org/news/problem-solving-and-technical-interview-prep/">the article I wrote about tech interview tips</a>).</p>
<p>Some of those interviews were like a reality check for me in the sense that they made me realize there was still an immense amount of things I knew nothing about and I'd need to keep improving if I was ever to have the chance of working as a dev.</p>
<p>These experiences kind of hurt my self esteem and made me doubt if I could do this. I gave up coding for a few weeks for the first time in almost a year, but eventually got back to it. I just liked it a lot and felt like I had to prove the people who rejected me wrong.</p>
<p>By this time I started to expand the resources I was using to learn. Live classes weren't that interesting for me anymore since I felt I didn't need constant feedback from others like I did when I was starting.</p>
<p>Now that I had a wide array of knowledge, terms, and concepts at least superficially present in my mind, I could easily take advantage of asynchronous resources like videos, articles, and documentation.</p>
<p>And more importantly, I knew what path I needed to go through in order to learn what I needed to learn to get to the jobs I wanted.</p>
<p>So I reduced the number of live classes I was taking, and started getting more into videos, articles, and documentation of good trusted sources I found.</p>
<p>Also, I started writing about each of the things I was learning, which made a huge difference for me as it helped me internalize knowledge, go into detail on each of the topics I learned, and gain confidence in a way I hadn't experienced before.</p>
<p>In parallel I was still going through different interview processes and feeling better and more confident in these situations. And in one of these processes I ended up getting hired. 🙃</p>
<p>After a year of learning, burning my brain, and dedicating absolutely all my free time to code, I finally reached my goal.</p>
<p>I remember I felt as happy as I'd ever felt when I got the news. It felt like ending a marathon. I'd never before put so much consistent effort into something, and the feeling of going from knowing nothing about technology to being able to call myself a "programmer" was amazing.</p>
<p>It was really a great moment, but to tell the truth, I was also scared to the bone... When I looked into the mirror I didn't see a programmer. I saw a guy who still didn't know much. And now I was going to switch careers and put my financial (and emotional) stability at risk. Crap... 😳</p>
<h1 id="heading-my-first-job-as-a-developer">My First Job as a Developer</h1>
<p>Luckily, all the fears I had going into my first developer job were unfounded. I landed on an amazing company, and got to work on an amazing team with an amazing leader.</p>
<p>There were TONS of new things to learn, and at moments I couldn't understand a single thing. But my team made it clear to me that this was what it was supposed to feel like and that I should be patient and stick to the process of learning.</p>
<p>I did, and I took it step by step. With the help of my leader and teammates I was able to become pretty much proficient in a matter of months.</p>
<p>My team had a great culture and our leader encouraged us to share knowledge all the time. If someone found a bug, created a new feature, or wrote some documentation, that had to be shared with the rest of the group.</p>
<p>The same went for when someone made a mistake. Mistakes were not treated as opportunities to blame someone, but as chances for everyone to learn.</p>
<p>We had weekly meetings in which we shared this kind of information with each other. Through this continuous exchange I made a huge "click" in my mind. I understood <strong>no one knows everything</strong>.</p>
<p>Before I got this job, one of my biggest fears was that I wasn't prepared enough. There were many things I knew nothing about and I felt I "was supposed" to know them. But after getting to know developers with 5, 8, or more years of experience, I understood even with that amount of study and preparation, they still don't know everything. And that's ok, because no one can.</p>
<p>The size of the technological world humans have created and the constant evolution of it just makes it impossible for a single person to understand and know every single detail.</p>
<p>What I think is truly important is to deeply understand the given set of tools you work with in your environment, and to have a superficial understanding of the general system you work within.</p>
<p>But even then, you'll still never understand everything. <strong>Learning new things all the time and figuring things out is a core part of the job</strong>. In fact, what most companies pay engineers for is to figure things out. You just face problems you don't know how to solve at first, and slowly figure them out until you arrive to a solution.</p>
<p>This single idea was very powerful to me, and allowed me to get over the impostor syndrome I felt.</p>
<p>Overall I was feeling awesome at my new job. I was working remotely all the time (which I love and allows me to spend more time with my family and pets). I was working with people I felt related to in the sense that everyone was interested in sharing knowledge and constantly learning. And I felt my job was stimulating and interesting.</p>
<p>I was using my brain everyday, having to think in order to solve stuff, and that made me feel alive and useful instead of the zombie-like feelings I had in past jobs.</p>
<p>The feeling I had (and still have) is that my job and my hobby are the same thing. I'm not longer living for the weekend (<a target="_blank" href="https://www.youtube.com/watch?v=fGardUiWjR4">great song</a> by the way). I enjoy my job and I still dedicate most of my free time to learning and doing code-related things because I like it.</p>
<h1 id="heading-present-tense-and-future">Present Tense and Future</h1>
<p>After 9 months at my first job as a developer, I got the chance to switch jobs again. It was hard to leave such a great team and leader, but in my current position I'm able to work with cool technologies on a big and interesting project. Also, changing companies and projects has allowed me to understand a little bit better the process of software development and how different companies manage it.</p>
<p>It's also very interesting to get to know other fellow developers and learn from them. I feel there're things to learn from every single person working in this industry, so getting to know and work with new people every once in a while is something I'd like to keep practicing.</p>
<p>Besides focusing on my job, I also got back into college to study computer engineering. I made this decision because I felt most of the courses and classes I took focused heavily on learning to use tools (such as React or Node for example), but I lacked the basic knowledge those things were built upon.</p>
<p>I wanted to have deep knowledge about computer science topics too, and even though there're many ways in which you can get this knowledge, college made sense for me.</p>
<p>I find it funny that I'm having a completely different experience now compared to my first time at university. I'm attending classes with curiosity and learning at least a few useful things every time. Being truly interested in what you're learning and understanding the purpose of the information really makes a huge difference.</p>
<p>And besides those two things, I'm also working as a part-time assistant teacher in a coding bootcamp and trying to periodically write articles.</p>
<p>Sharing knowledge with others is something I really like and appreciate about the coding world, and without a doubt is one of the things that has allowed me to learn the most. <a target="_blank" href="https://www.youtube.com/watch?v=tkm0TNFzIeg">Lots of people have benefited from this practice</a> and I'm not an exception.</p>
<p>Regarding the future, I want to train myself as a well rounded software engineer. And by this I mean I'm aiming to gain knowledge about the whole ecosystem of things that lays around the creation of web-based software: front-end and back-end development, testing, infrastructure, cloud technologies, CI/CD, systems design and so on.</p>
<p>I feel that having at least a superficial knowledge of the core concepts in each of these fields is important and valuable, even though if end up specializing in a certain field later on. So this is what I'm directing my attention towards at the moment... and the rest is just to keep going.</p>
<p>Reflecting on the steps I took in the last few years, from the position I'm in now, I kind of appreciate how the experiences I had led me to where I am now.</p>
<p>Working in the social sciences environment for several years allowed me to gain the social skills I lacked when I was an adolescent. Also, working in toxic environments forged my character and gave me the ability to appreciate good teams and leaders.</p>
<p>It's likely that if I had never gone through those unpleasant experiences I would've never gotten into coding.</p>
<p>Life is really weird... I don't like to pretend I know how it works. I don't think anyone does. But in these past years I learned for myself that I can do whatever I set my mind to if I put enough time and effort into it.</p>
<p>I also learned that I should never settle for a situation I'm not comfortable in. What I like to do for a living is learning, thinking, and using my brain to solve problems.</p>
<h1 id="heading-tips-and-thoughts">Tips and Thoughts</h1>
<p>So now that we're done with the <em>telenovela</em>, I'm going to present you with the main concepts and thoughts that have helped me get to where I am now.</p>
<p>Again, keep in mind this is not direct advice. Some of these things might not apply to you, but the idea is to share them so you can analyze and make decisions for yourself.</p>
<h2 id="heading-learn-how-to-learn">Learn How to Learn</h2>
<p>If you'd like to become a developer, become comfortable learning things constantly. As I mentioned, I think this is a core part of the job for most of us.</p>
<p>Get used to the struggle of not understanding things at first, asking questions, doing research, making little or no progress at all, giving it another try, googling, watching videos, reading articles... and slowly but surely getting to what you want.</p>
<p>If you struggle and at times feel you're just not capable of understanding anything, that's ok! We all feel that way. The important thing is to be consistent, don't give up, be curious and keep going. You'll eventually wrap your head around things – just don't expect it to be easy or quick.</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/08/image-39.png" alt="Image" width="600" height="400" loading="lazy"></p>
<p>I think the best way to learn how to learn is just to keep trying. It's like a muscle: if you push it it will get stronger.</p>
<p>The cool thing is that things get easier as you advance. The more concepts and ideas you understand, the more connection points you'll have for the next topic you get into, which will accelerate your learning curve and help you move faster.</p>
<h2 id="heading-try-to-find-a-path">Try to Find a Path</h2>
<p>The best thing about learning how to code is that there's so much information out there. The worst thing about it is also that there's so much information out there.</p>
<p>At the beginning everything sounds foreign and hard, so I think getting some kind of structure is of great help.</p>
<p>There're many sources for you to choose from. Free and with a cost, live or asynchronous, to learn alone or in a group... It's up to you and what you find works for you.</p>
<p>I'd say it's a good idea to start with something free to test if you like it. Then try different sources and work with the one or two you're more comfortable with.</p>
<p>Also, during the first steps, I feel like having the companionship of a tutor or a community is key to continue your learning path.</p>
<p>So much info can be overwhelming and it can be hard to know what to do next. A community and people to ask questions from can help diminish this level of uncertainty at the beginning.</p>
<p>Live classes solved this problem for me, but there are tons of ways to get in touch with people who are learning to code, so find one that suits yourself.</p>
<p>Also, after a while and once you have a clear understanding of your environment and what do you want to do, live classes can start to get less efficient and asynchronous learning becomes the best thing to do.</p>
<p>So getting to know useful and trustworthy sources of knowledge is key. And I don't have a recipe for this – for me it was just a matter of countless hours of exploring blogs, YouTube channels, and websites. And of course still all the time I'm finding great resources...</p>
<p>And about that, <a target="_blank" href="https://alexandria-rust.vercel.app/">here I've put together some of the coolest resources I've found</a> recently. Maybe it could be a good starting point for somebody. I'd also like to receive recommendations if you have any. 😉</p>
<h2 id="heading-do-you-need-a-college-degree-to-work-in-technology">Do You Need a College Degree to Work in Technology?</h2>
<p>Absolutely not. I was able to get a good developer job without a related college degree.</p>
<p>Also, if you're just looking to switch jobs and get into tech, I'd recommend going to a bootcamp or completing some free online courses. It will probably be much quicker and cheaper for you than learning through college.</p>
<p>What I do think is that if you can afford going to college (both money and time wise), a degree won't hurt at all. And through college you can learn a series of general foundational concepts not often available in a bootcamp or programming courses (though this information is also available in other media and for free as well).</p>
<p>In my country, college education is relatively cheap and there are quality free options as well. So college was a reasonable choice for me. But this may vary from country to country and from person to person.</p>
<h2 id="heading-what-kind-of-developer-do-you-want-to-become">What Kind of Developer Do You Want to Become?</h2>
<p>Once you start to comprehend the technology world, you'll see that the software engineer profession has many different paths and nuances. To name a few:</p>
<ul>
<li><p><strong>Front end developers:</strong> Build the visual side of websites</p>
</li>
<li><p><strong>Mobile developers:</strong> Build mobile apps</p>
</li>
<li><p><strong>Back end developers:</strong> Work with all the software that is not directly exposed to the end user, like databases, authentication, and so on.</p>
</li>
<li><p><strong>Testing / QA:</strong> These people write programs to test that the software developed works as expected.</p>
</li>
</ul>
<p>And many other paths like <strong>infrastructure, data analytics, robotics,</strong> and so on.</p>
<p>At first you won't be able to tell the difference between the one and the other, and that's ok. A good idea is to do a little research to understand all the possibilities that exist within the software engineering world, and see what you like most.</p>
<p>Also keep in mind there're different environments you can work in. From huge worldwide corporations to tiny startups, to freelance work, to starting your own company... Anything is possible.</p>
<p>Different fields and different environments make different experiences, and some might be better suited for what you like and what you're interested in. And also they'll require you to learn different things to get to work in those places.</p>
<h2 id="heading-how-to-pick-a-tech-stack">How to Pick a Tech Stack</h2>
<p>This is closely related to the kind of job and the environment you'd like to get. Though all knowledge is useful, some technologies are more related to one field and one type of environment in particular. So choosing carefully what to learn will help you use your time more efficiently and get to your goal quicker.</p>
<p>If I had to give a general path that applies to most people, I'd say get to know basic HTML, CSS and core programming concepts with JavaScript (variables, functions, loops, conditionals, data structures, and so on).</p>
<p>There're are lots of online resources where you can get this knowledge, and having these concepts under your belt will help you to some degree no matter what path you choose later.</p>
<p>I also feel that it's the easiest way to get into software since you start from a visual perspective that will allow you to build at least a very simple website in a few weeks.</p>
<p>Once you're there, I'd recommend that you analyze the different possible career paths and decide what you like the most or find the most interesting.</p>
<p>Watch videos, read articles, talk to people... Get a feeling of what each kind of job is about and what technologies are used in each of them. Then based on that, keep learning.</p>
<p>I find it's also important to choose based on what's available for you. For me, the bootcamp I was learning in had React and Node courses available, so that kind of laid the path for me. Maybe if they had Angular and Python courses I would've learned those technologies instead.</p>
<p>I don't really think it makes that much of a difference as long as the technologies serve your purposes. In the long run, technologies are only tools. And you can use many different tools to arrive to the same results.</p>
<p>Also keep in mind no choice is definitive. I mean, if you get into something and find that you don't like it, you can always get back and learn something else. It's useful to have some kind of plan and learning path, but it's not something rigid that can't be changed ever again.</p>
<p>Just to give you a superficial idea, the path I followed (and I'm still following) looks like this:</p>
<ul>
<li><p>HTML</p>
</li>
<li><p>CSS</p>
</li>
<li><p>Git and GitHub</p>
</li>
<li><p>Basic terminal usage</p>
</li>
<li><p>JavaScript</p>
</li>
<li><p>React</p>
</li>
<li><p>Node, Express, MongoDB and PostgreSQL</p>
</li>
<li><p>Algorithms and data structures</p>
</li>
<li><p>Testing: Jest, react testing library and Cypress</p>
</li>
<li><p>TypeScript</p>
</li>
<li><p>Intermediate terminal usage and scripting (Bash)</p>
</li>
<li><p>React Native</p>
</li>
<li><p>Firebase / AWS</p>
</li>
<li><p>GraphQL</p>
</li>
<li><p>Python</p>
</li>
<li><p>Docker</p>
</li>
</ul>
<h2 id="heading-dont-jump-around-too-much">Don't Jump Around Too Much</h2>
<p>The idea of having a learning path is to provide structure and meaning to knowledge you'll acquire, so you can get to your goals quicker.</p>
<p>As I mentioned before, there's a huge amount of information out there and that's awesome if you know what you're looking for. But if you're not certain about what you need to learn, you might get lost between all the different possibilities and end up knowing just a tiny bit of a lot of things – and that's not really useful.</p>
<p>At least at the beginning, I'd recommend that you dedicate at least a few weeks to each new tool or concept you're learning. Make sure the knowledge sinks in and build a project or two with the tool you're learning, and then hop on to the next thing.</p>
<p>If possible, with each new thing you learn, try to add it to the same project or build a new one with all the tools you know up to that point.</p>
<p>For example, if you learned React before and now you're learning about back-end with Node, a good idea would be to build a front-end for that back-end too. Practice and repetition will make you better.</p>
<p>I also wouldn't recommend learning more than one thing at the same time. For example, let's say you're building your first React project and you're using TypeScript for the first time as well. That could be problematic, because when you get an error you might not be able to distinguish if it's a React or a TypeScript thing. You could also confuse concepts that belong to one technology with the other.</p>
<h2 id="heading-dont-be-too-comfortable-or-get-ahead-of-yourself">Don't Be Too Comfortable or Get Ahead of Yourself</h2>
<p>Following the previous thought, I think it's important to push yourself and try to learn new things all the time. But it's also important to know where you are and control your rhythm. By this I mean, know when you need to move to the next thing and know when you need to stick to what you're learning at the moment.</p>
<p>This is a hard thing to know, and there's no way to be absolutely sure. I'd say you don't need to become an absolute expert, but at least build two decent projects with each technology you learn.</p>
<p>Make sure you understand the basic concepts behind it, understand the most common errors and problems you can face using it, compare your code to other people's code, and so on. If you feel you understand and can relate to most concepts regarding to that particular technology, then you're probably ready to learn something else.</p>
<p>Regarding what to learn next, that depends on your learning path and the things you've learned previously. I'd say a good sign is when you're able to connect some of the previous knowledge you have to the new things you're learning.</p>
<p>For example, if you learned HTML and now you're getting into CSS, you'll be able to understand how CSS helps you configure how HTML elements look and behave. If you learned JavaScript before, you'll be able to understand how TypeScript helps you control types and so on.</p>
<p>On the other hand, if you're <a target="_blank" href="https://www.freecodecamp.org/news/top-javascript-concepts-to-know-before-learning-react/">trying to learn React without having a clue about JavaScript</a>, you're very likely to mix concepts and confuse what technology is responsible for each thing (for example, I've seen many people think <code>map</code>, <code>filter</code> and <code>reduce</code> functions are a React thing, while they're all ES6 JavaScript features).</p>
<p>Consuming the right amount of information is important. Too little and you won't make progress, too much and you'll get confused and not make progress either.</p>
<h2 id="heading-how-to-know-when-youre-job-ready">How to Know When You're Job Ready</h2>
<p>Short answer is you'll never know. You'll need to try yourself and (probably) fail to see what you still need to get better at.</p>
<p>There's not an exact recipe to get a job. Companies require different skills and have different levels of demand for their candidates.</p>
<p>I'd say a good place to start would be to go through job postings and see what kind of knowledge is required for the types of jobs you like. Once you're more or less comfortable with most of the things they require, I'd say start applying.</p>
<p>Waiting too long to apply for jobs can also hurt you. Even though doing badly at an interview sucks (I know, trust me...), it will really help you realize what knowledge you lack, and in that way accelerate your learning process.</p>
<p>You can <a target="_blank" href="https://www.freecodecamp.org/news/problem-solving-and-technical-interview-prep/">read through this interviewing guide I wrote</a> to help you prepare as much as you're able.</p>
<h2 id="heading-sometimes-not-coding-is-the-best-way-to-learn-about-code">Sometimes Not Coding is the Best Way to Learn About Code</h2>
<p>I feel that when you start out, building things is the best way to learn about programming. It gives you practical knowledge and the feeling of progress (which is key to get over the frustration any learning process involves).</p>
<p>But once you get comfortable with the practical side of things, I think it's also important to get a theoretical foundation. Learning how tools work, how the internet works, how computers work, the history of computer science, algorithms and data structures, and so on. I don't mean becoming an expert, but at least superficial knowledge of these topics is useful.</p>
<p>Regarding how to get this, you can go with videos, articles, books, courses... Again, there're countless resources to pick from.</p>
<p>But something I found really useful is to actually create content. Writing stuff, sharing knowledge, helping others – it all makes you think about code and programming from a different angle and have a deeper understanding of topics.</p>
<p>This is one of the main reasons why I like writing articles. And what I find the most interesting about it is that when I get back to actually coding, I feel that I'm a better programmer than I was before. I guess sometimes not coding is the best way to get good at it.</p>
<h2 id="heading-diversify-your-learning-sources">Diversify Your Learning Sources</h2>
<p>I think a good way to wrap your head around complex topics is hearing different "voices" explain the same thing. Different people will use different analogies, vocabulary and approaches to explain. And eventually you'll find one that works for you.</p>
<p>Same goes to different formats like videos, articles, courses, and so on. Each time you're learning a new thing, try to combine different learning sources together so you can get a good general idea of it.</p>
<h2 id="heading-keep-in-mind-that-nobody-knows-everything">Keep in Mind that Nobody Knows Everything</h2>
<p>Looking from the outside, it may seem that people working in the industry know so much more than you. But they don't know everything.</p>
<p>Senior developers normally have deep knowledge in some particular stack, but they don't know everything about everything, so much less should you if you're just starting out your learning path.</p>
<p>For me, being curious, eager to learn, and consistent in your learning efforts is the most important.</p>
<h2 id="heading-therere-good-and-bad-things-too">There're Good and Bad Things Too</h2>
<p>For me, technology is the best possible environment to work in right now. Jobs are interesting and well paid, and the job market demand for developers is high (and it will probably keep growing in the future).</p>
<p>It's also one of the few sectors in which you can have a good job without a college degree.</p>
<p>I love it, and getting into technology has made a very positive change in my life. But I also think It's important to reflect about some of the negative things around it. For example:</p>
<h4 id="heading-working-remotely-has-challenges">Working remotely has challenges</h4>
<p>Working remotely is great in many senses. For me, it has given me much more control over my time. It has allowed me to save tons of commuting hours and invest those hours into studying, spending more time with my pets and family, or just sleeping more. On the other hand, I recognize it has also separated me a lot from people and society in general which sometimes leads me to feelings of isolation, monotony, and social anxiety.</p>
<h4 id="heading-working-in-tech-can-be-stressful">Working in tech can be stressful</h4>
<p>Working in a project-based environment (which is the most common thing in technology) is awesome. You get to do different things every once in a while, facing different challenges, learning new things and getting the feeling of progress and accomplishment. But on the other hand, the pressure of dealing with deadlines and needing to solve technical problems so things can get done can be hard to deal with, especially at the beginning and on occasions where you don't have help from others.</p>
<h4 id="heading-while-most-people-are-nicesome-really-arent">While most people are nice...some really aren't</h4>
<p>Though most people I've met in tech are nice, curious, and really eager to learn and share knowledge, there're also some egotistic, arrogant, and selfish people too. There're good and bad people in all paths of life.</p>
<h4 id="heading-technology-has-a-huge-impact-on-our-lives">Technology has a huge impact on our lives</h4>
<p>To a bigger or lesser degree, by working in technology we're designing and making decisions that shape an important part of the world's reality and people's lives.</p>
<p>Think about it – technology is everyday becoming more and more intrinsically connected to everything we do as humans. From deciding what or where to eat, to traveling, to meeting new people and building relationships, to buying things, studying, managing money, looking for jobs or something so basic and central like getting to know the world around us. Googling has become the most primary action for most of us when we want to get information about anything.</p>
<p>Technology is absolutely everywhere around us. And as developers, this is great for us because it gives us a huge platform to impact people's lives in a positive way.</p>
<p>But that platform can also impact people's lives in a negative way too. As humans we've become so dependable on technology that decisions made by tech companies and engineers can have the same or more impact on society than those made by politicians.</p>
<p>We're all more addicted to our cellphones than we'd like to admit. Social networks have been used by companies to have a very detailed understanding of our expectations, preferences, fears and emotions. And from that knowledge, get us to buy things we don't need to impress people we don't like (<a target="_blank" href="https://www.youtube.com/watch?v=49FB9hhoO6c">yeah</a>), or even worse, <a target="_blank" href="https://www.youtube.com/watch?v=HVHKYXJq7qo&amp;t=15s">manipulate people's political opinions</a>.</p>
<p>Technology is a very powerful tool, and that tool can be used both for good and for bad. The purpose and impact of it is up to us to decide, both as users and as developers.</p>
<h1 id="heading-wrapping-up">Wrapping up</h1>
<p>Well, I've talked about a lot of things here. I hope some of these concepts helped you picture how it may be to work in the technology industry yourself. Or at least cause you just to think and reflect about a thing or two.</p>
<p>If you read through all of this, I'd love to hear about your feedback or your own story in tech. You can hit me up on <a target="_blank" href="https://www.linkedin.com/in/germancocca/">LinkedIn</a> or <a target="_blank" href="https://twitter.com/CoccaGerman">Twitter</a> if you'd like. 😉</p>
<p>Here's a little <a target="_blank" href="https://www.youtube.com/watch?v=kr2473XpG98">goodbye song for you</a> (I'm making this a thing now 🤷‍♂️). See you in the next one.✌️</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/08/jaja-hahaha.gif" alt="Image" width="600" height="400" loading="lazy"></p>
 ]]>
                </content:encoded>
            </item>
        
    </channel>
</rss>
