<?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: Aadit Kamat</title>
    <description>The latest articles on DEV Community by Aadit Kamat (@aaditkamat).</description>
    <link>https://dev.to/aaditkamat</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F131757%2F9f92a106-df83-4157-8113-eb597a0e21d6.jpeg</url>
      <title>DEV Community: Aadit Kamat</title>
      <link>https://dev.to/aaditkamat</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/aaditkamat"/>
    <language>en</language>
    <item>
      <title>Hey guys, I wrote up a blog post based on my struggles working with dates on React Native. Do have a read and feel free to share your thoughts with me</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 27 Apr 2025 22:39:25 +0000</pubDate>
      <link>https://dev.to/aaditkamat/hey-guys-i-wrote-up-a-blog-post-based-on-my-struggles-working-with-dates-on-react-native-do-have-2l62</link>
      <guid>https://dev.to/aaditkamat/hey-guys-i-wrote-up-a-blog-post-based-on-my-struggles-working-with-dates-on-react-native-do-have-2l62</guid>
      <description>&lt;div class="ltag__link--embedded"&gt;
  &lt;div class="crayons-story "&gt;
  &lt;a href="https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac" class="crayons-story__hidden-navigation-link"&gt;Working with Dates across different platforms&lt;/a&gt;


  &lt;div class="crayons-story__body crayons-story__body-full_post"&gt;
    &lt;div class="crayons-story__top"&gt;
      &lt;div class="crayons-story__meta"&gt;
        &lt;div class="crayons-story__author-pic"&gt;

          &lt;a href="/aaditkamat" class="crayons-avatar  crayons-avatar--l  "&gt;
            &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F131757%2F9f92a106-df83-4157-8113-eb597a0e21d6.jpeg" alt="aaditkamat profile" class="crayons-avatar__image"&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;div&gt;
            &lt;a href="/aaditkamat" class="crayons-story__secondary fw-medium m:hidden"&gt;
              Aadit Kamat
            &lt;/a&gt;
            &lt;div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"&gt;
              
                Aadit Kamat
                
              
              &lt;div id="story-author-preview-content-2439383" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"&gt;
                &lt;div class="gap-4 grid"&gt;
                  &lt;div class="-mt-4"&gt;
                    &lt;a href="/aaditkamat" class="flex"&gt;
                      &lt;span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"&gt;
                        &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F131757%2F9f92a106-df83-4157-8113-eb597a0e21d6.jpeg" class="crayons-avatar__image" alt=""&gt;
                      &lt;/span&gt;
                      &lt;span class="crayons-link crayons-subtitle-2 mt-5"&gt;Aadit Kamat&lt;/span&gt;
                    &lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="print-hidden"&gt;
                    
                      Follow
                    
                  &lt;/div&gt;
                  &lt;div class="author-preview-metadata-container"&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;

          &lt;/div&gt;
          &lt;a href="https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac" class="crayons-story__tertiary fs-xs"&gt;&lt;time&gt;Apr 27 '25&lt;/time&gt;&lt;span class="time-ago-indicator-initial-placeholder"&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;

    &lt;/div&gt;

    &lt;div class="crayons-story__indention"&gt;
      &lt;h2 class="crayons-story__title crayons-story__title-full_post"&gt;
        &lt;a href="https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac" id="article-link-2439383"&gt;
          Working with Dates across different platforms
        &lt;/a&gt;
      &lt;/h2&gt;
        &lt;div class="crayons-story__tags"&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/javascript"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;javascript&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/reactnative"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;reactnative&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/datefns"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;datefns&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/dayjs"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;dayjs&lt;/a&gt;
        &lt;/div&gt;
      &lt;div class="crayons-story__bottom"&gt;
        &lt;div class="crayons-story__details"&gt;
            &lt;a href="https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center"&gt;
              Comments


              &lt;span class="hidden s:inline"&gt;Add Comment&lt;/span&gt;
            &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="crayons-story__save"&gt;
          &lt;small class="crayons-story__tertiary fs-xs mr-2"&gt;
            4 min read
          &lt;/small&gt;
            
              &lt;span class="bm-initial"&gt;
                

              &lt;/span&gt;
              &lt;span class="bm-success"&gt;
                

              &lt;/span&gt;
            
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;


</description>
      <category>javascript</category>
      <category>reactnative</category>
      <category>datefns</category>
      <category>dayjs</category>
    </item>
    <item>
      <title>Working with Dates across different platforms</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 27 Apr 2025 22:36:09 +0000</pubDate>
      <link>https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac</link>
      <guid>https://dev.to/aaditkamat/working-with-dates-across-different-platforms-22ac</guid>
      <description>&lt;h1&gt;
  
  
  How I started my journey into React Native
&lt;/h1&gt;

&lt;p&gt;I had my first experience with React Native as a Quality Assurance Engineer at Shopee. To give you folks some context, &lt;a href="https://shopee.sg/web" rel="noopener noreferrer"&gt;Shopee&lt;/a&gt; is the leading e-commerce firm in Southeast Asia and Taiwan. You can compare it to &lt;a href="https://www.temu.com/c.html_" rel="noopener noreferrer"&gt;Temu&lt;/a&gt; here in the US, and the user interface of both platforms is deceptively similar.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdeo.shopeemobile.com%2Fshopee%2Fshopee-appdlpage-live-sg%2Fstatic%2Fimg%2Fbanner_handx.eca0e441.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdeo.shopeemobile.com%2Fshopee%2Fshopee-appdlpage-live-sg%2Fstatic%2Fimg%2Fbanner_handx.eca0e441.png" alt="Shopee Mobile app" width="480" height="560"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.theasianaffairs.com%2Fwp-content%2Fuploads%2F2023%2F10%2FChinese-App-Temu-Takes-Over-the-Online-Shopping-World.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.theasianaffairs.com%2Fwp-content%2Fuploads%2F2023%2F10%2FChinese-App-Temu-Takes-Over-the-Online-Shopping-World.jpg" alt="Temu mobile app" width="800" height="462"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Since I was in the Test Automation department, I didn't have to touch the React Native code itself. However, I had to familiarize myself with React Native, because the devs were migrating the app from the pre existing Kotlin codebase to React Native, to ensure a consistent codebase across the iOS and Android applications without having to work with two separate technology stacks (Swift and Kotlin/Java).&lt;/p&gt;

&lt;p&gt;As any engineer who has worked on a major enterprise system would know, migration from another platform or technology to another is a painful and long process. It can take anywhere from a couple of months to years, depending on how complex the codebase is, how much resources your team can allocate and how business critical the code is. While developers often make breaking changes in the process, the engineers on the testing side have to play catchup. &lt;/p&gt;

&lt;p&gt;I had joined the team as this migration was still about half way through, and one of the first things I had to figure out where the IDs associated with the elements being tested were Android or React Native IDs. This helped determine where the tests had genuinely caught some bugs in the application or had yet to be updated to reflect code changes due to the React Native migration.&lt;/p&gt;

&lt;p&gt;After leaving Shopee, I had not worked on any mobile app project for a while. Earlier this month however, I was roped in to lead the development of a mobile app called Recyclepedia that Florida Community Innovation, a non profit organization in the civic tech space aiming to empower the citizens of Florida with trusted resources and critical social service, is building in partnership with another non profit, Dream in Green, for the residents of the Miami Dade County.&lt;/p&gt;

&lt;p&gt;In the last couple of days, I have been working on a feature rich home page, which includes a calendar showcasing recycling and sustainability events organized by community partners in Miami.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why am I writing this post?
&lt;/h2&gt;

&lt;p&gt;Now that I have gone into a lot of detail about my background, let me cut to the chase. The reason I am writing this post: I found myself hitting roadblocks a couple of times while handling dates and I'm hoping that any devs facing similar issues would find the journalling of my experience helpful.&lt;/p&gt;

&lt;p&gt;As I was implementing a feature for users to select the range of dates for any event they could submit to be included in the calendar, I found myself struggling to get the right dates highlighted. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fwix%2Freact-native-calendars%2Fblob%2Fmaster%2Fdemo%2Fassets%2Fmulti-marking.png%3Fraw%3Dtrue" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2Fwix%2Freact-native-calendars%2Fblob%2Fmaster%2Fdemo%2Fassets%2Fmulti-marking.png%3Fraw%3Dtrue" alt="React Native calendar with period marking" width="411" height="317"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The hiccups I ran into
&lt;/h2&gt;

&lt;p&gt;At first, I suspected this was due to an implementation error, a rookie &lt;a href="https://docs.aws.amazon.com/codeguru/detector-library/cpp/off-by-one-error/" rel="noopener noreferrer"&gt;"off-by-one" bug&lt;/a&gt;. As I dove in deeper, however, I found that I was storing the dates correctly. &lt;/p&gt;

&lt;p&gt;As it turns out, the utility functions within the &lt;code&gt;date-fns&lt;/code&gt; library, &lt;code&gt;addDays&lt;/code&gt; and &lt;code&gt;subDays&lt;/code&gt;, don’t always give &lt;a href="https://github.com/orgs/date-fns/discussions/2742" rel="noopener noreferrer"&gt;the expected output&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;You run into a similar problem when you try to format a date value.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import {format} from "date-fns";

format(new Date("2025-04-26"), "yyyy-MM-dd")) 
# Expected: "2025-04-26", Output: "2025-04-25"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Furthermore, native Date objects are processed slightly differently on the V8 JavaScript engine, used by browsers like Chrome and by Node.js, as compared to mobile platforms like Android or iOS using React Native. As the &lt;a href="https://maggiepint.com/2017/04/11/fixing-javascript-date-web-compatibility-and-reality/" rel="noopener noreferrer"&gt;ECMA262 specification is not compatible with the ISO8601 spec for some situations&lt;/a&gt;, we have to be very careful when parsing dates using the &lt;code&gt;Date()&lt;/code&gt; constructor.&lt;/p&gt;

&lt;h2&gt;
  
  
  How do we resolve these issues?
&lt;/h2&gt;

&lt;p&gt;That's why it is recommended to work with &lt;a href="https://en.wikipedia.org/wiki/Unix_time" rel="noopener noreferrer"&gt;Unix timestamps&lt;/a&gt; instead of string representations which are parsed differently for different engines. &lt;br&gt;
The main issue with this though, is that Unix timestamps are not easily understood by humans. &lt;/p&gt;

&lt;p&gt;To be consistent with date parsing, it’s better to use a utility library to format and manipulate Date objects consistently across your codebase rather than rely on the native Date object. &lt;/p&gt;

&lt;h2&gt;
  
  
  My own take
&lt;/h2&gt;

&lt;p&gt;Even after using &lt;code&gt;date-fns&lt;/code&gt;’s utility functions, I still found working with those dates across different React Native components to be more tedious than I expected. I mean, what’s with all these &lt;a href="https://github.com/date-fns/date-fns/blob/main/docs/unicodeTokens.md" rel="noopener noreferrer"&gt;different tokens for formatting date strings?&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;That’s why I decided to give &lt;code&gt;dayjs&lt;/code&gt; a shot. So far it seems like a cleaner solution, where you can wrap date strings and date-like objects within a &lt;code&gt;dayjs&lt;/code&gt; object before you manipulate them using object methods, but I’ll have greater clarity once everything has been implemented. &lt;/p&gt;

&lt;h2&gt;
  
  
  Final thoughts
&lt;/h2&gt;

&lt;p&gt;Whatever it is, make sure that you stick to a library that manipulates dates in a consistent way - whether it's &lt;a href="https://github.com/moment/moment" rel="noopener noreferrer"&gt;&lt;code&gt;moment&lt;/code&gt;&lt;/a&gt;, &lt;a href="https://github.com/date-fns/date-fns/" rel="noopener noreferrer"&gt;&lt;code&gt;date-fns&lt;/code&gt;&lt;/a&gt; or &lt;a href="https://github.com/iamkun/dayjs/" rel="noopener noreferrer"&gt;&lt;code&gt;dayjs&lt;/code&gt;&lt;/a&gt;. Don’t mix-and-match different Date methods and representations. This will save you a lot of pain as you go working with dates across different platforms.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>reactnative</category>
      <category>datefns</category>
      <category>dayjs</category>
    </item>
    <item>
      <title>Linear Algebra basics</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Mon, 07 Nov 2022 13:34:36 +0000</pubDate>
      <link>https://dev.to/aaditkamat/linear-algebra-basics-part-1-9m7</link>
      <guid>https://dev.to/aaditkamat/linear-algebra-basics-part-1-9m7</guid>
      <description>&lt;p&gt;I have been reviewing Linear Algebra concepts to get a better grasp of Machine Learning through a MOOC called &lt;a href="https://www.coursera.org/learn/linear-algebra-machine-learning" rel="noopener noreferrer"&gt;"Mathematics for Machine Learning: Linear Algebra"&lt;/a&gt; offered by the Imperial College of London on Coursera. This blog post aims to summarize some of the basic concepts in Linear Algebra.&lt;/p&gt;

&lt;h2&gt;
  
  
  Vectors
&lt;/h2&gt;

&lt;h3&gt;
  
  
  What are vectors?
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmathinsight.org%2Fmedia%2Fimage%2Fimage%2Fvector.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmathinsight.org%2Fmedia%2Fimage%2Fimage%2Fvector.png" alt="Geometric representation of a vector" width="449" height="221"&gt;&lt;/a&gt;&lt;br&gt;Geometric representation of a vector (source: &lt;a href="https://mathinsight.org/media/image/image/vector.png" rel="noopener noreferrer"&gt;Math Insight&lt;/a&gt;) 
  &lt;/p&gt;

&lt;p&gt;Vectors lie at the heart of linear algebra. Geometrically, they are directed line segments represented by two quantities: direction and magnitude. You can represent the magnitude of a vector by the length of the line segment and its direction by the direction in which the arrow points. &lt;/p&gt;

&lt;h3&gt;
  
  
  How are vectors represented?
&lt;/h3&gt;

&lt;p&gt;Vectors are often represented by a letter symbol with an arrow on top such as 

&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;v⃗\vec{v} &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;v&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 or in bold as &lt;strong&gt;v&lt;/strong&gt;. The latter representation is much easier to use while typesetting mathematical equations. &lt;/p&gt;

&lt;p&gt;The magnitude of a vector, sometimes also referred to as the norm of the vector, is represented as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;∣v⃗∣|\vec{v}| &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;v&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 or v (no bolding).&lt;/p&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.storyofmathematics.com%2Fwp-content%2Fuploads%2F2021%2F05%2Fdirection-of-a-vector-fig-2.jpg" alt="Direction of a vector" width="444" height="438"&gt;Direction of a vector (source: &lt;a href="https://www.storyofmathematics.com/wp-content/uploads/2021/05/direction-of-a-vector-fig-2.jpg" rel="noopener noreferrer"&gt;Story of Mathematics&lt;/a&gt;) 
  


&lt;p&gt;How is the direction of a vector represented? This is done in terms of the angle it forms with a set of standard bases, or axes as you would know them. In 2 dimensions, these would be the x and y axes. In 3 dimensions, these would be x, y and z axes. You can extend this idea to any number of higher dimensions. &lt;/p&gt;
&lt;h3&gt;
  
  
  What are standard bases?
&lt;/h3&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fthumb%2Ff%2Ffd%2F3D_Vector.svg%2F1200px-3D_Vector.svg.png" width="800" height="757"&gt;Standard Bases(source: &lt;a href="https://upload.wikimedia.org/wikipedia/commons/thumb/f/fd/3D_Vector.svg/1200px-3D_Vector.svg.png" rel="noopener noreferrer"&gt;Wikipedia&lt;/a&gt;) 
  


&lt;p&gt;They are vectors of unit length (magnitude 1) that are orthogonal (perpendicular) to each other. In 2 dimensions, the x and y axes form a plane and in 3 dimensions, the x, y and z axes form a cuboid. &lt;/p&gt;

&lt;p&gt;The reason why these are called standard bases is because they are the ones often used to describe vectors. Denoting the x axis as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;i^\hat{i}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;i&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
, y axis as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;j^\hat{j}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;j&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 and z axis as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;k^\hat{k}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;k&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
, we can describe any vector 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;v⃗\vec{v}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;v&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;v⃗=ai^+bj^+ck^\vec{v} = a\hat{i} + b\hat{j} + c\hat{k} &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;v&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;i&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;j&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;c&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;k&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 where a, b and c are real numbers. &lt;/p&gt;

&lt;p&gt;However, we could use other sets of bases to describe a vector space. These could be of unit length and orthogonal to each other, just like the standard bases, but the main idea is that you can have any vectors form bases as long as they are linearly independent.&lt;/p&gt;
&lt;h3&gt;
  
  
  What is linear dependence?
&lt;/h3&gt;

&lt;p&gt;If you can describe one of the vectors in the set as a linear combination of the other vectors, then these vectors are linearly dependent. &lt;/p&gt;

&lt;p&gt;Consider the case of 2 or 3 vectors in a regular 3 dimensional space. If you can describe one vector as a linear combination of the other vectors (
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;a⃗=nb⃗\vec{a} = n\vec{b}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;n&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
) then it points in the same or the opposite direction but with its magnitude increased (scaled) by a factor of n. This means that it still lies along the same line as the other vector. &lt;/p&gt;

&lt;p&gt;On the other hand, if you can describe one vector can be as a linear combination of two other vectors (
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;a⃗=mb⃗+nc⃗\vec{a} = m\vec{b} + n\vec{c}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;m&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;n&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;c&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
), then it means that it lies in the plane formed by those vectors because that is what the vector addition signifies.&lt;/p&gt;
&lt;h3&gt;
  
  
  How can you mathematically represent vectors?
&lt;/h3&gt;

&lt;p&gt;You can operate with vectors in mathematics as lists of numbers, formed by writing down the values of the components along the different axes, wrapped in round or square brackets. &lt;/p&gt;

&lt;p&gt;For example, &lt;br&gt;

&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(3 4 5)\begin{pmatrix} 3 \ 4 \ 5 \end{pmatrix} &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;3&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;4&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;5&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 &lt;br&gt;
is a 3-dimensional vector that has 3 units of length in the direction of the x axis, 4 in the direction of the y axis and 5 in the direction of the z axis.&lt;/p&gt;

&lt;p&gt;To make things more standardized for discussion, instead of axes, most linear algebra texts use the term standard bases, but know that these essentially refer to the same concept. &lt;br&gt;
You can represent these as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(1 0)\begin{pmatrix} 1 \ 0 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
  and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(0 1)\begin{pmatrix} 0 \ 1 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
  in the 2 dimensional case and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(1 0 0)\begin{pmatrix} 1 \ 0 \ 0 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
  , 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(0 1 0)\begin{pmatrix} 0 \ 1 \ 0 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(0 0 1)\begin{pmatrix} 0 \ 0 \ 1 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 in the 3 dimensional case. &lt;/p&gt;

&lt;p&gt;Hence, you can represent any vector 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;v^=ai^+bj^+ck^\hat{v} = a\hat{i} + b\hat{j} + c\hat{k} &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;v&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;i&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;j&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;c&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;k&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="mord"&gt;^&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(a b c)\begin{pmatrix} a \ b \ c \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord mathnormal"&gt;c&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 which is actually 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;a(1 0 0)+b(0 1 0)+c(0 0 1)a \begin{pmatrix} 1 \ 0 \ 0 \end{pmatrix} + b \begin{pmatrix} 0 \ 1 \ 0 \end{pmatrix}  + c \begin{pmatrix} 0 \ 0 \ 1 \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;+&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;c&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
&lt;/p&gt;

&lt;h3&gt;
  
  
  Is there an alternate way to represent vectors?
&lt;/h3&gt;

&lt;p&gt;You can also represent them is in terms of r, the magnitude of the vector, and the angles it forms with some of the bases. In the 2 dimensional case, for example, you can do so with variables r and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;θ\theta&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
, while for the 3 dimensional case, you can use r, 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;θ\theta&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;α\alpha&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;α&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
. &lt;/p&gt;

&lt;p&gt;Using the bracket notation, you can write these as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(r θ)\begin{pmatrix}r \ \theta \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;r&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 and 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(r θ α)\begin{pmatrix}r \ \theta \ \alpha \end{pmatrix}&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="minner"&gt;&lt;span class="mopen delimcenter"&gt;&lt;span class="delimsizing size1"&gt;(&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mtable"&gt;&lt;span class="col-align-c"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;r&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mspace"&gt; &lt;/span&gt;&lt;span class="mord mathnormal"&gt;α&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose delimcenter"&gt;&lt;span class="delimsizing size1"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 respectively. &lt;/p&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fthumb%2Fd%2Fd3%2FExamples_of_Polar_Coordinates.svg%2F1200px-Examples_of_Polar_Coordinates.svg.png" alt="Polar coordinates" width="800" height="596"&gt;Polar Coordinates(source: &lt;a href="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d3/Examples_of_Polar_Coordinates.svg/1200px-Examples_of_Polar_Coordinates.svg.png" rel="noopener noreferrer"&gt;Wikipedia&lt;/a&gt;) 
  


&lt;p&gt;The coordinates of the point that lie at the end of the vector are known as polar coordinates. By varying the angle, you can describe objects like circles and spheres in the 2 dimensional and 3 dimensional cases.&lt;/p&gt;
&lt;h3&gt;
  
  
  How can vectors be used in the real world?
&lt;/h3&gt;

&lt;p&gt;When you store numerical data in tables in terms of rows and columns, you can think of each of these rows/columns as a vector. For example, in a table consisting of the heights and weights of different people, each person's height and weight is a row vector whereas the list of heights or the list of weights is a column vector.&lt;/p&gt;
&lt;h3&gt;
  
  
  What are some operations you can do on vectors?
&lt;/h3&gt;

&lt;p&gt;You can add two vectors following the parallelogram law or the triangle law. In order to add two vectors, you need to place the tail of the second vector on the head of the first. You can easily extend this to the general case of adding n vectors to get a polygon.&lt;/p&gt;

&lt;p&gt;You can scale a vector by a factor of n. This essential means that you increase its magnitude by a factor of n. If n is positive, then the vector is stretched in the same direction. If n is zero, then the vector is reduced to a point. Otherwise, the vector is stretched in the opposite direction.&lt;/p&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmathinsight.org%2Fmedia%2Fimage%2Fimage%2Fdot_product_projection.png" width="409" height="287"&gt;Dot Product(source: &lt;a href="https://mathinsight.org/media/image/image/dot_product_projection.png" rel="noopener noreferrer"&gt;Math Insight&lt;/a&gt;) 
  


&lt;p&gt;You can take the dot product of two vectors, 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;a⃗.b⃗\vec{a}.\vec{b} &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;.&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
, which is a scalar that is:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The projection of vector a in the direction of b multiplied by the magnitude of b or&lt;/li&gt;
&lt;li&gt;The projection of b in the direction of a multiplied by the magnitude of a.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Mathematically, it works out to be 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;a⃗.b⃗=∣a⃗∣∣b⃗∣cos(θ)\vec{a}.\vec{b} = |\vec{a}||\vec{b}| cos(\theta) &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;.&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;a&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣∣&lt;/span&gt;&lt;span class="mord accent"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;b&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="accent-body"&gt;&lt;span class="overlay"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;span class="mord mathnormal"&gt;cos&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fxaktly.com%2FImages%2FMathematics%2FVectorProjections%2FVectorProjectionsFig2.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fxaktly.com%2FImages%2FMathematics%2FVectorProjections%2FVectorProjectionsFig2.png" width="203" height="244"&gt;&lt;/a&gt;&lt;br&gt;Vector Projections(source: &lt;a href="https://xaktly.com/Images/Mathematics/VectorProjections/VectorProjectionsFig2.png" rel="noopener noreferrer"&gt;xaktly.com&lt;/a&gt;) 
  &lt;/p&gt;

&lt;p&gt;The projection can be thought of as the shadow of one vector onto the other when light rays fall on it perpendicularly.&lt;br&gt;
The special cases are when: 1. two vectors are orthogonal, (the dot product is zero as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;θ=90°;cos(θ)=0\theta=90\degree{}; cos(\theta) = 0 &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;90°&lt;/span&gt;&lt;span class="mord"&gt;&lt;/span&gt;&lt;span class="mpunct"&gt;;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;cos&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;0&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
), 2. two vectors lie in the same direction (the dot product is ab as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;θ=0°;cos(θ)=1\theta=0\degree{};cos(\theta) = 1 &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;0°&lt;/span&gt;&lt;span class="mord"&gt;&lt;/span&gt;&lt;span class="mpunct"&gt;;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;cos&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
) and 3. two vectors lie in opposite direction (the dot product is -ab as 
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;θ=180°;cos(θ)=−1\theta=180\degree{}; cos(\theta) = -1 &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;180°&lt;/span&gt;&lt;span class="mord"&gt;&lt;/span&gt;&lt;span class="mpunct"&gt;;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;cos&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;θ&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;−&lt;/span&gt;&lt;span class="mord"&gt;1&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
 ). &lt;/p&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fupload.wikimedia.org%2Fwikipedia%2Fcommons%2Fthumb%2Fd%2Fd2%2FRight_hand_rule_cross_product.svg%2F1200px-Right_hand_rule_cross_product.svg.png" width="800" height="724"&gt;Right hand rule cross product (source: &lt;a href="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d2/Right_hand_rule_cross_product.svg/1200px-Right_hand_rule_cross_product.svg.png" rel="noopener noreferrer"&gt;Wikipedia&lt;/a&gt;) 
  



  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fchortle.ccsu.edu%2Fvectorlessons%2Fvch12%2FrightHandRule.gif" width="800" height="400"&gt;Corkscrew Rule (source: &lt;a href="https://chortle.ccsu.edu/vectorlessons/vch12/rightHandRule.gif" rel="noopener noreferrer"&gt;Connecticut State University&lt;/a&gt;) 
  


&lt;p&gt;Another operation on vectors results in a vector instead of a scalar (number). This is called the cross product. The way to think about it is in terms of the right hand rules or corkscrew rules, the third vector results from the rotation of one vector to another and is orthogonal to both the vectors. The magnitude of the cross product is the area formed by the vectors, usually computed using the determinant of the matrix formed by these vectors, which we will talk about in a later article.&lt;/p&gt;
&lt;h2&gt;
  
  
  Matrices
&lt;/h2&gt;
&lt;h3&gt;
  
  
  What is a matrix?
&lt;/h3&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fstudy.com%2Fcimages%2Fmultimages%2F16%2Fmatrix_dimensions.png" width="350" height="287"&gt;Matrix Dimensions (source: &lt;a href="https://study.com/cimages/multimages/16/matrix_dimensions.png" rel="noopener noreferrer"&gt;Study.com&lt;/a&gt;) 
  


&lt;p&gt;In high school, matrices are generally introduced as a collection of vectors, either row or column vectors. These are essentially similar to tables in that way. &lt;/p&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.kastatic.org%2Fgoogleusercontent%2F80xT1DCpKtop1dx5zOrdhdiT3qgnywb1j7AXqIx7uAJ1Z2o_YJEhQ9pLa9L6q1RHqwkh7sWwV2wTlXES1qeUKkIzCA" width="512" height="288"&gt;Augmented Matrix for a System of Linear Equations (source: &lt;a href="https://cdn.kastatic.org/googleusercontent/80xT1DCpKtop1dx5zOrdhdiT3qgnywb1j7AXqIx7uAJ1Z2o_YJEhQ9pLa9L6q1RHqwkh7sWwV2wTlXES1qeUKkIzCA" rel="noopener noreferrer"&gt;Khan Academy&lt;/a&gt;) 
  


&lt;p&gt;They come up when you are trying to solve a system of linear equations, to represent the coefficients that appear within the equations.&lt;/p&gt;

&lt;p&gt;But that's only part of the picture. Again, there is a very neat way to think about matrices geometrically just as you can think about vectors geometrically. That involves visualizing them in terms of linear transformations.&lt;/p&gt;
&lt;h3&gt;
  
  
  What are linear transformations?
&lt;/h3&gt;

&lt;p&gt;Linear transformations represent transformations (changes) of vectors and vector spaces. Remember when we said that we don't just have to use the standard bases to describe a vector space. That's where linear transformations come in handy. You can transform one set of bases to another through such transformations. These are linear in nature, because you get shapes formed by straight line segments, which do not have curves in them. The vector spaces can be thought as grids consisting of cells formed by parallel intersecting line segments that are evenly spaced out.&lt;/p&gt;
&lt;h3&gt;
  
  
  What are some common types of linear transformations?
&lt;/h3&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmathigon.org%2Fcontent%2Flinear-algebra%2Fimages%2Ftransformations.svg" width="1618" height="1618"&gt;Types of Linear Transformations (source: &lt;a href="https://mathigon.org/content/linear-algebra/images/transformations.svg" rel="noopener noreferrer"&gt;Mathigon&lt;/a&gt;) 
  


&lt;p&gt;The common types of linear transformations are:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Rotation: You rotate both the bases about the origin, which means that you keep the relative angles and the sizes of the vectors fixed.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Scaling: You stretch the bases in the same directions, changing their sizes but keeping the relative angles fixed.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Shearing: You kept one of the bases fixed and then rotate the other by an angle.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Reflection: You rotate both the bases about a line, rather than about a point such as the origin.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;There are some special types of linear transformations such as the identity transformation, which does nothing, and the zero transformation. You can understand them better in terms of matrix multiplication.&lt;/p&gt;
&lt;h3&gt;
  
  
  How can you visualize matrix-vector multiplication?
&lt;/h3&gt;


  &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmathinsight.org%2Fmedia%2Fimage%2Fimage%2Flinear_transformation_2d_m2_0_0_m2.png" width="700" height="333"&gt;Transformation of bases(source: &lt;a href="https://mathinsight.org/media/image/image/linear_transformation_2d_m2_0_0_m2.png" rel="noopener noreferrer"&gt;Math Insight&lt;/a&gt;) 
  


&lt;p&gt;You can thinking of multiplying a matrix to a vector as applying a linear transformation to that vector. As we said, a vector is usually described in terms of standard bases, but when we multiply it by a matrix, the new vector we get is the same vector described in terms of the bases represented by column vectors in the matrix.&lt;/p&gt;

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

&lt;p&gt;The identity transformation that we spoke out earlier is represented by the identity matrix:&lt;/p&gt;

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

&lt;p&gt;Now it makes sense why you get the same vector when you multiply a vector by the identity matrix: you are not transforming the set of bases and hence the vector space. When you apply the zero transformation, represented by the zero matrix, you essentially collapse everything to a point.&lt;/p&gt;

&lt;p&gt;In the 2 dimensional case, you can write down the matrices corresponding to the common types of linear transformations as follows:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Rotation: &lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Firkwo6ul0lpjdngz8qvc.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Firkwo6ul0lpjdngz8qvc.png" alt="Rotation" width="352" height="160"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Scaling: &lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fb8i9w3d5ixp694pawby3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fb8i9w3d5ixp694pawby3.png" alt="Scaling" width="304" height="136"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Shearing: &lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ytu66ble23xm5zeesdq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8ytu66ble23xm5zeesdq.png" alt="Shearing" width="352" height="160"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Reflection: &lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2ugi9ho86oq9lw8mnvz4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2ugi9ho86oq9lw8mnvz4.png" alt="Reflection" width="352" height="160"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;You can play around with these transformations and visualize them, using this wonderful tool called the &lt;a href="https://tinylittlemaggie.github.io/transformation-matrix-playground/" rel="noopener noreferrer"&gt;transformation matrix playground&lt;/a&gt;.&lt;/p&gt;
&lt;h3&gt;
  
  
  How can you now think about a system of linear equations?
&lt;/h3&gt;

&lt;p&gt;You can think of a system of linear equations in this way: can you find a vector in the standard coordinate system (the vector space described by the standard bases) that results in the solution vector once you apply a linear transformation represented by the matrix?&lt;/p&gt;

&lt;p&gt;This is how we go from numbers to vector spaces - algebra to geometry. Since you aren't dealing with variables raised to any power, you are only concerned with lines and their segments. This is why the field is called linear algebra in the first place.&lt;/p&gt;
&lt;h3&gt;
  
  
  How can you visualize matrix-matrix multiplication?
&lt;/h3&gt;

&lt;p&gt;What happens when you want to apply successive linear transformations? If you guessed that the equivalent was multiplying more than one matrix, then you are right. For example, when you want to rotate a vector (and its associated vector space) and then shear, you will multiply the matrix representing the rotation transformation and then the matrix representing the shearing transformation.&lt;/p&gt;

&lt;p&gt;Matrix multiplication is not commutative, since the order of the transformations matters. For example, rotating and then shearing is not the same as shearing and then rotating.&lt;/p&gt;

&lt;p&gt;
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;AB≠BAAB \neq BA &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;A&lt;/span&gt;&lt;span class="mord mathnormal"&gt;B&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;&lt;span class="mrel"&gt;&lt;span class="mord vbox"&gt;&lt;span class="thinbox"&gt;&lt;span class="rlap"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="inner"&gt;&lt;span class="mord"&gt;&lt;span class="mrel"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="fix"&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;B&lt;/span&gt;&lt;span class="mord mathnormal"&gt;A&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
&lt;/p&gt;

&lt;p&gt;Matrix multiplication is associative, however, since you can group the transformations in different ways, so long as they are applied in the same order.&lt;/p&gt;

&lt;p&gt;
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;A(BC)=(AB)CA(BC) = (AB)C &lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord mathnormal"&gt;A&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;BC&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mrel"&gt;=&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord mathnormal"&gt;A&lt;/span&gt;&lt;span class="mord mathnormal"&gt;B&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="mord mathnormal"&gt;C&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
&lt;/p&gt;

</description>
      <category>math</category>
      <category>linearalgebra</category>
    </item>
    <item>
      <title>Some basic Machine Learning concepts</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 02 Oct 2022 13:24:25 +0000</pubDate>
      <link>https://dev.to/aaditkamat/some-basic-machine-learning-concepts-58fg</link>
      <guid>https://dev.to/aaditkamat/some-basic-machine-learning-concepts-58fg</guid>
      <description>&lt;h2&gt;
  
  
  Background
&lt;/h2&gt;

&lt;p&gt;Machine learning is a discipline that uses mathematical tools like linear algebra, statistics and calculus under the hood to mainly explore problems related to prediction: predict the price of an index fund, predict the weather tomorrow and so on.&lt;/p&gt;

&lt;p&gt;The field has grown in popularity and sees application in a diverse number of fields today largely due to two factors: &lt;strong&gt;growing computational power&lt;/strong&gt; and &lt;strong&gt;larger, high-quality data sets (big data)&lt;/strong&gt; that allow us to make better predictions.&lt;/p&gt;

&lt;p&gt;Machine Learning tries to solve two categories of problems: &lt;strong&gt;estimation&lt;/strong&gt; and &lt;strong&gt;generalization&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Estimation refers to the problem of trying to &lt;strong&gt;guess the value of a variable&lt;/strong&gt; when you are faced with noisy data, which is usually the case when you are dealing with real-world data. This is a problem that appears commonly in statistics.&lt;/p&gt;

&lt;p&gt;Generalization, on the other hand, is based upon the principle of induction: you can &lt;strong&gt;formulate hypothesis (prediction) about future data&lt;/strong&gt; based on past data.&lt;/p&gt;

&lt;h2&gt;
  
  
  Supervised and Unsupervised Learning
&lt;/h2&gt;

&lt;p&gt;Most Machine Learning algorithms fall under two categories: Supervised Learning and Unsupervised Learning.&lt;/p&gt;

&lt;p&gt;As the name suggests, Supervised Learning algorithms require input (supervision) from the humans before they can be executed. Humans provide this input in the form of labelled examples in the training data set.&lt;/p&gt;

&lt;p&gt;Some types of supervised learning algorithms:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Classification: The output of the algorithm for each data point is the category to which the data point should belong. The classification can be binary when two categories are involved or multi-class when multiple categories are involved. Examples: Tagging someone based on previously labelled photos, recommending new songs based on feedback for songs in the history&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Regression: The output of the algorithm for each data point lies within a range of values in a continuous domain. Examples: Predicting height and weight, predicting weather of a place on a certain day&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Unsupervised Learning algorithms, on the other hand, try to identify underlying patterns in the data instead of relying on human input to detect these patterns. Some types of unsupervised learning algorithms are as follows:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Clustering: identify clusters of data points that are closely related by virtue of being closely located in a n-dimensional landscape such as a scatterplot&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Density estimation: Given a set of data points, identify the probability of the random variable representing the Independent and Identically Distributed (IID) population from which these data points are drawn&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Dimensionality reduction: While visualizing points in higher dimensions, it usually helps to boil the distribution down to lower dimensions (fewer variables involved in the prediction) and that is where dimensionality reduction techniques come in handy.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Evaluation
&lt;/h2&gt;

&lt;p&gt;We need some way to tell whether our predictions are in the right direction or not. When we have access to the actual values of the mathematical function representing the data that we are trying to learn, we make use of loss or error functions to see how far our estimates are from the actual values. A good prediction is one that tries to minimize the loss function.&lt;/p&gt;

&lt;p&gt;Before we do this, however, we usually split our input data for a learning algorithm into three sets: training data, test data and validation data. The training data is used by the machine learning algorithm to form a prediction which is then tested out on the test data set. The validation data sets come in handy to ensure that the model is not overfitting the training data. This happens when the model has many parameters and learns the training data set exactly (memorizes it) which leads to a zero error on the test data set.&lt;/p&gt;

&lt;p&gt;The types of loss functions that you typically encounter are:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Absolute function (

&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;∣yactual−yguess∣|y_{actual} - y_{guess}|&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;c&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;t&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;u&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;l&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;−&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;gu&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;ess&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mord"&gt;∣&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
)&lt;/li&gt;
&lt;li&gt;Square function (
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(yactual−yguess)2(y_{actual} - y_{guess})^2&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;c&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;t&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;u&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;l&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;−&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;gu&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;ess&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose"&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;2&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
)&lt;/li&gt;
&lt;li&gt;Linear function(
&lt;span class="katex-element"&gt;
  &lt;span class="katex"&gt;&lt;span class="katex-mathml"&gt;(yactual−yguess)(y_{actual} - y_{guess})&lt;/span&gt;&lt;span class="katex-html"&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mopen"&gt;(&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;c&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;t&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;u&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;a&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;l&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;span class="mbin"&gt;−&lt;/span&gt;&lt;span class="mspace"&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="base"&gt;&lt;span class="strut"&gt;&lt;/span&gt;&lt;span class="mord"&gt;&lt;span class="mord mathnormal"&gt;y&lt;/span&gt;&lt;span class="msupsub"&gt;&lt;span class="vlist-t vlist-t2"&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;span class="pstrut"&gt;&lt;/span&gt;&lt;span class="sizing reset-size6 size3 mtight"&gt;&lt;span class="mord mtight"&gt;&lt;span class="mord mathnormal mtight"&gt;gu&lt;/span&gt;&lt;span class="mord mathnormal mtight"&gt;ess&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-s"&gt;​&lt;/span&gt;&lt;/span&gt;&lt;span class="vlist-r"&gt;&lt;span class="vlist"&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;span class="mclose"&gt;)&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;
&lt;/span&gt;
)&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Model selection
&lt;/h2&gt;

&lt;p&gt;The model for a given data set is very specific to that dataset: the parameters for that model have specific values. It is usually picked from a class of models. For example, linear functions form a model class, while the linear function used as a classifier for the data set is a model selected from that class.&lt;/p&gt;

&lt;h2&gt;
  
  
  Learning algorithm
&lt;/h2&gt;

&lt;p&gt;It is easy to confuse Machine Learning algorithms with Machine Learning models because the terms are often used in conjunction. They are related concepts, but they are vastly different from each other.&lt;/p&gt;

&lt;p&gt;Learning algorithms are usually designed such that you start with a naive model in a learning algorithm. The learning algorithm then looks to optimize the model by varying the hyperparameters (also known as "hyperparameter tuning"): parameters specific to the algorithms that are not accessible to the models. This kind of optimisation enables models to be able to describe the data better, for example, by trying to minimize the loss function.&lt;/p&gt;

</description>
      <category>machinelearning</category>
    </item>
    <item>
      <title>How to deactivate your Slack account on a Workspace</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 25 Sep 2022 14:37:39 +0000</pubDate>
      <link>https://dev.to/aaditkamat/how-to-deactivate-your-slack-account-on-a-workspace-47n0</link>
      <guid>https://dev.to/aaditkamat/how-to-deactivate-your-slack-account-on-a-workspace-47n0</guid>
      <description>&lt;p&gt;I was trying to deactivate my old Slack accounts on different workspaces and I was kind of confused about how I should go about doing that. Since I was not able to figure it about going through the Slack docs, I thought that I would write a mini blog post with steps to go about deactivating your account.&lt;/p&gt;

&lt;p&gt;Steps:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Click on the icon at the top right corner and select 
&lt;strong&gt;Profile&lt;/strong&gt;
&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fyuiewrnsfrocjokyu9zv.png" alt="Profile" width="618" height="698"&gt;
&lt;/li&gt;
&lt;li&gt;Click on the button with three vertical dots and choose &lt;strong&gt;Account Settings&lt;/strong&gt; from the dropdown menu
&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fji7xqakw0byxzahw7pt9.png" alt="Account Settings" width="652" height="1396"&gt;
&lt;/li&gt;
&lt;li&gt;Click on the &lt;strong&gt;Deactivate your account&lt;/strong&gt; button after scrolling down the page, all the way to the bottom.
&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fscrjv4tn8ga65ul0j3gd.png" alt="Deactivate your account" width="800" height="263"&gt;
&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>slack</category>
    </item>
    <item>
      <title>Testing with Jest and React Testing Library</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 18 Sep 2022 08:20:18 +0000</pubDate>
      <link>https://dev.to/aaditkamat/testing-with-jest-and-react-testing-library-1amh</link>
      <guid>https://dev.to/aaditkamat/testing-with-jest-and-react-testing-library-1amh</guid>
      <description>&lt;p&gt;&lt;a href="https://jestjs.io/" rel="noopener noreferrer"&gt;Jest&lt;/a&gt; is a library developed by Meta for testing JavaScript applications. &lt;a href="https://testing-library.com/" rel="noopener noreferrer"&gt;React Testing Library&lt;/a&gt;, on the other hand, is a library developed by Kent C Dodds and other open source contributors, which wraps around the React library and provides a black box solution specifically for unit testing &lt;a href="https://reactjs.org/" rel="noopener noreferrer"&gt;React&lt;/a&gt; applications.&lt;/p&gt;

&lt;p&gt;At Visa, I was writing unit tests for a &lt;a href="https://nextjs.org/" rel="noopener noreferrer"&gt;Next.js&lt;/a&gt; project using components designed with &lt;a href="https://chakra-ui.com/" rel="noopener noreferrer"&gt;Chakra UI&lt;/a&gt;. That's where React Testing Library came in handy. Unlike other solutions like &lt;a href="https://enzymejs.github.io/enzyme/" rel="noopener noreferrer"&gt;Enzyme&lt;/a&gt;, I did not have to worry about the application snapshot but could instead focus on each UI element, its expected behaviour and the data it would render upon user interactions.&lt;/p&gt;

&lt;h2&gt;
  
  
  Jest
&lt;/h2&gt;

&lt;p&gt;In Jest, you usually split your tests into groups using the &lt;code&gt;describe&lt;/code&gt; block. You can write a descriptive message as the title of the block to indicate what kind of tests you are including in this block. Similarly, each individual test case is written using the &lt;code&gt;it&lt;/code&gt; or &lt;code&gt;test&lt;/code&gt; wrapper, with a message to describe the individual test case.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;The nice thing about Jest - which can also be a pain point when you actually get down to writing the tests - is that they execute in parallel rather than sequentially. You can force sequential execution by using the &lt;code&gt;--runInBand&lt;/code&gt; parameter and this comes in handy sometimes while debugging issues related to timing. However, test suites are generally executed in parallel so that they run faster.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;jest example.test.js --runInBand
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;With Jest, you write tests using the &lt;code&gt;expect&lt;/code&gt; clauses, where you specify the matcher that you are expecting and compare it to the received output, to verify that the expected behaviour is satisfied.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;



&lt;p&gt;You can specify the chunks of code you wish to execute before and after each test case using the &lt;code&gt;beforeEach&lt;/code&gt; and &lt;code&gt;afterEach&lt;/code&gt; clauses respectively. If you want to include some code before all the test cases are executed or after all the test cases are executed, you can use the &lt;code&gt;beforeAll&lt;/code&gt; and &lt;code&gt;afterAll&lt;/code&gt; clauses. These functions are very useful for consolidating all the common data setup as well as doing some cleanup.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;&lt;a href="https://jestjs.io/docs/mock-function-api" rel="noopener noreferrer"&gt;Mocking&lt;/a&gt; is a useful feature in Jest that allows you to test the expected behaviour when an API call is made without actually calling the respective APIs. This is necessary for testing because calling the actual APIs can be costly, since these calls are subject to constraints like network bandwidth. These can also be used for simulating calls to third party dependencies, which are not supposed to be tested because they have been developed by others.&lt;/p&gt;

&lt;h2&gt;
  
  
  React Testing Library
&lt;/h2&gt;

&lt;p&gt;These are the abstractions (functions) from the React Testing Library that I have used most for writing unit tests:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;screen&lt;/code&gt;: The &lt;code&gt;screen&lt;/code&gt; API allows you to access the HTML DOM, and print out either the entire DOM or a portion of it using the &lt;code&gt;debug&lt;/code&gt; method. You can also retrieve element(s) by using the &lt;code&gt;findBy*&lt;/code&gt;, &lt;code&gt;queryBy*&lt;/code&gt; and &lt;code&gt;getBy*&lt;/code&gt; functions. &lt;code&gt;findBy*&lt;/code&gt; is an asynchronous function that allows you to fetch an HTML Element or an array of HTML Elements. &lt;code&gt;queryBy*&lt;/code&gt;, on the other hand, allows you to fetch either as well as return null if they are not found. &lt;code&gt;getBy*&lt;/code&gt; throws an error if the element(s) in question is not found. &lt;code&gt;findAllBy*&lt;/code&gt;, &lt;code&gt;queryAllBy*&lt;/code&gt; and &lt;code&gt;getAllBy*&lt;/code&gt; are variants of the respective methods that let users retrieve an array of matching elements instead of a single element.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;waitFor&lt;/code&gt;: &lt;code&gt;waitFor&lt;/code&gt; allows you to execute a block of code and wait for it to finish before you move on to the other blocks of code in the test case.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;render&lt;/code&gt;: &lt;code&gt;render&lt;/code&gt; is used to render a React Component or Fragment as you would in a React application. This is basically a re-export of the original render function from the React library.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;fireEvent&lt;/code&gt;: &lt;code&gt;fireEvent&lt;/code&gt; allows you to handle trigger events on the different elements like &lt;code&gt;input&lt;/code&gt; or &lt;code&gt;select&lt;/code&gt;. An alternative is the &lt;code&gt;userEvent&lt;/code&gt; library for simulating the user interactions.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Example of a unit test case
&lt;/h2&gt;

&lt;p&gt;Let's say we build a login form using Chakra UI. We want to do very basic validations on the form data and check the logic flow once the &lt;code&gt;submit&lt;/code&gt; button is called.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;You only need to specify the respective test ids for the components while designing the front end. You can then match the values filled in with the expected values after carrying out the interactions. Here, the mock for the &lt;code&gt;console&lt;/code&gt; object comes in handy to determine whether the statement is printed upon successful login or not.&lt;/p&gt;

&lt;h2&gt;
  
  
  Pain points:
&lt;/h2&gt;

&lt;p&gt;While writing unit tests seems straightforward in theory, it requires a good amount of trial and error in practice. &lt;/p&gt;

&lt;p&gt;These are some of the issues that I faced along the way:&lt;/p&gt;

&lt;h3&gt;
  
  
  1. Time out issues
&lt;/h3&gt;

&lt;p&gt;If the tests involve a large set of UI interactions like filling in multiple fields in a form or handling multiple input events, they are likely to time out before the whole test case executes, or even in the waitFor block. A work around is using &lt;a href="https://jestjs.io/docs/jest-object#jestusefaketimersfaketimersconfig" rel="noopener noreferrer"&gt;&lt;code&gt;fakeTimers&lt;/code&gt;&lt;/a&gt; in jest and then &lt;a href="https://jestjs.io/docs/jest-object#jestrunalltimers" rel="noopener noreferrer"&gt;&lt;code&gt;runAllTimers&lt;/code&gt;&lt;/a&gt; once the component is rendered so that the test timer waits for the completion of the execution. Another way, is to use &lt;a href="https://jestjs.io/docs/jest-object#jestsettimeouttimeout" rel="noopener noreferrer"&gt;&lt;code&gt;setTimeout&lt;/code&gt;&lt;/a&gt; and specify the timeout you are expecting. &lt;/p&gt;

&lt;p&gt;The main problem is detecting the line(s) of test code responsible for the delay in test execution. For this, you have to usually resort to some trial and error with reordering the test cases in the suite or even the way you break the test cases into suites. You might also have to log the execution of the source code at several points to see whether the data obtained from a mock is the same one that the test was expecting at that point in time. The problem is compounded due to the asynchronous nature of execution of React code in hooks.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Test cases pass individually but fail when run in a suite
&lt;/h3&gt;

&lt;p&gt;Honestly, this is a very frustrating problem to solve. The first easy step to troubleshoot this issue is to have all the shared data setup for the test cases in the &lt;code&gt;beforeEach&lt;/code&gt; and &lt;code&gt;afterEach&lt;/code&gt; clauses. However, it could also be that some of the tests have taken longer to execute than others and therefore, only part of the source code gets tested in a failing case. Resolving this issue involves significant trial and error similar to the timeout issue.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Element not found
&lt;/h3&gt;

&lt;p&gt;Sometimes the element(s) you are looking for simply cannot be found. You would have to print out the whole DOM using &lt;code&gt;debug&lt;/code&gt; and inspect why this is not found. It's an easy fix if the matcher specified in the &lt;code&gt;expect&lt;/code&gt; clause is wrong, but it becomes quite troublesome if the element is not displayed because the state of the application has not been updated.  This might require you to inspect the application flow more thoroughly. It's good if the test has helped you catch the bugs in code execution, since that is the main purpose behind software testing. However, it is also possible that your code is executing correctly but there is some other issue that results in this error, like a timeout issue.&lt;/p&gt;

</description>
      <category>react</category>
      <category>reacttestinglibrary</category>
      <category>jest</category>
    </item>
    <item>
      <title>How to start blogging</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sat, 25 Jun 2022 13:35:54 +0000</pubDate>
      <link>https://dev.to/aaditkamat/how-to-start-blogging-45j3</link>
      <guid>https://dev.to/aaditkamat/how-to-start-blogging-45j3</guid>
      <description>&lt;p&gt;Writing is a demanding activity. There is no right or wrong way to approach this task. In the end, it boils down to is being able to find your own grooves and patterns, but I thought of writing a post with some tips to help you get started. &lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 1: Find a template
&lt;/h2&gt;

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



&lt;p&gt;When you are writing a lot, it becomes difficult to start writing from a blank page each time. Having a template in place can help you structure your thoughts as you start writing your first draft. Nicholas Cole’s &lt;a href="https://www.youtube.com/watch?v=NI0TSaYYv8A" rel="noopener noreferrer"&gt;YouTube video for Prepping the Page&lt;/a&gt; includes a template that you may find useful in getting started. &lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 2: Use a Pomodoro
&lt;/h2&gt;

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



&lt;p&gt;Pomodoros are great productivity tools that help you to keep track of the time spent on your tasks. Think of writing itself as a task that demands your undivided attention and don't rely solely on your willpower to reach the end. &lt;/p&gt;

&lt;p&gt;You can start with one pomodoro and do a brain dump, either on a piece of paper or in an online document. The advantage of dumping the information in an online document is that you can easily transfer over bits and pieces for your first draft.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 3: Outline before your draft
&lt;/h2&gt;

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



&lt;p&gt;I have written a couple of posts in prose form and edited them later on, but I find that this works better for a writing piece that relies less on structure, like a diary entry. &lt;/p&gt;

&lt;p&gt;For any other kind of writing where you are trying to convey information to your audience, it’s better to create an outline, where you can get your points out first. A list-like format helps you keep track of all the information you want to include in your post.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 4: Headings draw attention
&lt;/h2&gt;

&lt;p&gt;When you have headings for your posts, readers can figure out what each section of the post is trying to convey and focus on the key points. &lt;/p&gt;

&lt;p&gt;To see the difference that formatting can make, contrast a well-formatted post as opposed to those that reads like a long wall of text. You’ll find it much easier to comprehend information from the well formatted post. &lt;/p&gt;

&lt;p&gt;The same logic applies to conveying information to other readers.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 5: Draft first, edit later
&lt;/h2&gt;

&lt;p&gt;Don’t worry about editing your outline or even the first draft. This includes fixing spelling and grammatical errors as well as changing sentence structure. &lt;/p&gt;

&lt;p&gt;You should focus on drafting the post based on your outline first and leave the editing to the second phase of your writing. This separation of concern reduces the unnecessary time spent during the writing process.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 6: Pictures speak a thousand words
&lt;/h2&gt;

&lt;p&gt;Include pictures in your blog post that are relevant to what you are trying to say. This is a common technique used in Medium and Dev.to articles. The key though is to find a balance between using pictures to elucidate and removing additional distractions for your reader.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tip 7: Practice writing more
&lt;/h2&gt;

&lt;p&gt;The nice thing about blogging is that it does not have any prerequisites apart from reading and writing ability. One way to become a better writer is by reading more. However, at the end of the day, you need to hone your writing skill by practising it more often.&lt;/p&gt;

&lt;h2&gt;
  
  
  Additional References:
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.ship30for30.com/" rel="noopener noreferrer"&gt;Ship 30 for 30&lt;/a&gt;: They have a lot of practical and actionable advice to get started. Apart enrolling in their cohort, you can also subscribe to their 10-day email course as well as their Mastery Monday, Roundup Wednesday and Fast-Track Friday email newsletters.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.neelnanda.io/" rel="noopener noreferrer"&gt;Neel&lt;/a&gt;: He started blogging more regularly as a part of month long challenge. Maybe this will inspire to start such a challenge yourself.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://nik.art/" rel="noopener noreferrer"&gt;Nikolas Goeke&lt;/a&gt;: He has been writing for a long time. He provides insights on writing and other things he finds useful. He also runs a course called Write Like a Pro for getting others started with writing.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

</description>
      <category>writing</category>
    </item>
    <item>
      <title>Is college essential for success?</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 08 Aug 2021 07:47:53 +0000</pubDate>
      <link>https://dev.to/aaditkamat/is-college-essential-for-success-438l</link>
      <guid>https://dev.to/aaditkamat/is-college-essential-for-success-438l</guid>
      <description>&lt;p&gt;The learning experience in college experience is very different from the learning experience in schools. You have more flexibility to choose the courses related to your major as long as you meet the degree requirements. &lt;/p&gt;

&lt;h2&gt;
  
  
  Learning "hard" and "soft" skills
&lt;/h2&gt;

&lt;p&gt;College is a fantastic place to not only learn hard skills related to your discipline, but also develop soft skills like communication, time management, team work and critical thinking ability that are critical for success not only within college but also later on in life.&lt;/p&gt;

&lt;h2&gt;
  
  
  Pursuing research
&lt;/h2&gt;

&lt;p&gt;Colleges offer many avenues for students to discover their interests and follow career paths that align with those interests. One of the primary activities that colleges are renowned for is research. That is why, one of the major factors that decide the ranking of a college is research output. If your goal is to pursue a career in the academia, then college is the best path to achieve that goal. As a college student, you are able to get access to the resources you need for your research such as journals, research papers and books much more easily. It is also much easier to attain a research assistant position while you are in college than if you were to look for such positions in the industry.&lt;/p&gt;

&lt;h2&gt;
  
  
  Becoming an entrepreneur
&lt;/h2&gt;

&lt;p&gt;You can also pursue entrepreneurship when you are in college. One of the ways to do so is to take up a minor in entrepreneurship. If that does not fit your schedule, you may want to take some elective entrepreneurship classes instead. The best way to get into entrepreneurship, however, is to work on your own project and secure funding to turn your idea into a startup. Thanks to incubators and startup accelerators supported by many of the universities, students can also get access to a network of professionals who have been involved in their own startup journeys. They can give the right kind of advice or the motivation for the students to become entrepreneurs.&lt;/p&gt;

&lt;h2&gt;
  
  
  Is college for everyone?
&lt;/h2&gt;

&lt;p&gt;At the same time, there is some merit to the idea that college is not an absolute prerequisite for career success. There are fields where there are ample opportunities to self learn and you can in fact thrive better if you are an auto-didactic learner. For example, to pursue a career in programming, you don't really need to get a degree in Computing and IT related fields. However, getting a degree becomes necessary to virtue signal to employers that you have the required skills to do well in the job.&lt;/p&gt;

&lt;p&gt;Even then, going to the college is still not a waste of your time and resources. You never know when the knowledge you gain through your courses proves to be useful in your career. This is the view shared by Naval, the co founder of AngelList who is also recognized as a thought leader, in a podcast episode that I've personally come to agree with: if you don't have a good idea about what you wish to do later in life, then college is your best bet. However, if you have more surety, you may want to look into alternate options that align better with your personal goals.&lt;/p&gt;

</description>
      <category>college</category>
      <category>research</category>
      <category>entrepreneurship</category>
    </item>
    <item>
      <title>Advice to my younger self in college</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sat, 17 Jul 2021 02:36:03 +0000</pubDate>
      <link>https://dev.to/aaditkamat/advice-to-my-younger-self-in-college-2klp</link>
      <guid>https://dev.to/aaditkamat/advice-to-my-younger-self-in-college-2klp</guid>
      <description>&lt;p&gt;There comes a time after a student graduates where he reflects back upon his journey through the undergraduate days, usually right after his graduation. These are the four things that I wish I had known as an undergraduate student back in college.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Focus on personal development
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj4ufahix7ljf2b2gipqf.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fj4ufahix7ljf2b2gipqf.jpg" alt="Invest in yourself" width="800" height="347"&gt;&lt;/a&gt;&lt;br&gt;
First, I wish I hadn't gotten into the rat race to achieve stellar grades or bag prestigious internships at the top companies, just out of peer pressure. As the definition of success varies from individual to individual, it does not make too much sense to focus exclusively on these goals. I'd instead advise students to spend the extra time they get from attending classes to carry out personal development activities, especially those that they'd likely not get the time to work on once they start a full-time job.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Think long term
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fx4up2blydqmii2qg4pjs.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fx4up2blydqmii2qg4pjs.jpg" alt="Avoid short term thinking and embrace long term thinking" width="800" height="451"&gt;&lt;/a&gt;&lt;br&gt;
It is important to develop hobbies outside of work that you can derive a sense of purpose from or find enjoyment in, so that you can keep yourself buoyed up when the going gets tough in your full-time job.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Connect with your professors
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwm86ph50gzhvirjydosi.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwm86ph50gzhvirjydosi.jpg" alt="Maintain a good relationship with your professors" width="640" height="420"&gt;&lt;/a&gt;&lt;br&gt;
Third, form meaningful relationships with your professors by connecting with them after classes. This will help you in the long run, as the professor is likely to refer you to opportunities that will benefit you from a career perspective or within the college to develop skills.&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Take all advice with a pinch of salt
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhzdfn5x5fhasxigglv2l.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhzdfn5x5fhasxigglv2l.jpg" alt="Take all advice with a pinch of salt" width="760" height="757"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Last, but not the least, all advice given to others is from that individual's perspective. People will always have some regrets when they reflect back upon their college days. So take this advice with a pinch of salt and enjoy the college journey while you can!&lt;/p&gt;

</description>
      <category>college</category>
      <category>advice</category>
      <category>personaldevelopment</category>
    </item>
    <item>
      <title>My journey to becoming a developer</title>
      <dc:creator>Aadit Kamat</dc:creator>
      <pubDate>Sun, 04 Jul 2021 07:48:10 +0000</pubDate>
      <link>https://dev.to/aaditkamat/my-journey-to-becoming-a-developer-3gfc</link>
      <guid>https://dev.to/aaditkamat/my-journey-to-becoming-a-developer-3gfc</guid>
      <description>&lt;p&gt;I first started coding in 11th Standard when I took up a course on Computer Science, at the age of 16. I had learnt about HTML, CSS and a bit of JavaScript back when I was in 9th and 10th, but I hadn’t used it to create a website beyond the project that was assigned in the classroom, so that knowledge was rusty. Reflecting back on the experience in high school, I realise that I was more keen on learning other STEM subjects like Physics and Maths, so I didn’t spend much time learning about CS concepts beyond the classroom or researching about software in general. I’d also like to think that I had to spend a lot of time catching up with concepts taught at high school as it was a big jump from 10th to 11th.&lt;/p&gt;

&lt;p&gt;After giving my board exams in 12th, I was required to enlist in SCDF on May 2015 as part of my National Service (NS) obligations. I had secured 96% in my board exams, which was good enough to secure an admission at the National University of Singapore (NUS). I had initially applied for a Bachelor of Engineering degree program in Electrical Engineering as I wanted to continue learning physics at a higher level and apply concepts I had learnt in Electrodynamics and Mechanics classes back at high school to solve real Engineering problems. Admittedly, my greatest source of inspiration was my dad, who had studied the same subject in college for his Bachelor’s and Master’s. However I had a change of mind after my discussion with my dad when I had passed out of recruit phase and was well settled into my new role as an Admin assistant at the National Service Training Institute (NSTI). Given my stellar results in the Computer Science subject and the rising demand for Computing professionals, my dad encouraged me to think of pursuing Computer Science at the NUS School of Computing. The admission criteria for getting into the School of Computing was more stringent as compared to the one to get into the Faculty of Engineering, but he said that it was worth a shot if I was truly interested. As I reconsidered my decision to apply to the Electrical Engineering course, I realised that I wasn’t sure if I really wanted to go into Engineering of my own accord or because my other peers were applying for Engineering courses as well. I didn’t know how Computer Science would turn out, but I decided to try something new and take the gamble of switching the course. To my fortune, I was accepted into the Computer Science course. &lt;/p&gt;

&lt;p&gt;One of my regrets during my time in NS is that I did not try learning Computer Science concepts or practicing programming on my own over the weekends or after work. I assumed that I would learn more in depth in college anyways, so I didn’t need to spend the time doing that before college. I’d like to clarify here that one can learn programming in college and still succeed in the Computer Science course. However, I would have had a better time during the CS1010X (Programming Methodology) course that I had taken as I was completing my NS, had I spent more time refreshing the concepts I had learnt back in high school. &lt;/p&gt;

&lt;p&gt;Even though CS1010X was an introductory course, it was much more rigorous as compared to my high school course. The Professor who administered the course swore by the “sink or swim” methodology used to teach such courses there. Of course, we were not left completely stranded and the Teaching Assistants as well as Prof himself were quite helpful when we ran into any issues. However, Prof made it amply clear that they weren’t running an “Apple Genius Bar” service to guide us through each small technical issue and we were expected to research solutions to our problems as far as we could. This would turn out to be quite useful later on, during the course and after I had completed it, as every developer has to go through the journey of interpreting stack traces as they debug their programs, often on platforms like Stack Overflow. It takes a lot of time to get proficient at the art of debugging and it also depends on your experience with the particular programming language and project in question, but it helps you learn and ramp up quickly. This is something that I think most beginners might miss out in the beginning if they continue to follow along with tutorials or watch them passively without working on programming exercises and projects that employ these skills.&lt;/p&gt;

&lt;p&gt;I haven’t yet mastered coding and I do spend a lot of time trying to figure out why I am running into a particular issue even now after I have completed my undergraduate Computer Science course, but I think that all of this is a part of a learning process that never truly ends. I started writing this post as I was reading through &lt;a href="https://welearncode.com/25-tips-new-devs/" rel="noopener noreferrer"&gt;Ali Spittel’s tips to beginners&lt;/a&gt;, as a way of reminding myself about how I started and what I can learn from my own journey that I can now apply to my work as a QA Engineer. &lt;/p&gt;

</description>
      <category>cbse</category>
      <category>computerscience</category>
      <category>programming</category>
    </item>
  </channel>
</rss>
