DEV Community: kycodee

Intro to GraphQL

kycodee — Mon, 06 May 2024 11:46:01 +0000

What is GraphQL?

GraphQl is a query language and a server-side runtime. It was initially released by Facebook back in 2015. Facebook created GraphQL in order to give it's developers access to a data-fetching API that was simple, but powerful enough to describe all of Facebook's enormous log of data. Unlike any of the other querying languages you may have used, GraphQL can query data from many different sources and does not require a specific data store, such as a postgres database. Since it's release back in 2015, it has become fairly popular and some would argue that it is the future of web APIs. I'm not a fortune teller so I can't confirm nor deny that statement, but what I can do is give you some insight on graphQL and it's abilities. Continue reading, as I will explain to you how graphQL can be used in web applications and how it's schemas work.

Using GraphQL in Web Applications

As we all know, when building a web application we must have a way to retrieve data to be displayed on the user-interface. Luckily for us, graphQL was created just for this and is perfect for the task. In order to retrieve this data using graphQL, we must take the following steps. First, we must define one or more schemas that'll describe the type or types of data we can query from our database. This will allow us to grab data based off of the specific type that we used or created. After defining our schemas, we can add in resolvers. Resolvers, just like their name, are functions that resolve the data that is sent back in a response from the query. Resolvers also take up the responsibility of retrieving data from the database and sending it back in the way the query asked for it. Next, after adding in our resolvers, we must configure a graphQL server such as Express GraphQL, in order to interact with the schemas and resolvers we made. Lastly, we must set up a graphQL client that allows users to interact with an interface and send request to the database and that will be displayed on the user-interface or client.

GraphQL Schemas

Now it's time to go a little more in depth about those schemas we just talked about. In contrast to other querying languages, graphQL has it's own type system that is used to describe a schema. This type system's syntax is called Schema Definition Language or SDL for short. The schemas in graphQL are used to describe a collection of different types and how they relate to one another. In fact, there are some very important types that are already built into the graphQL system. These types are queries, mutations, and subscriptions. The action of the query type is fetching data from the server. The mutation type's job is to allow for requesting of modifications of the stored data. And last, but not least, is the subscription type that is used for alerting the client about changes to the data in the database.

GraphQL vs. REST

The most common comparison of graphQL is between it and REST APIs. They are both very popular architectural patterns used to build APIs. The biggest difference between these two architectural patterns is that REST APIs use HTTP requests and multiple endpoints to interact with data, while GraphQL allows clients to query the exact data they need through a single endpoint, which prevents the over-fetching of data. Even though after hearing this information you may be lead to believe that graphQL is more efficient, which would make you assume it is more popular, that is just not the case. REST APIs have been around a lot longer than graphQL and seems like it will continue to be the standard of data-fetching for a while.

Conclusion

In conclusion, graphQL seems to be an awesome option for developers looking to make the querying of data a bit easier on the themselves. If you are a professional developer or just a hobbyist, I'd recommend giving graphQL a try to see you if you prefer it rather than traditional querying languages. Thanks for reading my article and leave a comment on how you feel about the article and your experiences using graphQL.

Progressive Web Applications Explained

kycodee — Thu, 18 Apr 2024 02:23:06 +0000

What are Progressive Web Applications?

Progressive web applications are applications built using web-platform technologies, but display a mobile-style user-interface. Progressive web applications, also known as PWAs, were originally given the name back in 2015 by Google's Alex Russell and Frances Berriman. They coined the name and concept of PWAs after seeing the need to “build better experiences across devices and contexts within a single codebase”. This means that their goal was to build applications for all devices while still keeping the same code for each one. As development continues in 2024, progressive web apps are still one of the most-used design styles in software development. In this article, we will discuss some of the features that set PWAs apart from other applications.

Progressive User-Interface

One of the key features of a PWA is it's user-interface. The UI of a progressive web app most times can adapt to the screen of any kind of device appropriately. For example, a PWA that is opened in the browser of a phone will have the same look as a native app on a phone. Whenever the screen size is a adjusted on the specific device, the sizing and styles change to look as if the app has been downloaded from the app store. This allows users to feel like they are interacting with an downloadable app, because of the ease of navigation throughout the site.

Installability

The ability to install progressive web apps to the home screen of a mobile device is another feature that has driven developers to follow this design style. PWAs, just like apps downloaded from the app store, have the ability to be seen on the home screen of your device. While the web app is not really a native app, it displays as one and opens up as a website when clicked on. Instead of having to bookmark, write down, or memorize your favorite sites, you can just add them to install them to your device.

Native vs. Progressive Web Apps

Native and Progressive Web Apps may seem very similar to one another when first taking a look. The biggest and most important difference between native apps and PWAs is that native apps are actually built using mobile-platform technologies and PWAs aren't. Native apps are placed on to the app store and requires money to do so, while progressive web apps aren't. Many people get these app styles mixed up because they can both be seen on the home screen of a device and both look similar on the UI side of things. Some companies and developers argue that PWAs are better than native apps since they don't require users to go through the process of a download.

Conclusion

In conclusion, if you are interested in building an application that you would like to be mobile-based, try going the PWA route. You can potentially save money from not having to pay to add your app to the app store. Also, if you are used to creating web-based applications, you can use the same technologies and you won't have to learn any native technologies. I hope this article gave you some insight on progressive web applications and how they can be beneficial when building your own applications.

Introduction to Vue JS

kycodee — Tue, 02 Apr 2024 11:24:03 +0000

What is Vue?

Vue is an open-source Javascript frontend framework used to create user interfaces. It was initially created by a software developer, Evan You, and released in 2014. Vue is one of the most popular frontend Javascript frameworks on the market. It's most important feature is the ability to create and reuse components for displaying beautiful UIs on software applications. If you are familiar with HTML, CSS, and Javascript, Vue shouldn't be that big of a task to learn. More specifically, if you've experienced a framework like Angular JS, it'll be even more of a breeze to learn. Even if you haven't dealt with, you have nothing to worry about, you will learn the basics of Vue in this article. I will show you how to do the initial rendering of your Vue application and how to create components inside of it.

Rendering in Vue

Before we can start developing extravagant components for our UI, we must first learn how to render a Vue component altogether.

Although there are many ways to go about rendering a Vue js app, we're going to go over how to do it using a cdn. First, we would like to travel to an HTML file in our project. Once we make it there, place this information, inside of the body tag.

<div id="app">{{ message }}</div>

<script type="module">
  import { createApp, ref } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'

  createApp({
    setup() {
      const message = ref('Hello Vue!')
      return {
        message
      }
    }
  }).mount('#app')
</script>

The CDN URL is being used to import the built-in Vue createApp function into the file. Since we've gained access into the createApp's functionality, we must create a function, in this case, the "setup" method that allows us to create and return a message. In this example, once the message is returned, we can chain on the mount function and pass in the id of whichever html tag we're appending the message to. In this instance, it is the div with id of app seen just above.

Vue Components

When you get to the point of building bigger projects past initial rendering, you'd most likely need to create components inside of Javascript files. In order to do this, you must use the component method that comes with the importation of Vue. It used like this:

Vue.component("devto-tutorial", {
  template:
    '<h1>Dev.to App Setup</h1>'
});

// This is where we create the instance of our root Vue app
new Vue({ el: "#devto-tutorial" });

In this example, we use the component method that takes in the name of your component you're creating and an object containing the template of what should be in it. After that, we call a new Vue instance with the name of the element passed into it in order to render our component.

Conclusion

In conclusion, if you are interested in building Javascript web applications, you should give Vue.js a go. It is one of the leaders in the software development industry and the community continues to grow by the day. Hopefully this article gave you some insight about Vue.js and leads you to using it in one of your upcoming projects. Good luck and thanks for giving this article a read.

Terraform and Infrastructure

kycodee — Mon, 29 Jan 2024 13:25:53 +0000

What is Terraform?

Terraform is an open-source infrastructure-as-code software. It was initially released in July of 2014 by HashiCorp. Infrastructure-as-code, or IaC, is the provisioning of infrastructure by using code instead of manual processes.
Over the past decade, Terraform has been one of the leading infrastructure-as-code softwares in the DevOps industry. It has become so popular since it is a declarative process, meaning a user can give instructions on what they wanted coded, without giving step-by-step instructions on how to code it. Two of the key features of Terraform are it's ability to change the infrastructure of a project and automate those changes. Both of these features will be discussed in detail as you read through this article.

Changing and Automating Infrastructure

As many of us already know, Terraform can used for creating an infrastructure, but it also can be used for managing an established one as well. For instance, if after creating an infrastructure and deploying it, you want to add more servers to your infrastructure in order to deploy more microservices. Terraform makes this easy by allowing you to go back into the code to update the environment exactly how you need it to be.
Many times you will need a separate infrastructure environment from development to production. Terraform also allows us to replicate an infrastructure without affecting the original one. After learning your way around Terraform, you can also automate this process of replicating the code.

Basic Commands

Now it's time to discuss some of the basic commands that are commonly used in Terraform. The first one we'll go over is Refresh. Refresh queries the infrastructure provider to get the up to date state. This means that the refresh command can be used to grab the current data of the infrastructure at the time of the command. Plan is another command commonly used in Terraform. It creates an execution plan and determines what actions are needed to achieve the desired state. This command means exactly what it is called, to plan and map things out without making any actual changes. The next command commonly used directly after the Plan command is one called Apply. Apply executes all of the changes that were made in the PLAN phase. The Destroy command is the last one of this whole cycle. Destroy destroys the whole set-up and removes the elements one-by-one in the right order. This means that destroy can easily destroy everything we've built up from the previous stages.

Terraform vs. Ansible

Terraform and Ansible are both infrastructure as a code tools. They are both used to automate, provision, configure, and manage infrastructure. Terraform is mainly an infra-provisioning tool, but also has the ability to deploy applications in other tools on that infrastructure. Ansible, on the other hand is mainly a configuration tool. It is mostly used after the infrastructure has already been created, Ansible is usually used to deploy apps or install and update software on that infra's setup. To wrap your head around the main difference between Terraform and Ansible, I would say that terraform is better for provisioning or creating infrastructure and Ansible is better for configuring or updating the already-made infrastructure.

Conclusion

To conclude things, I’d like to advise anyone looking into DevOps or just wanting to learn about infrastructure to look into Terraform since it is a leader in the industry.

UI/UX Explained

kycodee — Mon, 18 Dec 2023 14:42:02 +0000

What is UI/UX?

UI and UX are the aspects of product development that caters to the needs of a user. The actual names of UI and UX are user-interface and user-experience. Most companies, whether modern or old, incorporate some type of UI/UX design. This practice has been used in business for years as a way to offer a pleasurable experience to customers. In order to keep a business afloat, the user always has to come first in mind. Today I'll be breaking down UI and UX into detail to explain how they actually perform.

UI

The user interface, most commonly known as UI, is where the user actually interacts with a technology. UI user interactions are usually carried out through the use of things like displays, keyboards, mice, etc... There are a few different categories of UI that I'll discuss with you today. The first one is called the command line interface, where the user interacts with the program using commands. It works by the user inputting a command into a terminal or dashboard and receiving the information they need. The command line interface, also known as CLI, can also be used with a visual prompt that a user can respond to in a command. The second category of UI we'll be talking about is the graphical user interface. The graphical user interface, also known as GUI, is used using menus, scrollbars, buttons, and wizards. Unlike with the command-line interface, GUIs usually have click functions on touchscreens that cause actions to happen instead of using commands.

UX

The user experience, often referred to as UX, is another major point of web-development. UX is how a person will engage with a product while using it. UX takes the study of human interactions with a product to another level. UX designers main goal is to cater to a user's ambitions, interests, and motivations for interacting with a product. The reason for this goal is so that consumer satisfaction can stay as high as possible. Another aspect of consumers staying satisfied is consistency. If a product is not consistent at all times, customers may look for competitors or simply give up on the product all together. To gauge the satisfactory, UX designers usually come up with ways to receive feedback from customers as well.

Differences Between UI & UX

Many people, when they hear UI or UX, believe them to be the same thing. This isn't a far-fetched assumption seeing that they both cater to users of a product and deal with design. I'll go over a couple of the things that set them apart from one another. The first thing that sets them apart from one another is that user experience is more focused on the overall engagement of the user with the product. For instance, UX designers will study how an athlete will interact with a sports gear website rather than figuring what device would be best to use to shop on it. Another difference between UI and UX is that UI designers place more of their focus on a products actual functions and visuals rather than mapping how it should function or be visualized.

Conclusion

Both UI and UX play major roles in web development in 2023. If you are an aspiring developer or current developer, UI and UX seems to be a great avenue to take. People who are really creative and enjoy visuals may like it even more. Hopefully, this blog gave you some insight on UI/UX development and will encourage you to give it a try.

Perl Language Explained

kycodee — Mon, 11 Dec 2023 14:38:45 +0000

What is Perl?

Practical Extraction and Reporting Language, also known as Perl, is a high-level programming language. It was developed in 1987 by a developer named Larry Wall. Initially, Perl was created as a unix scripting langauge that makes it easier to process reports. Recently, it has been performing it's original tasks, but it has been revised multiple times to perform on a higher level. I'll discuss with you a few of the main features that has kept Perl relevant throughout the years. One of them is Perl's ability to create CGI scripts that can perform some of the most difficult tasks seen in modern-day software development. Another thing we'll be discussing today is Perl's syntax and how it differs from the syntax of other languages such as Javascript.

Scripting

Perl is most commonly used for it's text manipulation and scripting capabilities. Common Gateway Interface, also known as, CGI has been the thing keeping perl alive recently. CGI is used to exchange information between web servers and custom scripts. It has the ability to create scripts that access databases, create webpages, and even generate graphics. Much of this scripting working is done in a shell, since Perl is a unix-based program. The generation of these scripts is a breeze when using perl since it has APIs that manipulate almost any text so that XML, HTML, and other markup languages can be used.

Syntax

If you've ever programmed in any other language, learning Perl should not be too hard of a task. For instance, coming from a Javascript background, Perl has been very easy to learn. Perl, just like Javascript, has variables, loops, blocks, and comments. The difference between JS comments and Perl comments is that JS uses '//' to comment things out and Perl uses '#'. Also, variables in Perl are declared with a '$' symbol in front of them. For example, if you wanted to store a value in a variable called dog, you would have to name the variable $dog instead of dog.

$dog = 'roscoe'; #correct syntax
dog = 'roscoe';  #incorrect syntax

Downsides

There are a few downsides to consider when dealing with the Perl language. One major con of Perl is it's slow initial execution time. Perl is a language that has to be compiled before use, so this causes a delay. Perl also is not as lightweight opposed to other languages. Lots of CPU and ram is used every time you execute something within Perl. Another complaint that Perl developers usually have is it's untidyness. Since Perl is so forgiving and lacks strictness, there are many ways to achieve the same result, making code unreadable.

Conclusion

If you are interested in creating CGI scripts or just making extremely powerful code, I'd suggest giving Perl a go. Considering all of the pros and cons we discussed about the language, it still seems to be a very viable option. Perl hasn't been very popular in recent years, because of newer options but it definitely isn't going anywhere soon. If becoming a Perl developer is something you're interested in but are on the fence about it, remember that Perl is often considered the 'swiss-army knife' of programming.

Sources

Perl.org
Simplilearn Perl
TechTarget: Perl

Intro to PostgreSQL

kycodee — Mon, 04 Dec 2023 14:41:45 +0000

What is PostgreSQL?

PostgreSQL, also known as postgres, is an oject-relational database management system. Object-relational databases allow you to store objects as data like we can in many programming languages. Postgres is so important in software development today.

Multi-version Concurrency Control

Multi-version Concurrency Control(MVCC) is a feature in postgres that allows for the storage of multiple versions of the same data. In most other database systems, whenever a row of data is updated, accessibility of the updated information is usually limited aftwerwards. With postgres, instead of updating a single version of a piece of data multiple times, a new version of the data is added to the queue and the previous versions remain. This allows anyone looking to view or update the information to do so without being locked out because of the changes to the original version.
Example using diagram

PostgreSQL shell commands

The postgres database is interacted with by using a terminal-based shell command-line. I am going to demonstrate to you a few of the most commands used when building a database in postgres.
CREATING A TABLE

CREATE TABLE opspark (
  phase VARCHAR(255),
  cohort VARCHAR(255),
  year INT
);

The command in the example above is asking postgres to create a table that has 3 fields that consist of a phase, cohort, and a year. The text on the right of each field created is the data type that the empty field will accept as an input. VARCHAR is used for alphabetical characters and INT stands for an interger, or number.
INSERTING INTO A TABLE

INSERT INTO opspark (phase, cohort, year)
VALUES ('Immersion Junior', 'Golf', 2023);

In order to add information into the table we created up above, we can use INSERT INTO in the command-line. This example shows us filling the empty opspark table with data for the phase of the bootcamp we're in, the cohort we're a part of, and the year we joined the program.
RETREIVING DATA FROM A DATABASE

SELECT phase, year FROM opspark;

In order to retrieve data from the database through command-line, we can use the SELECT keyword. In this example, we're attempting to retreive the phase and year rows of data from our opspark table. Here is what that data would look like from the information we inserted into the table earlier.

phase  | year
--------+------
 Immersion Junior   | 2023
(1 row)

These are just a few of the basic commands that are used to build tables in postgres. There are tons of more commands to look into when exploring postgres. If are you interested in using postgres in the future, I would highly recommend researching some of those commands.

Potential Downsides of Using PostgreSql

Even though we talked about some of the amazing benefits of using postgres and it's cool commands, there's still a few cons. Just like anything in life, postgres has its upsides and it has it's downsides. One of the downsides of using postgres is it's inefficiency in terms of performance. Postgres lacks efficiency in performance because of the amount of resources it takes to be ran. Another potential downside of postgres is that it isolates each client. This means that a new thread has to be started for each client so in return, it consumes much more memory than it should have to.

Conclusion

Embedded Systems

kycodee — Tue, 17 Oct 2023 19:24:55 +0000

What are embedded systems?

Embedded systems are a combination of software and hardware, created to perform a specific function. They are computer systems that have a dedicated function and are often times part of a larger mechanical or electronical system. Whenever you're dealing with devices that have one main ability, it is most likely going to be an embedded system. For example, a DSLR camera, like the one pictured below, would be considered an embedded system, since it's sole ability is to take photos and nothing else. That makes a point, that embedded systems are not multifunctional. Embedded systems perform there function and nothing can be done further. On most other computer systems, you can perform multiple functions, and even create other softwares sometimes using it.

Embedded Subsystems

Embedded subsystems are embedded systems that are part of a larger system. They, unlike some other embedded systems, do not stand alone. For example, a computer keyboard would be considered an embedded subsystem since it is part of a larger computer system. Although the keyboard performs one function, to input characters using keys and buttons, it is still part of a larger system. The larger system is the whole computer setup, and the keyboard is used to input the data from the key strokes into the computer system. Subsystems can be really useful when building out these bigger systems, because multiple can be made to perform their own specific tasks to bring together a well-kept ecosystem without any conflicts.

Standalone Embedded Systems

Standalone embedded systems are virtually the same as embedded subsystem, in which they both are designed to handle a specific function. The difference between the two is that standalone systems only handle their function and that's it, whereas subsystems are a small piece to a much larger puzzle. For example, a handheld calculator is a standalone embedded system. The calculator is considered a standalone, because all it does is handle math equations. It would've been considered a subsystem if it'd handle math equations and then send them to a computer system automatically.

Embedded Systems vs General Computers

In most cases, embedded systems and general computers differ a lot. The biggest difference is that general computers can be used to do pretty much anything technical. In contrast, embedded systems have a very limited scope of work it can do and that can't be changed. Many of us use general computers and embedded systems daily. For example, the device you are reading this article on is considered a general computer. That's because you can do anything on it. A microwave, something else you've probably used recently, is considered an embedded system since it can only perform one function, heating food.

Conclusion

Take some time to pay attention to all of the devices that you use on the daily basis. Once you've read this article, you'll be able to tell what's an embedded system and what's not. You'll also start to realize how important embedded systems are for to perform our daily tasks. Overall, I would say that embedded systems are pretty cool and very valuable.

Introduction to Automated Testing using Selenium

kycodee — Mon, 09 Oct 2023 12:36:37 +0000

What is Selenium?

Selenium is a set of tools that can be used to automate, document, and quickly execute tests on web applications. It was originally created in 2004 by a developer, Jason Huggins, at the company Thoughtworks. Jason was a developer tasked with manual testing of web applications, so to make it easier on himself, he decided to write a program that automates testing. This is how we get here today when it comes to automated testing. Selenium is not just a single tool, it has three components. In this article, I will give an introduction to all three components and how they work with automation.

Selenium Webdriver

Selenium WebDriver is an interface and component of the Selenium suite that allows programmers to create and run tests on any platform(mac, linux, windows, etc.) WebDriver interacts directly with the web browser and acts out things on web elements. The elements are reached using a tool called an "element locator". The element locator let's you target specific elements and then write scripts of actions to take on them. WebDriver is great for automated testing, because of it's ability to use multiple coding languages to do these actions. Here is a photo of how automated testing with Selenium WebDriver looks in code.

Selenium IDE

Selenium IDE(Integrated Development Environment) is another part of Selenium's Suite that is most used for it's recording and playback functionality. IDE is available as both a chrome browser extension and firefox plug-in. It allows the recording of web interactions so that failed and passing test can easily be referred back to and documented. The web interactions are documented by way of reusable scripts. For manual testers, this lightens the burden of keeping track of what works and what doesn't. Before having options like Selenium IDE, it was easy for manual testers to lose track of their progress and they would sometime have to test the same actions again. Here is a picture of the Selenium IDE extension in the chrome browser.

Selenium Grid

Selenium Grid is the last component of the Selenium suite. Grid is used to run multiple test scripts on multiple machines at the same time. The biggest benefit of running grid is that it gives quick feedback on the tests ran on these different platforms and browsers. Having the ability to run these tests simultaneously gives testers the ability to see the stats of these test cases to compare time and efficency over from machine to machine. This diagram explains how Selenium grid operates.

example of routing in js

Downsides of Selenium?

Although we've went over most of the amazing benefits of using Selenium for automated testing, there are still some downsides to using it. One of the most prominent downsides of Selenium, is that WebDriver can only run test on web applications. If you were wanting to test mobile applications, Selenium would not be an option. Another downside to using Selenium is that it does not have great image testing. If you are attempting to run tests on images on a web page, Selenium more than likely will not give you great feedback.

In Conclusion

Selenium is a great set of tools to have if you're interested in automated testing of web applications. I would also consider this set of tools great to add to your technical toolbox no matter your position in the software development process. Without tools like Selenium, it'd be hard to calculate how well our applications are running. For anyone looking for a way to automate testing, I'd definitely recommend taking a deeper look into Selenium's suite.

What is this ExpressJS thing all about?!

kycodee — Mon, 02 Oct 2023 13:49:06 +0000

What is Express JS?

If you're in the software devlopement field, I'm pretty sure you've heard of the infamous nodeJS framework, express.JS. Express.js is the most popular backend framework for nodeJS. Most developers that use express with node would agree that it makes a night and day difference when working using express rather than without it. Express is most famous for it's ability to make it easier to build web and mobile applications. Some of the things that express does to make things a breeze when developing applications are it's actions that handle templating, routing, and middleware. Keep reading along and I'll go over all of these things in detail to show you how express works.

Middleware

Express middleware is like a swiss-army knife, as it can perform multiples important tasks. It was given the name middleware, because it is usually a series of functions ran in-between the request and response cycle. Middleware functions have the ability to run any code, manipulate request and response objects, stop the response-request cycle, and invoke the next middleware function in the stack. To invoke the next middleware function in the stack, we can call the function, 'next()', inside the current middleware function. One of the most common used functions to run middleware in express.js is app.use() from the app object. App.use() takes in two arguments, one being a path on which the middleware will be invoked. The second argument is the actual middleware function or functions that will be invoked. Here is an example:

var express = require('express');
var app = express();

//Simple request time logger
app.use(function(req, res, next){
   console.log("A new request received at " + Date.now());

   //This function call is very important. It tells that more processing is
   //required for the current request and is in the next middleware
   function route handler.
   next();
});

app.listen(3000);

Templating

Another special ability that express.js has, is something called templating. Templating in Express is done by what we call, template engines. Template engines convert simple markup into HTML in the clients browser. They allow you to use static template files in your application and whenever the code runs, it fills the template files in with real values. Those files are then sent to the client. Here is a brief example of how express.JS templating works:

//this is an example a template file 
html
  head
    title= title
  body
    h1= message

//this is an example of the templating process that turns the above code into actual HTML and fill it with the passed in values
app.get('/', (req, res) => {
  res.render('index', { title: 'Hey', message: 'Hello there!' })
})

Routing

Routing in express.JS is what defines the path the request will take when ran. When defining a route in express, you can use a method like .get() or .set() and pass a path and a callback function into it. The path is the route that is passed in and is usually an HTTP endpoint. After the path is passed in, the callback function that was also passed in executes and takes the route of the path.

Downsides of Express JS?

Even after all of the great things we've said about express.JS, there are still some downsides about it to consider. One of the biggest cons of express, is it's lack of built-in features like many other frameworks have. It is normal for other frameworks to have things like authentication and authorization already built in. If you would like to have those features in express, you'd have no choice but to add them using third-party libraries. Another potential downside of express.JS is it's lack of structure. With this lack of structure, it's easy to get code jumbled up and almost impossible to read.

Conclusion

Express is a great framework that is used so of often in web application development. It is used at places like IBM, Uber, and Netflix. Just like anything else in life, express has it's pros and it has it's cons. All things considered, I'd still say that learning express will have a positive impact on your career as a software developer. That can be either from increased job opportunities or just simply using it as a lightweight tool in your toolbox. If you were wondering how express works or if it would be good idea to learn it, hopefully this blog clarified some of that for you.

Sources

(https://www.codecademy.com/article/what-is-express-js)
(https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction)
(https://www.simplilearn.com/tutorials/nodejs-tutorial/what-is-express-js#:~:text=Express%20is%20a%20node%20js,helps%20manage%20servers%20and%20routes.)
__

Javascript's Complex/Non-Primitive Data Types

kycodee — Tue, 22 Aug 2023 14:07:06 +0000

There are two main groups of data types in Javascript, primitive and non-primitive. Non-primitive data types, also known as complex data types, are what we'll be discussing in this read. There are two complex data types that we seem to use all of the time when working with code. These are arrays and objects. Complex data types are a place where we can store values and is often composed of multiple primitive values such as numbers, strings, booleans, etc.

Objects

Objects are usually used to store pieces of data about a specific person, place, or thing. When objects are defined, they are defined using key:value pairs. The keys in the object, also often called properties, are like the characteristics of the person or thing. For example, if we were creating an object for a car, we may have a property called 'make'. This property would refer to the make of that specific car. Now on to the second part of the key:value pair, the value. The values in an object are usually of the primitve data type, but can also be non-primitive, such as arrays and objects. In this case of making a key:value pair for a car's make will result in something like a property of 'make' and a value of 'Ford'. It would be written just like this.

const car = {
     make: 'Ford'
}

console.log(car) //logs to the console {make: 'ford'}

Arrays

An array is another important non-primitive data structure that is commonly used when programming. Like objects, they are used to store data. They are different from objects, because they are used to group together similar elements without going into detail about their characteristics using key:value pairs. Arrays are made using brackets and it's elements are seperated by commas. If we were to use the same example as object and make an array about cars, it would most likely be an array of elements that are the makes of cars. For example:

const cars = ['toyota', 'audi', 'dodge', 'honda', 'ford']

console.log(cars) //logs to the console => ['toyota', 'audi', 'dodge', 'honda', 'ford']

In conclusion, complex data types are great ways to store values in Javascript. Learning how to use them will benefit you tremendously since they are needed even on the most basic levels of programming. Once you learn to store values using arrays and objects, you will have no problem moving on to more complex things like functions, especially higher-order functions.

A Quick Look Into Higher Order Functions

kycodee — Tue, 04 Jul 2023 17:17:31 +0000

Out of all of the things I've learned on my journey as a software developer, higher order functions has been one of my favorites. Any function that takes in a function as a parameter or returns a function as an output can be considered a higher order function. We usually use these functions when dealing with arrays. Here's a little info on my three favorite higher order functions to use for a clean code environment.

the .Filter() method

The .filter() method is often used when we have an array of information and would like to return a new array, including only the elements that returned true to the conditions of the passed in function. The function that is passed into the filter method will have a parameter and the argument for that parameter will be an individual element in the array. Each element in the array will have a chance at this position. Once they are passed in as an argument, the function call will return either true or false. If the function call returns true, the element will be added to the new array. If the function call returns false, the element will not be added to the new array.

let array1 = [1, 2, 3, 4, 5, 6, 7, 8]

array1.filter(function(x){
    return x % 2 === 0
})

In this instance, the filter function will return true if the value is an even number. If the number is even, it will be pushed into the new array and if the number is odd it will not.

the .Map() method

The .map() method is a bit different than filter, as it returns the result of calling a function on each element in the array. Whatever the result of calling the function on the current element is, will be added to a new array.

For Example:

let array1 = [1, 2, 3, 4, 5, 6, 7, 8]

array1.map(function(x){
    return x * 2
})

//output: [2, 4, 6, 8, 10, 12, 14, 16]

In the above example, the function that is called is requesting the elements to be multiplied by 2. Once the elements are multiplied by 2, they will be added into the new array.

Last, but not least...the .forEach() method

The .forEach() method, unlike filter and map, doesn't return anything. forEach iterates over an array. It is often used to update elements in the array it is iterating over. For example:

let names = ['Jack', 'Peter', 'Rebecca'];

names.forEach(function(item, index){;
    names[index] = `Hi, my name is ${item}!`;
})

console.log(names);

//output:  [ 'Hi, my name is Jack!', 'Hi, my name is Peter!', 'Hi, my name is Rebecca!' ]

The example shows an array of names, that is updated to be an array of the people in the array introducing themselves. This was done by updating each element in the array using the forEach method.

In conclusion, higher order functions can be very useful when trying to write clean code and accessing specific things in arrays. If you would like to level up your coding skills, I would definitely recommend taking a look at these functions!