DEV Community: Nyior Clement Jr.

Dynamic and Asynchronous Vue Components: The What & How

Nyior Clement Jr. — Sun, 10 Sep 2023 18:49:39 +0000

It’s asking the right questions that count, they say. So let’s exploit that ancient wisdom and kick things off here with the questions that matter :)

The image above shows a user interface with two tabs: JobDescription and ApplicationForm. We want to explore how to create tabbed interfaces like this one using Vue.

It's easy to think it's simple – just create <JobDescription /> and <ApplicationForm /> components and render them to the DOM, as shown in the snippet below. But is it really that straightforward?"

<template>
  <JobDescription />
  <ApplicationForm />
</template>

Well, that's not quite right. If we render our components that way, both of them would appear at the same time. What we need is to have a single component appear dynamically based on the selected tab.

There's some dynamic behaviour we need: while we anticipate the user's selection of one of two components, the precise choice remains uncertain. What we want is a placeholder, a receptacle if you will, where Vue could insert components based on the selected tab in real-time.

Using vue-router here is not ideal. We do not want our URL changing when users switch between tabs. They are tabs, not pages.

So we pose the question, how can this type of dynamic behaviour be achieved in Vue?

I will show you how, but first, let's take a quick detour...

Suppose we've managed to learn how to dynamically render components in Vue. With this in mind, let’s take our analysis a step further. You may have already observed that the 'ApplicationForm' tab includes a basic job application form with a field for entering the full names of applicants.

Typically, if you enter your name in the 'ApplicationForm' tab's input field, then switch to the 'JobDescription' tab, and come back to your form, you'll notice that what you typed in the input field is gone. The image below illustrates this behavior:"

If you think about how Vue renders components, you’d see that this type of behaviour is expected. Every time we switch from a component, Vue un-mounts that component.

In our scenario, when transitioning from 'ApplicationForm' to 'JobDescription,' Vue un-mounts the former from the DOM and then mounts the latter. Any input in the field is lost because Vue needs to completely re-render the 'ApplicationForm' component when we switch back to it.

Could we potentially retain the state of a tab we've just left, you may ask? After all, we wouldn't want our users to have to re-enter their information from the beginning whenever they switch to a different tab, would we?

This brings us to our second question: How can we persist the state of components in our tabs scenario? What we want is an effect like the one shown in the image below:

Again, let’s assume we’ve somehow figured out how to persist the state of our components, and in our quest for perfection, we want to do one more thing: some performance optimization.

You see, even though Vue dynamically renders our components one at a time, depending on what tab is selected, whenever that page is visited, Vue would load the code for all the tabs on that page. Imagine if we had thousands of tabs we could switch between - not ideal, but a little bit of exaggeration could help here.

The first time that page is visited the code for all the thousands of tabs would be loaded from the server. I put this to you: Especially since Vue would only be rendering one tab at a time to the DOM, is grabbing the code for all the tab components upfront really necessary? What potential performance drawbacks might arise from this approach? Take a moment and reflect - or maybe you don't need to.

If your spidey-sense is already telling you there’s got to be a better way, then you’re absolutely right. What we could do is have Vue load the code for a tab only when it’s selected. So each time the page is visited only the code for the default tab is loaded. For other tabs, they’d only be loaded when visited. If you want to associate this technique with a name, just call it lazy loading.

This brings us to our third and final question: How can we implement lazy component loading in Vue?

In the subsequent sections, this piece would demonstrate how you could address the first two questions we raised with Vue Dynamic Components and how you could implement lazy loading with Asynchronous Components.

Dynamic Components

As mentioned just now, we could implement tabbed interfaces where users could switch between tabs and have each tab persist its state with dynamic components.

Normally, to add a component to a template, we’d add it by name to the template like in the snippet below:

<template>
  <ApplicationForm />
</template>

That way, we are statically adding our component to that template and by extension statically rendering it to the DOM. What makes a component in Vue dynamic is the fact that instead of statically adding the component to the template we’d have a placeholder of some sort where Vue could insert one of many components after some action happens. A placeholder?

Well yes. Vue has an inbuilt <component> element with the special is attribute:

<component :is="currentTab"></component>

The <component> element in the above is the placeholder, and the component rendered in that frame would change once the component CurrentTab is tied to changes. To make this work with our tabs scenario, you’d need to have a list of components defined in the script section of your component. At each point, one of the components in your list has to be mapped to currentTab. The <component> frame would then render whatever component is tied to currentTab. Way too abstract? Okay, let’s look at how we could do this with our ApplicationForm and JobDescription tabs.

The snippet below shows what the script section of our component would look like:

<script>
import JobDescription from "@/components/JD.vue"
import ApplicationForm from "@/components/ApplicationForm.vue"

export default {
  components: {
    JobDescription,
    ApplicationForm
  },
  data() {
    return {
      currentTab: 'JobDescription',
      tabs: [ 'JobDescription','ApplicationForm']
    }
  }
}
</script>

In the snippet above, we initialized tabs array with the components we imported. We then set JobDescription to be our default currentTab. What this means is that each time that page is visited, the JobDescription tab is what will be shown. But how do we update our currentTab to ApplicationForm when users switch to that tab in the UI? The update is done in the <template> section of our component as shown in the snippet below:

<template>
    <div>
        <button
          v-for="tab in tabs"
          :key="tab"
          @click="currentTab = tab"
        >
          {{ tab }}
        </button>

          <KeepAlive>
            <component :is="currentTab" class="tab"></component>
          </KeepAlive>
    </div>
</template>

In the snippet above we are using @click to update currentTab to the tab being clicked. One other thing you might have noticed is how the <component> element is wrapped by a KeepAlive component. The keepAlive is an inbuilt component that preserves the state of our component. In our case with the keepAlive around, when switching from the ApplicationForm component, whatever we typed in the input field would still be there when we return.

Two of our concerns had been addressed. What’s left for us now is exploring how we could load components on-demand. We previously tagged this lazy loading. Let’s quickly look at how we could do this.

Asynchronous Components

Let’s load our ApplicationForm component on-demand. Note that you could apply this to just any component. To load our component in question asynchronously, all we have to do is update how we are registering the component. See the snippet below:

<script>
import JobDescription from "@/components/JD.vue"
// import ApplicationForm from "@/components/ApplicationForm.vue"
import { defineAsyncComponent } from 'vue'

export default {
  components: {
    JobDescription,
    ApplicationForm: defineAsyncComponent(() =>
      import('@/components/ApplicationForm.vue')
    )
  },
  data() {
    return {
      currentTab: 'JobDescription',
      tabs: [ 'JobDescription','ApplicationForm']
    }
  }
}
</script>

Essentially, the only change we made is in using vue3’s defineAsyncComponent feature to register our ApplicationForm as an asynchronous component. With that, the ApplicationForm component will be loaded on demand.

Conclusion

In this piece, we’ve seen how we could render components to the DOM dynamically in Vue. We’ve also seen how the inbuilt <KeepAlive> component in Vue could help us persist the states of our component. And lastly, we explored how we could load components on demand to optimize for speed.

That’s all I have for you :)

If you want to share your thoughts on this tutorial with me or simply just connect, you can find/follow me on Github, Linkedin, or Twitter.

DR-CLI: A Flexible Cookie cutter and CRUD Endpoints Generator for Django

Nyior Clement Jr. — Fri, 13 May 2022 15:50:21 +0000

I've been writing REST APIs with the Django framework for some time now. Over the years, I couldn't help but notice, with discontent, how I've been repeating certain things in every project.

And there were things I just wished could be better. Permit me to kick this off with a catalogue of some of the issues I felt needed fixing :)

Problem-1: First of all, I noticed I was repeating at least one of the following integrations/features in every project:

A custom user model defined in a users app
Authentication endpoints.
python-decouple: for managing environment variables
drf-spectacular: for auto-generating API docs
dj-database-url: for connecting to various databases
pre-commit, black, isort, flake8: for code linting with pre-commit hooks
pytest-django: for writing unit tests with pytest
Docker: for containerization.

At a point, I wished there was a tool that could start my project with the integrations I need already configured. I found cookie-cutter-django-rest to be useful, but sometimes it's just an overkill for my use-case.

I needed something more flexible. Something that could start my project with a few or all the integrations above as the case may be.

Problem-2: Furthermore, I also realized I was always creating CRUD endpoints for most of the database models I define. CRUD endpoints like authentication are mainstay of most projects.

But most importantly, CRUD endpoints are so nondescript that I wish there was a tool to automate the task of writing them myself.

This type of automation I believe is necessary as it would save me minutes and perhaps hours(when dealing with hundreds of models) spent on the mundane CRUD stuff :(

Problem-3: Lastly, I had always wish there was a way to create multiples apps at once in my Django projects. I felt the need for this feature because most times I tend to know all the apps in my project at the design phase.

Overall, I was just dissatisfied with the time spent configuring third party packages, and writing CRUD endpoints when I could channel that energy into the more exciting parts of my projects.

To solve my problems, I scoured GitHub and PYPI for that one tool forged with the "super powers" to start my project with the integrations I need already configured as well as the potential to generate CRUD endpoints for the models I define with just a command.

My hunt ended rather disappointingly, and I figured well, maybe someone needs to create that tool.

Enter Django Rest CLI(dr-cli)

We created dr-cli to be a tool that comes bundled with:

The capability to start your project with the integrations you need already configured. For example: authentication endpoints with dj-rest-auth, auto-generated docs with drf-spectacular, docker support, and more.
The potential to generate CRUD endpoints for the models you define. For example, if you define a model, Product in your models.py file, this tool could generate a GET /products POST /products PUT /products/ etc. endpoints for that model.
An ability to create multiple apps at once in your project.

Cool, how can I get started with this?

Getting Started

Installation

pip install dr-cli

I highly recommend that you install this in a virtual environment.

Create a New Project

Run dr-cli startproject project_name

You'd be prompted to start your project from one of three templates: Basic, Medior, and Advanced templates. Learn more about what each template comes bundled with here.

On selecting one of the templates your project will then be created. Git will be initialized in your project, and all project dependencies installed.

The generated project comes with a nice Readme containing the steps for running the project.

Create New Apps in your Project

Run dr-cli startapps todo me-nu user

Where todo, me-nu, and user are the app names.

On running the above command, name validations would be performed first, and then all apps that pass the validation would be created.

Note: Make sure to add your created apps to the list of INSTALLED APPS

Generate CRUD Endpoints for your Apps

Run dr-cli addcrud memo user

to create CRUD endpoints for the models defined in the memo & user apps, for example.

Note: Make sure to register the URLs for each app in the top level urls.py file.

Accessing the docs page

Run python manage.py runserver to fire up your local development server, and point your browser to http://localhost:8000/api/v1/docs to view the auto-generated docs page similar to the one shown in the image below:

You can visit the project's repository to see a nice demo demonstrating these commands.

We are seeking ways to improve our current implementation. We'd really be happy to hear your thoughts. You can find me on LinkedIn, Twitter or GitHub.

Unveiling Django-rest-paystack: A minimal plugin for integrating the Paystack payment gateway into a Django API backend.

Nyior Clement Jr. — Tue, 11 Jan 2022 10:05:51 +0000

wtf(pardon my French) is django-rest-paystack?

First, Django is a tool that helps us build web applications. If/when you feel the need to dazzle your audience, you can call Django a web framework LOOL. Think Laravel, Node, and Spring. Django-rest-framework is built on top of Django. It just makes writing REST APIs with the Django framework so much easier.

Second, Paystack is a service that makes processing payments in our projects easy-breezy. Think Stripe, Paypal, and Razorpay.

Lastly, django-rest-paystack is a library we made. The goal with this project is to make the task of integrating the Paystack payment gateway into a django-rest project a snip.

Is this even useful?

Well, I'd let you be the judge of that. But from my personal experience, creating those payment endpoints for every single e-commerce project we work on could become redundant and perhaps somewhat boring overtime. While there are different approaches to integrating and processing payments with any payment gateway, in each approach, the flow doesn't really change. If it doesn't change then why repeat yourself?

Enter django-rest-paystack

when installed and configured in your project, this package generates all the endpoints you'd need to start and complete a transaction. Literally everything from initializing a transaction, handling webhook, and persisting useful transaction data. This package handles all the mundane payment stuff, just so you could focus on the more dynamic and exciting parts of your project. Did I mention that this package is very extensible?

How can I get this?

You can install the package in your project with pip :
pip install django-rest-paystack

You can also checkout the project on GitHub.

I love this package. How can I thank you?

Just share this with your friends, and leave us a star on the repo. I'd love the attention :)

The Django Framework: An Overview

Nyior Clement Jr. — Mon, 05 Apr 2021 18:18:19 +0000

Hi there,

Where have I been? Around the world and now I'm back again :D It's been a while since the last time I wrote. I recently got done with school, and I had to move from my city to a different city. I've been quite busy and lazy too. How I'm able to use the words busy and lazy in the same sentence is something that I don't want to talk about right now. Why? Because I'm only here to talk about Django. Oh, Django the famous Belgian-born jazz guitarist? LOL NO! I'm talking about Django the web framework.

What is a web framework you ask?

Literally, a framework = frame + work. In other words, a framework provides us with a frame for doing some work. So when we talk about web frameworks, we are talking about the frames that allow us to do some web-related work. But what is a frame you ask?

Seen a picture frame before? it provides a predefined layout for inserting pictures. same with a building frame. Thus, a web framework is more or less like a picture frame. It describes a predefined architecture for building web applications and more.

And more? Yes, web frameworks also provide reusable components that make developing web applications so much easier. A reusable component provided by a web framework is usually some code that takes care of some repetitive task that's an essential component of all web applications. Essentially, all web applications map client requests to some business logic that modifies or reads some data and then returns a response. Mapping URLs or requests to some business logic, managing an application's data, and dynamically rendering an HTML page based on some data retrieved from the database are three examples of the most common problems all web applications have to deal with. The three problems mentioned are formally called routing, database management, and templating. Web frameworks exist to solve problems like the ones mentioned above and more.

Now, if you don't get anything I have said in the paragraph above, just remember these two things: web frameworks provide us with a predefined architecture and reusable components for building, and running web applications. But that begs the question, if Django is a web framework, how does it discharge the two functions mentioned above?

Django provides a predefined architecture that forces the developer to separate the development of an application into three loosely coupled components: the component that manages an application's data and usually interacts directly with the database, the layer that presents data to or accepts data from the user; usually this is what most users interact with, and lastly the part that sits between the data management layer and the data presentation layer. This layer grabs data, usually, some user input, from the presentation layer, manipulates the data, and then passes it to the data management layer. This layer is also capable of fetching data from the data management layer, manipulating, and formatting the grabbed data in a certain way, and then returning the data as a response to the presentation layer. If you ever feel the need to impress anyone, you could tell them the Django web framework uses a Model-Template-View(MTV) architecture. Where MTV represents the data management, the presentation, and the third layer that sits between the data management and presentation layers respectively. As most of you might have figured out already Django is not really doing anything new. It just puts its twist on the popular MVC software development pattern.

Oh okay, I get the architecture that Django provides, but what reusable components does it come with?

In fact, the provision of reusable components is Django's greatest strength. Django is tagged as a 'batteries included' framework. It comes fully loaded with lots of extras that make the development of web applications faster and easier. Django comes bundled with components like the Admin backend with a corresponding web interface, Object Relational Mapping(ORM) tool, Routing, and Templating features that allow developers to focus on the application's business logic that changes from application to application and not these mundane tasks that stay the same, more or less.

An admin panel is one of the pivotal components of most modern web applications. In fact, it's unimaginably hard to come across a web application without an admin panel. If the application does not have an admin panel just yet, it's only a matter of time until that basic application needs one. Django recognizes this repetitiveness with admin panels; developers have to make an admin panel for every web application they develop. Repetition isn't Pythonic. Thus, to allow developers to focus on the more important things like the application's core business logic that's more likely to change from application to application, Django comes bundled with an admin full-stack logic. This logic automatically adds an admin panel to every web application created with the Django web framework. Essentially, the Django admin view allows users with the required permissions to manage an application's data from a web interface.

In a similar fashion, Django also recognizes the fact that the data layer is one of the standard components of most modern web applications. As a result, Django also comes with a tool out of the box that makes working with relational databases like Mysql and Postgresql so much easier. Django comes with an Object Relational Mapping(ORM) tool. ORM? Don't worry, ORM is just another computer science jargon that's not too hard to understand at all.

Normally, how you'd interact with your SQL-based database in let's say Python, is through SQL queries. For example, to get a list of all the users from a database table named Users you'd write an SQL query that looks like this:

SELECT * FROM Users;

While this works, it could be really time-consuming as you'd have to write both Python and SQL code. Furthermore, while this is not advisable, sometimes developers use one relational database for development and a different one in the production environment. In situations like that, the developer would have to make modifications to the code that interacts with the database. Object Relational Mapping solves this problem; essentially, it allows you to call and manipulate data from the database using your language of choice, for example, Python instead of SQL. In addition, the ORM also allows switching between relational databases with minimal code modification. In python and many more languages like it, Object Relational Mapping could be achieved using a tool called the Object Relational Mapper. The Django web framework comes with an inbuilt Object Relational Mapper that allows developers to interact with their databases using vanilla Python code.

Furthermore, Django also recognizes the fact that the task of mapping an incoming request(usually a URL path) to some application logic that in turn returns a response could be hard and somewhat repetitive. Again, to allow developers to focus on the main application logic, Django comes with an out-of-the-box solution that routes the incoming request to a Django view function(which is usually some defined logic for executing some task). Django is able to achieve this by allowing developers to specify a list of URLs in a URL configuration file. Each URL in the list is a path to match against the URL, and a target, which is either a view function or a different URLconf. Django is able to correctly route requests to the appropriate view function on behalf of the developer by looking at the list of URLs defined in the URLconf file and invoking the view function mapped to the URL pattern where a match is found.

Lastly, one common problem that arises in almost every web application is the issue of displaying content that changes frequently on an HTML page. In other to make rendering dynamic content within static HTML pages more convenient, Django uses a solution adopted by most web frameworks. Django uses templates to render dynamic content within a static HTML page. A template contains the static parts of the desired HTML output as well as some placeholder for inserting dynamic data. Django and many more frameworks like it is able to achieve this through the use of a template system that it provides out of the box. Django uses a template system called the Django template language (DTL). Django also ships with a built-in backend for the popular Jinja templating engine. The Django template system allows you to specify variables using a "double-handlebars" syntax e.g.

{{ variable_name }}

The variable_name will be replaced by values passed in from the view function when a page is rendered. The template system also provides support for expressions

(with syntax: {% expression %})

Syntax like the above would allow templates to perform simple operations as iterating list values passed into the template.

Conclusively, Django is a batteries-included web framework that puts its own twist on the popular MVC architecture. Django comes with lots of out-of-the-box solutions like the admin interface, a routing mechanism, an ORM, and a template system that makes developing web applications with this tool very convenient.

A Better Way to Shorten Your URLs

Nyior Clement Jr. — Wed, 30 Dec 2020 20:02:39 +0000

To shorten your URLs, I imagine that what you would normally do is copy the URL to be shortened, navigate to one of the many URL shortening websites out there, and have it shortened. Yes, that works, but do you have to go through all that just to shorten a URL?

No, you don't. Recently, we made a browser add-on for Google Chrome code-named klinurl. With klinurl, you could now shorten your URLs with just a click. You don't have to leave your browser's current tab. Klinurl saves you the time you would usually commit to making a decision about what URL shortening website to use and the effort required to navigate to one of these sites. klinurl is all about making the URL shortening process more convenient for everyone.

Our add-on is currently available in the chrome web store. For installation, you could find it here. We are super interested in hearing what you think of our extension. You could do that by giving us a review in the chrome web store.

Klinurl is currently a public repository on Github. Thus, PRs are welcome. Or do you just love what we are doing? Find our repo below and give us a star.

MLH-Fellowship / klin-url

google chrome add on for shortening urls

KlinUrl: Google Chrome URL Shortener

A google chrome addon for shortening urls in a more convenient way

Project Descripttion

This google chrome add on helps people especially developers shorten urls easily without having to visit sites like bitly. It makes shortening urls more convenient😃

If you like this repo, click the ⭐

Frontend Project Setup(klinurl_frontend folder):

clone project to your local machine
navigate to the klinurl_frontend directory

To install project dependencies(jest) run:

npm install

To test if it works, visit chrome://extensions in your browser and ensure that the Developer mode checkbox in the top right-hand corner is checked.
Click Load unpacked extension and select the directory in which your extension files live(basically, this project's folder). If the extension is valid, it will be active straight away so you can click on the extension's icon in your browser's address bar; this action should trigger a display of a pop up icon.

…

View on GitHub

Find below an explainer video that explains how klinurl works.

Artificial Intelligence Vs Machine Learning Vs Deep Learning: A Quick Comparison

Nyior Clement Jr. — Sun, 20 Dec 2020 22:00:28 +0000

The buzzwords AI, ML, and DL had always confused me. In fact, I had wrongly used them interchangeably several times. I say wrongly because, now that I understand what each of them means, it's very clear to me that even though they're related, they don't mean the same thing. It took me a bit of research to really understand these three concepts and how they differ. In this piece, I'd be sharing with you my understanding of these terms. Permit me to begin this writing by interrogating the eldest of the three.

Artificial Intelligence

By way of definition, we could say that artificial intelligence is a field of study that most of my friends are completely disinterested in :)

Come onnnnn are you kidding me?

Well, not really. While the definition above might come off as a complete joke, there are actually two facts in it:

Yes, most of my friends fiercely hate artificial intelligence.
Artificial intelligence is a field of study or branch of knowledge.

For now, we would ignore the first fact and pursue the second one. The common denominator to all fields of study is that they answer at least one fundamental question about humanity. For example, Physics tries to unravel how the universe works, History explores the evolution of human cultures and Biology demystifies life. But this begs the question: If AI is a field of study then what fundamental question about humanity does it try to answer? Artificial intelligence tries to answer this one question: How can we build machines with human intelligence?

With this understanding of artificial intelligence, we could redefine AI as a branch of knowledge that primarily concerns itself with building machines that could perform tasks that would usually require human intelligence. While endowing machines with human intelligence is a really broad statement, see it as giving machines the ability to learn, build some pool of knowledge/experience from what they've learned, and then use these experiences to solve problems.

Oh okay, Nyior I get what artificial intelligence is, but the idea of building machines that are as smart as humans sounds really impractical to me. I mean how can this be achieved?

It's simple. I present to you...

Machine Learning

It is one of the ways artificial intelligence could be achieved. It's centered around the idea that we could endow machines with human intelligence if we give them access to data and allow them to learn from that data.

what does learning entail you ask?

“Learning” entails using sophisticated mathematical algorithms to optimize some function called the predictor function so that, given input data x about a certain domain (say, square footage of a house), it will accurately predict some interesting value h(x) (say, the market price for the said house).

Yo Nyior, you're just saying buzzwords oh 😭

abeg no vex, let's try to make sense of that fancy definition😅. The key to making sense of the definition above lies in understanding what a predictor function is. Usually, when programmers write code, they are basically just hard coding rules that could be used by the machine to solve a given problem. Most rules in programming are expressed with some mathematical function. However, hardcoding rules for machines is not the machine learning way of building algorithms. In machine learning, we give our algorithm some data and allow them to autonomously discover those rules themselves. Thus, predictor functions are the rule(s) that a machine learning algorithm has to discover.

How do ML algorithms automatically generate the predictor function you ask?

An ML algorithm is first passed a function that performs really poorly at the task at hand. This could be something like y = theta1 + theta2x. The algorithm then learns by optimizing the initial function it was passed to do better at the given task. A function formally called the loss function, indicates the degree of the wrongness of a predictor function. Thus, generally, training a model in ML implies calling the loss function to measure the degree of the wrongness of the predictor function after every training data had been passed to the algorithm. In addition, learning in this context simply means exposing an ML algorithm to some data and having it optimize its predictor function.

Deep Learning

It is a subset of machine learning. Technically, deep learning is machine learning. It is just the collective name for the revolutionary breed of machine learning algorithms that had recently appeared on the AI scene. ML algorithms under the deep learning umbrella, unlike the traditional ML algorithms; have a logical structure that models the structure and behavior of the human brain. Algorithms that follow this structure are called Artificial Neural Networks(ANNs).

But what is this structure you ask?

Deep learning algorithms possess a layered structure that simulates the architecture of the human brain(a network of neurons). In a nutshell, the human brain functions by passing an electrical charge emitted by some neuron to the next neuron. Similarly, deep learning algorithms make computational decisions by accepting some data through the first layer called the input layer, manipulating the data, and then passing its output to the next layer, until it reaches the last layer called the output layer. ANNs could have one or more layers between the input and output layers. ANNs with more than one layer between the input and output layers are called deep neural networks.

Conclusively, think of AI as this broad concept of building machines that are as smart as humans, machine learning as one practical way of achieving artificial intelligence, and deep learning as the collective name for machine learning algorithms that model the structure and behavior of the human brain.

How to Waste the Remaining Six Weeks of the MLH Fellowship.

Nyior Clement Jr. — Mon, 16 Nov 2020 13:55:21 +0000

To all my fellow explorers, congratulations on making it this far!
Yes! we've all been working very hard, and it's surely worthy of praise.
But don't sit back, it's not over yet; we are still in the race.
Okay, Enough of the smooth and easy stuff.
Let me hit you with something tuff.

The MLH team needs to clad us all in gold for our Genghis-Khan-like bravery in battle...lol. Battle? Yes! The past six weeks, for me, every single day was like a puzzle that needed to be solved. But in the end, we are all still here. And now, we have just little time left to wrap up this fellowship. We've spent the first half of this fellowship connecting with new people, working on projects, and for me all these experiences had added up to an overwhelmingly inestimable lessons.

Please permit me to, in this piece, share some of these lessons I had learnt; more specifically, tips on how to waste the six weeks that we have left in this fellowship... haha.

Focus on the Technical Aspect of the Fellowship and that Alone!

Build bridges? nah! burn them! You don't need to walk on any bridge to become a successful developer. You could just swim anyway.

not always about what you know, sometimes it's about who you know? Gibberish! That's what incompetent and highly political people say to justify their efforts to replace meritocracy with nepotism in the workplace. And fortunately for us all they haven't succeeded. These days you don't need any network to become a successful entrepreneur or get your dream job.

Be intentional and relentless in your efforts to avoid all avenues provided by the MLH team to help you improve your soft skills. Also avoid opportunities provided by the MLH team to help you build relationships through 1-on-1s, and to improve your communication/presentation skills through show and tells, and round tables. Focus on improving your hard skills alone and you go dey alright (you'll be fine).

Work With New Sets of Technologies Every Sprint

The best generalists were at some point specialists? Come on! that doesn't even make sense! You are better off working with new sets of technologies every sprint. You are better off having just a shallow understanding of all the programming languages and frameworks of our time. I mean, who even cares about how well or deep you understand a technology?

I know even as you read this, some of you would argue that it's easier to transition to a new technology if one already has some prior deep understanding of a related technology. What a lame argument! After all, the explorer track is all about experimenting with new technologies and of course that ultimately means working with new sets of technologies every sprint and not pursuing an interest.

Completely Ignore the Engineering Focus of Each Sprint; Who Cares About These Things Anyway

Git? Clean code? Security? Testing? For crying out loud who comes up with these things? The MLH team expects fellows in the explorer track to focus on each of these per sprint? What a waste of time! Software engineers only write code. All these other things are just distractions. Focus on writing code and that alone.

Why waste your valuable time learning a version control system when you could spend that time perfecting your Python or Javascript skills. Why push your code to some remote server when you'd just be fine having it locally on your own machine?

I'm so tired of all the bullshit(please pardon my french) about version control systems making collaboration between devs easier, helping developers and organizations track changes made to a code base overtime and serving as a backup of some sort in cases of file loss. I strongly don't think these are good reasons to learn and use a version control system and I hope you see things the way I do. These guys only want us to learn this thing because everyone uses it! You don't have to fit the mold tho! Don't bow to societal pressure! Just do your thang and ignore all the noise around you.

Like learning how to use git effectively isn't enough burden already, the MLH team wants its fellows to focus on learning how to write clean code and a bunch of other things? clean code? You don't need that. You're not writing code for other people; you are writing code for yourself. So your code is excellent provided you can always understand what you've written.Even if you don't understand the code, it doesn't really matter! It still works.

Only Work on Your Team's Project When Motivated

Yes! you read that right. I really don't have much to say here. All I can say is, the best way to get a lot done is by only working when you are motivated.

Ladies and gents! commit to applying all the above tips and you will successfully waste the remaining six weeks we have left in this fellowship...haha

Lastly, on a somewhat unrelated note, if the sarcasm in this writing isn't very obvious then I did a horrible job. Please forgive me. It's not intended to be rude.

Okay I'm done.

Beginners Guide to Recursion

Nyior Clement Jr. — Thu, 15 Oct 2020 05:00:35 +0000

In most programming languages, we use loop constructs like ‘while’ and ‘for’ to repeatedly execute a block of code until a certain condition is met. A recursive function does pretty much the same thing; except that it does this by calling itself within itself! And just as in loops it stops calling itself when a certain condition is met. Thus, in computer programming, recursion is when a function calls itself.

In code this is what recursion looks like:

def decrement_number_until_zero(number):
    print(number)
    decrement_number_until_zero(number - 1)

Oh that Works ?
Well, it wouldn’t! Why? When executed this function will throw a stack overflow error.

Stack Overflow Error ?

A stack at the most basic level is a data structure that only exposes its topmost element. Think of a stack as a cylinder with one end open and the other end closed. In such a cylinder you obviously can only add and remove items from the open end. A stack is often referred to as a first in last out data structure. This is true because since stacks only allow you to add and remove items from the top of the stack only, then the last element to go into the stack will be the first to go out and the first to go into the stack will be the last to go out. Adding an element to a stack is called pushing and removing an element from a stack is called popping.

Okay, How is this Connected to Stack Overflow You Ask?

Well, anytime you make a function call, in Python and most programming languages, the function is pushed into a stack data structure called the call stack. And when the function returns, the function is popped from the call stack. Each function pushed into a stack is called a stack frame. A stack frame basically stores information like the variables used in a function and where the function is suppose to return to among others. In recursive functions every single time a function references itself that same function is pushed into the call stack. In Python there is an upper bound to the number of functions a call stack could accommodate at once.

Our function above will throw the stack overflow error because our function will attempt to add it self to the call stack for an infinite number of times. Remember, the call stack in python has a threshold. The stack overflow error is thrown when the threshold is reached.This is happening because the function definition does not specify the condition for when the function is suppose to stop calling itself. This condition is called the base case. So a better way of writing the function above will be this:

def decrement_number_until_zero(number):
    if number > 0:
        print(number)
        decrement_number_until_zero(number - 1)

This revised function wouldn’t attempt to execute to infinity because now a condition for when it should stop executing had been provided.

A second example of seeing recursion in action is seen below:

def reverse_string_recursively(string):
     if len(string) == 0:
         return string
     else:
         return reverse_string_recursively(string[1:] )+ string[0]

The function above reverses a string recursively. Again this is a great example of recursion because it specifies a condition for when the program should end execution.

As you might have figured out already, a good recursive function has two parts:

Base case: a boolean expression that when it evaluates to ‘true’ the program execution terminates
Recursive case: is the part that executes when the base case evaluates to false. Usually this is where the function references itself.

Now I’ve said a lot about call stacks, base cases and recursive cases. Let me quickly demonstrate how recursive functions are executed under the hood.

The way recursive functions execute under the hood could be likened to a storyteller who is telling a story about Person A then switches mid way to a story about person B then again switches mid way to a story about Person C. At the end of Person C’s story, the storyteller then goes back to the story about Person B where s/he left off. At the end of person B’s story, the storyteller then moves on and completes Person A’s story where s/he left off.

Didn’t Get that ?

Let’s first of all start by looking at an example of how this works in regular functions.

def c():
    print(“at the beginning of c”)
    c()
    print(“at the end of c”)

def b():
    print(“at the beginning of b”)
    c()
    print(“at the end of b”)

def a():
    print(“at the beginning of a”)
    b()
    print(“at the end of a”)
a()

First of all, the function a is loaded into the call stack and just as in the story teller analogy, mid way into it’s execution, the main execution thread switches to function b and there too it switches to function c. when function c is done executing the main execution thread switches to function b. It ends its execution with function a.

So the output of calling function a above would be:

at the beginning of a
at the beginning of b
at the beginning of c

at the end of c
at the end of b
at the end of a

As mentioned earlier on when the last line of a function is executed, the function returns. As a result that function is popped from the call stack.

Beginning to Understand How this Works?

Alright let’s look at how this works in recursive functions. Let’s try to understand this by looking at a popular problem in recursion: finding the factorial of a number.

def factorial(number):
    """factorial recursive implementation"""
    if number <0:
        return -1
    elif number < 2:
        return 1
    else:
       return number * factorial(number-1)

factorial(5)

First of all factorial(5) * 5 is called. But because 5 is greater than 2, factorial(5) will again trigger a call to factorial(5-1) * 5-1. This will continue until one of the conditions specified evaluates to true. This happens when factorial(1) is called. Because 1 is less than 2 factorial(1) returns some value that is then passed to the functions below it in the stack. Of course after factorial(1) * 1 returns, it is popped from the stack. visualize it this way :

factorial(1) * 1
factorial(2) * 2
factorial(3) * 3
factorial(4) 4
factorial(5) 5

Note that the item at the bottom is the first item loaded into the call stack

Because 1 is less than 2, based on our function definition, factorial(1) will return 1 and this output is then multiplied by 1. The result from the layer above is then passed to the function below: 1 is passed to factorial(2). factorial(2) then returns what it’s been passed and the output, 1, is multiplied by 2. Thus the second layer returns 2 and again this is passed to the function below, which is factorial(3). It continues this way until the function at the bottom of the stack returns.

This is how recursive functions are executed !

Still Don’t get it?

Well just give up on recursion and keep using your loops… lol

But see, frankly speaking, any recursive function could be implemented with loops. For example, the reverse string and factorial functions above could be implemented using loops like so:

def reverse_string(string):
“””iterative implementation”””
    length = len(string) - 1
    reversed_string = " "

    while length >= 0:
        reversed_string += string[length]
        length -= 1
    return reversed_string

def factorial(number):
    """iterative implementation of factorial"""

    if number <0:
        return -1
    elif number < 2:
        return 1
    else:
        factorial = 1

        for num in range(1, number+1):
            factorial = factorial * num
        return factorial

Furthermore, when compared with their iterative counterparts, recursive solutions do not necessarily have better space and time complexity. In fact, because recursive functions repeatedly add stack frames to the call stack, one could even argue that they have a terribly bad space complexity. Recursive solutions are just more elegant.! They are more concise! This in turn improves code readability and by extension code quality.

References
Freecodecamp: How Recursion Works Explained
Youtube: Recursion for Beginner, a Beginners Guide to Recursion

Demystifying Memory Management and Type System in Python

Nyior Clement Jr. — Thu, 24 Sep 2020 18:17:50 +0000

I will be using the term Python throughout this article. However, taking into account that there are different implementations of Python(Cpython, Cython, Jython etc.) just using the word ‘Python’ could be quite ambiguous. However, I’d like to state clearly from the outset of this article, that the ‘Python’ used in this post refers to the Cpython implementation.

Python is a High Level Programming Language.

What programmers do primarily, is write instructions for the computer with programming languages. These written instructions are usually loaded into memory and processed by the computer’s brain formally called its CPU. The exact moment when an/a instruction/program is loaded into memory and executed by the CPU will be called run-time in this article. It is important to note here that the CPU only understands 0’s and 1’s(machine code). While in some programming languages the programmer writes instructions in machine code, most programming languages today, allow the programmer to write instructions in languages that are syntactically similar to our natural languages. Languages in the former category are called low level languages, and those in the later category are called high level languages. High level languages are highly abstracted from machine code. Think of abstraction in this context as the amount of work the computer has to do to process the instructions. Because Python is a high level language that’s why we use words like: while, for, if, else and when writing our programs.

Since the CPU Could Only Process Machine Code, How Does it Process Our High Level Python Code ?

Through translation.

Translation?

Yes! It’s how a source code written in a high-level language is converted to machine code. This is achieved by using a piece of software that takes as input a high level source code and outputs a machine level code that is then executed by the CPU. Translators either compile, interpret or assemble a high level source code into machine code. In Python, even though there is a compilation step, Python source code, for the most part, is usually interpreted into machine code. Unlike in compilation where a language’s compiler translates the entire source code before run-time, the Python interpreter translates a python source code at run-time. It does this by reading the instruction one line at a time from memory and producing its machine code equivalent that is then executed by the CPU. I mentioned earlier on that for easy access, at run-time instructions are loaded into memory. Let’s explore how this is done in Python in great detail.

Memory Allocation and Management in Python

At the heart of every programming language is memory allocation and management. In Python everything is considered an object. When we declare variables like:

x=2, name=”nyior”.

At run-time, objects are created in memory. In fact we could even have objects that store other objects. For example lists, dictionaries etc. But hold on, this could actually be slightly confusing. When we declare a variable that points to a value say y=3 in Python which is considered the object? The variable on the left or the value on the right?
Well, in Python we have object references and the objects themselves. In python and most programming languages, variables are just object references. The values they point to are the objects. So going with our previous example, where y=3. y is the object reference and 3 is the object.

An object reference points to the memory address where the object it points to is stored. Every computer memory has a section called the stack and a second section called the heap. In python, object references are stored on the stack and the real objects they point to are stored on the heap. Going with our previous example when you declare a variable like so y=3, y is stored on the stack and 3 is created and stored on the heap. Furthermore, unlike in languages like Java, Python does not allow the creation of duplicate objects on the heap. For example, if you already have y=3 and then a second variable x=3 is also declared, python does not create a second object with value 3 on the heap. It just creates a new reference in the stack that points to the object with value 3 already stored in memory.

This process of allocating space to objects on the heap and object references on the stack is what’s is termed memory management. But memory management does not end there. It also encompasses removing an object from memory when it’s no longer needed. While in some languages like Rust the programmer has to manually allocate memory and deallocate memory space afterwards, in Python, memory management is done automatically under the hood through a technique called garbage collection.

Garbage Collection ?

Generally, languages that use garbage collection to deallocate space used by unused objects do this through a mechanism called reference counting. The number of times an object is referenced is kept track of. Once the number reaches 0, the object is deleted from memory. In Python, the main garbage collection technique is the reference counting too. So during a program execution in python all the objects used in the program are loaded into memory. These objects are then assigned three properties: a type, a reference count and a value.

When an object is referenced, its reference count is incremented and decremented when an object is dereferenced. If an object’s reference count is 0, the memory space allocated to that object is deallocated. An object is usually referenced when:

It is assigned to a variable
When it is added to a data structure or added as a property of a class
When it is passed as an argument to a function
Even though problematic, when an object is assigned to itself, its reference count also increases. This type of problem is called reference cycle in Python.

To solve this problem of cyclical reference that comes with reference counting garbage collection mechanism in Python, the generational garbage collection was created.

Here, all the Python objects in a given program are grouped into three conceptual layers called generations. There are: generations 0, 1 and 2. each layer has an upper bound of the number of objects it could accommodate. This upper bound is formally called its threshold. Once a generation reaches it’s threshold, the generational garbage collection algorithm executes on all the objects in that generation. The algorithm basically finds and obliterates objects with cyclical reference. All the objects that survive are then moved up to the next generation.

Basically, Python uses two techniques to free up space in the memory:

Reference counting where an object is immediately removed from memory once its reference count reaches 0.
Generational garbage collection, where objects with cyclical references are tracked and removed from memory.

Type System in Python

As stated earlier on, when an object is created on the heap, it is assigned three properties namely: a value, a reference count and a type(int, string, float, etc). Every programming language has a type system: a language’s set of rules that dictates how the data types of objects are declared, how and when the data type of an object is discerned among others.
A programming language is:

Either dynamically typed or statically typed and
Either strongly or weakly typed

Python is a Dynamically and Strongly Typed

In dynamically typed languages, an object’s type is only checked at run time. Dynamically typed languages do not require the programmer to specify the type of a construct in his/her code. This is because the construct is assigned a type on the fly based on its value. Statically typed languages on the other hand type check before a program’s execution; usually at compile time. Statically typed languages require the programmer to declare a construct’s data type before hand in his/her code.

Furthermore, Python could be considered a strongly typed language because it is very unforgiving when it comes to type coercion. In most cases Python does not allow for implicit type conversions. For example, “2” + 4 will raise a Type error in Python. Weakly typed languages like Javascript and Php on the other hand are very forgiving when it comes to type coercion. For example, “2” + 4 will yield 24 in Javascript.

Conclusively, Python is a high level programming language that uses an interpreter to translate code. Furthermore, Python is dynamically and strongly typed. Reference counting and generational garbage collection mechanisms are used to manage memory in Python.

References
Python Garbage Collection
Python Type System

How the Internet Works

Nyior Clement Jr. — Sun, 13 Sep 2020 08:17:21 +0000

The term internet has been grossly misused and in fact slandered. When my kid sister told me the internet is the cloud, I said to myself: enough is enough! In this article I’ve explained the internet in a way that even the non-techies could understand. If you have a strong grasp of the nitty-gritty of the internet, you’d find that this article has been oversimplified. Well, I’m just setting the lower bound for what I believe every person should know about the internet. Enough of the yarns; shall we get to the main thing?

Before the Internet

When people began to use machines for work, humans have been relentless in their pursuit of ways to make most of human experiences faster, easier, and more reliable. For example, in communication, there has been a shift from the use of town criers, to telegraphs, and subsequently telephones. Furthermore, when computers emerged, computer people began to explore ways to make communication more efficient and reliable with computers.

But was communication inefficient and unreliable prior to the internet you ask?

Yes! Prior to the internet, communication over long distances was highly inefficient. Most times letters took days to arrive at their destination. Then came the telephone era. While this new machine disrupted the communication sphere and made information dissemination faster, it wasn’t very efficient and reliable. This is true because, with telephones, two people could only talk over a dedicated communication line. What this means is this: if this communication line was a road, then only one car could go through at a time. The width of the road notwithstanding. Even if this car spoils mid way, other cars would have to wait. Relating this to telephones, talking over a dedicated communication line means it can only be used by two people at a time. Even if the users at the two ends aren’t really talking, simply because these two telephones are connected, other users wanting to use that particular communication line or to connect to one of the connected telephones would have to wait. This technique of moving data over a dedicated communication line is formally called circuit switching. While this technique undeniably had its strengths, it is, in my opinion, a makeshift solution at best. To fill this gap in communication, the internet was created.

Can you tell me what this internet is already?

Lol.. calm down.

Okay, Meet the Internet

The internet is just a more efficient and reliable way of passing data around with computers. As opposed to circuit switching, the internet uses packet switching to move data around. with packet switching, before being transferred, a piece of data is broken down into smaller chunks called packets. These packets are then transferred through several routes to their destination where they are then reassembled. Because of this architecture, on the internet, computers don’t have to wait. Thus, a computer on the internet could be sending data to several computers while receiving from other computers.

In reality, at any given time, there will be thousands or millions of people in different parts of the world who’d want to talk to each other. Thus, at any given time, there are thousands or millions of these computers that are connected and sharing information with each other in a network of some sort. The internet at the most basic level is the name given to this global digital community of computers constantly talking to each other. Oh, computers too talk ?

Yes! Pretty much the way humans do. It happens all the time. When you send an email to a friend the two devices involved are in a back and forth communication with each other. This communication is possible because these computers model the reality of human communication. This doesn’t make sense you think? I imagine you hold that opinion because you believe humans are able to communicate because they have and use language, but computers don’t have this do they ? Well, they do. Let me tell you how.

How the Internet Works

Computers on the internet have and use protocols. Just as language simplifies communication between two people, protocols on the internet make communication between computers on the internet possible. These protocols are predefined rules for formatting and moving data on the internet. Still struggling to understand what protocols do on the internet? It’s alright. Just carry on; you will soon understand.

When you say “hello” to a friend in an email, these protocols format your “hello” text in a certain way. After formatting this data, these protocols then carry this text from your device to the receiver’s device. Protocols are powerful!

The internet does not have just one monolithic protocol that does everything though. The internet is composed of several related protocols with each protocol doing one thing really well. These set of inter-related protocols on the internet are collectively called the TCP/IP suite.

Protocols in the TCP/IP suite are layered. Each layer is usually made up of protocols that leverage the capabilities of the protocols in the layer below it. These layers collectively make up the internet protocol stack, and this stack has four major layers:

The application layer (HTTP, SMTP)
The transport layer (TCP, UDP)
The network layer (IP)
Link layer (Ethernet)

The application layer protocols are usually embedded in the several applications in your computer. Embedded? Well, yes. Remember, protocols are just rules so they are programmed as part of these applications. For example browsers use the HTTP protocol and some email clients use the SMTP protocol. Using the protocols in this layer, these applications allow users to construct messages that are then passed down to the transport layer.

The transport and network layer protocols are usually embedded in the operating system of your device. The transport layer ensures that the message is reliably delivered to the right application in the receiving device. Message segments from the transport layer are then passed to the network layer. The network layer ensures that message segments are routed to the appropriate destination machine

The link layer protocols are most times embedded in the network interface cards. Segments from the network layer are then passed to the link layer that carries the data to the destination machine.

These protocols are collectively able to move data to a specific device and to a specific application in that device majorly because of IP addresses and port numbers.

IP addresses and Port numbers ? I thought you said non-techies could understand this too?

Yeah! See it’s simple: Every computer connected to the internet has a unique address called an IP address. An IP address is a series of numbers. Port numbers on the other hand, provide us with a way to uniquely identify processes/applications on a given computer. Protocols in the transport layer use these port numbers to forward messages to specific processes. Think of IP addresses as street addresses, and port numbers as house numbers within a street. Just as written letters are first of all transported to a particular street using the street address and then to a particular home using the house number, all messages on the internet are first of all routed to a computer (using its IP address) then to a specific application on that computer(using its port number).

So far, my explanation of how the internet works has been quite abstract right?

Don’t give up yet, I saved the best for last.

Going with the “hello” example at the beginning of this article, when you say “hello” to a friend in an email, the application layer forwards the message to the transport layer. At the transport layer, the port number of the email client is appended to the message passed from the application layer. Of course after splitting the message into segments. These segments with port numbers are then passed to the network layer. At the network layer, the IP address of the destination and the source computer is again added to each segment. Fully equipped with all the necessary extra data, the message is then moved to the data link layer that then moves all the segments to the destination computer using the IP address appended to each segment.

At the destination computer, the received segments are then moved from the data link layer to the network layer. At the network layer of the receiving computer, each segment is then stripped of the IP address appended to it (because it’s no longer needed). The segments are then moved to the transport layer. At the transport layer, the segments are then reassembled into the original message. Depending on whether the two devices are using the TCP or UDP protocols, at the transport layer, the receiving device could even send a message to the sending device confirming that it has successfully received all the segments. Using the port number appended to the received message, the transport layer is able to tell the process it is suppose to forward the message to in the application layer.

This is how the internet works. This is how every data you send is routed to the receiving device.

You Can’t Improve What You Don’t Understand: Know thy Algorithm’s Run Time Complexity

Nyior Clement Jr. — Sun, 06 Sep 2020 23:21:44 +0000

In my previous post in this series, I mentioned that in this article I’d explain how the efficiency of an algorithm could be measured.

But why measure the efficiency of algorithms you ask ?

Just as there could be several paths to a destination and we often go with the shortest path, there are usually several algorithms for solving one computational problem. Measuring the efficiency of algorithms helps us identify the shortest path to solving a given computational problem.

For a given task, we measure the efficiency of an algorithm in terms of :

*The space it requires to complete the task. This is formally called its space complexity.
*The time it takes to complete the task. This is formally called its time complexity.

Thus, measuring the efficiency of an algorithm implies deducing the time-space complexity of the algorithm.

Okay so how can I deduce the time-space complexity of my algorithm?

Very easy. Implement the algorithm, run it on a computer and observe how long it takes to execute and how much memory it uses.

Run it on a computer ?

Well spotted! So if we were comparing the performance of different algorithms we’d have to implement and run all of them? I mean why write code for several algorithms and run them only to pick one at the end ? That’s a brute force approach and not deft I’d say!

What if we could do a priori analysis of the time-space complexity of these algorithms then implement the most efficient ?

Priori analysis ? how can we possibly measure how fast an algorithm will perform or how much space it would take without running it on a computer.

I will tell you how, but before I do let me quickly correct this: you see, testing the time-space complexity of an algorithm by running it on a computer isn’t even cool. Why? Computers have disparate hardware. In addition, the execution time and space used by our algorithm could also be affected by the number of processes also running at the time of testing, the result obtained could be decidedly misleading.

Oh this actually makes sense. So how do you suggest I do this priori analysis?

It’s easy! I present to you the Big-O notation.

Big-O notation? Warisdat?

This provides us with a unique way to describe the performance of our algorithms without having to run them on a computer. With Big-O, we deduce how the number of steps an algorithm takes to complete a task will grow as a function of the input size in the worst case scenario. Algorithms always act on some data: in this case the input. So with Big-O, we are basically just trying to figure out the relationship between the growth rate of an algorithm with respect to the input of size, n. Even though Big-O could be used to deduce the space complexity of an algorithm too, for brevity's sake, this article will focus on the time complexity aspect.

Worst case scenario ?

Big-O assumes for example when iterating a list, that the element does not exist in the list. In which case our algorithm will have to loop to the end of the list. With Big-O, we are only concerned with how well an algorithm will perform in the most terrible situation. In which case it will have to do the hardest job.

How can this Big-O be used to measure the run time complexity of an algorithm?

There are existing classes of run time complexities. Usually, one of these is used to describe an algorithm’s runtime complexity. We will cover the most common ones here.

1. Constant time complexity O(1) : An algorithm is said to have a constant time complexity if the number of steps it takes to complete a task stays the same even with increasing input size.

my_list = [1, 2, 3]

first_element = my_list[0]

In the code snippet above, even when the size of the defined list grows, this algorithm will always take one step to complete its task of retrieving the first item in the list.

2. Linear time O(n) : For algorithms in this class, the number of steps required to complete a task grows in direct proportion to the input size. If input size = n, then the algorithm will take n steps to complete its task. For example:

my_list = [1, 2, 3]

For element in my_list:

    Print(element)

3. Quadratic time O(n*n): For algorithms in this class, the number of steps required to complete an operation will equal the square of the input size. This is so because it performs a linear time operation on each unit of the input. If input size=x, the algorithm will require x*x steps to complete its operations

arr = [1,2,3]

For x in arr :

    For y in arr :

        print(x, y)

4. Logarithmic time O(LogN): Algorithms in this class usually take LogN steps to complete their task where N =size of the input and LogN is the number that 2 must be raised to, to give N. For example, if N=16 then Log16=4. As you might have figured out already algorithms in this class are relatively efficient. How do algorithms in this class achieve this efficiency? At each step, they cut down the input size to half of the original size. A classic example of an algorithm that’s in this class is the binary search algorithm.

def binary_search(element, arr):

    """ function that searches a 
        sorted list in a binary fashion.
        where element is the search key
        and arr is the list that's to be 
        searched 
    """

    mid_point = len(arr)//2 #floor division

    while True:

        if element == arr[mid_point]:

            print(f"match found at index: {mid_point}")

            break

        elif element > arr[mid_point] and mid_point>0:

            mid_point = len(arr[mid_point: ])//2 + mid_point

            

        elif elem < arr[mid_elem] and mid_elem>0:

            mid_elem = len(arr[:mid_elem])//2

        else:

            print("element not in list")

            break

5. Exponential time O(2n): ** Algorithms in this class usually take 2 to the power of n steps to complete a task. For algorithms in this class, the number of steps they require to complete a task, doubles with a unit increase in the input size. For example if n = 3 then an algorithm in this class will require 2 to the power of 3 = 8 steps to complete its task. If n increases to 4 then the algorithm will require 2 to the power of 4 = 16 steps. As you can see the number of steps doubles from 8 to 16.

While the most common time complexities have been covered in this article, the list here is not exhaustive; there are others. Furthermore, real life software systems are usually made up of complex algorithms that could in fact be described with two or more classes of run time complexities. In situations like that, always describe your algorithm’s performance in terms of the most complex run time complexity present.

Stay tuned for my next article on linked lists :)

References

www.freecodecamp.org/news/time-is-complex-but-priceless-f0abd015063c/

I am a Crude Software Engineer

Nyior Clement Jr. — Sun, 06 Sep 2020 23:04:08 +0000

I have built things for the web and some of these things had really clever algorithms. I have written unit tests. I understand, and have done most of the things in-between building and deploying to a production server( this too included). Did I fail to mention that I’ve also collaborated with other developers using git ? Oh yeah I have.

Bruh! you are a pro mehn!

I wish... Even though I know I still have a lot to learn, there is one unchecked box that has become my biggest concern lately: I’m yet to master algorithms and data structures. Not mastering algorithms and data structures only means one thing: I’m a crude software engineer .

Oh wow! These constructs must be really important in software engineering then

No! algorithms and data structures aren’t essential components of software engineering; They are software engineering!

I’d love to really ask what makes these constructs so important in software engineering, but I don’t even know what they are to begin with

A data structure is a particular way of organizing data in a computer. For example, we could organize data in an indexed, ordered structure(lists/arrays). An algorithm on the other hand is any step by step instruction that manipulates some data. For example, when you write a for loop that prints each element in a list/array, that’s an algorithm.

These constructs are so important in software engineering because they guarantee building efficient software systems.

I beg your pardon?!

Building efficient software systems entails crafting applications that require the least amount of memory possible and the minimum execution time that’s achievable, to execute tasks.

Why is this important you ask ?

Usually a computer has several applications installed and most times 2 or more running concurrently. This wouldn’t have been a problem if these computers had infinite memory and indescribably fast processor clock speed, but they don’t. Remember, now there is a need for speed(pun intended) every where you go. As a result, if a program requires so much space and takes too long to execute, it will considerably slow down the computer, but most importantly, this will result in a poor user experience. It is imperative that every software engineer builds programs that are highly efficient.

Okay now I think I get the gist, but tbh, I still don’t understand how understanding these constructs will help me write efficient code though

Mastering data structures presupposes understanding the several existing ways data could be organized in a program and by extension the computer(lists, linked-lists, binary trees etc.). Usually, a given data structure is optimized for certain operations. For example, while lists/arrays are optimized for retrieving items based on index, linked lists are optimized for operations like inserting and removing items( something lists/arrays are poor at). There is always the right data structure for your use case. Using the wrong data structure could result in a revoltingly inefficient code.

Mastering algorithms on the other hand encompasses understanding the several existing ways for efficiently performing some of the most common operations(e.g. searching and sorting) in computer programming. Because some of these algorithms are relatively more efficient, knowing what algorithms exists and their behaviour will enable one use the optimal or near-optimal algorithm in a given scenario. Most times as software engineers, we create our own algorithms; having a strong grasp of these constructs helps us measure the efficiency of our algorithms too.

So tell me, how can I possibly be a pro when, out of ignorance I’ve probably wrongly used a data structure? How can I be a pro when out of ignorance I’ve probably written code that searches my sorted python list(probably called arrays in your favourite programming language) in a linear fashion, when there is a more efficient approach called binary search. No! to be a pro I’ve got to understand the art and the technique of software engineering. I need to start writing code that not only does the right thing, but does it well. To achieve this I need to start using correct data structures and highly efficient algorithms. Every software engineer needs to master algorithms and data structures! E get why!

Interested in understanding how to measure the efficiency of your algorithms? Read my post on space-time complexity, and the big-o notation

References

https://www.geeksforgeeks.org/data-structures/#

https://softwareengineering.stackexchange.com/questions/212575/why-are-algorithms-and-data-structures-important