<?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: Everistus Olumese</title>
    <description>The latest articles on DEV Community by Everistus Olumese (@bytenaija).</description>
    <link>https://dev.to/bytenaija</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%2F146712%2Fd00c404f-3058-464c-bec4-70e16ff10cd7.png</url>
      <title>DEV Community: Everistus Olumese</title>
      <link>https://dev.to/bytenaija</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/bytenaija"/>
    <language>en</language>
    <item>
      <title>I Walked 16.5 Kilometers (10.25 miles) Today: Embracing Wholeness at BenchSci</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Mon, 07 Aug 2023 22:33:22 +0000</pubDate>
      <link>https://dev.to/bytenaija/i-walked-165-kilometers-1025-miles-today-embracing-wholeness-at-benchsci-2h01</link>
      <guid>https://dev.to/bytenaija/i-walked-165-kilometers-1025-miles-today-embracing-wholeness-at-benchsci-2h01</guid>
      <description>&lt;p&gt;&lt;strong&gt;Introduction:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Hey there, readers! In a world where professional pursuits often overshadow personal passions, BenchSci emerges as a breath of fresh air—a workplace celebrating authenticity. In this series, we journey through BenchSci's vibrant culture. Let's dive into it.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ApvpOlXR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ht0okasuktkcc9xbiqa.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ApvpOlXR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ht0okasuktkcc9xbiqa.jpeg" alt="Image description" width="320" height="480"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--NYZNZLpG--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qpzjbwm4qouibxockgfi.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--NYZNZLpG--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qpzjbwm4qouibxockgfi.jpeg" alt="Image description" width="800" height="600"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--4fN-VC14--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/635cd53lg8xzjn03ss66.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--4fN-VC14--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/635cd53lg8xzjn03ss66.jpeg" alt="Image description" width="698" height="931"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;BenchSci's Diversity Mosaic as a Bridge to Connection&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Imagine a workspace where your job title doesn't define you. BenchSci's reality goes beyond talk. Slack channels aren't just digital spaces; they're vibrant communities fostering connections, nurturing shared interests, and creating bonds beyond deadlines.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Slack Channels: Where Unity Flourishes - Beyond the Everyday:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Let's chat about Slack channels that are windows into unique lives. Think "Parents and Caregivers," "Pets/Zoo," "Motorcycle," "Mental Health," and "DIY." These aren't just discussions; they're snapshots of colleagues' dimensions. Parents juggle families and careers. Pet lovers introduce furry companions. "Motorcycle" enthusiasts ride virtually, "DIY" aficionados craft.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;From Fitness to Transformation: The Exercise Channel (Embracing Change, Step by Step)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Among diverse interests, one channel stands out—the "Exercise" channel. BenchSci's community takes on fitness challenges, shattering boundaries. The BenchSci Strava group turns individual journeys into a shared adventure, uniting colleagues for physical well-being. Colleagues like Wai Chung Hon, P.Eng., CSM, Sean Kennedy, Christopher Guest and many others continue to motivate you because they bring their whole selves to work.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Power of Shared Goals - Championing Unity&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In a world where routines dominate, the Strava group isn't just about fitness but unity. Colleagues sync steps, and BenchSci's culture amplifies togetherness. A shared challenge evolves into a movement, urging us to embrace physicality and overcome inertia.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The Symphony of Transformation - Harmony Amidst Diversity:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Imagine a symphony—a blend of notes weaving beauty. BenchSci's culture resonates in every interaction. We're more than titles, passions aren't hobbies, and authenticity isn't a buzzword—it's a necessity.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Revisiting the Past - Footprints in Time&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Let's rewind to a time when exercise and vitality were part of everyday life. For me, this was around 2011-2012, a period when I used to cover 30km every second Saturday and lift locally-made weights back in Nigeria. But even then, I felt like the weakest link among friends, struggling to match their accomplishments and eventually succumbing to discouragement.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Weighty Concerns and Inconsistent Efforts (The Battle with Weight Gain)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Fast forward to 2015, and I noticed the pounds creeping in. Despite efforts in diet and exercise, the scale seemed unfazed. I felt like I was stuck in a losing battle, unable to find the consistency required for effective change. This wasn't just about vanity but about reclaiming a sense of vitality and self-worth.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Catalysts for Change - A Gathering Storm&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The catalysts for change were varied yet profound. Excessive weight gain, mental health struggles, sleep apnea, and a perpetual lack of energy all collided, forming a storm that demanded action. Colleagues like Wai Chung Hon, P.Eng., CSM, Sean Kennedy, Christopher Guest, and others paved the way, embracing fitness challenges. While they undertook 100 push-ups daily in an April 2023 challenge, I struggled to complete even one.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The Turning Point&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;April 8, 2023—a date etched in my memory. As the scale read 148.8kg, I realized it was time to seize control of my fitness journey. This was my tipping point, my call to rise above inertia and embrace transformation.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Taking the Reins - Investing in Change&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I dabbled in a gym membership but found myself visiting only once. So, I took matters into my own hands. I built a modest home gym—a weight bench, bands of varying intensities, barbells, dumbbells, and kettlebells. I discovered that most exercise apps catered to the already fit, leaving me struggling to keep up.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Adapting and Thriving - Finding the Sweet Spot&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Morning workouts drained my energy during the workday, leading me to adapt. I shifted to lunchtime walks, blending fitness with work breaks. This shift reinvigorated tasks and balanced my energy levels. I also learnt to take some meetings while walking.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Nurturing the Passion&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Days turned into weeks, making evenings and weekends my fitness sanctuaries. Walking unexpectedly emerged as my preferred exercise. Motivation from comments and colleagues' activities on Strava fueled my determination, pushing me to excel.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Blossoming Results - A New Milestone and Physical Changes&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Transformation yielded results—I ran 400 meters without stopping. While that might seem short, it was an accomplishment unimaginable in April 2023. I repeated this feat twice during my walk, concluding with an additional 300-meter run. Furthermore, the 16.5km walk I completed today marked the longest journey in over a decade. Today, I weigh 136.9kg, a remarkable drop from 148.8kg. This sustainable weight loss, the lowest since March 2021, signifies tangible progress.&lt;/p&gt;

&lt;p&gt;Weight wasn't the only indicator of progress. Better-fitting clothes, newfound energy, and mental clarity add to the list of victories.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Tools of Transformation - Supportive Allies:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;This journey was far from solitary. The Apple Watch Series 8 became a reliable ally, tracking my progress. The Apple Health app offered valuable insights, while tools like Strava, Hevy, and MyFitnessPal ensured accountability and enabled me to monitor my journey effectively. My go-to measurement tools remain the Renpho tape measure and the smart weighing scale. The weighing scale doesn't just show you your weight; it gives you other vital data like Body Fat Percentage, Fat-Free Body Weight, Subcutaneous fat, visceral fat etc. needed data to know how you are doing.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Conclusion: Navigating the Personal Landscape - Emerging Victorious&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;In this post, we've delved into BenchSci's vibrant culture—one thriving on passions. BenchSci isn't just work; it's where individuals paint their authentic selves. Each thread in the tapestry contributes to a diverse whole. As we journey, remember—these connections ignite transformation, blending personal passions with professional aspirations.. It peeled back layers of my journey, revealing a tapestry woven with personal history, motivations, and transformative milestones. It also unveiled the evolution, challenges, and victories of this transformative journey. It's a testament to resilience, adaptability, and the relentless pursuit of personal well-being. As we navigate this transformation landscape, remember that the journey extends beyond personal narratives. fin.&lt;/p&gt;

</description>
      <category>embracewholeness</category>
      <category>fitnessjourney</category>
      <category>symphonyofchange</category>
      <category>benchsci</category>
    </item>
    <item>
      <title>My First open-source Project: Building AmazonPay Gem</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Wed, 23 Sep 2020 11:05:57 +0000</pubDate>
      <link>https://dev.to/bytenaija/my-first-open-source-project-building-amazonpay-gem-57i1</link>
      <guid>https://dev.to/bytenaija/my-first-open-source-project-building-amazonpay-gem-57i1</guid>
      <description>&lt;h1&gt;
  
  
  Introduction
&lt;/h1&gt;

&lt;p&gt;Recently at my workplace, I was assigned the task to implement the new Amazon Pay checkout v2 in our e-commerce application. A little bit of context, we currently use Ruby on Rails on the backend and use React for our frontend. We combine the application with a mix of server-side rendering and Single Page Application.&lt;/p&gt;

&lt;h1&gt;
  
  
  Amazon Payment Flow
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--NpTEcaX3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/3c6kjt4cbebv5gyf8k7q.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--NpTEcaX3--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/3c6kjt4cbebv5gyf8k7q.png" alt="amazon.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For an e-commerce site using Amazon Pay Checkout v2, the following is the checkout and payment flow:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Prepare the Payload&lt;/li&gt;
&lt;li&gt;Send the payload to the server and get a signature by signing the payload&lt;/li&gt;
&lt;li&gt;Send the signature and the string version of the payload to your frontend application&lt;/li&gt;
&lt;li&gt;Use the payload and the signature to render an Amazon Pay button&lt;/li&gt;
&lt;li&gt;A user clicks on the rendered Amazon Pay button&lt;/li&gt;
&lt;li&gt;S/He is taken to the Amazon website where the person logs in&lt;/li&gt;
&lt;li&gt;S/He  payment method and shipping address if that is required&lt;/li&gt;
&lt;li&gt;Amazon returns to a review URL supplied by the user along with a URL parameter that contains the unique session ID&lt;/li&gt;
&lt;li&gt;Send the session ID to the server &lt;/li&gt;
&lt;li&gt;Retrieve details of the session using the session ID&lt;/li&gt;
&lt;li&gt;Update the checkout session if necessary&lt;/li&gt;
&lt;li&gt;Return the checkout session data to your frontend and display a review page where the user has the option of changing payment method and ship address&lt;/li&gt;
&lt;li&gt;Attached the amazon pay redirect URL returned from the session to a checkout button&lt;/li&gt;
&lt;li&gt;User presses the checkout button and is taken back to amazon website where the payment is processed&lt;/li&gt;
&lt;li&gt;Amazon calls the user return result URL with the same amazon checkout session parameter&lt;/li&gt;
&lt;li&gt;Send the session ID to the server and then call the SDK complete session method that allows amazon to complete the payment&lt;/li&gt;
&lt;li&gt;Display customary thank you page.&lt;/li&gt;
&lt;/ul&gt;

&lt;h1&gt;
  
  
  The problem
&lt;/h1&gt;

&lt;p&gt;Amazon currently offers SDKs for PHP, .NET, Java and Node.js. For those of us that implemented our server in Ruby, we are up the creek without a paddle. You would have to go through a relatively complicated process to get every request authenticated.&lt;/p&gt;

&lt;p&gt;To make it easy for everyone to use AmazonPay in their Ruby application, I have created the Amazon Pay Ruby SDK. This makes it as easy to implement Amazon Pay in ruby as it currently is in Node.js, or PHP, or .Net.&lt;/p&gt;

&lt;p&gt;The SDK is mostly based off of the node.js SDK so it is as safe and secure as the Nodejs SDK is. &lt;/p&gt;

&lt;h1&gt;
  
  
  Links
&lt;/h1&gt;

&lt;p&gt;The SDK is currently published in the RubyGem repository at &lt;a href="https://rubygems.org/gems/amazon_pay_sdk_ruby"&gt;Amazon Pay Ruby Gem&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The codebase is at  &lt;a href="https://github.com/bytenaija/amazon-pay-sdk-ruby"&gt;AmazonPay Ruby SDK&lt;/a&gt;.&lt;/p&gt;

&lt;h1&gt;
  
  
  Maintenace
&lt;/h1&gt;

&lt;p&gt;I will try to ensure this Gem keeps in concert with any Amazon changes to the Nodejs SDK within at least a week.&lt;/p&gt;

&lt;p&gt;I, however, welcome contributions and help maintaining the project.&lt;/p&gt;

&lt;h1&gt;
  
  
  Conclusion
&lt;/h1&gt;

&lt;p&gt;I hope this gem serves the community as well as every open source project have ever used served me.&lt;/p&gt;

</description>
      <category>amazonpay</category>
      <category>ruby</category>
      <category>gem</category>
      <category>amazon</category>
    </item>
    <item>
      <title>Sorting arrays in JavaScript</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Thu, 09 Jul 2020 08:10:45 +0000</pubDate>
      <link>https://dev.to/bytenaija/sorting-arrays-in-javascript-bh8</link>
      <guid>https://dev.to/bytenaija/sorting-arrays-in-javascript-bh8</guid>
      <description>&lt;p&gt;In the  &lt;a href="https://blog.everistus.xyz/three-methods-to-get-unique-values-from-arrays-in-es6-ck8dypcjd01a8xjs13gde9xmc" rel="noopener noreferrer"&gt;previous episode&lt;/a&gt; we discussed three methods of getting unique values from JavaScript. &lt;/p&gt;

&lt;p&gt;Sorting is a common task when working with arrays. It would be used, for instance, if you want to display the city or county names in alphabetical order.&lt;/p&gt;

&lt;p&gt;The JavaScript Array object has a built-in method sort() for sorting array elements in alphabetical order. Okay, let's get a move on.&lt;/p&gt;

&lt;p&gt;First of all, let us instantiate the variables will be sorted in this article.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;arrCharacters&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;mary&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;had&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;a&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;little&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;lamb&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;arrInteger&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="mi"&gt;6&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;100&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;200&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;11&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;30&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;1000&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;500&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;700&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;900&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
&lt;span class="p"&gt;];&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;arrObject&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;
  &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;asemota&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;unicodeveloper&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;hacksultan&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;developerayo&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;wellpaiddeveloper&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;sarah_edo&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;name&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;techgirl1908&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;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The first variable &lt;code&gt;arrCharacters&lt;/code&gt; is an array of strings, second variable &lt;code&gt;arrCharacters&lt;/code&gt; is an array of numbers and the third variable &lt;code&gt;arrObject&lt;/code&gt; is an array of objects with key-value pairs.&lt;/p&gt;

&lt;p&gt;Now let's move on the sorting these variables. &lt;/p&gt;

&lt;h2&gt;
  
  
  Sorting arrays of strings
&lt;/h2&gt;

&lt;p&gt;We will start with the array of strings. Sorting arrays of strings in JavaScript is pretty straight-forward. All you need to do is call the builtin &lt;code&gt;sort&lt;/code&gt; method on the array.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortChar&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;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;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sort&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortChar&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrCharacters&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277109764%2F2yQRCo2sp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277109764%2F2yQRCo2sp.png" alt="sort1.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;As you can see in the image above, this simply sorts the array in ascending order with no fuss and no moss.&lt;/p&gt;

&lt;h2&gt;
  
  
  Sorting arrays of numbers
&lt;/h2&gt;

&lt;p&gt;Sorting an array of numbers is not as straight forward as sorting an array of strings unfortunately although come to think of it, the extra steps you need to perform are not that difficult. &lt;/p&gt;

&lt;p&gt;Let us see what happens when we sort an array of integers like we sort the array of strings above.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortIntegerwrong&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;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;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sort&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortIntegerwrong&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrInteger&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277611395%2F9TMsfy-r4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277611395%2F9TMsfy-r4.png" alt="sort2.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;As you can see, the result is different from what we've expected. It happens because the sort() method sorts the numeric array elements by converting them to strings (i.e. 30 becomes "30", 100 becomes "100", and so on), and since the first character of the string "30" (i.e. "3") comes after the first character of the string "100" (i.e. "1"), that's why the value 20 is sorted after the 100.&lt;/p&gt;

&lt;p&gt;To fix this sorting problem with a numeric array, you can pass a compare callback, like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;//  Sort Integer Rewritten the first time.&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortInteger&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;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;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sort&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="o"&gt;=&amp;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;a&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;b&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="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;b&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;a&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="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;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="k"&gt;return&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="p"&gt;});&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortInteger&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrInteger&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277846436%2Fle9zqOGfp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277846436%2Fle9zqOGfp.png" alt="sort3.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now we finally have a well-sorted array. Let's see how it works.&lt;/p&gt;

&lt;p&gt;When a callback function is specified, array elements are sorted according to the return value of the callback function. For example, when comparing a and b:&lt;/p&gt;

&lt;p&gt;If the callback function returns a value less than 0, then a comes first.&lt;br&gt;
If the callback function returns a value greater than 0, then b comes first.&lt;br&gt;
If the callback function returns 0, a and b remain unchanged with respect to each other but sorted with respect to all other elements.&lt;/p&gt;

&lt;p&gt;There are various ways to implement the callback function in JavaScript as demonstrated below:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;//  Sort Integer Rewritten the second time. Come on!&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortIntegerOptionA&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;gt;&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;sort&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="o"&gt;=&amp;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;a&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="nx"&gt;b&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;});&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortIntegerOptionA&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrInteger&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&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="c1"&gt;//  Sort Integer Rewritten the third time. I promise, this is the final time&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortIntegerOptionB&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;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;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sort&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="o"&gt;=&amp;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;a&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;b&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;b&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;a&lt;/span&gt; &lt;span class="p"&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="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="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortIntegerOptionB&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrInteger&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277846436%2Fle9zqOGfp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594277846436%2Fle9zqOGfp.png" alt="sort3.png"&gt;&lt;/a&gt;&lt;br&gt;
They all produce the same result as above.&lt;/p&gt;
&lt;h2&gt;
  
  
  Sort an array of objects
&lt;/h2&gt;

&lt;p&gt;An array of objects in JavaScript contains objects of key-value pairs. Sorting these arrays requires the use of a callback method with the built-in sort method. However, you would need to access specific keys to be able to properly sort the arrays based on the values in the object.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Array of objects of names&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;sortArrObject&lt;/span&gt; &lt;span class="o"&gt;=&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="o"&gt;=&amp;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;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;sort&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="o"&gt;=&amp;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;a&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;&amp;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;name&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;b&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;&amp;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;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;1&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="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;sortArrObject&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arrObject&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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594279862649%2F9kD09Fokl.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1594279862649%2F9kD09Fokl.png" alt="sort4.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;What we did here was to use the callback function to check if the value of the name key of each object is greater, less, or equal to the subsequent object. The same logic we used when sorting integers also applies here. The difference is that we have to access the values of the object by the corresponding key.&lt;/p&gt;

&lt;p&gt;In this article, we have examined some ways to sort arrays in JavaScript. We will be discussing in details &lt;code&gt;Array.prototype.reduce()&lt;/code&gt; in the next episode of the JavaScript Snippet Series. Hope to see you back here soon.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>snippets</category>
      <category>algorithms</category>
      <category>sorting</category>
    </item>
    <item>
      <title>Three methods to get unique values from arrays in ES6.</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Mon, 30 Mar 2020 08:24:47 +0000</pubDate>
      <link>https://dev.to/bytenaija/three-methods-to-get-unique-values-from-arrays-in-es6-128g</link>
      <guid>https://dev.to/bytenaija/three-methods-to-get-unique-values-from-arrays-in-es6-128g</guid>
      <description>&lt;p&gt;This article was originally published on &lt;a href="https://everistus.me/three-methods-to-get-unique-values-from-arrays-in-es6-ck8dypcjd01a8xjs13gde9xmc" rel="noopener noreferrer"&gt;everistus.me&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;There are several ways and several algorithms that you can easily implement to retrieve unique element in an array in JavaScript. In this article, we will discuss three of those ways. This is the first article in The JavaScript Snippet Series. It is accompanied by a  &lt;a href="https://www.youtube.com/watch?v=aTABbLQ9yvg" rel="noopener noreferrer"&gt;video&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Using Set
&lt;/h2&gt;

&lt;p&gt;In ES6, a Set is a collection of values. The values in a set are unique in the Set's collection. Using this property of a Set, we can pass an array into a Set and because each value in the Set has to be unique, the value equality will be checked. This means the Set will only retain unique values. We can, therefore, using the &lt;code&gt;spread&lt;/code&gt; operator return a new array of unique values.&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;

&lt;span class="kd"&gt;const&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;2019&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2020&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2019&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2018&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2020&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2021&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2030&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2020&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2019&lt;/span&gt;&lt;span class="p"&gt;];&lt;/span&gt;

&lt;span class="c1"&gt;// Using sets&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;useSet&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return&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;Set&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="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;result&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;


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

&lt;/div&gt;

&lt;p&gt;This will return a new array with only unique elements like we wanted.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541120378%2FFL1Q89Dxq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541120378%2FFL1Q89Dxq.png" alt="Screen Shot 2020-03-30 at 5.04.56 AM.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Using Array.filter
&lt;/h2&gt;

&lt;p&gt;The next method we will be using is using ES6 &lt;code&gt;Array.filter&lt;/code&gt; function. The &lt;code&gt;Array.filter&lt;/code&gt; function takes a callback whose first parameter is the current element in the operation. It also takes an optional &lt;code&gt;index&lt;/code&gt; parameter and the array itself. Combining these, we can use Array.filter to ensure only unique element are returned in the array&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;

&lt;span class="c1"&gt;// Using Array.filter&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;useFilter&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&amp;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;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="nx"&gt;value&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="nb"&gt;self&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="k"&gt;return&lt;/span&gt; &lt;span class="nb"&gt;self&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;value&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&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="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useFilter&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;p&gt;This will give us the same result as before:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541388717%2FGmHXsZV7S.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541388717%2FGmHXsZV7S.png" alt="Screen Shot 2020-03-30 at 5.04.56 AM.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Using Iteration
&lt;/h2&gt;

&lt;p&gt;The last method we will consider is using a for...of loop to iterate through the array and keep only unique elements in a new array.&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;

&lt;span class="c1"&gt;// Using iteration&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;useIteration&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;map&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[];&lt;/span&gt;
  &lt;span class="k"&gt;for &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;value&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="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;map&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;value&lt;/span&gt;&lt;span class="p"&gt;)&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="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;map&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;push&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&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="nx"&gt;map&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;result&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nf"&gt;useIteration&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;p&gt;We create a new array, simply loop through the initial array and then if the current element is not in the new array, we push it into the new array else, we leave it out. At the end of the iteration, we return the new array that contains unique values.&lt;/p&gt;

&lt;p&gt;It also produces the correct result for us&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541388717%2FGmHXsZV7S.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.hashnode.com%2Fres%2Fhashnode%2Fimage%2Fupload%2Fv1585541388717%2FGmHXsZV7S.png" alt="Screen Shot 2020-03-30 at 5.04.56 AM.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;That is three simple ways to return unique values in an array in ES6. &lt;/p&gt;

&lt;p&gt;Note: We did not discuss the time and space complexity using these simple algorithms. If you would like to discuss it, why not add a comment either on the youtube page or on the comment below. &lt;/p&gt;

&lt;p&gt;We will be discussing array sorting in the next episode of JavaScript Snippet Series.  Hope to see you back here soon.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>arrays</category>
      <category>es6</category>
    </item>
    <item>
      <title>My Skills Development List</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Sun, 26 May 2019 11:11:31 +0000</pubDate>
      <link>https://dev.to/bytenaija/my-skills-development-list-25dn</link>
      <guid>https://dev.to/bytenaija/my-skills-development-list-25dn</guid>
      <description>&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--tumc0Zo5--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://hlny.org/wp-content/uploads/2016/09/career-development.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tumc0Zo5--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://hlny.org/wp-content/uploads/2016/09/career-development.jpg" alt="https://hlny.org/wp-content/uploads/2016/09/career-development.jpg"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this article, which happens to be the first I will be publishing on dev.to, I will be going through a list of Software Development topics and tools I will develop my skills on. Although I would not outline the plan to do this here, I however have developed such a plan and would be willing to share same if you want the plan. If you need the plan comment your email below and I will send it to you, but remember to modify the plan to suit your needs when you get it. &lt;/p&gt;

&lt;h2&gt;
  
  
  Background
&lt;/h2&gt;

&lt;p&gt;I am a Software Engineer who has traditionally worked out of Nigeria both as an onsite and remote Engineer. Since I was young, I loved reading and learning new things. I keep having this pressure inside of me when I see new Software Engineering tools that I know nothing about. When I was 12, being unable to pay tuition at the school I was attending, I spent most of the year reading books in the local library. I read anything from fiction to Encyclopedia. That was when I first read about how the Hubble Space Telescope was built. Learning new technology has been an integral part of whom I am and the proliferation of technologies I know nothing about is heartrending for me. &lt;/p&gt;

&lt;h2&gt;
  
  
  Why these Technologies
&lt;/h2&gt;

&lt;p&gt;The technology I will be spending time learning spans from DevOps to Cloud to Programming Languages. Before we go to the details of the specific technologies I will be learning, let me give you an idea of the technologies I already use or know a bit about:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;PHP/Laravel&lt;/li&gt;
&lt;li&gt;JavaScript (Node.js, React.js, Vue.js, React Native, Express)&lt;/li&gt;
&lt;li&gt;GraphQL&lt;/li&gt;
&lt;li&gt;Databases (PostgreSQL, MySQL, MongoDB, Redis)&lt;/li&gt;
&lt;li&gt;TDD (Jest, Mocha, Chai, Puppeteer)&lt;/li&gt;
&lt;li&gt;HTML/CSS, SASS&lt;/li&gt;
&lt;li&gt;Git&lt;/li&gt;
&lt;li&gt;Redux, Flux, Vuex&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;There are other tools or concept that I know well enough about but did not make it to this list. &lt;/p&gt;

&lt;p&gt;To answer the question, why these technologies? requires an understanding of the tech ecosystem today. The trend of cloud based technologies, serverless computing, continuous integration and continuous delivery, etc rules the software engineering field today. As an engineer, whether frontend, backend, fullstack or devops, you are required to not only know about your craft, but from most of the job advert, it is an advantage to know a lot of the technologies listed below. I like to think of it this way; If I happens to own a startup where all the engineers suddenly resign a few weeks to launch, I should have enough knowledge to muddle through the launch. &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Yeah I know, it must be an awful startup to have all the engineers quit at the same time. Let's just say we would have a difference of opinion on who is the G.O.A.T in football. BTW it is Cristiano Ronaldo. And the best club is Chelsea FC&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Technologies
&lt;/h2&gt;

&lt;p&gt;So finally we move on to the various technologies that I want to learn within the next nine months:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Continuous Delivery

&lt;ul&gt;
&lt;li&gt;Docker&lt;/li&gt;
&lt;li&gt;Jenkins&lt;/li&gt;
&lt;li&gt;Circle CI&lt;/li&gt;
&lt;li&gt;Travis CI&lt;/li&gt;
&lt;li&gt;Kubernetes&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;Cloud Technologies

&lt;ul&gt;
&lt;li&gt;AWS&lt;/li&gt;
&lt;li&gt;GCP&lt;/li&gt;
&lt;li&gt;Azure (Certification this year)&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;TDD

&lt;ul&gt;
&lt;li&gt;React Testing Library&lt;/li&gt;
&lt;li&gt;Enzyme&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;Languages

&lt;ul&gt;
&lt;li&gt;Typescript&lt;/li&gt;
&lt;li&gt;Go&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;Messaging and Real Time

&lt;ul&gt;
&lt;li&gt;RabbitMQ&lt;/li&gt;
&lt;li&gt;Kafka&lt;/li&gt;
&lt;li&gt;Socket.io&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

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

&lt;p&gt;It is going to take me a great while before I can be proficient in this technologies especially with respect to the cloud technology and Go but one thing I know is that if I dedicate sufficient time to this, it will definitely be worth it for my peace of mind or career progression. Follow me on twitter &lt;a href="http://twitter.com/bytenaija"&gt;http://twitter.com/bytenaija&lt;/a&gt; to know how it goes.&lt;/p&gt;

</description>
      <category>career</category>
      <category>skills</category>
      <category>skillsdevelopment</category>
    </item>
    <item>
      <title>I am a JavaScript Developer who likes learning a lot, Ask Me Anything!</title>
      <dc:creator>Everistus Olumese</dc:creator>
      <pubDate>Mon, 18 Mar 2019 11:11:24 +0000</pubDate>
      <link>https://dev.to/bytenaija/i-am-a-javascript-developer-who-likes-learning-a-lot-ask-me-anything-51fp</link>
      <guid>https://dev.to/bytenaija/i-am-a-javascript-developer-who-likes-learning-a-lot-ask-me-anything-51fp</guid>
      <description>

</description>
      <category>ama</category>
    </item>
  </channel>
</rss>
