<?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>DEV Community: Somadina </title>
    <description>The latest articles on DEV Community by Somadina  (@somadinag).</description>
    <link>https://dev.to/somadinag</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.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3266439%2Fe605a369-66c2-4463-9a2a-2e8c3a92d27e.jpg</url>
      <title>DEV Community: Somadina </title>
      <link>https://dev.to/somadinag</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/somadinag"/>
    <language>en</language>
    <item>
      <title>The Biggest Lie About Programming Complexity ⭐ (my favorite)</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 03 Jul 2026 16:13:37 +0000</pubDate>
      <link>https://dev.to/somadinag/the-biggest-lie-about-programming-complexity-my-favorite-3kkn</link>
      <guid>https://dev.to/somadinag/the-biggest-lie-about-programming-complexity-my-favorite-3kkn</guid>
      <description>&lt;h2&gt;
  
  
  The Common Ground of Complexity in Programming and Artificial Intelligence
&lt;/h2&gt;

&lt;p&gt;No matter how complex a system is—and in this case, learning &lt;strong&gt;programming&lt;/strong&gt; and &lt;strong&gt;artificial intelligence&lt;/strong&gt;—no matter how complex they have become, they all have a &lt;strong&gt;common ground&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Looking for that common ground is where the challenge lies.&lt;/p&gt;

&lt;p&gt;To find it, you need to &lt;strong&gt;experiment&lt;/strong&gt; and &lt;strong&gt;backtest your understanding&lt;/strong&gt;. Those two practices are what gradually reveal the patterns behind the complexity.&lt;/p&gt;

&lt;p&gt;But do you know what these two things require?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Discipline&lt;/li&gt;
&lt;li&gt;A strong will&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Without them, it becomes difficult to stay consistent long enough to discover the fundamentals that make everything else easier to understand.&lt;/p&gt;

&lt;h2&gt;
  
  
  Complexity Isn't the Real Problem
&lt;/h2&gt;

&lt;p&gt;What I have realized is that what scares people away from learning programming well is &lt;strong&gt;not its complexity&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;The real challenge is the inability to find its common ground.&lt;/p&gt;

&lt;p&gt;Every programming language, framework, algorithm, or AI concept is built on underlying principles. Once you identify those principles, what once seemed confusing begins to make sense.&lt;/p&gt;

&lt;p&gt;Finding that common ground is where the real work is.&lt;/p&gt;

&lt;p&gt;And it is that understanding that enables you to recreate, direct, and reinvent code that does your bidding.&lt;/p&gt;

&lt;h2&gt;
  
  
  My Advice
&lt;/h2&gt;

&lt;p&gt;If you want to scale up your programming skills and you meet the walls of complexity, &lt;strong&gt;look at the ground&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;If you do not see the ground, search for it.&lt;/p&gt;

&lt;p&gt;Keep experimenting.&lt;/p&gt;

&lt;p&gt;Keep testing your understanding.&lt;/p&gt;

&lt;p&gt;Keep asking &lt;em&gt;why&lt;/em&gt; things work the way they do.&lt;/p&gt;

&lt;p&gt;Eventually, you will notice something surprising:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Hard things become easier when you understand the common ground they are built upon.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Complexity often disappears the moment the fundamentals become clear.&lt;/p&gt;




&lt;h2&gt;
  
  
  Final Thoughts
&lt;/h2&gt;

&lt;p&gt;Learning programming isn't about becoming comfortable with complexity.&lt;/p&gt;

&lt;p&gt;It's about becoming skilled at discovering the simple ideas that complexity is built upon.&lt;/p&gt;

&lt;p&gt;Never stop looking for the common ground.&lt;/p&gt;




&lt;p&gt;Thank you for reading!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;It's me, your digital communicator, Somadina.&lt;/strong&gt;&lt;/p&gt;




&lt;h3&gt;
  
  
  Let's Discuss
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;What was the "common ground" that finally made programming click for you? Share your experience in the comments.&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>ai</category>
      <category>programming</category>
      <category>webdev</category>
      <category>softwaredevelopment</category>
    </item>
    <item>
      <title>A Quick Story About Why Testing Matters</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Thu, 25 Jun 2026 13:17:37 +0000</pubDate>
      <link>https://dev.to/somadinag/a-quick-story-about-why-testing-matters-51ln</link>
      <guid>https://dev.to/somadinag/a-quick-story-about-why-testing-matters-51ln</guid>
      <description>&lt;h2&gt;
  
  
  🚀 I want to share a quick story with my network.
&lt;/h2&gt;

&lt;p&gt;A few days ago, someone asked me to analyze the user interface of a newly launched website.&lt;/p&gt;

&lt;p&gt;For several days, I postponed the evaluation, but whenever we discussed the project, he spoke confidently about the application.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Everything is working perfectly. Just take a look."&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Eventually, I decided to test the site myself.&lt;/p&gt;

&lt;p&gt;When I opened it, I noticed he was already logged in. He suggested that I simply use his account to perform what he thought would be a brief analysis.&lt;/p&gt;

&lt;p&gt;I declined.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"That's not how software is evaluated. I'll create my own account and go through the experience from the ground up, just like a real user."&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Although he initially wanted to rest, he agreed to log out so I could proceed.&lt;/p&gt;




&lt;h2&gt;
  
  
  The Turning Point
&lt;/h2&gt;

&lt;p&gt;The moment he logged out, everything changed.&lt;/p&gt;

&lt;p&gt;The application crashed.&lt;/p&gt;

&lt;p&gt;Pages stopped functioning correctly. He could no longer access his profile or reproduce the workflow he had demonstrated earlier. Features that seemed fine while he was logged in suddenly became unusable.&lt;/p&gt;

&lt;p&gt;I suggested restarting the application.&lt;/p&gt;

&lt;p&gt;He did.&lt;/p&gt;

&lt;p&gt;Nothing changed.&lt;/p&gt;

&lt;p&gt;At that point, I reminded him:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"We came here to test the product, not to debug it. Since you wanted to hand me the device and relax, go and relax. We'll identify the issues first, then fix them."&lt;/p&gt;
&lt;/blockquote&gt;




&lt;h2&gt;
  
  
  The Lesson
&lt;/h2&gt;

&lt;p&gt;As software developers, we can't confidently claim that a product is complete until it has been thoroughly tested.&lt;/p&gt;

&lt;p&gt;What appeared to be a stable application was hiding an entire layer of issues that would never have been discovered without proper testing. That single test session uncovered problems buried deep beneath the surface.&lt;/p&gt;

&lt;p&gt;And that's what development is really about: identifying problems early and turning them into opportunities to create better experiences for users.&lt;/p&gt;




&lt;h2&gt;
  
  
  Remember
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Code that works for the developer isn't enough.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Code must work for the user.&lt;/strong&gt;&lt;/p&gt;




&lt;p&gt;💡 &lt;strong&gt;Have you ever discovered a critical bug only after testing from a fresh user's perspective?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Share your experience below.&lt;/p&gt;

</description>
      <category>testing</category>
      <category>webdev</category>
      <category>softwareengineering</category>
    </item>
    <item>
      <title>Q&amp;A: Understanding What AI Really Is (A Thought Process)</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 17 Apr 2026 12:52:11 +0000</pubDate>
      <link>https://dev.to/somadinag/qa-understanding-what-ai-really-is-a-thought-process-2bnh</link>
      <guid>https://dev.to/somadinag/qa-understanding-what-ai-really-is-a-thought-process-2bnh</guid>
      <description>&lt;h2&gt;
  
  
  Your Question:
&lt;/h2&gt;

&lt;p&gt;If there haven’t been datacenters that store digital information like text, chats, images, and videos, would AI still be able to dynamically create answers to prompts using weights and tokens based on statistics and probability?&lt;/p&gt;

&lt;h2&gt;
  
  
  The Answer:
&lt;/h2&gt;

&lt;p&gt;No. AI models rely on existing data to learn patterns. Without stored data, there would be nothing to train on, so the model couldn’t form meaningful weights or probabilities. Any output would be random and not useful.&lt;/p&gt;




&lt;h2&gt;
  
  
  Your Question:
&lt;/h2&gt;

&lt;blockquote&gt;
&lt;p&gt;“No is the answer haha 😂”&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;If “no” is the answer, then AI is simply a computer program or software that helps humans access information in datacenters in a customized and relatable format based on the user’s prompt. Humans engineered it.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Answer:
&lt;/h2&gt;

&lt;p&gt;Not quite. AI is not just a tool that fetches data from datacenters. It doesn’t directly look up answers.  &lt;/p&gt;

&lt;p&gt;It is a trained model that learned patterns from data and uses probabilities to generate responses. Datacenters mainly store and run the model, not act as a live library it searches.&lt;/p&gt;

&lt;h3&gt;
  
  
  A better way to say it:
&lt;/h3&gt;

&lt;p&gt;AI is a human-made system that learned from data and can generate new responses, not just customize stored information.&lt;/p&gt;




&lt;h2&gt;
  
  
  Your Suggestion, Questions, and Clarification:
&lt;/h2&gt;

&lt;p&gt;That sounds similar to what I meant. Since AI wouldn’t exist without data stored in datacenters, doesn’t that mean it’s an engineered program that manipulates that stored information using probability and statistics? And isn’t that what you call a trained model that learned patterns from data, whether it is after it got trained or before it got trained on it, it is still manipulating data?&lt;/p&gt;

&lt;h2&gt;
  
  
  Answer:
&lt;/h2&gt;

&lt;p&gt;Close, but slightly off.  &lt;/p&gt;

&lt;p&gt;AI does not manipulate stored data in datacenters while answering questions.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;During training →&lt;/strong&gt; it learns from stored datasets
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;After training →&lt;/strong&gt; it no longer uses those datasets directly
&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  At runtime, it uses:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Learned weights
&lt;/li&gt;
&lt;li&gt;Probability to predict the next word
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So, AI generates answers from learned patterns, not by working on stored files in real time.&lt;/p&gt;

&lt;h3&gt;
  
  
  Refined idea:
&lt;/h3&gt;

&lt;p&gt;AI is a human-engineered system that learns from stored data, then uses statistical patterns to generate new answers independently of that data.&lt;/p&gt;




&lt;h2&gt;
  
  
  Your Final Question:
&lt;/h2&gt;

&lt;p&gt;Humans are the ones who initially train AI by showing it data and associations, right? After that, it follows those patterns. And doesn’t that mean others can also train their own AI using their own datasets?&lt;/p&gt;

&lt;h2&gt;
  
  
  Answer:
&lt;/h2&gt;

&lt;p&gt;Yes — that’s basically correct.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Humans provide data and training methods
&lt;/li&gt;
&lt;li&gt;The AI learns patterns from that data (partly guided, partly automatic)
&lt;/li&gt;
&lt;li&gt;After training, it follows those learned patterns
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;And yes:&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
People can train their own AI models or fine-tune existing ones using their own datasets.&lt;/p&gt;




&lt;h2&gt;
  
  
  Conclusion:
&lt;/h2&gt;

&lt;p&gt;AI is not just a system that retrieves stored information. It is a human-engineered system that learns patterns from data and uses probability to generate new, context-aware responses.&lt;/p&gt;

&lt;p&gt;And you have solidly seen and witnessed the cause and effect of AI; every other thing you do with the information depends on you.  &lt;/p&gt;

&lt;p&gt;Technology is not hard to conceptualize when you closely look at it.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>deeplearning</category>
      <category>softwareengineering</category>
    </item>
    <item>
      <title>#How I Self-Taught, Battle-Tested: My Journey to Becoming a Technical Writer And Developer</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 20 Mar 2026 07:47:46 +0000</pubDate>
      <link>https://dev.to/somadinag/how-i-self-taught-battle-tested-my-journey-to-becoming-a-technical-writer-and-developer-2j5a</link>
      <guid>https://dev.to/somadinag/how-i-self-taught-battle-tested-my-journey-to-becoming-a-technical-writer-and-developer-2j5a</guid>
      <description>&lt;h2&gt;
  
  
  From Self-Taught to Service-Ready: My Journey into Technical Writing and Development
&lt;/h2&gt;

&lt;p&gt;A book with 500 pages starts with the first page.  &lt;/p&gt;

&lt;p&gt;This story is the first page:  &lt;/p&gt;

&lt;p&gt;I’ve spent the last two years and few months doing what most people thought was unrealistic — building myself into a technical writer and developer, without waiting for a job, title, or formal training.  &lt;/p&gt;

&lt;p&gt;No classroom set the path. I imagined the future I wanted, then walked straight into it — step by step.  &lt;/p&gt;

&lt;p&gt;I practiced technical writing without being hired. I wrote as if I already had clients. I studied how companies structure their docs, their tones, and how they serve users. I wasn’t passive — I practiced every single concept.  &lt;/p&gt;

&lt;p&gt;I explored &lt;strong&gt;HTML, CSS, and JavaScript&lt;/strong&gt;.&lt;br&gt;&lt;br&gt;
I learned how they connect — not just by reading, but by building.  &lt;/p&gt;

&lt;p&gt;I wiped Windows from my own system, installed Ubuntu, and learned to navigate Linux terminal commands. I studied file hierarchies, understood bootloaders, BIOS, OS structure, and how the machine speaks before the desktop even boots.  &lt;/p&gt;

&lt;p&gt;I broke down the common threads between programming languages — variables, loops, functions, conditionals. I explored computer networks, hardware, and software layers.&lt;br&gt;&lt;br&gt;
Then I went deeper — into &lt;strong&gt;UX/UI design&lt;/strong&gt;, thinking like the user. I even practiced animation and visual storytelling, trying to draw what I saw in my head when words weren’t enough.  &lt;/p&gt;

&lt;p&gt;I did all of these with:  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;No formal teacher
&lt;/li&gt;
&lt;li&gt;No structured support system
&lt;/li&gt;
&lt;li&gt;Just by reading any book I came across and felt could help, visiting related websites, watching videos, and practicing with my low-life laptop
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I isolated myself for this course — not out of loneliness, but because focus mattered more than comfort.  &lt;/p&gt;

&lt;p&gt;I left behind friends, distractions, noise — just to stay on course.&lt;br&gt;&lt;br&gt;
I endured poverty.&lt;br&gt;&lt;br&gt;
I experienced hardship.&lt;br&gt;&lt;br&gt;
But I never stopped. Because I had one goal in mind:  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;To become valuable.&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
&lt;strong&gt;To serve.&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
&lt;strong&gt;To earn the right to be rewarded.&lt;/strong&gt;  &lt;/p&gt;

&lt;p&gt;Because I paid the price in sweat, patience, and practice, it should not surprise anyone when I solve problems with focus,&lt;br&gt;&lt;br&gt;
when I break things down,&lt;br&gt;&lt;br&gt;
when I write and think with clarity.&lt;br&gt;&lt;br&gt;
Because I built this mindset — brick by brick.  &lt;/p&gt;

&lt;p&gt;Now, I am ready to offer my skills, my writing, and my experience — not as a beginner who’s guessing, but as someone who has lived the discipline required to succeed.  &lt;/p&gt;

&lt;p&gt;Whether as a &lt;strong&gt;technical writer, developer, or documentation analyst&lt;/strong&gt; — I’m not just starting.&lt;br&gt;&lt;br&gt;
I’ve already done the reps.&lt;br&gt;&lt;br&gt;
And I’m just getting warmed up.  &lt;/p&gt;

&lt;p&gt;What are you doing with your time? And what are you building with your time? &lt;strong&gt;Start early, finish rich.&lt;/strong&gt;  &lt;/p&gt;

&lt;p&gt;I shared this story to show you that you can grow when their eyes are not watching if you are determined.  &lt;/p&gt;

&lt;p&gt;What I want you to get out of this story is this: set your goals, and when things don't seem to be aligning with them, relax, watch, re-strategize, and still pursue your goals.  &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Be flexible and focused.&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>ai</category>
      <category>programming</category>
      <category>devbugsmash</category>
    </item>
    <item>
      <title>A digestible Breakdown of web servers</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 20 Mar 2026 07:03:32 +0000</pubDate>
      <link>https://dev.to/somadinag/a-digestible-breakdown-of-web-servers-37f8</link>
      <guid>https://dev.to/somadinag/a-digestible-breakdown-of-web-servers-37f8</guid>
      <description>&lt;p&gt;Even if you are not familiar with all the servers in the world, you must have heard of a &lt;strong&gt;web server&lt;/strong&gt;. It is the most common type of server. In fact, when developers want to teach client–server relationships, the web server is the most prevalent illustration.&lt;/p&gt;

&lt;p&gt;But did you know that beyond web servers, there are other types of servers that are crucial parts of the backbone of the internet?&lt;/p&gt;

&lt;p&gt;That is what I will be listing out, along with their uncommon functions.&lt;/p&gt;

&lt;h2&gt;
  
  
  We have:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Database servers:&lt;/strong&gt; They manage data storage and retrieval, e.g., the server that saves your Facebook profile.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Mail servers:&lt;/strong&gt; They handle email transmission, e.g., the servers responsible for sending and receiving emails from Gmail, AOL, or even Yahoo.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;File servers:&lt;/strong&gt; They centralize file storage. Let’s talk about this one a bit, because it looks useless at first glance. Everything about computers is a file, which implies that a mail server, for example, also stores files and allows retrieval—likewise a database server, etc.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So why is this one called a file server, and what is its importance and function?&lt;/p&gt;

&lt;p&gt;A file server is a dedicated computer on a network that acts as a centralized repository for storing, managing, and sharing files, documents, and data among authorized users.&lt;/p&gt;

&lt;p&gt;While it is true that almost everything in computing is a file—and other servers like mail servers do store files—a file server is specialized for general-purpose file management and for collaboration tasks rather than for processing application logic or mail transmission.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Google Drive and SharePoint are perfect examples of services built on top of this type of server.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Other types include:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Proxy servers:&lt;/strong&gt; Intermediaries for web traffic.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;DNS servers:&lt;/strong&gt; Translate domain names into IP addresses.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Application servers:&lt;/strong&gt; Run software applications.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;FTP servers:&lt;/strong&gt; Facilitate file transfer between systems.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Game servers:&lt;/strong&gt; Host multiplayer online games.
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Virtual/Cloud servers:&lt;/strong&gt; Software-based servers running on physical hardware that provide scalable and flexible computing resources.
&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;These servers are designed for specific tasks to manage, secure, and distribute resources efficiently within a network.&lt;/p&gt;

&lt;p&gt;Their interactions, combined with carrying out their specific purposes, are what make the internet smooth in your hands. They are the background engines, dispersed in remote areas, yet still able to reach you with their services whenever you need them.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;More content about computers, networking, and software development is coming. So always check and stick around. Thank you.&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>programming</category>
      <category>devops</category>
    </item>
    <item>
      <title>Why Web Development Won Me Over (After Comparing It to Apps)</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 27 Feb 2026 12:20:35 +0000</pubDate>
      <link>https://dev.to/somadinag/why-web-development-won-me-over-after-comparing-it-to-apps-e9o</link>
      <guid>https://dev.to/somadinag/why-web-development-won-me-over-after-comparing-it-to-apps-e9o</guid>
      <description>&lt;h1&gt;
  
  
  Why I Love Websites Is Deeper Than You Think
&lt;/h1&gt;

&lt;p&gt;Although am actively learning app development, but it happened that I did an extensive research—a deep, thorough study—on the correlation between apps (&lt;strong&gt;Android, iOS, and Windows&lt;/strong&gt;) and website development.&lt;/p&gt;

&lt;p&gt;I explored whether you can build an app using tools meant for building a website. The answer is &lt;strong&gt;no&lt;/strong&gt;. You can't build an app with Flutterwave.&lt;/p&gt;

&lt;p&gt;Each device—&lt;strong&gt;iOS, Android, and Windows&lt;/strong&gt;—has its specific frameworks and languages for app development.&lt;/p&gt;

&lt;h2&gt;
  
  
  So Why Do I Love Websites?
&lt;/h2&gt;

&lt;p&gt;Because they are &lt;strong&gt;browser-oriented&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Any device with a browser can access your website, which essentially contains information about your business and services.&lt;/p&gt;

&lt;p&gt;But for apps:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;If it's developed for &lt;strong&gt;Android&lt;/strong&gt;, it won't be available on &lt;strong&gt;iOS&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;Each platform requires its own development approach.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  The Only Limitation?
&lt;/h2&gt;

&lt;p&gt;The only limitation websites have is if you intentionally disable &lt;strong&gt;JavaScript&lt;/strong&gt; or &lt;strong&gt;CSS&lt;/strong&gt; in your browser.&lt;/p&gt;

&lt;p&gt;The consequence:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Interactivity may be lost
&lt;/li&gt;
&lt;li&gt;Styling may be lost
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;But that’s not a deal-breaker for me.&lt;/p&gt;




&lt;p&gt;Although I can build apps, I especially love working with &lt;strong&gt;websites&lt;/strong&gt;—particularly:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Backend logic
&lt;/li&gt;
&lt;li&gt;Search Engine Optimization (SEO)
&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Let’s Build Something Amazing
&lt;/h2&gt;

&lt;p&gt;Do you want a website for your business with groundbreaking &lt;strong&gt;UX designs&lt;/strong&gt; that leave users speechless for 39 minutes?&lt;/p&gt;

&lt;p&gt;Reach out so we can discuss and create your perfect solution.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>programming</category>
      <category>ai</category>
      <category>opensource</category>
    </item>
    <item>
      <title>Mobile Network Turns Off During Calls — Has Anyone Experienced This?</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Fri, 02 Jan 2026 22:06:23 +0000</pubDate>
      <link>https://dev.to/somadinag/mobile-network-turns-off-during-calls-has-anyone-experienced-this-5034</link>
      <guid>https://dev.to/somadinag/mobile-network-turns-off-during-calls-has-anyone-experienced-this-5034</guid>
      <description>&lt;p&gt;Has anyone experienced this before?&lt;/p&gt;

&lt;p&gt;Whenever I make a call, my mobile network switches off. Once the call ends, the network comes back on again.&lt;/p&gt;

&lt;p&gt;Is this because I’m in Nigeria, or what? Has anyone else had this kind of experience? It keeps happening, and it really bothers me that my data goes off whenever I make calls.&lt;/p&gt;

&lt;h2&gt;
  
  
  Investigating the Problem
&lt;/h2&gt;

&lt;p&gt;I hadn’t looked into it before, but I finally decided to check the problem. I knew it would be one of three things:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Network
&lt;/li&gt;
&lt;li&gt;Phone
&lt;/li&gt;
&lt;li&gt;An unknown application buried in my phone causing the issue
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  What Did I Find?
&lt;/h2&gt;

&lt;p&gt;I discovered that my phone was falling back to &lt;strong&gt;2G/3G during calls&lt;/strong&gt;, which disables mobile data. This happens when &lt;strong&gt;VoLTE is off or not supported&lt;/strong&gt; on a network or SIM.&lt;/p&gt;

&lt;p&gt;You can confirm this by &lt;strong&gt;long-pressing your mobile data icon&lt;/strong&gt; and checking your network settings.&lt;/p&gt;

&lt;p&gt;That explained everything.&lt;/p&gt;

&lt;h2&gt;
  
  
  Other Possible Causes
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;SIM configuration issues
&lt;/li&gt;
&lt;li&gt;Network configuration issues
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How I Fixed Mine
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Turned on &lt;strong&gt;VoLTE&lt;/strong&gt;&lt;br&gt;&lt;br&gt;
&lt;code&gt;Settings → SIM cards &amp;amp; mobile networks → Enable VoLTE&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Selected &lt;strong&gt;4G/LTE&lt;/strong&gt; as the preferred network mode&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  If the Issue Still Persists
&lt;/h2&gt;

&lt;p&gt;Try the following:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Update your phone software
&lt;/li&gt;
&lt;li&gt;Ask your network provider to activate &lt;strong&gt;VoLTE&lt;/strong&gt; on your SIM
&lt;/li&gt;
&lt;li&gt;Replace old SIM cards (upgrade to a 4G SIM)
&lt;/li&gt;
&lt;li&gt;Reset network settings if necessary
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Hope this helps someone.&lt;/p&gt;

</description>
      <category>networking</category>
      <category>mobile</category>
      <category>android</category>
    </item>
    <item>
      <title>You Don’t Know What You Can Achieve Until You Try: My Journey from Technical Writing to UX/UI and Coding</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Thu, 01 Jan 2026 14:55:49 +0000</pubDate>
      <link>https://dev.to/somadinag/you-dont-know-what-you-can-achieve-until-you-try-my-journey-from-technical-writing-to-uxui-and-1cf9</link>
      <guid>https://dev.to/somadinag/you-dont-know-what-you-can-achieve-until-you-try-my-journey-from-technical-writing-to-uxui-and-1cf9</guid>
      <description>&lt;h1&gt;
  
  
  You Don’t Truly Know What You Can Achieve Until You Try
&lt;/h1&gt;

&lt;p&gt;You don’t truly know what you can achieve &lt;strong&gt;until you try&lt;/strong&gt;. It’s easy to look at something and think, &lt;em&gt;“I can do this.”&lt;/em&gt; But when the moment comes to actually perform, you will realize just how much your thinking process wasn’t ready for what seemed simple.  &lt;/p&gt;

&lt;p&gt;When you try, you either &lt;strong&gt;continue or stop&lt;/strong&gt;. That’s the essence of what I am saying.  &lt;/p&gt;




&lt;h2&gt;
  
  
  My Journey: From Technical Writing to UX/UI and Programming
&lt;/h2&gt;

&lt;p&gt;Let me give you an example. I started as a technical writer and ended in the &lt;strong&gt;cobwebs of UX/UI design and programming&lt;/strong&gt;. I could have stayed a technical writer—studying website documentation, improving content, maybe replacing it entirely—but I wanted more.  &lt;/p&gt;

&lt;p&gt;I wanted to understand &lt;strong&gt;computer programs and workflows&lt;/strong&gt;. And to write about something I didn’t understand, I had to learn it.  &lt;/p&gt;




&lt;h2&gt;
  
  
  Starting with Front-End Development
&lt;/h2&gt;

&lt;p&gt;I began with front-end development: &lt;strong&gt;HTML, CSS, JavaScript&lt;/strong&gt;. At first, it felt overwhelming. The real challenge wasn’t the code—it was &lt;strong&gt;my own thinking&lt;/strong&gt;.  &lt;/p&gt;

&lt;p&gt;I struggled to connect front-end with back-end; learning one seemed to erase the other from my memory. I nearly gave up.  &lt;/p&gt;




&lt;h2&gt;
  
  
  What Kept Me Going
&lt;/h2&gt;

&lt;p&gt;What kept me going wasn’t how easy it looked at first glance—it was &lt;strong&gt;consistency&lt;/strong&gt;. Step by step, I pushed through. And now, the reward is real.  &lt;/p&gt;

&lt;p&gt;The knowledge I gained is invaluable. The principles of technical writing—&lt;strong&gt;concision, scannability, simplicity, comprehension&lt;/strong&gt;—still matter, but applying them when writing for programmers and engineers requires more.  &lt;/p&gt;

&lt;p&gt;That &lt;strong&gt;“more”&lt;/strong&gt; is where the fun begins, and that fun is what I am having.  &lt;/p&gt;




&lt;h2&gt;
  
  
  AI as a Partner
&lt;/h2&gt;

&lt;p&gt;Through this journey, &lt;strong&gt;AI hasn’t just been a tool; it’s been a partner&lt;/strong&gt;. And it all started with a single try.&lt;/p&gt;

</description>
      <category>programming</category>
      <category>webdev</category>
      <category>ai</category>
      <category>devrel</category>
    </item>
    <item>
      <title># What Exactly Is a Computer Port, What Can Be Found There, and How to See All Existing Ports of a Computer?</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Tue, 18 Nov 2025 06:10:52 +0000</pubDate>
      <link>https://dev.to/somadinag/-what-exactly-is-a-computer-port-what-can-be-found-there-and-how-to-see-all-existing-ports-of-a-2426</link>
      <guid>https://dev.to/somadinag/-what-exactly-is-a-computer-port-what-can-be-found-there-and-how-to-see-all-existing-ports-of-a-2426</guid>
      <description>&lt;h2&gt;
  
  
  A Computer Port Defined
&lt;/h2&gt;

&lt;p&gt;A computer port is a physical or virtual interface that enables data to flow between a computer and external devices, or between software applications and network connections. They are essential for communication and connectivity.&lt;/p&gt;

&lt;h2&gt;
  
  
  What Exactly Is a Computer Port?
&lt;/h2&gt;

&lt;p&gt;Computer ports can be understood from two primary contexts:  &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Physical ports (hardware)&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Virtual/logical ports (software networking)&lt;/strong&gt;&lt;/li&gt;
&lt;/ol&gt;




&lt;h2&gt;
  
  
  Physical Ports (Hardware)
&lt;/h2&gt;

&lt;p&gt;These are the physical sockets on the computer's casing where you plug in cables and devices. They provide a standardized mode of connection to peripherals like monitors, keyboards, mice, printers, and external hard drives. Examples include &lt;strong&gt;USB, HDMI, Ethernet, and audio jacks&lt;/strong&gt;.&lt;/p&gt;




&lt;h2&gt;
  
  
  Virtual/Logical Ports (Software/Networking)
&lt;/h2&gt;

&lt;p&gt;These are not physical sockets but numerical identifiers (ranging from 0 to 65,535) used by networking protocols, e.g., &lt;strong&gt;TCP, UDP&lt;/strong&gt;, and so on, to direct data to the correct software application on a computer.&lt;/p&gt;

&lt;p&gt;For example:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Web browsers typically use &lt;strong&gt;port 80 or 443&lt;/strong&gt;, which is part of the 65,535 numerical identifiers, for web traffic.
&lt;/li&gt;
&lt;li&gt;Email clients use ports like &lt;strong&gt;25 or 110&lt;/strong&gt; to direct network traffic of specific email protocols like &lt;strong&gt;SMTP, POP3, or IMAP&lt;/strong&gt;.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  What Could Be Found There?
&lt;/h2&gt;

&lt;h3&gt;
  
  
  At a Physical Port
&lt;/h3&gt;

&lt;p&gt;You can find:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The connection point itself
&lt;/li&gt;
&lt;li&gt;The cable connector that plugs into it (e.g., a USB-C cable or HDMI)
&lt;/li&gt;
&lt;li&gt;The peripheral device attached to it (e.g., a monitor, printer, or external drive)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The port provides an interface for data transfer and sometimes power delivery.&lt;/p&gt;

&lt;h3&gt;
  
  
  At a Virtual/Logical Port
&lt;/h3&gt;

&lt;p&gt;You find the data stream associated with a specific running application or network service.&lt;br&gt;&lt;br&gt;
The port number acts as a &lt;strong&gt;“mailing address”&lt;/strong&gt; to ensure that incoming network traffic reaches the correct program.&lt;/p&gt;

&lt;p&gt;Examples:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Data arriving on &lt;strong&gt;port 22&lt;/strong&gt; is directed to the &lt;strong&gt;Secure Shell (SSH)&lt;/strong&gt; service.
&lt;/li&gt;
&lt;li&gt;Data on &lt;strong&gt;port 3389&lt;/strong&gt; goes to the &lt;strong&gt;Remote Desktop Protocol (RDP)&lt;/strong&gt; service.&lt;/li&gt;
&lt;/ul&gt;


&lt;h2&gt;
  
  
  How to See All the Ports?
&lt;/h2&gt;
&lt;h3&gt;
  
  
  To See Physical Ports
&lt;/h3&gt;

&lt;p&gt;Simply look at the front, back, and sides of your desktop computer, laptop, or other device.&lt;br&gt;&lt;br&gt;
Those holes are ports. You will visibly see the different shapes and types of connectors.&lt;/p&gt;


&lt;h2&gt;
  
  
  To See Virtual/Logical Ports
&lt;/h2&gt;

&lt;p&gt;You need to use command-line tools within your operating system. These tools display which ports are open, listening for connections, and which applications are using them.&lt;/p&gt;
&lt;h3&gt;
  
  
  &lt;strong&gt;Windows&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Open the Command Prompt or PowerShell and type:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;netstat -ano
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This command lists all active connections and listening ports, along with the Process ID (PID) of the application using them.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;strong&gt;macOS and Linux&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Use any of these commands in the Terminal:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;netstat -tuln
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ss -tuln
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;lsof -i
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h2&gt;
  
  
  In Conclusion
&lt;/h2&gt;

&lt;p&gt;You can see the physical ports directly, but you cannot directly see the virtual/logical ports except by using command-line tools that depend on the operating system you are using.&lt;/p&gt;

&lt;p&gt;However, you should use your understanding of how the physical ports work to grasp the idea behind the virtual version. Just as you need cables to connect your peripherals like a monitor or mouse, you need virtual ports to connect two machines wirelessly, and those ports are numbered from &lt;strong&gt;1 to 65,535&lt;/strong&gt;.&lt;/p&gt;

</description>
      <category>linux</category>
    </item>
    <item>
      <title>Can the OS (Operating System) of Android Be Changed — Maybe to iPhone.Just as we can change Desktop OS (Operating System)?</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Mon, 03 Nov 2025 07:25:33 +0000</pubDate>
      <link>https://dev.to/somadinag/can-the-os-operating-system-of-android-be-changed-maybe-to-iphonejust-as-we-can-change-desktop-149f</link>
      <guid>https://dev.to/somadinag/can-the-os-operating-system-of-android-be-changed-maybe-to-iphonejust-as-we-can-change-desktop-149f</guid>
      <description>&lt;p&gt;Lets tacklethis rough question together.&lt;/p&gt;

&lt;p&gt;The OS on Android can be changed — it’s called installing a &lt;strong&gt;custom ROM&lt;/strong&gt; (Read-Only Memory).&lt;/p&gt;

&lt;p&gt;Let me give your curious mind a short, clear overview of how to change an Android OS and install a custom ROM.&lt;/p&gt;




&lt;h2&gt;
  
  
  ⚠️ Warning
&lt;/h2&gt;

&lt;p&gt;Be careful — this process can erase all your data or break your phone if done incorrectly.&lt;/p&gt;




&lt;h2&gt;
  
  
  Steps to Change Android OS (Install a Custom ROM)
&lt;/h2&gt;

&lt;h3&gt;
  
  
  1. &lt;strong&gt;Backup Your Data&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;I mean everything first: contacts, photos, and files — because replacement of your OS is capable of wiping out your cherished data, rendering you information-less.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. &lt;strong&gt;Unlock the Bootloader&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Go to your phone’s &lt;strong&gt;Settings → About phone → tap OS version 7 times&lt;/strong&gt; to enable &lt;strong&gt;Developer options&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;After that, go back to your settings, scroll down and find &lt;strong&gt;Developer options&lt;/strong&gt;, then enable &lt;strong&gt;OEM unlocking&lt;/strong&gt; and &lt;strong&gt;USB debugging&lt;/strong&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. &lt;strong&gt;Use Your PC and Command&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Install a custom recovery (like &lt;strong&gt;TWRP&lt;/strong&gt;).&lt;br&gt;&lt;br&gt;
Ensure you download the correct TWRP image for your phone.&lt;/p&gt;

&lt;p&gt;Run the command:&lt;/p&gt;

&lt;p&gt;fastboot oem unlock&lt;/p&gt;

&lt;p&gt;&lt;em&gt;(This wipes your device.)&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;In case you don't know what &lt;strong&gt;Fastboot&lt;/strong&gt; is — it is a diagnostic or repair tool that can flash firmware or restore an operating system.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. &lt;strong&gt;Boot into Fastboot Mode and Flash It&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;fastboot flash recovery twrp.img&lt;/p&gt;

&lt;h3&gt;
  
  
  5. &lt;strong&gt;Download a Custom ROM&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Examples: &lt;strong&gt;LineageOS&lt;/strong&gt;, &lt;strong&gt;Pixel Experience&lt;/strong&gt;, &lt;strong&gt;Evolution X&lt;/strong&gt;, etc.  &lt;/p&gt;

&lt;p&gt;Also download &lt;strong&gt;GApps&lt;/strong&gt; if you want Google services.&lt;/p&gt;

&lt;h3&gt;
  
  
  6. &lt;strong&gt;Flash the ROM&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Boot into &lt;strong&gt;TWRP recovery&lt;/strong&gt;, which is your recovery app you must first have downloaded and activated.&lt;/p&gt;

&lt;p&gt;Wipe &lt;strong&gt;data&lt;/strong&gt;, &lt;strong&gt;cache&lt;/strong&gt;, and &lt;strong&gt;system&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Tap &lt;strong&gt;Install&lt;/strong&gt;, choose the ROM zip, and swipe to flash.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;(Optionally, you can flash GApps.)&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  7. &lt;strong&gt;Reboot the Device&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Once done, reboot your phone — it’ll start with the new OS.&lt;/p&gt;




&lt;h2&gt;
  
  
  Is the Tool and Method for Flashing Your Phone Dependent on the Model and Phone Brand?
&lt;/h2&gt;

&lt;p&gt;Yes, it is phone brand and model dependent. Each Android device has:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Different bootloader unlock methods
&lt;/li&gt;
&lt;li&gt;A unique recovery image (&lt;strong&gt;TWRP&lt;/strong&gt;)
&lt;/li&gt;
&lt;li&gt;Specific custom ROM builds
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So, you must always use files and instructions made for your exact phone model (e.g., &lt;strong&gt;Samsung Galaxy A52&lt;/strong&gt; or &lt;strong&gt;Xiaomi Redmi Note 12&lt;/strong&gt;).&lt;br&gt;&lt;br&gt;
Using the wrong ones can break your phone.&lt;/p&gt;




&lt;h2&gt;
  
  
  Can You Change Android OS to iPhone OS?
&lt;/h2&gt;

&lt;p&gt;Because you change the OS of your Android doesn’t mean you can transit from your Android to iPhone. It must be another OS your device supports — and that will be within its ecosystem.&lt;/p&gt;

&lt;p&gt;Android and iOS are completely different operating systems — iOS is closed-source and made only for Apple hardware, while Android is both a closed and open-source operating system.&lt;br&gt;&lt;br&gt;
For example, &lt;strong&gt;AOSP (Android Open Source Project)&lt;/strong&gt; is open source, but Google’s proprietary store (like the &lt;strong&gt;Play Store&lt;/strong&gt;) is closed source.&lt;br&gt;&lt;br&gt;
&lt;em&gt;Did you catch the difference?&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Besides, you can make Android &lt;strong&gt;look like iOS&lt;/strong&gt; using launchers, icon packs, and themes.&lt;br&gt;&lt;br&gt;
But you &lt;strong&gt;cannot install real iOS&lt;/strong&gt; on an Android phone.&lt;br&gt;&lt;br&gt;
Therefore, you can mimic iOS, but not replace Android with iOS.&lt;/p&gt;




&lt;h2&gt;
  
  
  So Why Can't You Change Android to iOS Since What We Are Changing Is the OS and the OS Was Claimed to Be Changeable?
&lt;/h2&gt;

&lt;p&gt;Good question — and here’s the short reason:&lt;br&gt;&lt;br&gt;
Even though Android’s OS can be changed, iOS isn’t compatible with Android hardware.&lt;/p&gt;

&lt;h3&gt;
  
  
  1. &lt;strong&gt;Closed Source&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Apple doesn’t release iOS code publicly, so no one can install or modify it for other devices — it is a closed-source system.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. &lt;strong&gt;Different Hardware Architecture&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;iPhones use Apple’s own chips and firmware, which work only with iOS.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. &lt;strong&gt;Secure Boot and Encryption&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;iOS only runs on devices that pass Apple’s hardware verification.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. &lt;strong&gt;Drivers and Firmware&lt;/strong&gt;
&lt;/h3&gt;

&lt;p&gt;Android devices use different cameras, screens, radios, etc., and iOS has no drivers for them.&lt;/p&gt;




&lt;h3&gt;
  
  
  ✅ &lt;strong&gt;Conclusion&lt;/strong&gt;
&lt;/h3&gt;

&lt;h2&gt;
  
  
  So technically, Android can be changed — but only to other &lt;strong&gt;Android-based systems (custom ROMs)&lt;/strong&gt;, not iOS, because iOS simply won’t run on non-Apple hardware.
&lt;/h2&gt;

</description>
    </item>
    <item>
      <title>Breakdown of JavaScript cores concept in connection to html with examples</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Sun, 02 Nov 2025 17:56:20 +0000</pubDate>
      <link>https://dev.to/somadinag/breakdown-of-javascript-cores-concept-in-connection-to-html-with-examples-1oj3</link>
      <guid>https://dev.to/somadinag/breakdown-of-javascript-cores-concept-in-connection-to-html-with-examples-1oj3</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;Could you believe that these are the core concepts that make up the giant JavaScript programming language. The  interconnection of these cores builds interactiity on webpage. It is the layer upon which frameworks like jquery tries to simplify. Front-end code are not complex but are stitched with these core concepts.Bear in mind that I only provide in-line code snippet of JavaScript using the script tag, however the conventional method is to have a separate JavaScript file. The snippet is meant to show you how JavaScript core idea is applied in html, which is one thing that scatters the mind of beginners when they are trying to understand the giant called JavaScript:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Syntax&lt;/li&gt;
   &lt;li&gt;Comments&lt;/li&gt;
   &lt;li&gt;Arithmetic Operators&lt;/li&gt;
   &lt;li&gt;Assignment Operators&lt;/li&gt;
   &lt;li&gt;Variables&lt;/li&gt;
   &lt;li&gt;Data types&lt;/li&gt;
   &lt;li&gt;Conditionals&lt;/li&gt;
   &lt;li&gt;Loops&lt;/li&gt;
   &lt;li&gt;Functions&lt;/li&gt;
   &lt;li&gt;Objects&lt;/li&gt;
   &lt;li&gt;Events&lt;/li&gt;
   &lt;li&gt;DOM Manipulation  (In fact, DOM manipulation is the main tool that controls the behavior of web pages, creating the interactivity web developers often talk about). &lt;/li&gt; 
  &lt;/ul&gt;
  

&lt;p&gt;## Concepts are:&lt;/p&gt;


&lt;ul&gt; 
  &lt;li&gt;Asynchrous Operations,&lt;/li&gt;

  &lt;li&gt;Modules&lt;/li&gt;

  &lt;li&gt; And finally, Library&lt;/li&gt;

  &lt;/ul&gt;

&lt;p&gt;&lt;br&gt;
If you know how to initiate these core concepts when programming, you can proudly call yourself a JavaScript guru. You can also easily learn other higher-level programming languages and start helping your fellow humans solve their digital problems. All these concepts are interrelated but somewhat subtle to detect, yet they exist deeply in your code if you have ever added JavaScript to your web page.&lt;/p&gt;

&lt;p&gt;So don’t just read this content alone — use the ideas here to look at any JavaScript codebase. It will remove your phobia about seeing complex code structures as eyesores in your mind. Your life will also be a lot easier when debugging or trying to understand the connection between JavaScript, HTML, and CSS.&lt;/p&gt;

&lt;p&gt;I don’t want to use anything aside from HTML as an example since that is what web development in connection with JavaScript entails. Creating examples about the core concepts of JavaScript without showing how they are used in HTML only makes you wonder about their applicability when reading. I don’t want that to happen. That’s why I’ve fused the core concepts with HTML itself. So, to benefit fully from this lesson, you at least need basic HTML knowledge.&lt;/p&gt;

&lt;p&gt;Comments are a set of instructions written within your code that are ignored by the browser. Single-line and multi-line comments are the two main types. Examples: anything written after two forward slashes like // is a single-line comment, while anything written between &lt;code&gt;/*&lt;/code&gt; &lt;em&gt;and&lt;/em&gt; &lt;code&gt;*/&lt;/code&gt; is a multi-line comment.&lt;/p&gt;

&lt;p&gt;I have to define comments carefully from the onset because they will be used intensively within the code that demonstrates these core concepts. Study the comments within the code — think about them and connect them to the preview or highlights defining each concept.&lt;/p&gt;
&lt;h2&gt;
  
  
  Code snippet example of comments in action:
&lt;/h2&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="c1"&gt;// This is a single-line comment&lt;/span&gt;

  &lt;span class="cm"&gt;/* 
     This is a multi-line comment.
     It can span multiple lines.
  */&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;John&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// store user's name&lt;/span&gt;
  &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// display name in console&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;h2&gt;
  
  
  Unraveling The Core Concepts of JavaScript
&lt;/h2&gt;
&lt;h2&gt;
  
  
  Syntax:
&lt;/h2&gt;

&lt;p&gt;It is the language of any programming system — the way you express your human intentions to the computer. Syntax is how you present the building blocks (e.g., variables, functions, and loops) to the computer through that specific language — in this case, JavaScript.&lt;/p&gt;
&lt;h2&gt;
  
  
  Variable:
&lt;/h2&gt;

&lt;p&gt;A variable is memory space for storing values temporarily or permanently before referencing them.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;h1&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;siteTitle&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/h1&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;siteName&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;TechWorld Blog&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;yearEstablished&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;2020&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;titleElement&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;siteTitle&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="nx"&gt;titleElement&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;siteName&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt; - Since &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;yearEstablished&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Arithmetic and Assignment Operators:
&lt;/h2&gt;

&lt;p&gt;Arithmetic operators (+, -, *, /) perform calculations, while Assignment Operators (=, +=, -=, *=, /=) store and update variable values.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mathResult&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

  &lt;span class="c1"&gt;// Arithmetic operations&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;sum&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;diff&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;prod&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;div&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;/&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

  &lt;span class="c1"&gt;// Assignment operations&lt;/span&gt;
  &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="nx"&gt;b&lt;/span&gt; &lt;span class="o"&gt;*=&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mathResult&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;innerHTML&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;`
    Sum: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;sum&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;br&amp;gt;
    Difference: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;diff&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;br&amp;gt;
    Product: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;prod&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;br&amp;gt;
    Division: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;div&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;br&amp;gt;
    Updated a: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;a&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;br&amp;gt;
    Updated b: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;
  `&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Data Types:
&lt;/h2&gt;

&lt;p&gt;Data types include Number, String, Boolean, Object, Array, Null, and Undefined. They are the basic units that make up everything your page displays. Without understanding data types, you’ll struggle with constructing or deconstructing assignments within your codebase.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;ul&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;dataTypes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/ul&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;siteName&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;TechWorld Blog&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;                &lt;span class="c1"&gt;// String&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;visitorCount&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;1345&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;                        &lt;span class="c1"&gt;// Number&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;isUserLoggedIn&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;                      &lt;span class="c1"&gt;// Boolean&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;userEmail&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;                                  &lt;span class="c1"&gt;// Undefined&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;currentAd&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="kc"&gt;null&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;                           &lt;span class="c1"&gt;// Null&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;article&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;title&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Intro to JS&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;author&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Jane Doe&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;};&lt;/span&gt; &lt;span class="c1"&gt;// Object&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;categories&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;HTML&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;CSS&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;JavaScript&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt; &lt;span class="c1"&gt;// Array&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;uniqueId&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nc"&gt;Symbol&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;userID&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;                &lt;span class="c1"&gt;// Symbol&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;totalUsers&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;9876543210123456789&lt;/span&gt;&lt;span class="nx"&gt;n&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;          &lt;span class="c1"&gt;// BigInt&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;dataList&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;dataTypes&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="nx"&gt;dataList&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;innerHTML&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;`
    &amp;lt;li&amp;gt;String: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;siteName&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Number: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;visitorCount&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Boolean: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;isUserLoggedIn&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Undefined: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;userEmail&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Null: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;currentAd&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Object: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;article&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;title&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt; by &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;article&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;author&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Array: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;categories&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;join&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;, &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;Symbol: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;uniqueId&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;toString&lt;/span&gt;&lt;span class="p"&gt;()}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
    &amp;lt;li&amp;gt;BigInt: &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;totalUsers&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;
  `&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Conditionals:
&lt;/h2&gt;

&lt;p&gt;Conditionals apply Boolean logic — true or false — to trigger specific code when a condition is met.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;score&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;75&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;score&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt; &lt;span class="mi"&gt;80&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Excellent!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;score&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt; &lt;span class="mi"&gt;50&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Good job!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Keep trying!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Loops:
&lt;/h2&gt;

&lt;p&gt;Loops repeat code a set number of times. Use a for loop when you know how many times to run, and a while loop when you don’t.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;ul&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;list&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/ul&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;output&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;""&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;=&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;output&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;li&amp;gt;For loop count: &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;j&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="k"&gt;while &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;j&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;=&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;output&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;li&amp;gt;While loop count: &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;j&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;&amp;lt;/li&amp;gt;&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nx"&gt;j&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;

  &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;list&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;innerHTML&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;output&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Inner workings of the for and while loops:
&lt;/h2&gt;

&lt;p&gt;Both loops add list items three times each. The for loop runs a fixed number of iterations, while the while loop continues as long as the condition is true.&lt;/p&gt;

&lt;h2&gt;
  
  
  Functions:
&lt;/h2&gt;

&lt;p&gt;Two methods — the standard function keyword or the arrow () =&amp;gt; method.&lt;br&gt;
Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;onclick&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;greetUser()&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Click&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt; &lt;span class="nx"&gt;Greet&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;message&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;greetUser&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Visitor&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;message&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Welcome, &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Arrow function method of creating functions:
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;greetBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Click&lt;/span&gt; &lt;span class="nx"&gt;to&lt;/span&gt; &lt;span class="nx"&gt;Greet&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;message&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;greetUser&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Visitor&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;message&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Welcome, &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;
  &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;greetBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;addEventListener&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;click&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;greetUser&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Objects:
&lt;/h2&gt;

&lt;p&gt;Objects are key–value pairs. The value of the variable is structured data accessed using dot notation.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;userInfo&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Jane Doe&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="na"&gt;role&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Admin&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="na"&gt;email&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;jane@techworld.com&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;
  &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;userInfo&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt;
    &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt; (&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;role&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;) - &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;user&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;email&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Events:
&lt;/h2&gt;

&lt;p&gt;Events respond to user actions like clicks or input changes.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;changeBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Change&lt;/span&gt; &lt;span class="nx"&gt;Color&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;btn&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;changeBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="nx"&gt;btn&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;addEventListener&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;click&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;body&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;style&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;backgroundColor&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;lightblue&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;});&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  DOM Manipulation:
&lt;/h2&gt;

&lt;p&gt;DOM stands for Document Object Model — the main way JavaScript interacts with HTML elements.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;h2&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;pageTitle&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Welcome&lt;/span&gt;&lt;span class="o"&gt;!&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/h2&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;button&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;updateBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Update&lt;/span&gt; &lt;span class="nx"&gt;Title&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/button&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;updateBtn&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;addEventListener&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;click&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;title&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;pageTitle&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="nx"&gt;title&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;JavaScript DOM Manipulation in Action!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nx"&gt;title&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;style&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;color&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;green&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;});&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Asynchronous JavaScript:
&lt;/h2&gt;

&lt;p&gt;Handles delays with callbacks, promises, and async/await.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;output&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;&lt;span class="nx"&gt;Starting&lt;/span&gt;&lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="nf"&gt;setTimeout&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;output&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;setTimeout: Runs after 2s&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;},&lt;/span&gt; &lt;span class="mi"&gt;2000&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;timer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;setInterval&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;setInterval count:&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;count&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="nf"&gt;clearInterval&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;timer&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;},&lt;/span&gt; &lt;span class="mi"&gt;1000&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;loadData&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Promise&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;setTimeout&lt;/span&gt;&lt;span class="p"&gt;(()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nf"&gt;resolve&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Promise: Data loaded!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt; &lt;span class="mi"&gt;3000&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;});&lt;/span&gt;

  &lt;span class="k"&gt;async&lt;/span&gt; &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;showData&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;try&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;loadData&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
      &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;output&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;catch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;error&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;output&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Error occurred!&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;

  &lt;span class="nf"&gt;showData&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Modules:
&lt;/h2&gt;

&lt;p&gt;Reusable JS files imported/exported.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// message.js&lt;/span&gt;
&lt;span class="k"&gt;export&lt;/span&gt; &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;greet&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="s2"&gt;`Welcome, &lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;!`&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;

&lt;span class="c1"&gt;// main.js&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;greet&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;./message.js&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;msg&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;greet&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Jane&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;msg&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt; &lt;span class="nx"&gt;type&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;module&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="nx"&gt;src&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;main.js&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Libraries:
&lt;/h2&gt;

&lt;p&gt;Prebuilt JavaScript code used to simplify tasks — often added via CDN, locally, or through npm.&lt;br&gt;
Example using Lodash:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;p&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/p&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt; &lt;span class="nx"&gt;src&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;script&lt;/span&gt;&lt;span class="o"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;numbers&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;20&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;30&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;40&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;sum&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;_&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sum&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;numbers&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;getElementById&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;result&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;textContent&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Total: &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;sum&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="sr"&gt;/script&lt;/span&gt;&lt;span class="err"&gt;&amp;gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Output:
&lt;/h2&gt;

&lt;p&gt;&lt;code&gt;javascript&lt;br&gt;
Total: 100&lt;br&gt;
&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;We’ve come to the end of this short but detailed lesson. I hope you had a good time studying this guide. If you have questions about programming, feel free to reach out. I’ll also welcome your suggestions. Programming should be simple, and I’m doing my best to make sure that idea becomes a reality for everyone.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>html</category>
      <category>beginners</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>If you learn the concept of one low-level language, have you learn techniques of another low-level language? Find out!</title>
      <dc:creator>Somadina </dc:creator>
      <pubDate>Sun, 14 Sep 2025 12:29:00 +0000</pubDate>
      <link>https://dev.to/somadinag/if-you-learn-the-concept-of-one-low-level-language-have-you-learn-techniques-of-m-andanother-48el</link>
      <guid>https://dev.to/somadinag/if-you-learn-the-concept-of-one-low-level-language-have-you-learn-techniques-of-m-andanother-48el</guid>
      <description>&lt;p&gt;You may be familiar with the idea that all high-level languages for coding have one thing in common, e.g., variables, arrays, loops—you know the rest. This signifies that if you learn Python, for instance, it will be easy to learn another programming language like JavaScript, Java, etc.&lt;/p&gt;

&lt;p&gt;That is true for high-level languages. The next question that comes to mind is: does it also apply to low-level languages like x86 assembly or ARM assembly? We shall attempt to give an answer to that because, in some sense, it is true—but in another sense, it isn’t.&lt;/p&gt;

&lt;h2&gt;
  
  
  High-Level Languages
&lt;/h2&gt;

&lt;p&gt;Once you learn one high-level programming language (like Python, JavaScript, or Java), it becomes much easier to pick up others because of the core concepts they share:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Variables, data types, control flow (if/else, loops)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Functions and modularity&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Data structures (arrays, lists, dictionaries/maps)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Object-oriented or functional programming principles&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Therefore, the main difference when switching between them is mostly syntax and some language-specific features.&lt;/p&gt;

&lt;h3&gt;
  
  
  Low-Level Languages
&lt;/h3&gt;

&lt;p&gt;Low-level languages, on the other hand, are a bit different. How?&lt;/p&gt;

&lt;p&gt;A low-level language is very close to the hardware and depends on the CPU architecture (x86, ARM, RISC-V, etc.). Learning one kind of assembly won’t directly transfer to another because the instruction sets are different. However, the general way of thinking about registers, memory, and CPU instructions will apply.&lt;/p&gt;

&lt;p&gt;The C language, which is often portrayed as a “portable assembly,” is still a bit higher than raw assembly—so don’t count too much on that—although it is much lower-level than Python or JavaScript. If you learn C well, you’ll gain beneficial knowledge about both low-level and high-level languages.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;More specifically, you will know:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;How memory management works (pointers, allocation, stack vs. heap)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;How data is stored at a lower level&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;How compilers and operating systems interact with hardware&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That knowledge makes it easier to learn other low-level languages because many concepts carry over.&lt;/p&gt;

&lt;p&gt;So, does the rule still apply?&lt;/p&gt;

&lt;p&gt;Yes—but you’ve seen the twist.&lt;/p&gt;

&lt;p&gt;For high-level languages learning one makes the others much easier because the abstractions are similar.&lt;/p&gt;

&lt;p&gt;For low-level languages learning one gives you the foundational mental model (how computers really work), but the specifics (like assembly instructions) may not transfer directly between platforms.&lt;/p&gt;

&lt;h4&gt;
  
  
  👉 What is the way forward?
&lt;/h4&gt;

&lt;p&gt;Well, the practical strategy is:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Learn one high-level language (Python is a great first).&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Learn one low-level language (C is usually recommended).&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;That way, you cover both: ease of programming and how things work under the hood.&lt;/p&gt;

</description>
      <category>programming</category>
      <category>javascript</category>
      <category>webdev</category>
      <category>devops</category>
    </item>
  </channel>
</rss>
