<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: Dayo Jaiye </title>
    <description>The latest articles on Forem by Dayo Jaiye  (@devjaiye).</description>
    <link>https://forem.com/devjaiye</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F518199%2Fa7cd22aa-5539-4211-81f1-27a168eee8ab.jpg</url>
      <title>Forem: Dayo Jaiye </title>
      <link>https://forem.com/devjaiye</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/devjaiye"/>
    <language>en</language>
    <item>
      <title>There is nothing wrong in trying again..</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Fri, 06 Feb 2026 09:09:25 +0000</pubDate>
      <link>https://forem.com/devjaiye/there-is-nothing-wrong-in-trying-again-ejn</link>
      <guid>https://forem.com/devjaiye/there-is-nothing-wrong-in-trying-again-ejn</guid>
      <description></description>
      <category>beginners</category>
      <category>discuss</category>
      <category>learning</category>
      <category>watercooler</category>
    </item>
    <item>
      <title>Understanding Concurrency Through Everyday Life Examples</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Wed, 04 Feb 2026 14:39:49 +0000</pubDate>
      <link>https://forem.com/devjaiye/understanding-concurrency-through-everyday-life-examples-2hc9</link>
      <guid>https://forem.com/devjaiye/understanding-concurrency-through-everyday-life-examples-2hc9</guid>
      <description>&lt;p&gt;Concurrency is one of those concepts almost every developer uses — but many struggle to explain clearly.&lt;/p&gt;

&lt;p&gt;Most explanations jump straight into CPU cores, threads, and abstract diagrams. That’s usually where confusion starts.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The irony?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You already understand concurrency from real life.&lt;/p&gt;

&lt;p&gt;You’ve been doing it long before you wrote your first line of code.&lt;/p&gt;

&lt;p&gt;Let’s connect the dots.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why Concurrency Feels Hard to Understand
&lt;/h2&gt;

&lt;p&gt;When developers hear concurrency, they often think:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;“Multiple things running at the same time”&lt;/li&gt;
&lt;li&gt;“Multithreading”&lt;/li&gt;
&lt;li&gt;“Something low-level and complex”&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That mental model is misleading.&lt;/p&gt;

&lt;p&gt;Concurrency is not primarily about speed or hardware.&lt;br&gt;
It’s about how tasks are organized when some of them spend time waiting.&lt;/p&gt;

&lt;p&gt;Once you see that, everything becomes clearer.&lt;/p&gt;
&lt;h2&gt;
  
  
  A Practical Definition
&lt;/h2&gt;

&lt;p&gt;Concurrency means managing multiple tasks by making progress on each without blocking the entire system.&lt;/p&gt;

&lt;p&gt;The important phrase here is &lt;strong&gt;making progress&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Tasks don’t need to finish at the same time.&lt;br&gt;
They just shouldn’t stop everything else from moving forward.&lt;/p&gt;
&lt;h2&gt;
  
  
  Everyday Example: Cooking a Simple Meal
&lt;/h2&gt;

&lt;p&gt;Imagine you’re preparing a meal at home:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Rice takes about 20 minutes to cook&lt;/li&gt;
&lt;li&gt;Washing dishes takes 5 minutes&lt;/li&gt;
&lt;li&gt;Cutting vegetables takes 5 minutes&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;❌ No concurrency (inefficient approach)&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Put rice on the stove&lt;/li&gt;
&lt;li&gt;Stand and wait for 20 minutes&lt;/li&gt;
&lt;li&gt;Wash dishes&lt;/li&gt;
&lt;li&gt;Cut vegetables&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;This works — but it wastes time.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ Concurrency (what humans naturally do)&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Put rice on the stove&lt;/li&gt;
&lt;li&gt;While it cooks, wash dishes&lt;/li&gt;
&lt;li&gt;Cut vegetables&lt;/li&gt;
&lt;li&gt;Occasionally check the rice&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;You didn’t cook faster.&lt;br&gt;
You &lt;strong&gt;used waiting time efficiently&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;That’s concurrency.&lt;/p&gt;
&lt;h2&gt;
  
  
  The Key Insight Most Tutorials Miss
&lt;/h2&gt;

&lt;p&gt;Concurrency exists &lt;strong&gt;because waiting exists&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;In software, tasks often wait for:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Network requests&lt;/li&gt;
&lt;li&gt;Database queries&lt;/li&gt;
&lt;li&gt;File reads&lt;/li&gt;
&lt;li&gt;Timers&lt;/li&gt;
&lt;li&gt;User input&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If your program blocks while waiting, everything else pauses.&lt;/p&gt;

&lt;p&gt;Concurrency allows your program to say:&lt;/p&gt;

&lt;p&gt;“While I’m waiting on this, let me do something else.”&lt;/p&gt;
&lt;h2&gt;
  
  
  Translating the Example to Code
&lt;/h2&gt;

&lt;p&gt;Here’s a simple JavaScript example:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F43149wxr452ixi8z4j45.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F43149wxr452ixi8z4j45.png" alt=" " width="800" height="378"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What’s really happening here?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The timer starts (rice is cooking)&lt;/li&gt;
&lt;li&gt;The program does not stop and wait&lt;/li&gt;
&lt;li&gt;Other tasks continue running&lt;/li&gt;
&lt;li&gt;When the timer finishes, the callback executes&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The program stays responsive the entire time.&lt;/p&gt;

&lt;p&gt;That’s concurrency in action.&lt;/p&gt;
&lt;h2&gt;
  
  
  Concurrency vs Parallelism (They Are Not the Same)
&lt;/h2&gt;

&lt;p&gt;These two are often confused.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Concurrency&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;One worker&lt;/li&gt;
&lt;li&gt;Multiple tasks&lt;/li&gt;
&lt;li&gt;Switching between tasks while waiting&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Parallelism&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Multiple workers&lt;/li&gt;
&lt;li&gt;Tasks truly running at the same time&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Real-life analogy:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Concurrency → One cook handling multiple meals&lt;/li&gt;
&lt;li&gt;Parallelism → Multiple cooks, each handling a meal&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You can have concurrency without parallelism — and vice versa.&lt;/p&gt;
&lt;h2&gt;
  
  
  Why Concurrency Matters in Real Systems
&lt;/h2&gt;

&lt;p&gt;Without concurrency:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;One slow request blocks others&lt;/li&gt;
&lt;li&gt;APIs feel sluggish&lt;/li&gt;
&lt;li&gt;Applications freeze&lt;/li&gt;
&lt;li&gt;Scalability suffers&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;With proper concurrency:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Servers handle many users efficiently&lt;/li&gt;
&lt;li&gt;Applications remain responsive&lt;/li&gt;
&lt;li&gt;Resources are used effectively&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Most real-world performance issues are &lt;strong&gt;concurrency problems&lt;/strong&gt;, not hardware problems.&lt;/p&gt;
&lt;h2&gt;
  
  
  Common Mistakes Developers Make
&lt;/h2&gt;

&lt;p&gt;1️⃣ &lt;strong&gt;"Concurrency means everything runs at once"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;It doesn’t. Tasks take turns when needed.&lt;/p&gt;

&lt;p&gt;2️⃣ &lt;strong&gt;Blocking while waiting&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Synchronous I/O and long blocking operations kill responsiveness.&lt;/p&gt;

&lt;p&gt;3️⃣ &lt;strong&gt;Ignoring shared state&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Concurrency introduces race conditions and subtle bugs if not managed properly.&lt;/p&gt;

&lt;p&gt;4️⃣ &lt;strong&gt;Assuming async automatically means faster&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Async improves &lt;strong&gt;responsiveness&lt;/strong&gt;, not raw execution speed.&lt;/p&gt;
&lt;h2&gt;
  
  
  How Experienced Developers Think About Concurrency
&lt;/h2&gt;

&lt;p&gt;Experienced developers don’t ask:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;How do I make this async?
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;They ask:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;What is waiting here — and how do I avoid blocking everything else?
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That mindset shift changes how you design systems.&lt;/p&gt;

&lt;h2&gt;
  
  
  Final Takeaway
&lt;/h2&gt;

&lt;p&gt;Concurrency isn’t magic.&lt;br&gt;
It isn’t scary.&lt;br&gt;
It isn’t advanced.&lt;/p&gt;

&lt;p&gt;It’s simply:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Doing useful work while waiting.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Once you understand it in everyday life, the code starts to make sense naturally.&lt;/p&gt;

&lt;h2&gt;
  
  
  💬 Let’s Discuss
&lt;/h2&gt;

&lt;p&gt;How would you explain concurrency to a beginner?&lt;br&gt;
Drop your analogy in the comments 👇&lt;/p&gt;

</description>
      <category>programming</category>
      <category>computerscience</category>
      <category>software</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Asynchronous Programming Simplified</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Fri, 24 Feb 2023 11:58:06 +0000</pubDate>
      <link>https://forem.com/devjaiye/asynchronous-programming-simplified-2ge0</link>
      <guid>https://forem.com/devjaiye/asynchronous-programming-simplified-2ge0</guid>
      <description>&lt;p&gt;Asynchronous programming is a programming paradigm that allows for non-blocking execution of code by running tasks in the background and notifying the program when they are complete. &lt;/p&gt;

&lt;p&gt;This is useful for tasks that can take a long time to complete, such as accessing data from a database or fetching data from an external API.&lt;/p&gt;

&lt;p&gt;A practical example of asynchronous programming is cooking a meal. When you are cooking a meal, you can start one task (such as chopping vegetables) and then move on to another task (such as boiling water) while the first task is still running. You don't have to wait for the first task to finish before starting the second task. &lt;/p&gt;

&lt;p&gt;Similarly, in asynchronous programming, you can start a task and move on to another task without waiting for the first task to complete.&lt;/p&gt;

&lt;p&gt;Here is an example of asynchronous programming in JavaScript using a function that fetches data from an external API:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwxenxv51scxlv8gfn4i5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwxenxv51scxlv8gfn4i5.png" alt=" " width="800" height="777"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this example, the &lt;code&gt;fetchData&lt;/code&gt; function takes a URL as an argument and returns a Promise. The Promise represents the eventual completion (or failure) of the task of fetching data from the URL.&lt;/p&gt;

&lt;p&gt;The function uses the &lt;code&gt;XMLHttpRequest&lt;/code&gt; object to make a network request to the URL and listens for the &lt;code&gt;load&lt;/code&gt;and &lt;code&gt;error&lt;/code&gt;events. If the request is successful, the Promise is resolved with the response data. If the request fails, the Promise is rejected with an error.&lt;/p&gt;

&lt;p&gt;In the main program, we call the &lt;code&gt;fetchData&lt;/code&gt; function with a URL and &lt;code&gt;then&lt;/code&gt;attach a then callback to handle the successful completion of the Promise (which in this case simply logs the response data to the console) and a &lt;code&gt;catch&lt;/code&gt;callback to handle any errors that may occur during the task. &lt;/p&gt;

&lt;p&gt;This allows the program to continue running other tasks while the network request is running in the background, and then handle the result of the request when it is completed.&lt;/p&gt;

&lt;p&gt;If you find this helpful, leave a like and share with someone. See you in the next post. &lt;/p&gt;

&lt;p&gt;Gracias...&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>programming</category>
      <category>tutorial</category>
      <category>api</category>
    </item>
    <item>
      <title>What is Recursion?</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Wed, 22 Feb 2023 13:18:24 +0000</pubDate>
      <link>https://forem.com/devjaiye/what-is-recursion-2p15</link>
      <guid>https://forem.com/devjaiye/what-is-recursion-2p15</guid>
      <description>&lt;p&gt;In this article I will explain the term recursion to give you a clear understanding. Let's get into it! 🙂&lt;/p&gt;

&lt;p&gt;Recursion is a programming technique in which a function calls itself to solve a problem by breaking it down into smaller sub-problems. It is a powerful tool in solving problems that can be broken down into smaller, similar problems.&lt;/p&gt;

&lt;p&gt;A good everyday example to understand recursion in programming is the process of folding a piece of paper in half multiple times.&lt;/p&gt;

&lt;p&gt;Let's say you start with a sheet of paper and fold it in half. You now have two smaller sheets of paper, each with half the size of the original sheet.&lt;/p&gt;

&lt;p&gt;You can repeat this process by folding each of the smaller sheets in half, which will result in four even smaller sheets of paper. If you continue folding each smaller sheet in half, you will eventually end up with many tiny sheets of paper, each with a very small size.&lt;/p&gt;

&lt;p&gt;In programming, this process can be represented using recursion. Here is an example of a JavaScript function that uses recursion to simulate the process of folding a piece of paper in half multiple times:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function foldPaper(numFolds, paperSize) {
  if (numFolds === 0) {
    return paperSize;
  } else {
    const halfSize = paperSize / 2;
    return foldPaper(numFolds - 1, halfSize);
  }
}

console.log(foldPaper(5, 8.5)); // Output: 0.1328125
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this example, the &lt;code&gt;foldPaper&lt;/code&gt; function takes two arguments: &lt;code&gt;numFolds&lt;/code&gt; and &lt;code&gt;paperSize&lt;/code&gt;. &lt;code&gt;numFolds&lt;/code&gt; represents the number of times the paper should be folded, and &lt;code&gt;paperSize&lt;/code&gt; represents the initial size of the paper.&lt;/p&gt;

&lt;p&gt;The function uses a base case (&lt;code&gt;numFolds === 0&lt;/code&gt;) to terminate the recursion. If &lt;code&gt;numFolds&lt;/code&gt; is 0, the function simply returns the paperSize.&lt;/p&gt;

&lt;p&gt;If &lt;code&gt;numFolds&lt;/code&gt; is not 0, the function calculates the size of the paper after folding it in half (&lt;code&gt;halfSize&lt;/code&gt;) and calls itself with &lt;code&gt;numFolds - 1&lt;/code&gt; and &lt;code&gt;halfSize&lt;/code&gt; as arguments. This process continues until &lt;code&gt;numFolds&lt;/code&gt; reaches 0, at which point the function returns the final size of the paper.&lt;/p&gt;

&lt;p&gt;So, when we call &lt;code&gt;foldPaper(5, 8.5)&lt;/code&gt;, the function calls itself with &lt;code&gt;numFolds&lt;/code&gt; equal to 4, then 3, then 2, then 1, and finally 0. At each step, the &lt;code&gt;paperSize&lt;/code&gt; is halved, resulting in a smaller and smaller size. The final result is &lt;code&gt;0.1328125&lt;/code&gt;, which represents the size of the paper after folding it 5 times.&lt;/p&gt;

&lt;p&gt;If you find this helpful, show me❤️&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>programming</category>
      <category>beginners</category>
      <category>100daysofcode</category>
    </item>
    <item>
      <title>My Top Most Used Development Tool - Tabnine</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Sat, 10 Dec 2022 12:07:05 +0000</pubDate>
      <link>https://forem.com/devjaiye/my-top-most-used-development-tool-tabnine-1jlc</link>
      <guid>https://forem.com/devjaiye/my-top-most-used-development-tool-tabnine-1jlc</guid>
      <description>&lt;p&gt;&lt;strong&gt;Artificial Intelligence&lt;/strong&gt; has been predicted by experts to be the future of technology for more than a decade. In the 2010s, automation got better, cheaper, and less avoidable. &lt;/p&gt;

&lt;p&gt;Today, automated software helps you manage work easily, fast, and accurately. &lt;/p&gt;

&lt;p&gt;Building an app from scratch is quite tedious for software developers. The goal of &lt;strong&gt;&lt;a href="https://app.tabnine.com/" rel="noopener noreferrer"&gt;Tabnine&lt;/a&gt;&lt;/strong&gt; is to boost your productivity when you use their tool. &lt;/p&gt;

&lt;p&gt;The plugin is easy to install in your IDE (Integrated Development Environment), for free!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Install Tabnine on Visual Studio Code&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Open VSCode on you computer.&lt;/li&gt;
&lt;li&gt;Click the &lt;code&gt;extensions&lt;/code&gt; icon on the left panel. &lt;/li&gt;
&lt;li&gt;Type &lt;code&gt;tabnine&lt;/code&gt; in the search. &lt;/li&gt;
&lt;li&gt;Click the &lt;code&gt;install&lt;/code&gt; button to enjoy 😊&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fk0m6yzaw0r32o21k2pg4.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fk0m6yzaw0r32o21k2pg4.gif" alt="install Tabnine" width="316" height="276"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;What Tabnine offers you&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;(0) &lt;strong&gt;Productivity ✔️&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;Higher productivity ensures effective time performance, speed, and stress-free. Moreover, It gives you excellent results and consistent effort. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxjjazlucnrmmkbbggj92.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxjjazlucnrmmkbbggj92.png" alt=" " width="402" height="163"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;(1) &lt;strong&gt;Superb Auto-Completion System ✔️&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;It takes-away the burden of remembering and typing the exact names of variables, functions, methods or classes. &lt;/p&gt;

&lt;p&gt;It provides: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Short code completions&lt;/li&gt;
&lt;li&gt;Whole-line of code completions&lt;/li&gt;
&lt;li&gt;Full-function code completions&lt;/li&gt;
&lt;li&gt;Natural language to code completions&lt;/li&gt;
&lt;li&gt;Learns your coding patterns &amp;amp; styles &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuexa43hy8i67vm9l4msd.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fuexa43hy8i67vm9l4msd.gif" alt=" " width="480" height="208"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;(2) &lt;strong&gt;Saves Time Everyday ✔️&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;How you start the program is very important and affects every other decision you'll make.&lt;/p&gt;

&lt;p&gt;You cannot remember every code when building a project. &lt;/p&gt;

&lt;p&gt;It eventually leads to unproductivity if you are close to a deadline - Tabnine improves your speed while coding. &lt;/p&gt;

&lt;p&gt;One of the things I like about the plugin is that I can easily track my performance. With Tabnine delivering your client's project on time is just too easy.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgwd4xbq6yfp8t2j77ofd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgwd4xbq6yfp8t2j77ofd.png" alt=" " width="335" height="203"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let me know your favorite tool in the comment &lt;br&gt;
Show some ❤️‍🔥&lt;/p&gt;

</description>
      <category>softwaredevelopment</category>
    </item>
    <item>
      <title>Build a weather app using JavaScript - step by step tutorial 🚀</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Sat, 17 Sep 2022 16:36:14 +0000</pubDate>
      <link>https://forem.com/devjaiye/build-a-weather-app-using-javascript-step-by-step-tutorial-24hi</link>
      <guid>https://forem.com/devjaiye/build-a-weather-app-using-javascript-step-by-step-tutorial-24hi</guid>
      <description>&lt;p&gt;If you are familiar with programming, you will agree that one of the important concepts you must learn is API. &lt;/p&gt;

&lt;p&gt;API (Application Programming Interface) makes it easy for us to communicate with third-party libraries, files, and get access to data.&lt;/p&gt;

&lt;p&gt;In this tutorial, I will show you how to build a beautiful weather app using HTML, CSS, and JavaScript. We’ll use the &lt;a href="https://openweathermap.org/api" rel="noopener noreferrer"&gt;Open Weather API&lt;/a&gt; to fetch the current weather information. &lt;/p&gt;

&lt;p&gt;Our app will display the user's city, country, temperature, and humidity. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Demo app&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fz2f1w8fasxl66h2nmo5b.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fz2f1w8fasxl66h2nmo5b.gif" alt=" " width="485" height="466"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The tutorial covers the following:&lt;/strong&gt; &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Text validation&lt;/li&gt;
&lt;li&gt;CSS styling&lt;/li&gt;
&lt;li&gt;JSON to string&lt;/li&gt;
&lt;li&gt;Geolocation&lt;/li&gt;
&lt;li&gt;API 
&amp;amp; more…&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let’s dive into it. &lt;/p&gt;

&lt;p&gt;`&lt;strong&gt;Step 0 – Setting up the project&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Open the IDE or code editor of your choice. Create a new folder, I will name mine weather app. For the sake of this tutorial, I will be using Visual Studio Code. Moreso, I provided the &lt;a href="https://github.com/devjaiye/js-weather-app/tree/master/icons" rel="noopener noreferrer"&gt;image link&lt;/a&gt; for this tutorial. &lt;/p&gt;

&lt;p&gt;We need to create our blank files &lt;code&gt;index.html&lt;/code&gt;, &lt;code&gt;style.css&lt;/code&gt;, and &lt;code&gt;script.js&lt;/code&gt;. Create a folder in your project to store the images we will use. `&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5new0ouho4ht0dcseqll.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5new0ouho4ht0dcseqll.png" alt=" " width="208" height="277"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It's time to write the basic HTML code to setup your project. In the code below, I changed the title name to "Weather App". &lt;/p&gt;

&lt;p&gt;&lt;code&gt;index.html&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html lang="en"&amp;gt;
&amp;lt;head&amp;gt;
    &amp;lt;meta charset="UTF-8"&amp;gt;
    &amp;lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&amp;gt;
    &amp;lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&amp;gt;
    &amp;lt;title&amp;gt;Weather App&amp;lt;/title&amp;gt;
&amp;lt;/head&amp;gt;
&amp;lt;body&amp;gt;
    

&amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Add the CSS link and Box Icon&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;After the &lt;code&gt;&amp;lt;/title&amp;gt;&lt;/code&gt; closing tag, we can write the code to connect our css file, and Box Icon link. The &lt;a href="https://boxicons.com/usage" rel="noopener noreferrer"&gt;Box Icon CDN&lt;/a&gt; will be used to generate icons in our app. Next, we can link the JavaScript file below the &lt;code&gt;&amp;lt;/div&amp;gt;&lt;/code&gt; tag.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;index.html&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;/title&amp;gt;
    &amp;lt;!-- css file --&amp;gt;
    &amp;lt;link rel="stylesheet" href="style.css"&amp;gt;
    &amp;lt;!-- Box Icon plugin --&amp;gt;
    &amp;lt;link href="https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css" rel="stylesheet"&amp;gt;
&amp;lt;/head&amp;gt;
&amp;lt;body&amp;gt;
    &amp;lt;div class="wrapper"&amp;gt;
 &amp;lt;!-- Your code here --&amp;gt;
    &amp;lt;/div&amp;gt;
    &amp;lt;!-- Js file --&amp;gt;
    &amp;lt;script src="script.js"&amp;gt;&amp;lt;/script&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Create The HTML Layout for the app&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;Inside the &lt;code&gt;&amp;lt;body&amp;gt;&lt;/code&gt; tag of our &lt;code&gt;index.html&lt;/code&gt; file, we need to create a &lt;code&gt;&amp;lt;div&amp;gt;&lt;/code&gt; with a class name of &lt;code&gt;wrapper&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;div class="wrapper"&amp;gt;

        &amp;lt;!-- your code here --&amp;gt;

    &amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In the &lt;code&gt;&amp;lt;header&amp;gt;&lt;/code&gt; tag, let us create a left arrow icon (&amp;lt;-). The icon is generated from Box Icon. Then, give your app a preferred name. Mine is “Weather App”&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;div class="wrapper"&amp;gt;
        &amp;lt;!-- your code here --&amp;gt;
     &amp;lt;header&amp;gt;&amp;lt;i class="bx bx-left-arrow-alt"&amp;gt;&amp;lt;/i&amp;gt;Weather App&amp;lt;/header&amp;gt;
    &amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;We need to create two &lt;code&gt;&amp;lt;section&amp;gt;&lt;/code&gt; tags inside our &lt;code&gt;&amp;lt;div&amp;gt;&lt;/code&gt;. The first &lt;code&gt;&amp;lt;section&amp;gt;&lt;/code&gt; will contain our input and button&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;div class="wrapper"&amp;gt;
        &amp;lt;div class="wrapper"&amp;gt;
            &amp;lt;header&amp;gt;&amp;lt;i class="bx bx-left-arrow-alt"&amp;gt;&amp;lt;/i&amp;gt;Weather App&amp;lt;/header&amp;gt;
            &amp;lt;!-- input and button --&amp;gt;
            &amp;lt;section class="input-part"&amp;gt;
                &amp;lt;p class="info-text"&amp;gt;&amp;lt;/p&amp;gt;
                &amp;lt;input type="text" placeholder="Enter city here..." spellcheck="false" required&amp;gt;
                &amp;lt;div class="separator"&amp;gt;&amp;lt;/div&amp;gt;
                &amp;lt;button&amp;gt;Get Device Location&amp;lt;/button&amp;gt;
            &amp;lt;/section&amp;gt;
    &amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;At the end of the &lt;code&gt;&amp;lt;/section&amp;gt;&lt;/code&gt; tag, we can write the code for the second &lt;code&gt;&amp;lt;section&amp;gt;&lt;/code&gt; to display the weather information.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;/section&amp;gt;
&amp;lt;!-- display weather info --&amp;gt;
        &amp;lt;section class="weather-part"&amp;gt;
            &amp;lt;img src="icons/cloud.svg" alt="weather icon"&amp;gt;
            &amp;lt;div class="temp"&amp;gt;
                &amp;lt;span class="numb"&amp;gt;_&amp;lt;/span&amp;gt; &amp;lt;span class="deg"&amp;gt;°&amp;lt;/span&amp;gt;C
            &amp;lt;/div&amp;gt;

            &amp;lt;div class="weather"&amp;gt;_ _&amp;lt;/div&amp;gt;
            &amp;lt;div class="location"&amp;gt;
                &amp;lt;i class="bx bx-map"&amp;gt;&amp;lt;/i&amp;gt;
                &amp;lt;span&amp;gt;_, _&amp;lt;/span&amp;gt;
            &amp;lt;/div&amp;gt;
            &amp;lt;div class="bottom-details"&amp;gt;
                &amp;lt;div class="column feels"&amp;gt;
                    &amp;lt;i class="bx bxs-thermometer"&amp;gt;&amp;lt;/i&amp;gt;
                    &amp;lt;div class="details"&amp;gt;
                        &amp;lt;div class="temp"&amp;gt;
                            &amp;lt;span class="numb-2"&amp;gt;_&amp;lt;/span&amp;gt;
                            &amp;lt;span class="deg"&amp;gt;°&amp;lt;/span&amp;gt;C
                        &amp;lt;/div&amp;gt;
                        &amp;lt;P&amp;gt;Feels like&amp;lt;/P&amp;gt;
                    &amp;lt;/div&amp;gt;
                &amp;lt;/div&amp;gt;

                &amp;lt;div class="column humidity"&amp;gt;
                    &amp;lt;i class="bx bxs-droplet-half"&amp;gt;&amp;lt;/i&amp;gt;
                    &amp;lt;div class="details"&amp;gt;
                            &amp;lt;span&amp;gt;_&amp;lt;/span&amp;gt;
                            &amp;lt;p&amp;gt;Humidity&amp;lt;/p&amp;gt;
                        &amp;lt;/div&amp;gt;
                    &amp;lt;/div&amp;gt;
                &amp;lt;/div&amp;gt;
            &amp;lt;/div&amp;gt;
        &amp;lt;/section&amp;gt;
    &amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This is everything you need to do inside the &lt;code&gt;&amp;lt;div&amp;gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;The result of our code will look as so: &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Foa0nyqnuogbwgi6wu0lr.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Foa0nyqnuogbwgi6wu0lr.gif" alt=" " width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Note: the Box Icon will not be generated if your internet connection is not connected.&lt;/em&gt; &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step 1 – Styling our HTML code in style.css&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Our HTML code looks ugly, we need to make the best out of it using CSS. Open your style.css file and let’s get it done. &lt;br&gt;
We will start by adding a few changes to the HTML code.The asterisk (&lt;em&gt;) sign in CSS is useful when you want to set a style for all the elements of an HTML page or for all of the elements within an element of an HTML page. The (&lt;/em&gt;) class will contain the following attributes: &lt;code&gt;margin&lt;/code&gt;, &lt;code&gt;padding&lt;/code&gt;, &lt;code&gt;box-sizing&lt;/code&gt;, &lt;code&gt;font-family&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;style.css&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;*{
    margin: 0; 
    padding: 0; 
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Styling the &lt;code&gt;&amp;lt;body&amp;gt;&lt;/code&gt;, &lt;code&gt;&amp;lt;div&amp;gt;&lt;/code&gt;, classes and elements&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;The code below will be used to style the body of our HTML code.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;body{
    display: flex;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
    background-color: rgb(86, 11, 165);
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, it's time to style our &lt;code&gt;wrapper&lt;/code&gt;, elements and classes in our first &lt;code&gt;&amp;lt;section&amp;gt;&lt;/code&gt; for the input.  Next, we have to style the second  which houses the weather details of our app.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;.wrapper{
    width: 400px;
    border-radius: 7px;
    background-color: #fff;
}

.wrapper header{
    color: rgb(86, 11, 165);
    font-size: 21px;
    font-weight: 500;
    padding: 16px 16px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ededed;
}

header i{
    cursor: pointer;
    font-size: 0px;
    margin-right: 8px;
    color: #000;
}

.wrapper.active header i{
    font-size: 30px;
    margin-left: 5px;
}

.wrapper .input-part{
    margin: 20px 25px 30px;
}

.wrapper.active .input-part{
    display:none;
}

.input-part :where(input, button){
    width: 100%;
    height: 55px;
    border: none;
    outline: none;
    font-size: 18px;
    border-radius: 7px;
}

/* input required style */
.input-part input::is(:focus, :valid){
    border: 2px solid #43AFFC;
}

.input-part input{
    text-align: center;
    border: 1px solid #bfbfbf;
}

.input-part .info-text{
    display: none;
    margin-bottom: 15px;
    padding: 12px 10px;
    text-align: center;
    border-radius: 7px;
    font-size: 17px;
}

.info-text.error{
    display: block;
    color: #721c24;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
}

.info-text.pending{
    display: block;
    color: #0c5460;
    background: #d1ecf1;
    border: 1px solid #f5c6cb;
}

.input-part .separator{
    height: 1px;
    width: 100%;
    margin: 20px 0;
    background: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.separator::before{
    content: "or";
    color: #ccc;
    font-size: 19px;
    padding: 0 15px;
    background: #fff;

}

.input-part button{
    color: #fff;
    cursor: pointer;
    background: rgb(86, 11, 165);
}

/* weather style */
.wrapper .weather-part{
    margin: 30px 0 0;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.wrapper.active .weather-part{
    display: flex;
}

.weather-part img{
    max-width: 125px;
}

.weather-part .temp{
    display: flex;
    font-size: 72px;
    font-weight: 500;
}

.weather-part .temp .numb{
    font-weight: 600;
}

.weather-part .temp .deg{
    font-size: 40px;
    margin: 10px 5px 0 0;
    display: block;
}

.weather-part .weather{
    font-size: 21px;
    text-align: center;
    margin: -5px 20px 15px;
}

.weather-part .location{
    display: flex;
    align-items: center;
    font-size: 21px;
    margin-bottom: 30px;
}

.location i{
    font-size: 22px;
    margin-right: 5px;
}

.weather-part .bottom-details{
    width: 100%;
    display: flex;
    align-items: center;
    border-top: 1px solid #bfbfbf;
    justify-content: space-between;
}

.bottom-details .column{
    width: 100%;
    display: flex;
    padding: 15px 0;
    align-items: center;
    justify-content: center;
}

.column i{
    color: #43AFFC;
    font-size: 40px;
}

.column.humidity{
    border-left: 1px solid #bfbfbf;
}

.details .temp, .humidity span{
    font-size: 18px;
    font-weight: 500;
    margin-top: -3px;
}

.details .temp .deg{
    margin: 0;
    font-size: 17px;
    padding: 0 2px 0 1px;
}

.details p{
    font-size: 14px;
    margin-top: -6px;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Once you complete the CSS code your result should look like the image below 😃&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5hy75gknws6airbr4xdb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5hy75gknws6airbr4xdb.png" alt=" " width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We are almost there. Let’s add some functionality to our app using JavaScript.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step 2 - Add Functionality to the app&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Finally, we are at the last part. Open the &lt;code&gt;script.js&lt;/code&gt; file.&lt;br&gt;
The first thing we need to do inside the &lt;code&gt;script.js&lt;/code&gt; file is to find the HTML elements based on their tag name and class. &lt;/p&gt;

&lt;p&gt;&lt;code&gt;script.js&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const wrapper = document.querySelector(".wrapper")
inputPart = document.querySelector(".input-part")
infoText = document.querySelector(".info-text")
inputField = document.querySelector("input")
getLocationBtn = document.querySelector("button")
arrowBack = wrapper.querySelector("header i")
weatherIcon = document.querySelector("weather-part img")
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;API Key&lt;/strong&gt;&lt;br&gt;
Before we proceed further, you will need an API key to get the weather information. &lt;/p&gt;

&lt;p&gt;Follow the steps below To get the API key: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;sign up or login to &lt;a href="https://openweathermap.org" rel="noopener noreferrer"&gt;OpenWeather&lt;/a&gt; if you have an existing account &lt;/li&gt;
&lt;li&gt;Click on your username at the top right corner and select &lt;strong&gt;My API Keys&lt;/strong&gt; from the dropdown&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzqmio7wnyvtnh9ub4dv3.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzqmio7wnyvtnh9ub4dv3.gif" alt=" " width="485" height="288"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Your API key will be displayed as seen below. Copy and paste it into your notepad or any text editor on your computer.  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fo419e89a5uczfrffnea0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fo419e89a5uczfrffnea0.png" alt=" " width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Open Weather API&lt;/strong&gt; 👍&lt;/p&gt;

&lt;p&gt;We are still on the website, time to get the weather API for our project. The process for that is explained below. Copy and paste the API into your text editor.  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0px8ewy1tqeisq7cead9.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0px8ewy1tqeisq7cead9.gif" alt=" " width="480" height="270"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Wrapping up 😎&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Since we have copied the necessary files from &lt;a href="https://openweathermap.org" rel="noopener noreferrer"&gt;OpenWeather&lt;/a&gt;, we can go back to the &lt;code&gt;script.js&lt;/code&gt; file to make use of the code. &lt;/p&gt;

&lt;p&gt;We need to create two variables, one for the API and the other for the API key.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let api
var apiKey = "paste the api key here…"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Next, let's create functions to handle our API requests. Firstly, I will create a function which will request the API from the server. For the API to search the weather information by cities, it must be specified in the code as seen below.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;function requestApi()&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function requestApi(city){
    //..addded {&amp;amp;units=metric} to the api to round up the number to the nearest 
    api = `https://api.openweathermap.org/data/2.5/weather?q=${city}&amp;amp;units=metric&amp;amp;appid=${apiKey}`
    fectchWeatherData()
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;fectchWeatherData()&lt;/code&gt; This will display an information to notify the user about the process of the app in a &lt;code&gt;&amp;lt;p&amp;gt;&lt;/code&gt;tag. Thereafter, we can get the data from the server and return the API response by passing it into our app as a JavaScript object.  &lt;/p&gt;

&lt;p&gt;&lt;code&gt;.then()&lt;/code&gt; calls the &lt;code&gt;weatherDetails()&lt;/code&gt; where we pass in our result.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;fectchWeatherData()&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function fectchWeatherData(){
    infoText.innerText="Getting weather info..."
    infoText.classList.add("pending")
//...get server and return api response
    fetch(api).then(response =&amp;gt; response.json()).
    then(result =&amp;gt; weatherDetails(result)) 
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;weatherDetails()&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function weatherDetails(info){
    infoText.classList.replace("pending", "error") //..our css style changes the text info background 
    if(info.cod == "404"){ //..cod is an object called from the weather api
        infoText.innerText = `You entered ${inputField.value} which isn't a valid city` //..checks for validation
    } else{
         //..get api data to properties in info-text   
        const city = info.name
        const country = info.sys.country
        const {description, id} = info.weather[0]
        const{feels_like,humidity, temp} = info.main

        //..parse the above values into the html elements 
        wrapper.querySelector(".temp, .numb").innerText = Math.floor(temp) //..round up number to nearest Integer
        wrapper.querySelector(".weather").innerHTML = description
        wrapper.querySelector(".location span").innerHTML = `${city}, ${country}`
        wrapper.querySelector(".temp .numb-2").innerHTML = Math.floor(feels_like)
        wrapper.querySelector(".humidity span").innerHTML = `${humidity}%`
       infoText.classList.remove("pending", "error") //..if we get the correct city from the api we hide pending and error message
        wrapper.classList.add("active") //..show the dashboard which displays the weather info
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Get user’s current location&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;We can make our app detect the user’s current location whenever the button is clicked, and the permission is accepted by the user.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;getLocationBtn.addEventListener("click", ()=&amp;gt;{
    if(navigator.geolocation){ //..if user's browser supports geolocation
        navigator.geolocation.getCurrentPosition(onSuccess, onError)
    } else {
        alert("Browser doesn't support geolocation api")
    }
})
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If the user grants the request, we'll get the weather details of the user's location. Else an error message will be displayed if the user declines. &lt;/p&gt;

&lt;p&gt;To perform this we can write the code in a function called &lt;code&gt;onSuccess()&lt;/code&gt; and &lt;code&gt;onError()&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function onSuccess(position){
    const {latitude, longitude} = position.coords //..getting the lat and long from coordinator object
    api = `https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&amp;amp;lon=${longitude}&amp;amp;units=metric&amp;amp;appid=${apiKey}`
    //..addded {&amp;amp;units=metric} to the api to round up the number
    fectchWeatherData()
}

function onError(error){
  infoText.innerText = error.message //..html text will display error message
  infoText.classList.add("error")
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbwojrhqdcll14qk0duyw.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbwojrhqdcll14qk0duyw.gif" alt=" " width="485" height="323"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The Input Field&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When the user type an input and press the enter button on the keyboard the app will fetch the weather information from the server.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;inputField.addEventListener("keyup", e=&amp;gt;{
    //... input value is not empty 
    if(e.key == "Enter" &amp;amp;&amp;amp; inputField.value !=""){
        requestApi(inputField.value)
    }
})
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The app fulfills its purpose if you run the code, But did you notice the back arrow isn’t working? 🤔&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkkyrgg0qx061wl3n4fp0.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkkyrgg0qx061wl3n4fp0.gif" alt=" " width="422" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let’s fix that by writing this line of code&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;arrowBack.addEventListener("click", ()=&amp;gt;{
    wrapper.classList.remove("active")
})
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Output&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F56gjxbgj0u2h3ilvdnl1.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F56gjxbgj0u2h3ilvdnl1.gif" alt=" " width="378" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Pat yourself at the back for making it thus far 😍 🥰&lt;/p&gt;

&lt;p&gt;Feel free to share to help someone ☺️&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/devjaiye/js-weather-app" rel="noopener noreferrer"&gt;Get the code&lt;/a&gt; 🚀&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>programming</category>
      <category>tutorial</category>
      <category>api</category>
    </item>
    <item>
      <title>Before You Apply for a Job, Do This😎</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Tue, 06 Sep 2022 11:21:12 +0000</pubDate>
      <link>https://forem.com/devjaiye/before-you-apply-for-a-job-do-this-46b2</link>
      <guid>https://forem.com/devjaiye/before-you-apply-for-a-job-do-this-46b2</guid>
      <description>&lt;p&gt;The moment you apply for a job, have it at the back of your mind that you are competing with people who are better than you. It's advised that you prepare for an interview properly in order to beat your competitors. &lt;/p&gt;

&lt;p&gt;There are a few things you should do before applying for a job: &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Learn about the company&lt;/strong&gt; - Understand the company's policies, criteria, services, and products. Doing research in advance shows that you are interested in the company and think of ways to make it run more successfully or efficiently as required. It's also essential to know a bit about their background history. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Stay positive&lt;/strong&gt; - Positivity will encourage you to carry on with your search. Additionally, your optimistic outlook will show during interviews and networking opportunities, enhancing your chances of creating a favorable first impression. If you don't believe in yourself, nobody will. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Update your Resume&lt;/strong&gt; - An updated resume will give recruiters a bad impression about you. Your resume should constantly highlight your most recent accomplishments, skills, qualities, and work experiences. It's crucial to check your resume for out-of-date information and update each part as appropriate before applying for new positions. Remember, how you present your resume determines the closer you are to getting the job.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Clean your social media profiles&lt;/strong&gt; - Your social media profiles, such as your LinkedIn profile, may be viewed by potential employers when you submit a job application. Make sure your social media profiles reflect what you want employers to see when you apply for the job. This means you should remove anything from Twitter or Facebook that you wouldn't want a potential employer to see and update your LinkedIn page with your most recent experience.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Read the instructions&lt;/strong&gt; - Carefully read the application instructions. Don't send a resume as a &lt;strong&gt;.doc&lt;/strong&gt; file if the application requests one in &lt;strong&gt;PDF&lt;/strong&gt; format. Don't send a resume if a cover letter is required. You almost certainly won't get the interview if you don't read every detail and pay close attention to the directions.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I hope you find this helpful.❤️&lt;/p&gt;

&lt;p&gt;Got questions? Send me a message.  &lt;/p&gt;

</description>
      <category>productivity</category>
      <category>career</category>
      <category>tutorial</category>
      <category>beginners</category>
    </item>
    <item>
      <title>What Every Programmer Should Know</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Thu, 13 May 2021 09:13:41 +0000</pubDate>
      <link>https://forem.com/devjaiye/what-every-programmer-should-know-3f3l</link>
      <guid>https://forem.com/devjaiye/what-every-programmer-should-know-3f3l</guid>
      <description>&lt;p&gt;In this post, I will discuss the eight (8) things programmers should know.  Let's dive in.....&lt;/p&gt;

&lt;h3&gt;
  
  
  1. Problem solving and analysis
&lt;/h3&gt;

&lt;p&gt;The ability to solve a problem without a computer is necessary. Here is when critical thinking takes place. You will struggle if you cannot explain or solve a problem on paper before coding.  &lt;/p&gt;

&lt;h3&gt;
  
  
  2. It is not gender-based
&lt;/h3&gt;

&lt;p&gt;Programming is not men's thing. Whether you are a male or a female, you can become a programmer. What matters is your drive towards it.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Consistency will help you
&lt;/h3&gt;

&lt;p&gt;For instance, you are learning to ride a bike. Of a surety, there will be ups and downs as you practice. Naturally, you will make mistakes as a newbie or pro but do not give up  - your focus to learn will yield consistency.  &lt;/p&gt;

&lt;h3&gt;
  
  
  4. Coding at night doesn't make you a pro
&lt;/h3&gt;

&lt;p&gt;Hey, you need to sleep. Rest is good for your brain. When you sleep, your body and brain will be refresh and active to accomplish whatever task you want to do. Lack of sleep can lead to sickness and burnout.&lt;/p&gt;

&lt;h3&gt;
  
  
  5. You are your success and failure
&lt;/h3&gt;

&lt;p&gt;Don't blame anyone for your wrong. Avoid this childish act, accept your mistakes, and find a way to solve them - If your friends cannot help fix it yourself. The problem is not with the programming language you are learning, but your wrong implementation can be why the code isn't working.  &lt;/p&gt;

&lt;h3&gt;
  
  
  6. Make friend with Google
&lt;/h3&gt;

&lt;p&gt;Constantly search for the solution to problems on the internet. There might be someone who has encountered the same before. &lt;/p&gt;

&lt;h3&gt;
  
  
  7. Share your knowledge to gain connections
&lt;/h3&gt;

&lt;p&gt;Sharing what you know doesn't kill or make you look foolish. The more you share your knowledge, the more you become a magnet of attraction. &lt;/p&gt;

&lt;h3&gt;
  
  
  8. Don't ignore your health
&lt;/h3&gt;

&lt;p&gt;While you focus on your profession, take good care of yourself also. Your health should be a top priority. Neglecting your health is dangerous. Avoid smoking, alcohol, excess sugar, and anything that can endanger your body.&lt;/p&gt;

</description>
      <category>codenewbie</category>
      <category>devops</category>
      <category>discuss</category>
      <category>programming</category>
    </item>
    <item>
      <title>5 Reasons Why People Are Afraid To Code</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Wed, 31 Mar 2021 15:35:45 +0000</pubDate>
      <link>https://forem.com/devjaiye/5-reasons-why-people-are-afraid-to-code-26h3</link>
      <guid>https://forem.com/devjaiye/5-reasons-why-people-are-afraid-to-code-26h3</guid>
      <description>&lt;p&gt;The passion to learn new things is one of the major reasons why developers still code through the years. Let's take a look at the challenge faced by beginners who aspire to start a career on this path. &lt;/p&gt;

&lt;h2&gt;
  
  
  1. People Think it's Too Difficult
&lt;/h2&gt;

&lt;p&gt;Programming is difficult and can become frustrating if íts not understood. Learning the fundamentals of a programming language will make it easy and fun. In this case, you will gain more knowledge and experience as you practice consistently. &lt;/p&gt;

&lt;h2&gt;
  
  
  2. They Presume That They’ll Fail
&lt;/h2&gt;

&lt;p&gt;Mindset is everything. If you think you are a loser so you are, vice versa. Your attitude towards a thing determines the outcome. Wrong motivations can not yield productivity.  Presuming that you’ll fail affects your mindset and soon enough you’ll start to have negative thoughts.&lt;/p&gt;

&lt;p&gt;Those who fail are those who never start. &lt;/p&gt;

&lt;h2&gt;
  
  
  3. Beginners Think it’s Too Late to Learn
&lt;/h2&gt;

&lt;p&gt;Coding is a continuous journey it has no end. &lt;br&gt;
 The truth is programming is a never-ending skill that you need to develop. You don’t stop learning, pretty much like any profession. Age isn't a barrier to success. I have read stories of famous entrepreneurs who founded their companies at their old age. Age shouldn't stop you from achieving that goal you desire. &lt;/p&gt;

&lt;h2&gt;
  
  
  4. They Think They Aren't Meant to Code
&lt;/h2&gt;

&lt;p&gt;No man is an island of knowledge. Just because your program was unable to run at the first attempt doesn't define your journey into the future. Stop comparing yourself to others there is no superman anywhere. Keep trying and never be disappointed when you fail. &lt;/p&gt;

&lt;h2&gt;
  
  
  5. They Think it’s Expensive
&lt;/h2&gt;

&lt;p&gt;Some people tell me how interested they love to learn to code but can't afford the cost. You see it's not about the cost it's about your actions. There are so many free resources online for beginners to start learning with. In my case, I took advantage of YouTube, and free e-books related to what I was learning at that moment. This same approach still works for beginners. &lt;/p&gt;

</description>
      <category>codenewbie</category>
      <category>codepen</category>
      <category>programming</category>
      <category>devlive</category>
    </item>
    <item>
      <title>17 Beginner Tips For Software Engineers</title>
      <dc:creator>Dayo Jaiye </dc:creator>
      <pubDate>Sat, 21 Nov 2020 06:14:20 +0000</pubDate>
      <link>https://forem.com/devjaiye/17-beginner-tips-for-software-engineers-1h34</link>
      <guid>https://forem.com/devjaiye/17-beginner-tips-for-software-engineers-1h34</guid>
      <description>&lt;p&gt;Software engineering is a branch of computer science that includes the development and building of computer systems software and applications software. Computer systems software is composed of programs that include computing utilities and operations systems.&lt;/p&gt;

&lt;p&gt;As popular as it is today, beginners tend to lose interest in the process of learning. The following will help you gain a depth understanding of what the field entails. Let's get started!&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Write it down before you code
&lt;/h2&gt;

&lt;p&gt;Understand the problem before choosing a way to solve it, Write it down on a paper, or design the UI for better understanding. &lt;/p&gt;

&lt;h2&gt;
  
  
  2. Ask Google for answers
&lt;/h2&gt;

&lt;p&gt;Yeah, "Google is the best teacher." as quoted. Always ask Google before you ask anyone. &lt;/p&gt;

&lt;h2&gt;
  
  
  3. Learn the best way to do things
&lt;/h2&gt;

&lt;p&gt;Don't stick to the awful method of problem-solving. Deal with your weakness.&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Stay updated
&lt;/h2&gt;

&lt;p&gt;Remember that technology always changes.&lt;/p&gt;

&lt;h2&gt;
  
  
  5. Document your code
&lt;/h2&gt;

&lt;p&gt;It explains the reliability of your project. Neat code without documentation is not complete.&lt;/p&gt;

&lt;h2&gt;
  
  
  6. Don't be afraid of bugs
&lt;/h2&gt;

&lt;p&gt;I have learned more by fixing bugs. Stackoverflow is there to rescue you. Don't abandon the project too soon.&lt;/p&gt;

&lt;h2&gt;
  
  
  7. Finish undone projects
&lt;/h2&gt;

&lt;p&gt;Laziness, lack of motivation, inability to find solutions to problems will lead to this.&lt;/p&gt;

&lt;h2&gt;
  
  
  8. Don’t sell yourself short
&lt;/h2&gt;

&lt;p&gt;Software engineer is probably the job with the highest demand. Companies need you. Aim higher! &lt;/p&gt;

&lt;h2&gt;
  
  
  9. Work on your LinkedIn profile
&lt;/h2&gt;

&lt;p&gt;A poorly maintained profile is worse than no profile.&lt;/p&gt;

&lt;h2&gt;
  
  
  10. Make use of version control
&lt;/h2&gt;

&lt;p&gt;It makes it easy for other developers to work with you on the same project. It also helps to share and reuse your project. Github is widely used to achieve this. &lt;/p&gt;

&lt;h2&gt;
  
  
  11. Train your communication skills
&lt;/h2&gt;

&lt;p&gt;One of the biggest threats for any project is miscommunication amongst the team. &lt;/p&gt;

&lt;h2&gt;
  
  
  12. Exercise regularly
&lt;/h2&gt;

&lt;p&gt;I do this often to stay energetic. It's a great way to refresh my body system. &lt;/p&gt;

&lt;h2&gt;
  
  
  13. Invest in Learning
&lt;/h2&gt;

&lt;p&gt;Udemy, Coursera, Youtube, FreeCodeCamp Khan Academy, Udacity, Medium. etc..contains helpful resources to help you improve. &lt;/p&gt;

&lt;h2&gt;
  
  
  14. Plan before you work
&lt;/h2&gt;

&lt;p&gt;List out the technologies needed in the project, set a deadline, and checklist your progress daily. &lt;/p&gt;

&lt;h2&gt;
  
  
  15. Don't hesitate to ask for help
&lt;/h2&gt;

&lt;p&gt;It doesn't make you unprofessional. It's right to ask for help when stuck. You don't know it all.&lt;/p&gt;

&lt;h2&gt;
  
  
  16. Trends don't matter
&lt;/h2&gt;

&lt;p&gt;A new framework or technology might not be necessary to learn.&lt;/p&gt;

&lt;h2&gt;
  
  
  17. Get enough sleep to stay active
&lt;/h2&gt;

&lt;p&gt;Staying up all night decreases your motivation. Spending donkey hours coding will not make you a pro. Don't stress your brain.&lt;/p&gt;

&lt;p&gt;Happy Coding!  🙂&lt;/p&gt;

</description>
      <category>programming</category>
      <category>python</category>
      <category>android</category>
      <category>codenewbie</category>
    </item>
  </channel>
</rss>
