<?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: Vukani Gcabashe</title>
    <description>The latest articles on DEV Community by Vukani Gcabashe (@nash4253).</description>
    <link>https://dev.to/nash4253</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%2F810913%2F807e9bab-9322-4d81-b8cd-2c56948edb63.jpg</url>
      <title>DEV Community: Vukani Gcabashe</title>
      <link>https://dev.to/nash4253</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/nash4253"/>
    <language>en</language>
    <item>
      <title>How to growing your confidence as junior dev</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Wed, 23 Nov 2022 20:33:51 +0000</pubDate>
      <link>https://dev.to/nash4253/growing-your-confidence-as-junior-dev-m0i</link>
      <guid>https://dev.to/nash4253/growing-your-confidence-as-junior-dev-m0i</guid>
      <description>&lt;p&gt;Clearly confidence does influence how people react around you, your 'internal positioning' sets the tone for how we behave around you, from my experience if you are not enjoying these benefits as a person at work or home, then you are sleeping on your confidence and we can work on changing that:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Your peers and managers trust you more, and that's one thing we all value.&lt;/li&gt;
&lt;li&gt;You don't get bullied.&lt;/li&gt;
&lt;li&gt;You become more approachable.&lt;/li&gt;
&lt;li&gt;Everybody enjoys working with you.&lt;/li&gt;
&lt;/ol&gt;




&lt;p&gt;Those are all foundation for having a good time at work or anywhere else in your life, lets look at how to make that a possibility.&lt;/p&gt;

&lt;h3&gt;
  
  
  Learn to communicate:
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;How you communicate really reflects your confidence and how true your own words are to you. Basically you need to stand up for yourself, read between the lines or even share some important info - the point is com's are key and you need to master them.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;As always, I recommend books that discuss communication skills, the mission isn't to learn how to talk but how to communicate correctly.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Listening is a powerful skill, learn to listen with the intent to understand the person concerns, when working with another understand their intention, the process they have in mind and the priority of the gig, avoid leaving good questions unanswered. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Hearing alone is sometimes not enough to create understanding for us juniors, learn to voice out confusion clearly and early. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Learn to give first before asking, share good news, be positive, bring solutions &amp;amp; avoid bringing bad news or problems with no solution. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Avoid arguments by all means and if there is one yield and show your point through actions not words, and please you don't need to be cocky about it. &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Love yourself:
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;For most of us we feel less in touch with our confidence because we aren't giving ourselves enough attention, time and love. &lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Practice self grooming and appreciation, we all learn from you how to treat you and handle ourselves around you. &lt;strong&gt;Set a good example in that regard my friend.&lt;/strong&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Stop playing the victims in your life, love your life and your people, accept what you have &amp;amp; adopt the &lt;strong&gt;gratitude mindset&lt;/strong&gt; believe me that will thank me later.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Learn to take criticism gracefully because it could be constructive, don't let your big ego stop you from seeing that &lt;em&gt;the truth has a way of shaking us awake sometimes&lt;/em&gt;. Think about what people say before becoming defensive.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Never exploit or sabotage yourself to please those around you&lt;/strong&gt;, this indirectly causes resentment and also lowers your value and the value of your mentors.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;read my blog posts, these will always be here to help you around and show you the way..&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Learn to say no&lt;/strong&gt;, when an offer is good but does not align with your goals &amp;amp; vision give it a pass or suggest someone who could benefit from it, this doesn't only grow your confidence but makes your peers respect you more for saving your time while helping others.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Take care of your body, go to the gym or play some physical sports. A healthy and active body does influence your emotions &amp;amp; reduces stress. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;I don't say this enough &lt;strong&gt;"STOP THAT NEGATIVE SELF TALK"&lt;/strong&gt;, I dont wana hear it, and nobody else does including you. It's that simple.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Develop Consistency:
&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhrylp25pl4u97x3cnhwo.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%2Fhrylp25pl4u97x3cnhwo.jpg" alt="image of results from consistancy" width="800" height="578"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;This is one thing that people look at you differently, it allows them to have respect for you based on, you ability to produce a certain standard of life &amp;amp; work. Psychology studies have proven over the years that &lt;strong&gt;30%&lt;/strong&gt; of above average people are in that state because of consistency not talent.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Consistency helps you ease the load and also accomplish more since the other things have become subconscious. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Learn to have regular self introspection daily / weekly, make it a habit to see your flaws &amp;amp; finding ways to fix them.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Spend time with people who are honest to you and have your best interest, these people will help you grow much quicker n boost how you feel.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Watch your mouth, and watch your actions even more. what you do is so so much more impactful to your than what you say.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Have an internal compass:
&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Feisilq6we48bkh2p1hiy.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%2Feisilq6we48bkh2p1hiy.jpg" alt="Image showing compass" width="640" height="419"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;A sad reality about some of us is that we fail to have our core beliefs, values and mission clearly expressed in our lives. Lets discuss how these affect your confidence.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;One of the things that interferes with our confidence is that we believe in something but spend over 60% of our time doing the total opposite. &lt;strong&gt;Stop it!!&lt;/strong&gt;, put your focus &amp;amp; time in what you truly believe in. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Avoid things that make you doubt yourself, confidence is a muscle you will improve only by being intuitive not doubtful.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Never neglect consistent self-introspection&lt;/strong&gt;, you will have a clear idea of where you are in your growth cycle and also what steps you should take to get closer to your dreams. Even though indirect - this hugely helps us feel secure within our skin and helps us keep moving.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;center&gt;

### **How did you grow your confidence as a junior developer ??**

&lt;/center&gt;

&lt;center&gt;

#### **Leave a comment bellow, i am dying to know!!**

&lt;/center&gt;

</description>
      <category>beginners</category>
      <category>programming</category>
      <category>productivity</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>new image</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Thu, 29 Sep 2022 12:47:54 +0000</pubDate>
      <link>https://dev.to/nash4253/new-image-1iim</link>
      <guid>https://dev.to/nash4253/new-image-1iim</guid>
      <description>&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%2F3qe91jct29mwveveydbz.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%2F3qe91jct29mwveveydbz.jpg" alt="Image description" width="675" height="506"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fupl29xtzbmm69uuqqd04.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%2Fupl29xtzbmm69uuqqd04.png" alt="Image description" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5bbxk7fi2eb6emrk1wqr.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%2F5bbxk7fi2eb6emrk1wqr.jpg" alt="Image description" width="564" height="1003"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fg52ztvy9wbui65poofha.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%2Fg52ztvy9wbui65poofha.jpg" alt="Image description" width="353" height="353"&gt;&lt;/a&gt;&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%2F0wz1dlovqd1ypfnd1vlq.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%2F0wz1dlovqd1ypfnd1vlq.jpg" alt="Image description" width="800" height="450"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fetz9whxytdwpyupbul3k.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%2Fetz9whxytdwpyupbul3k.png" alt="Image description" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa17znqbo935op1np4avc.jpeg" 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%2Fa17znqbo935op1np4avc.jpeg" alt="holder for cordialebeautylounge" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F65y1etmaqqxry0jf8vbk.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%2F65y1etmaqqxry0jf8vbk.jpg" alt="reactjs blog" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa9mi84xpp6i6q4yn28go.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%2Fa9mi84xpp6i6q4yn28go.png" alt="right align projects" width="800" height="442"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0op3jew8hcxrk4on4suw.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%2F0op3jew8hcxrk4on4suw.jpg" alt="space x project" width="800" height="450"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fowpo3kq4gdb1nn5mmear.jpeg" 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%2Fowpo3kq4gdb1nn5mmear.jpeg" alt="Image description" width="342" height="458"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F72mzqmqg2fyetp98p17z.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%2F72mzqmqg2fyetp98p17z.jpg" alt="Image description" width="359" height="333"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqtkqyg4tpallwsja44pc.jpeg" 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%2Fqtkqyg4tpallwsja44pc.jpeg" alt="Image description" width="418" height="156"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvw9374vhaw1u22sn4e09.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%2Fvw9374vhaw1u22sn4e09.jpg" alt="Image description" width="150" height="150"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkrn5s1e3dynj03pzh0yn.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%2Fkrn5s1e3dynj03pzh0yn.png" alt="Image description" width="50" height="50"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fk95wcrasba8qswmwlfmb.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%2Fk95wcrasba8qswmwlfmb.png" alt="Image description" width="46" height="30"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8lespcfwaes4n6xv19t6.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%2F8lespcfwaes4n6xv19t6.jpg" alt="Image description" width="640" height="830"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqgityz5do1f6ww3aewud.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%2Fqgityz5do1f6ww3aewud.png" alt="exposure" width="65" height="65"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpzr3dprepwhs53mo69xh.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%2Fpzr3dprepwhs53mo69xh.png" alt="Image description" width="300" height="168"&gt;&lt;/a&gt;&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%2Fhyvwj6x8dsxnnyxlo3hs.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%2Fhyvwj6x8dsxnnyxlo3hs.jpg" alt="well being" width="800" height="600"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs2178ypiiy81ygzk14tc.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%2Fs2178ypiiy81ygzk14tc.jpg" alt="strategy" width="800" height="545"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F3u2cynx3cl5a2oy5t0b0.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%2F3u2cynx3cl5a2oy5t0b0.png" alt="exposed" width="426" height="289"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffvi9mdzqes4nt18ycfes.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%2Ffvi9mdzqes4nt18ycfes.png" alt="emotions" width="360" height="233"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fg4vi81q9enc2rcjepqg0.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%2Fg4vi81q9enc2rcjepqg0.png" alt="stocks" width="193" height="135"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzh8q56r9bsiy91fk2yxq.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%2Fzh8q56r9bsiy91fk2yxq.png" alt="Image description" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F68l8vuku9cczxh2ovte7.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%2F68l8vuku9cczxh2ovte7.png" alt="Image description" width="800" height="800"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fvnn1coofawt3ogftkig4.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%2Fvnn1coofawt3ogftkig4.png" alt="Image description" width="40" height="40"&gt;&lt;/a&gt;&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%2Fzif8g24bd7uo9ocle6dd.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%2Fzif8g24bd7uo9ocle6dd.jpg" alt="Image description" width="800" height="600"&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8diid58d1so5v3magdp8.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%2F8diid58d1so5v3magdp8.jpg" alt="Image description" width="800" height="800"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Javascript in's &amp; outs 1</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Mon, 18 Jul 2022 07:22:45 +0000</pubDate>
      <link>https://dev.to/nash4253/javascript-ins-outs-1-2h43</link>
      <guid>https://dev.to/nash4253/javascript-ins-outs-1-2h43</guid>
      <description>&lt;p&gt;Based on the books i have read through - I made this summary.&lt;/p&gt;

&lt;h1&gt;
  
  
  My Javascript Cheatsheet:
&lt;/h1&gt;

&lt;h2&gt;
  
  
  Javascript Strings
&lt;/h2&gt;

&lt;h2&gt;
  
  
  Access:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Accessing characters &lt;code&gt;.chartAt()&lt;/code&gt;, &lt;code&gt;'dog'.chartAt(1)&lt;/code&gt; returns 0.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;.chartAt(index);&lt;/code&gt; takes an index which starts at 0 and returns the character at that index.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;.chartAt(start, finish)&lt;/code&gt; will returns character at start to finish position.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Search:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;.indexOf(searchValue[fromIndex])&lt;/code&gt; will help you search for for sub string within a string.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;this function takes string to be searched and optional parameter for the starting index for the search &amp;amp; -1 if nothing is found. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;the function &lt;code&gt;.startsWith(?)&lt;/code&gt; will help you find out what the string starts with.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;the function &lt;code&gt;.endsWith(?)&lt;/code&gt; will returns true if the string ends with the parameter string.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;to replace a string we use the function ' .replace('str1','str2')'&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;To check the occurance of a search string simply check if -1 was returned  from &lt;code&gt;.indexOf(?)&lt;/code&gt;.&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;hey there Batch&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;count&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;pos&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;indexOf&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;a&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;pos&lt;/span&gt; &lt;span class="o"&gt;!=&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="nx"&gt;count&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="nx"&gt;pos&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;indexOf&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;a&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;pos&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Regular Expressions:
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Basic Regex:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;^&lt;/code&gt; start of a string&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;\d:&lt;/code&gt; finds any digit&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;[abc]&lt;/code&gt; finds an character between the brackets&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;[^abc]&lt;/code&gt; finds character not in the bracket&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;[0 - 9]&lt;/code&gt; finds digit between the bracket&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;[^0 - 9]&lt;/code&gt; finds digit not between the bracket&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;(x|y)&lt;/code&gt; finds any of the alternatives specified&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  RegExp functions:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;search(?)&lt;/code&gt; test for matches in a string and returns the index of the match.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;match(?)&lt;/code&gt; test for matches in a string and returns all the matches.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;exec(?)&lt;/code&gt; returns the first match.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;test(?)&lt;/code&gt; returns true of false.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;hey there Batch&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;cn&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;search&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="sr"&gt;/here/&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;cn&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



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

&lt;h2&gt;
  
  
  Base64 Encoding:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;The &lt;code&gt;btoa(?)&lt;/code&gt; function creates a base64 encoded ASCII string from the string. &lt;/li&gt;
&lt;li&gt;The &lt;code&gt;atob(?)&lt;/code&gt; function will decode the base64 encoded string.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  String Shortening:
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var Dictionary = "sjhlksafhjksdhfjkdsflsdjlifhisdoncmx.nvmcx,grdj".split("");
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;encoded&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;base&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;DICTIONARY&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;encoded&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;""&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

        &lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;==&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
            &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;DICTIONARY&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="k"&gt;else&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;
            &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
                &lt;span class="nx"&gt;encoded&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="nx"&gt;DICTIONARY&lt;/span&gt;&lt;span class="p"&gt;[(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;%&lt;/span&gt; &lt;span class="nx"&gt;base&lt;/span&gt;&lt;span class="p"&gt;)];&lt;/span&gt;
                &lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;Math&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;floor&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;/&lt;/span&gt;&lt;span class="nx"&gt;base&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
            &lt;span class="p"&gt;}&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nf"&gt;reverseWord&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;encoded&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;reverseWord&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;reversed&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;""&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;--&lt;/span&gt; &lt;span class="p"&gt;){&lt;/span&gt;
            &lt;span class="nx"&gt;reversed&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt;&lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;charAt&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;reversed&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;decodeId&lt;/span&gt;&lt;span class="p"&gt;(){&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;base&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;DICTIONARY&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;decoded&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
        &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;index&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;index&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;split&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;''&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;index&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt; &lt;span class="p"&gt;){&lt;/span&gt;
            &lt;span class="nx"&gt;decoded&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;decoded&lt;/span&gt;&lt;span class="o"&gt;*&lt;/span&gt;&lt;span class="nx"&gt;base&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;DICTIONARY&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
            &lt;span class="nf"&gt;indexOf&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;id&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;chartAt&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;index&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;

        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;decoded&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Javascript Arrays:
&lt;/h2&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;var arr = [1, 2, 3 . 4]&lt;/code&gt;.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;To access array elements we use its index &lt;code&gt;arr[?]&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;To insert an array element &lt;code&gt;arr.push(?)&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;To remove an element at the end &lt;code&gt;arr.pop(?)&lt;/code&gt; another option to remove is &lt;code&gt;arr.shift(?)&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Iteration:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;this method of iteration will call indices individually, and you will access the data inside it.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;

    &lt;span class="k"&gt;for&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;index&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;index&lt;/span&gt;&lt;span class="p"&gt;]);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;this method will allow you to access and use the objects of the array individually each time you get one, you can do your checks this way.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;

    &lt;span class="k"&gt;for&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;element&lt;/span&gt; &lt;span class="k"&gt;of&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;element&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  forEach():
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;this method is better than the other iteration methods because it can break out of the iteration or skip certain elements of the array.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;

    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;forEach&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;el&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="k"&gt;in&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;el&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



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

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;.slice(begin,end)&lt;/code&gt; will return us a portion of a given array taking the begining and end index of what you selecting.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;slice&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// returns [2] &lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;slice&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// returns [3, 4]&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;.from()&lt;/code&gt; function will help us to create a new array from an existing one.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr2&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;Array&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;from&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;.splice()&lt;/code&gt; takes three params: begining &amp;amp; end index with number of things in the middle.After aplying the method the added other items will change the array.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;splice&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt; &lt;span class="c1"&gt;// returns [] &lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;splice&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// returns [2, 3], modifying arr = [1,4]&lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;splice&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;6&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;&lt;span class="mi"&gt;7&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// returns [2, 3], arr = [1, 5, 6, 7, 4] &lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;.concat(?)&lt;/code&gt; will be used to add another array into an existing one. The method will return a modified array but stull the original one remains untouched.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;concat&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;]);&lt;/span&gt; &lt;span class="c1"&gt;// returns [1, 2, 3, 4, 5, 1, 2] and arr still remains the same&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Spread Operator:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;this operator will allow use to access all elements individually.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;

    &lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;printNumz&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;a&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;c&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;d&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;c&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;d&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nf"&gt;printNumz&lt;/span&gt;&lt;span class="p"&gt;(...&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Array functional methods:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;The &lt;code&gt;.filter()&lt;/code&gt; method is used for filtering elements or checking a condition like the following example:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
    &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;filter&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nf"&gt;function &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;item&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;item&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt; &lt;span class="c1"&gt;// returns [3,4,5] &lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;&lt;p&gt;This method can allow you to perform other operations to the elements as you reach them in the erray.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We also have the &lt;code&gt;.reduce()&lt;/code&gt; function that will combine all the elements in the erray into one value, using the passed function.&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;sum&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nf"&gt;reduce&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;function&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;prevVal&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;currVal&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;index&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;array&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;prevVal&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;currVal&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;});&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Cookies:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;to check if cookies are enabled we use the pattern with corresponding code to set the cookie, note that it might not work for older browsers.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;navigation&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;cookieEnabled&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="nx"&gt;False&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="c1"&gt;// Do something...&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_NAME&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Example cookie&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// naming the cookie.&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_VALUE&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Something &lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// the value of the cookie.&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_PATH&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;/foo/bar&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// GIVE THE COOKIE A PATH.&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_EXPIRES&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

    &lt;span class="nx"&gt;COOKIE_EXPIRES&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nb"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="k"&gt;new&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;6000&lt;/span&gt; &lt;span class="p"&gt;)).&lt;/span&gt; &lt;span class="nf"&gt;toUTCString&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;

    &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;cookie&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_NAME&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_VALUE&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;; expires=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_EXPIRES&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;; path=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;COOKIE_PATH&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Reading the cookie:
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;=&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;cookie_array&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;document&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;split&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;;&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="nx"&gt;cookie_value&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nx"&gt;cookie_array&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="o"&gt;++&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;cookie&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;cookie_array&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;i&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
        &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;charAt&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;==&lt;/span&gt; &lt;span class="dl"&gt;''&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
            &lt;span class="nx"&gt;cookie&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;substring&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
        &lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;indexOf&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;==&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
            &lt;span class="nx"&gt;cookie_value&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;substring&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;cookie&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
        &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; 

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;LocalStorage, sessionStorage are like js objects, so we can use them like they are:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;   &lt;span class="nx"&gt;localStorage&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;greet&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;hey there&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// window.localStorage.setItem('')&lt;/span&gt;

   &lt;span class="nx"&gt;localStorage&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;greet&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// window.localStorage.getItem('')&lt;/span&gt;

   &lt;span class="k"&gt;delete&lt;/span&gt; &lt;span class="nx"&gt;localStorage&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;greet&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="c1"&gt;// Same as: window.localStorage.removeItem('')&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;sessionStorage uses the same storage as the localStorage but it will only be avaliable per session or for that window.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Web Workers:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;a web worker is a way to run scripts  in background threads &lt;code&gt;var webworker = new Worker("./path/to/webworker.js");&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;you can also inject a script as a worker in a string the string is used in &lt;code&gt;URL.createObjectURL()&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;workerData&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;function someFunction() {}; console.log('More code');&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;blobURL&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;URL&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;createObjectURL&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Blob&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;workerData&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;)&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;type&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;text/javascript&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}));&lt;/span&gt;
    &lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;webworker&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Worker&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;blobURL&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;&lt;p&gt;service worker is a event-driven worker bound to the original site, it can control the site, and use its resources.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;ITS A PROGRAMMABLE NETWORK PROXY,&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;IT WILL BE TERMINATED WHEN NOT IN USE.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;IT HAS A LIFE CYCLE UNBOUND TO THE WEB PAGE.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;IT NEEDS HTTPS.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>programming</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Things I wish I knew before being an junior Dev: Communication</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Sat, 18 Jun 2022 20:36:24 +0000</pubDate>
      <link>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-communication-5c4n</link>
      <guid>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-communication-5c4n</guid>
      <description>&lt;h1&gt;
  
  
  Hi,
&lt;/h1&gt;

&lt;h2&gt;
  
  
  Those two letters can be a start or end of a bad day. How? because most people think greeting is the only thing they should know concerning the &lt;em&gt;"communication"&lt;/em&gt; subject in their life.
&lt;/h2&gt;

&lt;h2&gt;
  
  
  Communication is not speaking / talking, and what someone said isn't enough for you to totally understand the depth of what they meant, so I want us to explore possible how we can research communication and why it can be our advantage.
&lt;/h2&gt;

&lt;h2&gt;
  
  
  I wont even attempt to describe what &lt;a href="https://www.skillsyouneed.com/ips/what-is-communication.html" rel="noopener noreferrer"&gt;communication&lt;/a&gt; is but its clear that we need to do this right &lt;em&gt;no matter who you are&lt;/em&gt; to actually understand people, get along with people, and in most cases for you to get things done and being a developer is no exception. 
&lt;/h2&gt;




&lt;h2&gt;
  
  
  Benefits of Good communication skills:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;### Personally&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Faju3yj2lbbti9spxic86.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%2Faju3yj2lbbti9spxic86.jpg" alt="Image description" width="640" height="360"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;People will respect &amp;amp; trust your more.&lt;/li&gt;
&lt;li&gt;People can share your perspective without fighting to understand you.&lt;/li&gt;
&lt;li&gt;You can get what you want without &lt;strong&gt;arguments&lt;/strong&gt;, &lt;strong&gt;rejection&lt;/strong&gt; and &lt;strong&gt;resentment&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;You will grow better and have much greater access to things.&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;You will have solid and healthy relationships.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;### Professionally&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fmrlzgac7prfvpgb1j3e4.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%2Fmrlzgac7prfvpgb1j3e4.jpg" alt="professional setting" width="640" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You will have a larger network and that means potentially more resources.&lt;/li&gt;
&lt;li&gt;You can work with a team or even lead one successfully.&lt;/li&gt;
&lt;li&gt;You will produce better work and quicker.&lt;/li&gt;
&lt;li&gt;You will be able to learn / teach faster.&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  How to grow communicate skills:
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Maintain a Growth Mindset:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Only a person who is ready to grow themselves will see the need and the way to grow their skills to communicate, and so we start there.&lt;/li&gt;
&lt;li&gt;Realize that being a good communicator means you can get and maintain a healthy circle of people in your network and even get things done with or through them.&lt;/li&gt;
&lt;li&gt;Having a growth mindset will allow you to be able to speak the same language with successful/progressive people, and that's good for your reputation.&lt;/li&gt;
&lt;li&gt;This mindset alone will allow you to understand other people's intension and if they are worth focusing on or not. &lt;/li&gt;
&lt;li&gt;This mindset and many other created from it will create room for growing in many ways including your communication.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F37f1n0ysnw326r7guuj5.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%2F37f1n0ysnw326r7guuj5.jpg" alt="coomunication @&amp;lt;br&amp;gt;
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6z4bjd8uamlrdmno9uzk.jpg)vukani.hashnode.dev" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Researching:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Reading books personal growth books,  for me growing my communication skills started with reading the book &lt;em&gt;&lt;a href="http://vukanig.hasnode.dev/communication1" rel="noopener noreferrer"&gt;How to make friends by influencing people&lt;/a&gt;&lt;/em&gt; and it change my perspective on people and that's the first time I changed the way I handle people and conversations.&lt;/li&gt;
&lt;li&gt;Speak with good communicators speaking with good &lt;a href="https://dev.to/nash4253/404-3g35"&gt;communicators&lt;/a&gt;, studying how they communicate and paying attention to why they do certain things does allow you to be a better person and better communicator yourself, because they will put effort to better you and also for you to keep up you have to grow your &lt;em&gt;communication game&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;Listening to podcasts and also interviews about topics you like or of people you like will help you pick up the correct/professional way to interact with others that creates a respectable, lovable and charismatic image of who you are.&lt;/li&gt;
&lt;li&gt;With the people you keep around you, listen to their recommendation of how to communicate better.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;




&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0se6kmvvzc1n230r8zh8.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%2F0se6kmvvzc1n230r8zh8.jpg" alt="listen more image" width="640" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Learn To Listen:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;This one is special because Listening is a skill that we all need to learn and relearn over and over again, but learn to listen.&lt;/li&gt;
&lt;li&gt;Firstly focus on &lt;strong&gt;listening to yourself, your feelings, your words, your ideas&lt;/strong&gt;. Practicing to listen to yourself will really open up the range and quality of the things you communicate to other people.&lt;/li&gt;
&lt;li&gt;Listening being one thing that's resurfacing in the book &lt;em&gt;&lt;a href="http://vukanig.hasnode.dev/communication1" rel="noopener noreferrer"&gt;How to make friends by influencing people&lt;/a&gt;&lt;/em&gt; shows how important it is to communication and also for your own personal health.&lt;/li&gt;
&lt;li&gt;75% of unsuccessful interactions happen because of mis-communications and &lt;strong&gt;being a good listener&lt;/strong&gt; means you will understand people and situations better and have a greater success rate of communication.&lt;/li&gt;
&lt;li&gt;Make habits that bring &lt;strong&gt;clarity&lt;/strong&gt; and &lt;strong&gt;stillness&lt;/strong&gt; in the mind, and trust me this will help you listen better, again &lt;em&gt;&lt;code&gt;you cannot hear anything new if the old things in your mind are too noisy&lt;/code&gt;&lt;/em&gt;.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;




&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnweyumekr9915n8h8noj.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%2Fnweyumekr9915n8h8noj.jpg" alt="have acceptance image" width="640" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Be Realistic:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;One thing that makes certain people approachable is they quality of being down to earth and being &lt;strong&gt;realistic&lt;/strong&gt;. &lt;/li&gt;
&lt;li&gt;I find it to be very attractive to be a person who is open to the truth and willing to handle life as a whole &lt;em&gt;as it is&lt;/em&gt; without needing to modify it or or people in it. &lt;/li&gt;
&lt;li&gt;In a way being a realistic person will allow you to deal with situations not people and also handle situations according to what's happening in that moment, in that room, which is one thing that is important to shape how you communicate.&lt;/li&gt;
&lt;li&gt;Most of us interact with others with an agender for either them to do something you want, and being realistic, &lt;strong&gt;being present&lt;/strong&gt; in that context of the interaction and actually proposing something that's realistic.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;




&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Have Presence:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Having presence means being there, being a person who has &lt;strong&gt;integrity&lt;/strong&gt;, &lt;strong&gt;confidence&lt;/strong&gt; and &lt;strong&gt;clarity&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;It also means actually &lt;strong&gt;reading the situations&lt;/strong&gt; you are in before going into them head-first.&lt;/li&gt;
&lt;li&gt;In a way growing your communication needs these things and will actually make you have even more after you up your &lt;em&gt;communication game&lt;/em&gt;
&lt;/li&gt;
&lt;li&gt;Invest in things that will grow your confidence and integrity, and this will allow you to communicate better.&lt;/li&gt;
&lt;li&gt;Invest in having a clean and respectable track record, this does boost how you feel and how relevant you are and this without a doubt will boost confidence and communication.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&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%2Fcmme7dnw2j8fjyvunabn.jpeg" alt="@https://https://www.instagram.com/nqubekogcabashe/instagram/nqubekogcabashe presence" width="768" height="1024"&gt;
&lt;/h2&gt;

&lt;h2&gt;
  
  
  Roots of communication blockages:
&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%2F54rqxtsigkcv0nlfald6.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%2F54rqxtsigkcv0nlfald6.jpg" alt="Image description" width="640" height="594"&gt;&lt;/a&gt;&lt;br&gt;
I realized that I personally have things that block my ability to communicate better and these I realized can hold back other people if there is no self introspection done. So lets explore these points.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Selfishness:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Its easy to judge a fail in communication to being the other person being the problem, but its important to accept that both people can be blamed and that both can be said to be selfish and being one sided.&lt;/li&gt;
&lt;li&gt;This is why the book &lt;em&gt;&lt;a href="http://vukanig.hasnode.dev/communication1" rel="noopener noreferrer"&gt;How to make friends by influencing people&lt;/a&gt;&lt;/em&gt; references twice the ability to &lt;em&gt;stand in the other persons shoes&lt;/em&gt; as being a very important move to try when dealing with others, being sympathetic.&lt;/li&gt;
&lt;li&gt;Another thing that happens in many interactions is direct and non-constructive criticism between people causing an unsuccessful communication, and that comes from having unrealistic expectations to a person.&lt;/li&gt;
&lt;li&gt;I want to stress that being selfish is another mindset that even though indirectly, it is opposite to the growth mindset, and so it will deteriorate your communication logically.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;h2&gt;
  
  
  Lack Of Direction:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;being a person who has no direction / clarity in life or a task will cause you to fail to communicate good.&lt;/li&gt;
&lt;li&gt;Unclarity and being directionless causes people to loose personal respect, integrity and confidence - and that will make you bad communicator.&lt;/li&gt;
&lt;li&gt;I also see having no clear path making you be the type of person bumping into everyone and trying to fit into everything without success.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;h2&gt;
  
  
  No Vision:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;It can only make sense that being a person who doesn't want to be open-minded will block you from being able to connect as far *as communication goes with certain people.&lt;/li&gt;
&lt;li&gt;The thing is &lt;em&gt;&lt;code&gt;a visionary can speak to anyone, and a non visionary can only speak to another of its kind&lt;/code&gt;&lt;/em&gt;, and my friend it will help you a lot to go out and speak with people who will stretch your mind and experience, and ultimately this will help you a lot more than communication goes.&lt;/li&gt;
&lt;li&gt;Find what you love, focus on that and learn to grow your knowledge, skills and networks with that thing. Don't stop there, start developing new creative things out of that.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;h2&gt;
  
  
  Lack Of Confidence:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Lack of &lt;strong&gt;confidence does break the communication&lt;/strong&gt; of an individual, it lowers integrity and also makes a person less attractive.&lt;/li&gt;
&lt;li&gt;So its important to focus on what makes you confident and what makes you feel n look good. You will thank me later.&lt;/li&gt;
&lt;li&gt;There are things one cannot hide / act, and having confidence is one of them and what's crazy is that the less confident you are the harder it becomes for you to relate with other people, especially the confident ones. &lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;So I do return to the facts here that you will become a better you, and a better developer if you connect with other people and also communicate well with them. I am requesting you work on this personal project and see if it does not grow your network and give your access to more resources and also see if it doesn't make things happen smoother around you.&lt;/p&gt;

&lt;h2&gt;
  
  
  People want to connect with you
&lt;/h2&gt;

</description>
      <category>communicatio</category>
      <category>beginners</category>
      <category>programming</category>
    </item>
    <item>
      <title>MY HTML BASICS</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Wed, 01 Jun 2022 06:07:52 +0000</pubDate>
      <link>https://dev.to/nash4253/my-html-basics-3jad</link>
      <guid>https://dev.to/nash4253/my-html-basics-3jad</guid>
      <description>&lt;h1&gt;
  
  
  BASIC HTML:
&lt;/h1&gt;

&lt;p&gt;The structure for writing HTML code is using tags to tell the browser what it's interpreting for you the user.&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%2Fjj1pb3tvw0w8wyhoo3c3.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%2Fjj1pb3tvw0w8wyhoo3c3.png" alt="@nqubekogcabashe html basics image" width="800" height="988"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Creating HTML File:
&lt;/h2&gt;

&lt;p&gt;Creating the html file means creating a file with the &lt;code&gt;.html&lt;/code&gt; extension.&lt;/p&gt;
&lt;h2&gt;
  
  
  Basic Tags:
&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%2F2atagbmas50hcpkyw2oa.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%2F2atagbmas50hcpkyw2oa.png" alt="@nqubekogcabashe html basic tags" width="800" height="943"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;html tag is the one that will initialize / format the HTML document for the browser.
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight html"&gt;&lt;code&gt;    &lt;span class="nt"&gt;&amp;lt;html&amp;gt;&lt;/span&gt;

        // Your other tags will go here

    &lt;span class="nt"&gt;&amp;lt;/html&amp;gt;&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;head tag is where we put tags and meta-tags that will describe the html document.



&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%2Fic0d12iwws84u3wzi1b8.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%2Fic0d12iwws84u3wzi1b8.png" alt="@nqubekogcabashe html head tag" width="800" height="968"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;the head tag goes inside the &lt;code&gt;&amp;lt;html&amp;gt;&amp;lt;/html&amp;gt;&lt;/code&gt; tag but its one tag who's content you won't see displayed on the html, but perhaps the window.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8r14shmw6u4hl6dxy0v0.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%2F8r14shmw6u4hl6dxy0v0.png" alt="@nqubekogcabashe head tag img" width="800" height="931"&gt;&lt;/a&gt;&lt;/p&gt;



&lt;pre class="highlight html"&gt;&lt;code&gt;    &lt;span class="nt"&gt;&amp;lt;head&amp;gt;&lt;/span&gt; 
        // code for other tags and meta-tags goes here
    &lt;span class="nt"&gt;&amp;lt;/head&amp;gt;&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;



&lt;ul&gt;
&lt;li&gt;title tag is used to give a name to the window or tab that will represent that page.
&lt;/li&gt;
&lt;/ul&gt;

&lt;pre class="highlight html"&gt;&lt;code&gt;    &lt;span class="nt"&gt;&amp;lt;title&amp;gt;&lt;/span&gt; 
        // page title goes here
    &lt;span class="nt"&gt;&amp;lt;/title&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;



&lt;ul&gt;
&lt;li&gt;body tag is used to contain the web pages content, this is where you put all content.
&lt;/li&gt;
&lt;/ul&gt;

&lt;pre class="highlight html"&gt;&lt;code&gt;    &lt;span class="nt"&gt;&amp;lt;body&amp;gt;&lt;/span&gt; 
        //web page content goes here
    &lt;span class="nt"&gt;&amp;lt;/body&amp;gt;&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;


&lt;h2&gt;
  
  
  Body Tag Attributes Examples:
&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%2Fmp60dl9jvq5qy0ty4aiv.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%2Fmp60dl9jvq5qy0ty4aiv.png" alt="@nqubekogcabashe html body tag" width="800" height="935"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;to set the background-color to green of body tag. You can use color name or hex value&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;html &amp;lt;body bgcolor="green"&amp;gt; ... &amp;lt;/body&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to set text color of links, using name or hex value:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;body link="green"&amp;gt; ... &amp;lt;/body&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to set color of visited links, using name or hex value:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;html &amp;lt;body alink="green"&amp;gt; ... &amp;lt;/body&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h2&gt;
  
  
  Text Tags:
&lt;/h2&gt;

&lt;h2&gt;
  
  
  These tags are used to format text content you adding to your html and you use the following HTML tags.
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;to create pre-formatted text.&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;pre&amp;gt; ... &amp;lt;/pre&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to create header tags h1, h2...h6 where the h1-largest &amp;amp; h6-smallest:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;h1&amp;gt; Heading Text &amp;lt;/h1&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to make text bold:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;b&amp;gt; test to turn bold &amp;lt;/b&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to display / define source code usually monospace:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;code&amp;gt; ... &amp;lt;/code&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to emphasize a word or text:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;strong&amp;gt; ... &amp;lt;/strong&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to set the size of the font, replace "?" with size in em, rem, % or px as measurement:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;font size="?"&amp;gt; ... &amp;lt;/font&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;to display source code:&lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;body&amp;gt; ... &amp;lt;/body&amp;gt;&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Formatting:
&lt;/h2&gt;

&lt;h2&gt;
  
  
  We use these methods to group certain content types like articles, container like div spans.
&lt;/h2&gt;
&lt;h2&gt;
  
  
  Container tags:
&lt;/h2&gt;

&lt;p&gt;these tags are used to contain other tags or content within them, you would do this to create some sectioning, to be able to share attributes "style, format" or other reasons you intend for data to be sectioned out.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;We commonly use div tag most times &lt;code&gt;&amp;lt;div&amp;gt;...&amp;lt;/div&amp;gt;&lt;/code&gt; and within this tag we add content that will be sections with many lines.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We also use the span tag to create sections within divs also &lt;code&gt;&amp;lt;span&amp;gt; ... &amp;lt;/span&amp;gt;&lt;/code&gt; and its used to format inline content with CSS.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We then have the &lt;code&gt;&amp;lt;p&amp;gt;... &amp;lt;/p&amp;gt;&lt;/code&gt; to contain content within this paragraph tag as one paragraph.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Html Input Tags:
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;&amp;lt;input type="email" name=? value=? disabled=? /&amp;gt;&lt;/code&gt; &lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;This is our basic input tag where the type attribute will have a value of either &lt;em&gt;email&lt;/em&gt;, &lt;em&gt;password&lt;/em&gt;, &lt;em&gt;number&lt;/em&gt; , &lt;em&gt;url&lt;/em&gt; or &lt;em&gt;text&lt;/em&gt; "i think there is more" but that's the ones i have used, but these are used to validate your input and also helps the reader understand the data they are expected to give the web page.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Another that i have encountered include &lt;code&gt;&amp;lt;input type='date/month/week/time name='date' /&amp;gt;&lt;/code&gt; and this one is used to input to date.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Another good one is &lt;code&gt;&amp;lt;input type='search' name='search' /&amp;gt;&lt;/code&gt; that is used for search.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Another fun one i loved was &lt;code&gt;&amp;lt;input type="color" value="green" /&amp;gt;&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We also have the &lt;em&gt;name&lt;/em&gt; attribute that will help you identify the input tag with the name attribute in situations with more than one input.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Then we also have the &lt;em&gt;value&lt;/em&gt; attribute that is used a lot to capture the input that you have put into the input tag.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We also have the &lt;em&gt;disabled&lt;/em&gt; attribute which determines if the input is accessible in terms of adding data.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So that's the basics of HTML i got time to write out but there are definitely more tags out there and your job is to seek them out and use them to your advantage to make the site user friendly and lovable. &lt;/p&gt;




&lt;h2&gt;
  
  
  I hope this helped you out and this is also another more details source for the &lt;a href="https://devdocs.io/html/" rel="noopener noreferrer"&gt;documentation &lt;/a&gt;for HTML please use it and also check out my video &amp;amp; content on how to use &lt;a href="https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-learning-3aej"&gt;documentation &lt;/a&gt;using python example.
&lt;/h2&gt;


&lt;/li&gt;

&lt;/ul&gt;

</description>
      <category>beginners</category>
      <category>programming</category>
      <category>html</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Tips to get into programming</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Mon, 23 May 2022 06:28:18 +0000</pubDate>
      <link>https://dev.to/nash4253/tips-to-get-into-programming-2j8b</link>
      <guid>https://dev.to/nash4253/tips-to-get-into-programming-2j8b</guid>
      <description>&lt;h1&gt;
  
  
  Getting into programming:
&lt;/h1&gt;

&lt;h2&gt;
  
  
  Disclaimer:
&lt;/h2&gt;




&lt;p&gt;I honestly cannot fully claim to be self-taught, but my understanding of coding and software comes from my computer science degree I couldn't finish, but I would love to share good resources, ideas &amp;amp; tools for getting into programming fundamentals that I have picked up in my growth and realized you can get without going for a degree.&lt;/p&gt;




&lt;h3&gt;
  
  
  Facts First:
&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe4shqdxrhdpf96wosezw.jpeg" 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%2Fe4shqdxrhdpf96wosezw.jpeg" alt="programming is solving problems not just fun only" width="800" height="905"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;This field needs you to learn a lot, and practice what you learned to master it - &lt;em&gt;this isn't theory only but practical&lt;/em&gt;.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Anybody can start programming and everyone can master a field or domain in programming.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You cannot learn programming without a computer or laptop, &amp;amp; you cannot be a programmer if you have a computer but don't want to learn.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Where to start ??:
&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%2F182bdu96meagkyska4p7.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%2F182bdu96meagkyska4p7.jpg" alt="the importance of computer literacy before starting to learn programming" width="640" height="360"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;note&lt;/strong&gt;: &lt;em&gt;these are only topics in programming that are important for you to grasp. Watching short video's explaining each is good for you.&lt;/em&gt;
&lt;/h2&gt;

&lt;h3&gt;
  
  
  learning basics for beginning programming:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;If you know nothing about a computer just start with learning the basics of &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=WpUTsnZwd3Q" rel="noopener noreferrer"&gt;video&lt;/a&gt; important !!&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://erasmusintern.org/sites/default/files/traineeship/attachments/Computer%20Literacy%20Curriculum.pdf" rel="noopener noreferrer"&gt;wikipedia&lt;/a&gt; important !!&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;what is a program and programming language?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.youtube.com/watch?v=ifo76VyrBYo" rel="noopener noreferrer"&gt;video&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://en.wikipedia.org/wiki/Computer_programming" rel="noopener noreferrer"&gt;wikipedia&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;what is an operating system?:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=26QPDBe-NB8" rel="noopener noreferrer"&gt;video&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://en.wikipedia.org/wiki/Operating_system#:~:text=An%20operating%20system%20(OS)%20is,common%20services%20for%20computer%20programs." rel="noopener noreferrer"&gt;operating system&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;what are the typical tools used to create a program?:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.youtube.com/watch?v=YbPCtALcVdo" rel="noopener noreferrer"&gt;video&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://en.wikipedia.org/wiki/Programming_tool#:~:text=The%20most%20basic%20tools%20are,like%20a%20debugger%20or%20profiler." rel="noopener noreferrer"&gt;wikipedia&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;What are the different types of programs?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.youtube.com/watch?v=hx4NNTYb85c" rel="noopener noreferrer"&gt;video&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.cs.ucc.ie/~gavin/cs1001/Notes/chap01/ch01_9.html" rel="noopener noreferrer"&gt;wikipedia&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;what you could do as a job after learning programming?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://www.youtube.com/watch?v=5FySFg78cQI" rel="noopener noreferrer"&gt;video&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.indeed.com/career-advice/finding-a-job/types-of-programming-jobs" rel="noopener noreferrer"&gt;wikipedia&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  Getting Into It:
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Which language to learn first?:
&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F95eqdnptnrv5b1adsd70.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%2F95eqdnptnrv5b1adsd70.png" alt="list of programming languages to learn first" width="765" height="388"&gt;&lt;/a&gt;&lt;br&gt;
It's important to understand that with regard to programming it's not about just grabbing any book/video with the title "beginner programming with..." but first we practice  &lt;a href="https://dev.to/nash4253/target-learning-1m1k"&gt;targeted learning&lt;/a&gt; and then learn languages that are applied or relevant to that market or software domain.&lt;/p&gt;

&lt;h4&gt;
  
  
  - Example:
&lt;/h4&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- We choose to get into web development.

&lt;ul&gt;
&lt;li&gt;We look at resources that will help us to get the fundamentals, intermediate, and master level understanding of web dev.&lt;/li&gt;
&lt;li&gt;We hang out in web dev communities for &lt;a href="//www.devto.io"&gt;Dev. to&lt;/a&gt; or &lt;a href="//www.hashnode.com/profile/nqubeko"&gt;hashnode&lt;/a&gt;, and catch the latest trends.&lt;/li&gt;
&lt;li&gt;start building a sub-portfolio from that which you will add to the main portfolio.
&lt;/li&gt;
&lt;/ul&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h3&gt;


Have fun with your skills:
&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%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2erp2mdzqyhyq5zc6beu.jpeg" 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%2F2erp2mdzqyhyq5zc6beu.jpeg" alt="create programming projects you will be proud of after learning programming" width="800" height="776"&gt;&lt;/a&gt;&lt;br&gt;
One other thing i realized with most learning programmers is the trend / tradition of making learning not be fun in a way &lt;/p&gt;

&lt;h2&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%2Fdjptl7zhsbrl9pau1xul.png" alt="javascript function for not having fun while programming" width="297" height="186"&gt;
&lt;/h2&gt;




&lt;p&gt;but i really think this is something that we can change as a community, and most people have taken the initiative to like:&lt;/p&gt;

&lt;blockquote&gt;
&lt;ul&gt;
&lt;li&gt;&lt;p&gt;we have &lt;strong&gt;&lt;a href="//www.sololearn.com"&gt;sololearn&lt;/a&gt;&lt;/strong&gt;, which is a learning and playing programming platform with a playground in it.&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%2Fua8rqh4wwbar0edt26z0.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%2Fua8rqh4wwbar0edt26z0.jpg" alt="sololearn programming platform logo" width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;we have &lt;strong&gt;&lt;a href="//www.codesandbox.com"&gt;codesandbox&lt;/a&gt;&lt;/strong&gt; which is an online editor where you can also enjoy writing and testing code remotely.&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%2Fcgxfhrs9hdx42c56p8i7.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%2Fcgxfhrs9hdx42c56p8i7.png" alt="codesandbox programming platform logo" width="800" height="304"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We have places like &lt;strong&gt;&lt;a href="//www.codewars.com"&gt;codewars&lt;/a&gt;&lt;/strong&gt; where you can try to solve problems and see some competitive programming.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/blockquote&gt;

&lt;h2&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%2Fhmphymxvuoetewzufyqo.png" alt="codewars programming platform logo" width="800" height="203"&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;em&gt;Follow my blogs to stay up to date with my work...&lt;/em&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Target Learning</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Sun, 22 May 2022 16:12:20 +0000</pubDate>
      <link>https://dev.to/nash4253/target-learning-1m1k</link>
      <guid>https://dev.to/nash4253/target-learning-1m1k</guid>
      <description>&lt;p&gt;In learning, let's try implementing the law of measuring twice and cutting once by planning the learning process so it goes through successfully. Three important benefits if you practice targeted learning, these being:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Efficiency in grasping concepts and using them.&lt;/p&gt;

&lt;p&gt;Effectivity in solving common problems in a domain.&lt;/p&gt;

&lt;p&gt;In-depth understanding of tools, services, and frameworks used in the field.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  What is targeted learning?
&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%2Fdi8if1rc9lr75dg3yvku.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%2Fdi8if1rc9lr75dg3yvku.jpg" alt="Image description" width="640" height="503"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  This is a learning style focused on helping the student experience the most understanding after learning something, to gain the max amount of theory and muscle memory as a package after exposure to learning material.
&lt;/h2&gt;

&lt;h2&gt;
  
  
  Let's look at how I use it and I hope my explanation can give you enough value that you can try it out.
&lt;/h2&gt;

&lt;h2&gt;
  
  
  STEP 1: &lt;em&gt;prep work&lt;/em&gt;
&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%2Foafog40u3c9coebyphbp.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%2Foafog40u3c9coebyphbp.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Choose what you intend to master and write that down.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;When choosing the subject to learn with a proper understanding of how you will use it somewhere.&lt;/li&gt;
&lt;li&gt;Before starting the learning process discuss with someone, and do research to find out what's important to learn.&lt;/li&gt;
&lt;li&gt;Find out how deep you must learn concepts, and how to practice them.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;With whatever you have researched you need additional information:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;What tools will I need to master using.&lt;/li&gt;
&lt;li&gt;where you can access the tools and practice the tools.&lt;/li&gt;
&lt;li&gt;how you will benefit from using these tools compared to others.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  STEP 2: &lt;em&gt;remove fluff&lt;/em&gt;
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Do a proper introspection with the sole purpose to understand which is the best learning style that works for you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;For that subject, go see how many types of material available and if there is &lt;br&gt;
material for the learning style that works best for you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Compile a learning list or vision board about that subject and point out the fundamentals that must be learned using your particular successful learning style.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Get clarity and help from someone with experience to validate your learning list and if its too broad or narrow to apply in a way that earns money.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Step 3: &lt;em&gt;now, lets learn&lt;/em&gt;
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;Prepare yourself for learning:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Excercise and keep the body well rested after that. &lt;/li&gt;
&lt;li&gt;Eat well and get proper hydration.&lt;/li&gt;
&lt;li&gt;Remove all distractions from your learning space and your devices.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;&lt;p&gt;&lt;strong&gt;Prepare your learning&lt;/strong&gt; space and time to be consistent so you will get max consumption habit in your system &lt;em&gt;it's easy to neglect this but its important&lt;/em&gt;.&lt;/p&gt;&lt;/li&gt;

&lt;li&gt;&lt;p&gt;Please start learning the fundamentals using the learning style of your choice and write notes and a summary after you finish.&lt;/p&gt;&lt;/li&gt;

&lt;li&gt;&lt;p&gt;Soon as you finish learning something new immediately put it to practice.&lt;/p&gt;&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  STEP 4: &lt;em&gt;create experience&lt;/em&gt;
&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%2Fakv77fue2dcqjtr8w2mn.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%2Fakv77fue2dcqjtr8w2mn.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;After you had started learning this, I am sure you had something you intended to do to implement that or a place you will be working and using it.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Start your research on when you can start expressing or using what you have learned, in a way that benefits you or &lt;em&gt;preferably&lt;/em&gt; someone else.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Look at the company you intend to work for or the place you intend to use that tool and find the trends happening there.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;After you have found the trends of the domain, and also the methods how the skills you learned are used. Now get guidance again if your process you want to use.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F099y5x0jwlgn6kvjn2vz.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%2F099y5x0jwlgn6kvjn2vz.jpg" alt="Image description" width="640" height="853"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>javascript</category>
      <category>programming</category>
      <category>software</category>
    </item>
    <item>
      <title>404</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Sun, 22 May 2022 16:09:49 +0000</pubDate>
      <link>https://dev.to/nash4253/404-3g35</link>
      <guid>https://dev.to/nash4253/404-3g35</guid>
      <description>&lt;h1&gt;
  
  
  Hey There,
&lt;/h1&gt;











































&lt;h2&gt;
  
  
  &lt;strong&gt;Page still in production.&lt;/strong&gt;
&lt;/h2&gt;

&lt;h2&gt;
  
  
   &lt;strong&gt;Sorry.&lt;/strong&gt;
&lt;/h2&gt;























































</description>
    </item>
    <item>
      <title>Things I wish I knew before being an junior Dev: Networking</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Sun, 08 May 2022 13:44:09 +0000</pubDate>
      <link>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-networking-42de</link>
      <guid>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-networking-42de</guid>
      <description>&lt;p&gt;Hey guys, I have been thinking about how I have seen a lot of growth in my self, I have had since I met certain people, since I opened up to learning better communication skills. There is definitely a plethora of skills, understandings &amp;amp; opportunity you will get from being around the right people, so allow me to share tips on good networking skills and how it benefits you as a junior developer or anyone who wants to get into programming.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is networking?
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;I think the best way to describe networking in a personal and also professional  sense is that it's a skill and part of your life that allows you to see your software developer's growth from a different perspective. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;It's a way to keep yourself updated on programming languages, tools, and libraries that are efficient and effective.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdf4e4fgpl9muuavyxrld.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%2Fdf4e4fgpl9muuavyxrld.jpg" alt="Image description" width="640" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Networking is also the process you use to add value to people's lives and this is done through sharing what you have learned and also showing people pitfalls that held you back.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Reading comments from coding groups, developer blogs facebook programming groups and see what you can learn from them.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

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

&lt;h2&gt;
  
  
  The Benefits of networking
&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%2F41d27fclifwwwfktvmqy.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%2F41d27fclifwwwfktvmqy.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;You can better prepare for a project or standard of code you create by learning from the people in your network who are writing better code than you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://research.stlouisfed.org/publications/employment-research/how-does-networking-affect-your-job-search#:~:text=Network%20searches%20have%20higher%20finding,shorter%2C%20according%20to%20the%20authors." rel="noopener noreferrer"&gt;Stats&lt;/a&gt; do say that people with a healthy network will have better employment opportunity.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You can and will always get good advice and guidance from those with much more experience than you on a certain language, framework, or library.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You will understand frameworks or libraries quicker because someone can explain them better and share the fundamentals.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You will have a chance to grow a good reputation through helping others and also taking initiative and learning important but hard skills.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You can grow a committed circle of people you can trust and count on for certain networking platforms like &lt;a href="https://www.linkedin.com/in/nqubeko-gcabashe/" rel="noopener noreferrer"&gt;linkedIn &lt;/a&gt;.'&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkq1nlnm3xhjrpu4gjq7s.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%2Fkq1nlnm3xhjrpu4gjq7s.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You will have an update about where the industry is going and what companies are using.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How do we network?
&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%2Fysafvi8o27jp76q1gbma.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%2Fysafvi8o27jp76q1gbma.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Work on your communication skills. Work on how you speak, and the motive for opening your mouth. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Work on how to be more welcoming, and that could be either having a good smile or sharing ideas that you think a developer might like or enjoy looking at like another developer's portfolio or your code.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Only build relationships with people you actually like for who they are not what they have or can do for you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Offer value for free to people around you this can be done by solving their software issues or fixing their bug issues or sharing learning material.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F5so1haoe95ttx15baacu.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%2F5so1haoe95ttx15baacu.jpg" alt="Image description" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Give genuine compliments from time to time on people's work and progress, and also be open to compliments from others.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Use your social media and speak to people and ask about what they do.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Use networking platforms like LinkedIn that will help you have a narrowly targeted network.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Ultimately getting out there will help you grow better, it will help you handle things with much better information to decide on as a developer on your journey.&lt;/p&gt;

&lt;p&gt;I have so much to learn still and to accomplish and I know it's actually going to happen mainly because I trust my network and my mentor, and I hope you could have that trust in what you doing and your growth.&lt;/p&gt;

</description>
      <category>networking</category>
      <category>webdev</category>
      <category>beginners</category>
      <category>programming</category>
    </item>
    <item>
      <title>Debugging Tips: Javascrip2</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Thu, 28 Apr 2022 08:33:45 +0000</pubDate>
      <link>https://dev.to/nash4253/debugging-tips-javascrip2-1k15</link>
      <guid>https://dev.to/nash4253/debugging-tips-javascrip2-1k15</guid>
      <description>&lt;p&gt;Hey guys&lt;br&gt;
So after my first debugging tips, I realized there are some additional things I could add that does help and also examples where we can clearly see that the editor will not show us the bugs but the Chrome Dev tools do.&lt;/p&gt;

&lt;p&gt;I also want to share an important feature in Chrome Dev tools that will help you when debugging your app and you want to see the source code on the browser.&lt;/p&gt;

&lt;h2&gt;
  
  
  How to show source files when debugging on chrome:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Firstly you wana open your chrome dev tools, open Chrome -&amp;gt; press &lt;strong&gt;CTL + SHIFT + I&lt;/strong&gt; or go to settings then &lt;strong&gt;More Tools&lt;/strong&gt; then &lt;strong&gt;Developer Tools&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpv7idlnqrodcliph92i1.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%2Fpv7idlnqrodcliph92i1.png" alt="f001.png" width="553" height="445"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Next, you want to open the "big gear" or high-level settings for the dev tools use the example bellow: &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2i30wk0glesfw9nm418a.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%2F2i30wk0glesfw9nm418a.png" alt="f0.png" width="800" height="502"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;When the settings have opened go to &lt;strong&gt;Sources&lt;/strong&gt; and enable **Automatically reveal files in the sidebar with the example below.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fz5hgy6s7mes2alkegcfv.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%2Fz5hgy6s7mes2alkegcfv.png" alt="reveale.png" width="423" height="262"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;-Open and close the Dev tools/ rerun your project, then when you need to debug you can actually open the file and see its activity at run time. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Press the &lt;strong&gt;3-dots&lt;/strong&gt; &amp;amp; select &lt;strong&gt;Open file&lt;/strong&gt; option or options using example bellow:&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1651129118210%2FgtXeZprD8.png%2520align%3D" 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%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1651129118210%2FgtXeZprD8.png%2520align%3D" alt="f1.png" width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This will allow you to select the file you intend to debug and I made example of how they show on my chrome, showing dropdown with the files in the current project I am working on.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1651129143172%2FzNFnW3m3_.png%2520align%3D" 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%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1651129143172%2FzNFnW3m3_.png%2520align%3D" alt="f3.png" width="800" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You will have to select the files you want to work with and I advise you don't choose the entire folder but select the files you currently working on or the module you working with at the time because of space and you want to keep it uncluttered.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjhxlsgh92i5twldzmp85.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%2Fjhxlsgh92i5twldzmp85.png" alt="f2.png" width="800" height="718"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This image shows the files I have selected and where they will show and from here I can put breakpoints %[line 26] and see the result of certain return statements or where the code produces null reference errors or anything of that sort.&lt;/p&gt;

&lt;p&gt;Why is using this important for debugging?&lt;/p&gt;

&lt;p&gt;That's a good question, so sometimes when you write javascript code on your code editor and the errors or mistakes you make like spelling errors in the HTML or even Typescript will not show until run time.&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%2Fwbonzfjqujlc5r4pdg1p.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%2Fwbonzfjqujlc5r4pdg1p.png" alt="f4.png" width="800" height="615"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is an example where I created an error where I had misspelled the name of the function i want to call when I handle the click event in the HTML, as much as rubber duck debugging would have worked, it could take hours, so this is an example where this skill will help by opening the source code on the browser and seeing the problem.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9d3ra455lxjmocg9c8eg.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%2F9d3ra455lxjmocg9c8eg.png" alt="f44.png" width="800" height="563"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;So from the HTML code you can see that we calling the &lt;strong&gt;clickItem()&lt;/strong&gt; function. but we have a problem, that's not the name of the function in TS and I couldnt see from the code. &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So please think about it, check it out on your next debugging sesion, and tell me what you think and if it brings value to your dev process. Good luck coder!!&lt;/p&gt;

&lt;p&gt;Thank you.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>angular</category>
      <category>beginners</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Why source control is important for developers ???</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Fri, 01 Apr 2022 07:02:23 +0000</pubDate>
      <link>https://dev.to/nash4253/why-source-control-is-important-for-developers--5d8j</link>
      <guid>https://dev.to/nash4253/why-source-control-is-important-for-developers--5d8j</guid>
      <description>&lt;h2&gt;
  
  
  Source Control:
&lt;/h2&gt;

&lt;p&gt;In our intern series we discussed that source control is one of the major tools for all developers and that its important for your back up, for being able to keep track of your work, working remotely.&lt;br&gt;
Lets look at what source control is, examples out there and why it benefits you.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is source control?
&lt;/h2&gt;

&lt;p&gt;Source / version control is a method of keeping track of the work you do or the changes you add or remove from your code for the project you working on.&lt;/p&gt;

&lt;p&gt;Since its rare to make an app in one go writing everything and finishing, you want to add changes over time to finish your project, but also you need a way to manage and the progress you make. &lt;/p&gt;

&lt;p&gt;Version control is sort of like the bigger scale of applying the OPEN CLOSED PRINCIPLE “code is not open to extension and closed to modification”.&lt;/p&gt;

&lt;h2&gt;
  
  
  Benefits of using source control:
&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%2Flyqnfwlsy5hfxjij56lm.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%2Flyqnfwlsy5hfxjij56lm.jpg" alt="https://www.istockphoto.com/photo/volunteer-with-box-of-food-for-poor-ramazan-kolisi-ramadan-paketi-gm1311922883-400874115?utm_source=unsplash&amp;amp;utm_medium=affiliate&amp;amp;utm_campaign=srp_photos_top&amp;amp;utm_content=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fgiving&amp;amp;utm_term=giving%3A%3Asearch-explore-top-affiliate-outside-feed%3Adisabled" width="509" height="339"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;most importantly it protects your work from being lost, either deleted or your machine stolen.&lt;/li&gt;
&lt;li&gt;it gives you the habit of working either remotely or with other developers.&lt;/li&gt;
&lt;li&gt;It is also a habit that grows confidence because you can write test code without contaminating stable code.&lt;/li&gt;
&lt;li&gt;Allows you to make progressive updates to your application without breaking the system.&lt;/li&gt;
&lt;li&gt;lastly it will allow you to create less buggy systems.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How it benefits you as a junior:
&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%2Fihxjz8wpejhq92arnnk9.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%2Fihxjz8wpejhq92arnnk9.jpg" alt="https://www.istockphoto.com/photo/mother-and-daughter-at-the-swimming-pool-on-summer-vacation-gm1306309262-396925772?utm_source=unsplash&amp;amp;utm_medium=affiliate&amp;amp;utm_campaign=srp_photos_top&amp;amp;utm_content=https%3A%2F%2Funsplash.com%2Fs%2Fphotos%2Fbaby-with-father-on-ladder&amp;amp;utm_term=baby%20with%20father%20on%20ladder%3A%3Asearch-explore-top-affiliate-outside-feed%3Adisabled" width="509" height="339"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;It does show that you take your work seriously, I say this because you have experience using a tool that is closely related to professionalism in software.&lt;/li&gt;
&lt;li&gt;Using S.C will allow you to collaborate with developers with more experience with you, allowing yourself to produce much more standard projects with high success rate.&lt;/li&gt;
&lt;li&gt;you can show off with your work and this means even in interviews or your profile you can show off your work.&lt;/li&gt;
&lt;li&gt;You can see your growth progress and this will always boost your confidence.&lt;/li&gt;
&lt;li&gt;it will lead to you producing less buggy code because you will review your code before commits and also you can track where a bug was introduced and fix it much quicker.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;So as you can see getting into the habit of using source control will help you grow your career and make you a better candidate in interviews and also boost your profile.&lt;/p&gt;

&lt;h2&gt;
  
  
  Source Control Examples:
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://tortoisegit.org/" rel="noopener noreferrer"&gt;Tortoise git&lt;/a&gt; - good UI and user friendly. &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/" rel="noopener noreferrer"&gt;Github&lt;/a&gt; - most popular with new windows App.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://bitbucket.org/" rel="noopener noreferrer"&gt;Gitbucket&lt;/a&gt; - Seems abit for collaborations.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://beanstalkapp.com/" rel="noopener noreferrer"&gt;BeanStalk&lt;/a&gt; - great UI with docs.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;There many others if those don’t satisfy you, but the basic function of these technologies is to help version your code and better your coding experience.&lt;/p&gt;

&lt;h1&gt;
  
  
  Lets try Github as an example.
&lt;/h1&gt;

&lt;ul&gt;
&lt;li&gt;Go to the &lt;a href="https://github.com/" rel="noopener noreferrer"&gt;Github website&lt;/a&gt; .&lt;/li&gt;
&lt;li&gt;click on the Sign Up button on the top right corner.
&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%2Fvp21niabl8t7i2frmt96.png" alt="github website" width="800" height="334"&gt;
&lt;/li&gt;
&lt;li&gt;It will take us to the following page and we enter the email there.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fn0co83cfrem84nuo39kj.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%2Fn0co83cfrem84nuo39kj.png" alt="github websit" width="800" height="406"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The console card will keep asking for your input with instructions till you done, and it will look something like this.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpscredbzfkrl0nb2xy6y.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%2Fpscredbzfkrl0nb2xy6y.png" alt="github image" width="800" height="383"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Yours will not be packed like this, because the left panel shows your projects, which you have not added yet, and then the middle grid shows all the people you follow and their work. The right grid is just marketing or your interests.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;The following image shows the git market place, where you can see services or apps you can use in collabo with your github.&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%2F1ysij62urse8i0q49idg.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%2F1ysij62urse8i0q49idg.png" alt="git image" width="800" height="621"&gt;&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;this image now shows my fave, the Explore pannel where you can see other developers work, and follow their commits and see code.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxk31ibsh3t2dk2790x6g.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%2Fxk31ibsh3t2dk2790x6g.png" alt="git image" width="800" height="459"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I think this part is quiet important for us growing juniors, because it actually allows you to play with peoples code and learn how to read code.&lt;/li&gt;
&lt;li&gt;&lt;p&gt;It does allow you to also reach out to other developers and request to work with them, or your project will allow them to reach out to you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Another part i love is the explore - topics tab, You will alot from this as a developer, you can get material, cheat sheets, learn deep topics about&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fobeqgk0bc2rcf3r72oa7.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%2Fobeqgk0bc2rcf3r72oa7.png" alt="git image" width="800" height="318"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;So this exposure to these tools has been very helpful in my growth and it will be a good deal for you too. &lt;/li&gt;
&lt;li&gt;These are just github, and I think if you get your time and learn these tools and play with these source control tools you might end up learning a lot of useful skills and having access to usefull tools.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Now being handy with your tools is good but mastering this one is quite important for the people you work for because you are using a safe and trusted process to release code and also keep track of how far you have gone in your work.&lt;/p&gt;

&lt;p&gt;So the answer to the question is that source control helps you be more efficient, to protect your work and also gives you the power to work with others or remotely. What more would a developer need lol. &lt;/p&gt;

</description>
      <category>git</category>
      <category>intern</category>
      <category>beginners</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Learning Programming Using Doc's</title>
      <dc:creator>Vukani Gcabashe</dc:creator>
      <pubDate>Tue, 29 Mar 2022 20:03:48 +0000</pubDate>
      <link>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-learning-3aej</link>
      <guid>https://dev.to/nash4253/things-i-wish-i-knew-before-being-an-junior-dev-learning-3aej</guid>
      <description>&lt;h2&gt;
  
  
  Things I wish I knew before being an Junior Dev: Learning
&lt;/h2&gt;

&lt;p&gt;From my first post where I was sharing things I wish I knew before beginning my internship, I had expressed the 6 most important things a junior must know and use to scale their profile and grow their skill set as a developer.&lt;/p&gt;

&lt;p&gt;Here we will discuss how to get around learning a tool or language while using the documentation or using a textbook.&lt;/p&gt;

&lt;h2&gt;
  
  
  Learning how to learn:
&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%2Frvscv07jxibru0eqi9x9.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%2Frvscv07jxibru0eqi9x9.jpg" alt="learning how to learn" width="640" height="427"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With this I want start by saying its important to check out the &lt;strong&gt;four styles of learning&lt;/strong&gt; and also do self introspection to see  which one works best for you. So how about you look at your past learning achievements and see which process of learning you have done before that gave you best result or even how you can improve it.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Create a flexible pattern of learning that you will use for grasping concepts and &lt;strong&gt;understanding material effective&lt;/strong&gt; and &lt;strong&gt;efficiently&lt;/strong&gt; but base it on your preferred learning style. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Make a habit of &lt;strong&gt;setting miles stones&lt;/strong&gt; for your learning code. Look at the different subjects relating to that tool or language, the different uses &amp;amp; try to learn them individually and write summary of your understanding.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Another achieve your milestones is to make small programs with what you have learnt or code along with your tutorial video or the documentation you looking at and we will discuss that later also. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;If you don’t manage to finish a course or finish a tool tutorial, make a note to put book mark where you left off and come back to &lt;strong&gt;finish it&lt;/strong&gt; off later, its a good habit to start and finish things.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Have a reason to learn that tool:
&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%2F8od2180vf83vhag04ryz.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%2F8od2180vf83vhag04ryz.jpg" alt="reason to learn" width="527" height="327"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Whatever tool you working on let it have value in the beginning of your learning, because learning it without a purpose you will burn out of boredom or you will waist your time gaining a skill you wont be happy working with.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Look at your what your &lt;strong&gt;employer needs&lt;/strong&gt;, or look at the projects you intend to build or the company you want work for and learn skills and technologies so that your target market sees value in you.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;A good example is, if I intend to work for Designative, I need to look at their LinkedIn and see what types of skills they need, then I will start learning those and staying up to date with who else needs those skills . Then when I start I know my goals are to **master this **tool enough to maintain the type of software Designative uses.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Which resource do I use to learn?
&lt;/h2&gt;

&lt;p&gt;A huge part of learning is mostly you trusting the validity of what ever tool or method you use, So here I am just showing examples of the content which is available out there and i hope you can go out and search for the material that works for you or a content creator that resinates with you. &lt;/p&gt;

&lt;p&gt;Books 'my fave!!' - &lt;a href="https://www.pdfdrive.com/" rel="noopener noreferrer"&gt;PDFDrive&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Online courses for programming like &lt;a href="https://www.udemy.com/?utm_source=adwords-brand&amp;amp;utm_medium=udemyads&amp;amp;utm_campaign=Brand-Udemy_la.EN_cc.ROW&amp;amp;utm_term=_._ag_80315195513_._ad_535757779892_._de_c_._dm__._pl__._ti_kwd-310556426868_._li_1028712_._pd__._&amp;amp;utm_term=_._pd__._kw_udemy_._&amp;amp;matchtype=e" rel="noopener noreferrer"&gt;Udemy&lt;/a&gt; &amp;amp; &lt;a href="https://www.sololearn.com/" rel="noopener noreferrer"&gt;Sololearn&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;Coding games - &lt;a href="https://www.codewars.com/" rel="noopener noreferrer"&gt;Codewars&lt;/a&gt; &amp;amp; &lt;a href="https://assessment.hackerearth.com/challenges/college/ietcodearena/" rel="noopener noreferrer"&gt;codearena&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You tube videos - &lt;a href="https://www.youtube.com/watch?v=YaONowiQKW8" rel="noopener noreferrer"&gt;WebDevSimplify&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Blogs - &lt;a href="https://dev.to/"&gt;Dev.to&lt;/a&gt; &amp;amp; &lt;a href="https://github.blog/" rel="noopener noreferrer"&gt;Github Blog&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;These are just examples of good blogs, video creators and also games that will help you learn and grow.&lt;br&gt;
Challenges - &lt;a href="https://practice.geeksforgeeks.org/courses/competitive-programming-live/?utm_source=geeksforgeeks&amp;amp;utm_medium=subment&amp;amp;utm_campaign=GFG_Submenu_CP" rel="noopener noreferrer"&gt;Geek4Geeks&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  How do you learn code:
&lt;/h2&gt;
&lt;/li&gt;
&lt;li&gt;&lt;p&gt;So what's important when learning a library, framework or a programming language is to be able to use it and also &lt;strong&gt;understand the fundamentals&lt;/strong&gt; of how it works and how you can use it on a high level.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;So you want to be able to be efficient with your learning process and also effective with your information consumption. This means you have to learn to understand the tool and within that same go you aim at being able to use it effectively after your learning process.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You also want to &lt;strong&gt;practice&lt;/strong&gt; the different design patterns and tools available there to see how it behaves and the bugs that are possible with your logic and consumption.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;You also want to have something to satisfy yourself after learning, and so if you create something while you learn you will have something to be happy &lt;strong&gt;you achieved&lt;/strong&gt;, something more or less tangible.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Example of using documentation:
&lt;/h2&gt;

&lt;p&gt;We have a very good example on the video I explain using the python documentation to learn how to use the &lt;a href="https://docs.python.org/3/library/tkinter.html" rel="noopener noreferrer"&gt;tkinter&lt;/a&gt; library&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;So in this &lt;a href="https://youtu.be/EAD_kYizR5o" rel="noopener noreferrer"&gt;video&lt;/a&gt; I show how following the instruction in the documentation and also see how you will get stuck and start debugging.
Link the video&lt;/li&gt;
&lt;li&gt;&lt;p&gt;When using the docs to learn something you want to first install it properly and set up your environment. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Some times you have to download the tool or library like bootstrap and you will use it on your machine.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fkcz3klisrycvq6nf1dpi.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%2Fkcz3klisrycvq6nf1dpi.jpg" alt="bootstrap page with download button showing" width="800" height="544"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;But then if you don’t intend to use it locally you can also used the CDN like the following image, So you copy that link to the CSS online and paste it in your project or your html.&lt;/p&gt;

&lt;p&gt;This image shows the download for the node installer.&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%2Fof5hftra725vtvqsgr33.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%2Fof5hftra725vtvqsgr33.jpg" alt="downloading node installer" width="800" height="422"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;For situations where you have a package manager line node js already installed, you would have to use the &lt;code&gt;npm install&lt;/code&gt; command to install things, for example installing a tailwind library: 
In this following image we see installation of the tailwind css cli,&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F61090sbcnqxwdc515imd.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%2F61090sbcnqxwdc515imd.jpg" alt="tailwind css installation" width="800" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this instance we see how to install using postcss&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%2Fvmdkhydhb0xczhquw5d5.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%2Fvmdkhydhb0xczhquw5d5.jpg" alt="installing tailwindcss with postcss" width="800" height="481"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this instance we can see how to install bootstrap instead of downloading it.&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%2F9mghtnhvpwwc39igxgfj.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%2F9mghtnhvpwwc39igxgfj.jpg" alt="installing bootstrap" width="800" height="129"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In the following image we can see what's possible, we can see more guidance on how to config your environment for using the tool and also how to start out, and so you can see the docs will help you get started.&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%2Fkwb5ngaszg838dls31un.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%2Fkwb5ngaszg838dls31un.jpg" alt="Getting started with programming" width="800" height="558"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;So the docs are out there for you to use, go get it friend!!&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How to stay at the top of your game:
&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%2F8d0ewn23r43t4fo8fevq.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%2F8d0ewn23r43t4fo8fevq.jpg" alt="https://unsplash.com/@prince_perry?utm_source=unsplash&amp;amp;utm_medium=referral&amp;amp;utm_content=creditCopyTex" width="640" height="360"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Creating code alone or just for your own pleasure can get uninspiring and boring, I suggest you involve other developers in your growth. Try learning the tool together, do some buddy programming, or even build the same thing using different logic.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Talk to your senior and hear what they think about what you have done thus far and how you could improve your work or your code.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;This way you can also have code review to see how much your understand and how you can apply some standards in your projects.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Also describe the bugs you facing and ask for possible fixes for the problem you facing, this can greatly expose you to different problem solving methods.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Ask for chance to work on projects that relate to what you have learnt so your skills can be tested and can grow.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Don’t be satisfied by building hello world program with each tool you learn then forget about it, go deeper, understand all &lt;br&gt;
the fundamentals, check how they are applied in different instances, solve problems for other people on that tool. You Have To Be Pro Active.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Example of using documentation:
&lt;/h2&gt;

&lt;p&gt;We have a very good example on the video I explain using the python documentation to learn how to use the tkinter library&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;So in this video I show how following the instruction in the documentation and also see how you will get stuck and start debugging.
&amp;gt; Check out how &lt;a href="https://youtu.be/EAD_kYizR5o" rel="noopener noreferrer"&gt;python Documentation &lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  The Goal of learning:
&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%2Fcp6e0915p0bdi5ge9eop.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%2Fcp6e0915p0bdi5ge9eop.jpg" alt="path to sowewhere" width="509" height="339"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Its smart to practice iterative learning, learning to reach a small goal, then set a bigger or much in-depth one then do it again, then keep iterating till your goal becomes mastering.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Firstly its always import to be clear that you learning to understand and be effective when using a tool, to be able to read someone’s code or create a beginning project that works. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Second you want to learn to use best practices and understand higher level concepts or patterns above the fundamentals and practice those on your beginning project. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Third you want to build learn some of the concepts or design patterns used for different  scenarios with that tool and understand those and their bugs.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;I know you have an app idea lol, I suggest you take this time to build that project and apply those fundamentals and their high level counterparts.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;We can also use other channels of learning like this &lt;a href="https://youtu.be/QFaFIcGhPoM?list=PLC3y8-rFHvwgg3vaYJgHGnModB54rxOk3" rel="noopener noreferrer"&gt;react docs&lt;/a&gt; video where you have a collection of videos with good quality information which is like a translation of the documentation as a video.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let me hear your ideas on how we can improve this process for better learning. I am ready to learn more.&lt;/p&gt;

&lt;p&gt;Follow me on LinkedIn and lets connect - &lt;a href="https://www.linkedin.com/in/nqubeko-gcabashe/" rel="noopener noreferrer"&gt;vukani&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Follow me on Instagram because I will create content -&lt;a href="https://www.instagram.com/nqubekogcabashe/" rel="noopener noreferrer"&gt;vukani&lt;/a&gt;&lt;/p&gt;

</description>
      <category>python</category>
      <category>documentation</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
