<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: b.chau504</title>
    <description>The latest articles on DEV Community by b.chau504 (@bchau).</description>
    <link>https://dev.to/bchau</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F851966%2F44624fa3-b3db-48c4-86e7-a3648c0ca3a7.jpeg</url>
      <title>DEV Community: b.chau504</title>
      <link>https://dev.to/bchau</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/bchau"/>
    <language>en</language>
    <item>
      <title>Going Down the Gopher Hole. Intro to Go</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Mon, 29 Aug 2022 04:31:00 +0000</pubDate>
      <link>https://dev.to/bchau/going-down-the-gopher-hole-intro-to-go-23i9</link>
      <guid>https://dev.to/bchau/going-down-the-gopher-hole-intro-to-go-23i9</guid>
      <description>&lt;p&gt;As developers, when we are debugging, we always end up turning to Google for answers. To no surprise, it's the world's most used search engine. Google is also part of FAANG(Facebook, Amazon, Apple, Netflix, Google), some of the world's largest, most well-known tech companies. Many individuals that start their journey as a software developer aspire to work for one of these big tech companies, like Google.&lt;/p&gt;

&lt;p&gt;So what does it take to work for a company like Google? Some of the main programming languages used within Google include C++, Python, Java, and Javascript. You may have heard of some of these well-known, general languages, but there is a language that Google uses in several of their internal projects that include Chrome, App Engine, Earth, and Youtube. This language is called Go(or GoLang for better search search results). It was developed at Google, so learning Go will definitely give you an advantage in the interview process.&lt;/p&gt;

&lt;p&gt;Go is an open-sourced, compiled, and statically typed programming language. It was designed to improve the programming productivity within Google and allow developers to create dependable or concurrent applications. Because it compiles quickly, many programmers feel that they can get a lot more done.&lt;/p&gt;

&lt;p&gt;Go's simplicity and readability are among the reasons it quickly gained popularity and became many developer's first choice. It is simple to learn, especially if you have prior experience with another programming language. &lt;/p&gt;




&lt;h2&gt;
  
  
  Getting Started with Go
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Install
&lt;/h3&gt;

&lt;p&gt;To get started using Go, we would need to &lt;a href="https://go.dev/doc/install"&gt;download and install&lt;/a&gt; it.&lt;/p&gt;

&lt;p&gt;Once installed, verify that Go has been installed by opening your terminal and run the following command:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ go version
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Note: For the changes to take effect, you may need to restart your terminal.&lt;/p&gt;

&lt;p&gt;If the command prints the installed version of Go, you can move on to the next step.&lt;/p&gt;

&lt;h4&gt;
  
  
  Setup
&lt;/h4&gt;

&lt;p&gt;cd into the directory that you'd like to create your go project.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;cd %PATH%
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Create a directory for you Go source code&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;mkdir gobasics
cd gobasics
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;When your code imports packages from other modules, you manage those dependencies in your own module. A go.mod file defines that module, which tracks the modules that offer those packages. That go.mod file is kept with your code and in your source code repository.&lt;/p&gt;

&lt;p&gt;Run the go mod init command and specify the name of the module your code will be in to enable dependency tracking.&lt;/p&gt;

&lt;p&gt;In development, the module path is usually the repository location where your source code is stored. The module path, for instance, could be github.com/mymodule. If you intend to make it available to others, the module path must point to a location where Go tools can download it.&lt;/p&gt;

&lt;p&gt;We will be using example/gobasics.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ go mod init example/gobasics
go: creating new go.mod: module example/hello
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;To open your text editor, in the gobasics directory, run the command:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ code .
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In your text editor terminal create a file to begin writing your code.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ touch gobasics.go
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
    fmt.Println("Hello, World!")
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The above code is a basic setup. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;We start by declaring main package to create a standalone executable. (A package is a method of grouping functions that is made up of all the files in the same directory)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Afterward, we would import the fmt package, which has tools for formatting text, like printing to the console. When you installed Go, you received this package as one of the standard library packages.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Finally, create a main function that will print a message to the console. When you launch the main package, a main function is executed by default.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Let's give it a try. Run the following command in your terminal:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;$ go run .
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;h3&gt;
  
  
  Basic Syntax
&lt;/h3&gt;

&lt;p&gt;Let's get into some of the basic syntax of Go and see how easy it is to learn.&lt;/p&gt;

&lt;h4&gt;
  
  
  Printing
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var i, j string = "Super", "man"

  fmt.Print(i)
  fmt.Print(j)

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

&lt;/div&gt;



&lt;p&gt;The Print() function prints its arguments with their default format, so this will output Superman in one line.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var i, j string = "Super", "man"

  fmt.Print(i, "\n") // =&amp;gt; Super
  fmt.Print(j, "\n") // =&amp;gt; man
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use \n if you want to print the arguments on separate lines.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;fmt.Print(i, "\n", j)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It is also possible to print many variables with a single call to Print().&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;fmt.Print(i, " ", j)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use " " to separate string arguments.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var i,j = 10,20

  fmt.Print(i,j)
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If neither argument is a string, Print() places a space between the parameters.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var i,j string = "Super","man"

  fmt.Println(i,j) // =&amp;gt; Super man
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then there is Println(), which is a derivative of Print() that adds whitespace between the arguments and a new line at the end of the output.&lt;/p&gt;




&lt;h4&gt;
  
  
  Variables
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var favFood string = "sushi"
  x := 4

  fmt.Print(favFood) // =&amp;gt; sushi
  fmt.Print(x) // =&amp;gt; 4
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Variables are declared using the var keyword, followed by the variable name and type. You must always specify either type or value or both.&lt;/p&gt;

&lt;p&gt;Using the := sign, the type is inferred from the value, meaning the type is determined by the value by the compiler.&lt;br&gt;
When using the := sign, you must always assign a value to it.&lt;/p&gt;

&lt;p&gt;Unlike the var keyword, := can only be used inside functions and variable declaration and value assignment has to be done in the same line.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main
import "fmt"

func main() {
  var a string
  var b int
  var c bool

  fmt.Println(a) // =&amp;gt; 
  fmt.Println(b) // =&amp;gt; 0
  fmt.Println(c) // =&amp;gt; false
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;A variable's value will be set to the type's default value if it is declared without an initial value.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var a, b int = 6, 2

  fmt.Println(a) // =&amp;gt; 6
  fmt.Println(b) // =&amp;gt; 2

  c, d := 4, "Ever"

  fmt.Println(c) // =&amp;gt; 4
  fmt.Println(d) // =&amp;gt; Ever
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Several variables can be declared in a single line. When using the type keyword, you can only declare one type of variable per line. Otherwise, you can declare different types of variables in the same line.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main
import ("fmt")

func main() {
   var (
     a int
     b int = 0
     c string = "seven"
   )

  fmt.Println(a) // =&amp;gt; 0
  fmt.Println(b) // =&amp;gt; 0
  fmt.Println(c) // =&amp;gt; seven
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;For better readability, several variable declarations can be gathered within a block.&lt;/p&gt;




&lt;h4&gt;
  
  
  Arrays
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package main

import "fmt"

func main() {
  var arr1 = [4]int{1,2,3,4}
  arr2 := [5]int{5,6,7,8,9}
  var arr3 = [...]string{"Pomeranian","Husky","Shiba","German Shepherd"}

  fmt.Println(arr1[2]) // =&amp;gt; 3
  fmt.Println(arr2[0]) // =&amp;gt; 5
  fmt.Println(arr3[1]) // =&amp;gt; Husky
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;When declaring an array you must specify the length of the array by number like arr1 and arr2 or its inferred like arr3. A specific array element can be accessed by using the index number.&lt;/p&gt;

</description>
      <category>codenewbie</category>
      <category>go</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Exploring Swift</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Wed, 10 Aug 2022 05:45:00 +0000</pubDate>
      <link>https://dev.to/bchau/swift-476j</link>
      <guid>https://dev.to/bchau/swift-476j</guid>
      <description>&lt;p&gt;With more people owning mobile phones than toilets, the thought of mobile app development seemed like a good idea. So I wanted to explore it a little more. &lt;/p&gt;

&lt;p&gt;There are two types of mobile app development that you can get into, native and cross-platform. Selecting between the two is one of the most important choices to make when getting into mobile app development. &lt;/p&gt;

&lt;p&gt;A brief description of the two:  &lt;/p&gt;

&lt;p&gt;Cross-platform development is as it sounds; it refers to the process of developing an app that functions across many platforms. This is accomplished through the use of technologies such as React Native, Xamarin, and Flutter, and the resulting apps can be deployed on both Android and iOS. &lt;/p&gt;

&lt;p&gt;Native App development on the other hand, involves building a mobile app entirely for a single platform. It is built using programming languages and tools that are exclusive to one platform. For instance, you can create native Android apps using Java and Kotlin and native iOS apps using Swift and Objective-C.&lt;/p&gt;

&lt;p&gt;I wanted to delve into Swift a bit further because it is one of the most in-demand and popular languages employers and companies seek. It is also said to be one of the more beginner friendly programming languages.&lt;/p&gt;




&lt;h3&gt;
  
  
  Where did Swift come from?
&lt;/h3&gt;

&lt;p&gt;Objective-C, Apple's previous programming language, has been mostly untouched since the early 1980s and lacked current language capabilities. Swift, which was first introduced in 2014 at Apple's Worldwide Developers Conference(WWDC), was created as a replacement. It builds on Objective-C concepts, but modernizes them to include cleaner syntax and simpler readability, maintainability, and safety to prevent crashes.&lt;/p&gt;

&lt;p&gt;Swift outperformed Objective-C in a few areas, including type safety, security, and greater on-hardware performance. Swift is more than 8.4 times quicker than Python and more than 2.6 times faster than Objective-C.&lt;/p&gt;

&lt;p&gt;Swift is built on modern methods found in other modern programming languages such as JavaScript. For those who are coming from Javascript like me, here are some syntax differences and similarities between Javascript and Swift. &lt;/p&gt;

&lt;p&gt;Javascript:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log("Hello World");
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Swift:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;print("Hello World");
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;The var expression is used to declare a new variable with a value in both JavaScript and Swift.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var similar = "JS and Swift";
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Constants in Swift can also be defined as:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let favFood = "sushi";
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;All variables used in JavaScript are either strings, functions, or objects because it is entirely a dynamically typed language, however in Swift, the language is completely static type based, thus you have to explicitly state the types. For instance, in Swift, you would need to write it like this to separate the definition and declaration:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var dogName: String;
dogName = "Bumi";
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;Template literals&lt;br&gt;
Javascript:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var firstName = "Neil", middleName = "Patrick", lastName = "Harris";
console.log(`Full name is ${firstName} ${middleName} ${lastName}`);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Swift:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var firstName = "Neil", middleName = "Patrick", lastName = "Harris";
console.log("Full name is \(firstName) \(middleName) \(lastName)")
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;Despite the fact that Swift seems to have so many fans, the language is still far from ideal. When it comes to transitioning to the new language, many developers and company owners are very cautious. This is appropriate for a number of reasons. &lt;/p&gt;

&lt;p&gt;The language is still in its early stages. When compared to Objective C, which has been around since the 1980s, Swift was first presented to the public in 2014. Although it may seem like a long time ago, Swift is actually only 8 years old. The most recent upgrade improved ABI stability across Apple's platforms, backward compatibility with Swift versions, and documentation. Those are significant moves in the direction of making Swift a more sophisticated language. &lt;/p&gt;

&lt;p&gt;However, concurrently, continuous updates and modifications can lead developers to question whether their project can even be built, let alone whether the code they are writing now will work with earlier versions tomorrow.&lt;/p&gt;

&lt;p&gt;Compared to any other open source language, the Swift community is still much smaller, despite its rapid growth. Only 5.1 percent of the 83,053 respondents to the most recent StackOverflow Developer Survey reported using Swift. Therefore, if you want to use Swift for your next project, you could have difficulties finding developers that have sufficient Swift experience.&lt;/p&gt;




&lt;p&gt;Swift is used for more than just creating apps for Apple products. It was intended to be a general-purpose language. Swift has been compatible with Linux since version 2.2 was released in 2016 for the operating system. Version 5.3 of Swift was published in 2020, making it usable on Windows. It can be used on the top three operating systems as a cross-platform programming language.&lt;/p&gt;

&lt;p&gt;This indicates that Swift is being used to build online services and even web apps, and that developers may discover further uses for it in the future. This gives me pleasure to see the growth of this programming language and hope to work with it in the future. &lt;/p&gt;

</description>
      <category>swift</category>
      <category>beginners</category>
      <category>codenewbie</category>
      <category>ios</category>
    </item>
    <item>
      <title>Should I Learn PostgreSQL?</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Mon, 01 Aug 2022 03:48:00 +0000</pubDate>
      <link>https://dev.to/bchau/should-i-learn-postgresql-3opf</link>
      <guid>https://dev.to/bchau/should-i-learn-postgresql-3opf</guid>
      <description>&lt;p&gt;I'm currently at a point in my coding journey where I am nearly finished completing my first coding bootcamp. Job hunt will be the next step to take so that I can finally land that dream job that I and so many others desired. &lt;/p&gt;

&lt;p&gt;But first, building a strong resume that appeal to employers is crucial. It can be challenging drafting a resume as an entry-level software engineer. Upon writing out my current technical skills, I became curious to see what technical skills employers and companies would like to see in candidates. I found that a consistently solid understanding of databases is essential for software engineers because they are an integral component of software and application development. Which makes sense, because the world today simply cannot function without data.&lt;/p&gt;

&lt;p&gt;You will most likely expect to encounter database administration functions such as how to create, update, store, modify, and insert information. In the case that you are working with an organization's records or improving its security will need you to be familiar with their database.&lt;/p&gt;

&lt;p&gt;The industry standard for managing databases is SQL. SQL is known as a relational database management system (RDBMS), which means it saves data in rows and columns like a spreadsheet, as opposed to non-relational databases, which do not. Non-relational databases use a storage model that is best adapted for the type of data it is storing.&lt;/p&gt;

&lt;p&gt;There are several relation databases that use and support SQL querying; PostgreSQL being one of them. &lt;/p&gt;




&lt;h3&gt;
  
  
  Why learn PostgreSQL?
&lt;/h3&gt;

&lt;p&gt;Well, what exactly is PostgreSQL? Let's define it in more detail. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;PostgreSQL, commonly goes by the name Postgres, is an open-source and free to use RDBMS. (Who doesn't like free, right?)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;An extremely robust database that has been developed by the open-source community over the course of more than 30 years. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;It is an advanced version of SQL. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Runs on all major operating systems(Linux, macOS, Windows)&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://en.wikipedia.org/wiki/ACID"&gt;ACID&lt;/a&gt;-compliant since 2001.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Supports JSON(non-relational) querying as well.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Many web applications, as well as mobile and analytics applications, rely on it as their primary database.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Now that we have a general idea of what Postgres is, let's look at why learning how to utilize this database can be advantageous.&lt;/p&gt;

&lt;p&gt;Given that it is so similar to SQL standards, it makes it a great option for individuals who are new to SQL.&lt;/p&gt;

&lt;p&gt;Some of the largest and most well-known companies in the industry includes Postgres as part of their tech stack. The list includes companies like Apple, IMDB, Instagram, Reddit, Skype, Spotify, Twitch and NASA. &lt;a href="https://db-engines.com/en/blog/DBMS+of+the+year"&gt;db-engines.com&lt;/a&gt; has calculated the popularity of DBMSs over the years and has declared Postgres as the DBMS of the Year in 2017, 2018, and 2020. Making it the first system to win the title three times. According to a &lt;a href="https://insights.stackoverflow.com/survey/2021#most-popular-technologies-database-prof"&gt;survey&lt;/a&gt; conducted by stackoverflow.com, Postgres is currently the second most popular database system used by actual professional developers. So adding it to your array of technical skills will surely offer more job opportunities.      &lt;/p&gt;

&lt;p&gt;Many features in Postgres are designed to support developers in creating applications, administrators in protecting data integrity and constructing fault-tolerant systems, and you in managing your data regardless of the size of the dataset. Postgres is quite extendable. You can, for instance, create custom functions, define your own data types, and even write code in a variety of programming languages without having to recompile your database. It aims to comply to the SQL standard if such conformity does not conflict with conventional features or lead to poor architecture choices. Despite occasionally having somewhat different syntax or functionality, many of the features required by the SQL standard are supported. Continued progress in this direction can be expected. As of the September 2021 version 14 release, Postgres complies with at least 170 of the 179 requirements for SQL:2016 Core conformance.&lt;/p&gt;

&lt;p&gt;The well-known PostGIS geospatial database extender is only one of the many add-ons for Postgres. It provides support for geographic objects, allowing location queries to be performed in SQL. In addition to basic location awareness, PostGIS provides several capabilities not available in competing spatial databases such as Oracle Locator/Spatial and SQL Server.&lt;/p&gt;




&lt;p&gt;After doing some research on Postgres, it has demonstrated to me that it deserves and will have a position in my tech stack. Following market trends is the plan of attack right now and Postgres is one of the most popular and widely used database management systems in the world. With it being regularly improved by the open source community, I'll have plenty to keep me occupied since I enjoy learning new concepts and technology. I hope this helps you decide if learning Postgres is worth your time.   &lt;/p&gt;

</description>
      <category>career</category>
      <category>database</category>
      <category>postgres</category>
      <category>sql</category>
    </item>
    <item>
      <title>Type of Apps</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Sun, 26 Jun 2022 01:38:35 +0000</pubDate>
      <link>https://dev.to/bchau/type-of-apps-ngo</link>
      <guid>https://dev.to/bchau/type-of-apps-ngo</guid>
      <description>&lt;h1&gt;
  
  
  Different Types of Apps
&lt;/h1&gt;

&lt;p&gt;A typical user might not be able to distinguish a website, web app or native app on first sight. As long as they get the results for what they are searching for, the type of app doesn't really matter. As developers though, it's important that we know the difference between the various types of apps. &lt;/p&gt;

&lt;p&gt;Building the right app for users to enjoy is something we as developers should strive for. Making an app that is user friendly is a sure way to get many people to start using your app. There are different types of apps and each have their own purpose, but which is more preferred by users? &lt;/p&gt;




&lt;p&gt;It's crucial to understand the distinctions between websites and web applications since they can often be mistaken for one another due to their similarities.&lt;/p&gt;

&lt;h2&gt;
  
  
  Websites vs Web Apps
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Websites
&lt;/h3&gt;

&lt;p&gt;Websites are a collection of linked web pages that may consist of text, images, audio, video, and other content. It can be linked to one page, two pages, or numerous amounts of pages. Through a browser like Chrome or Firefox, you are able to view them. A website can be created using only HTML and CSS, but Javascript may be used to give it more dynamic features. Typically, websites are static in nature, meaning the content is organized in pages and they are not constantly updated. Often times, they are generally referred to as read-only sites. Archive websites, blogs, and community sites are just some examples of the type of static websites out there. A website's main intent is to facilitate user navigation and obtain information that is pertinent to their needs.&lt;/p&gt;

&lt;h3&gt;
  
  
  Web Apps
&lt;/h3&gt;

&lt;p&gt;Web apps, unlike webpages, require authentication. To present information, the web application utilizes both server-side and client-side scripts. It requires the use of a server to manage user requests. The visual difference between websites and web apps are that they are particularly dynamic and responsive. Every user sees a new set of data each time. These features make usability smooth and more engaging than a typical website.  &lt;/p&gt;

&lt;p&gt;Like websites, web apps are built using HTML, CSS, and Javascript. It also makes use of a database and a few other computer languages, including Ruby, PHP, and frameworks like Django, Angular, React, and Ruby on Rails.&lt;/p&gt;

&lt;p&gt;Some examples of web apps: &lt;/p&gt;




&lt;h2&gt;
  
  
  Native Apps
&lt;/h2&gt;

&lt;p&gt;Native apps are software programs that are designed to use on a specific device or platform like IOS or Android and Mac or Windows. The great thing about a native app is it can be installed directly onto the device, allowing users to still use it without internet connectivity, in most cases. Native apps are also capable of accessing a devices features, such as push notifications.&lt;/p&gt;

&lt;p&gt;Swift is a powerful and user-friendly programming language designed by Apple to develop iOS and MacOS apps. Other languages are available to use when building native apps like, Objective-C and C#. Android, on the other hand, uses Java, Kotlin, and Python to build their apps. &lt;/p&gt;




&lt;h2&gt;
  
  
  Progressive Web Apps
&lt;/h2&gt;

&lt;p&gt;PWAs are web applications created using a shared set of specific technology and practices that enable them to use both web and native app features. Web applications, for example, are more discoverable than native apps; visiting a website is much more quicker and easier than installing an app, and you can conveniently share web apps by simply sending a link. Native apps, on the other hand, are properly designed to work with the operating system and thus provide a more smooth user experience. We recently discussed how native apps are installed so that they may also be used offline, and users prefer to access their favorite apps simply tapping their icons rather than using a browser. Progressive web applications make it possible to create web apps that can use features that make web apps and native apps so great. &lt;/p&gt;

&lt;p&gt;From the outside, it's difficult to tell whether a web app is progressive or not. Like web apps, PWAs use HTML, CSS, and Javascript. When an app satisfies specific standards or incorporates a set of provided features, it is deemed a PWA: it operates offline, is installable, is easy to synchronize, can send push notifications, and so on. &lt;a href="https://developer.chrome.com/docs/lighthouse/overview/"&gt;Lighthouse&lt;/a&gt;, for example, is a tool that measures how complete (as a percentage) a web app is.&lt;/p&gt;

&lt;p&gt;One thing to note when developing an app, is the cost of development. A progressive web app is less expensive to produce than a native app. For the native app, you will need to learn the language and create a version for each platform. This implies you'll need at least two versions for iOS and Android, as well as the resources to keep each one up to date. This involves a serious amount of time and money, depending on the app's intent and complexity.   &lt;/p&gt;

&lt;p&gt;It takes less time to create and update a progressive web app. You can use a single codebase for several platforms in addition to the two most widely used ones. With the use of tools like Google Lighthouse, you can modify your existing website rather than creating an app from start. With responsive design, you only need one version of the app, and it will operate the same way across all platforms.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>programming</category>
      <category>mobile</category>
      <category>design</category>
    </item>
    <item>
      <title>The Importance of SEO to Developers</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Sun, 19 Jun 2022 05:39:32 +0000</pubDate>
      <link>https://dev.to/bchau/the-importance-of-seo-to-developers-4m6j</link>
      <guid>https://dev.to/bchau/the-importance-of-seo-to-developers-4m6j</guid>
      <description>&lt;h2&gt;
  
  
  What's beyond the first search page?
&lt;/h2&gt;

&lt;p&gt;Have you ever searched something on google and gotten to the tenth page before finding what you needed? No? Maybe the fifth? Or the third? I wouldn't be surprised if most of the time you find what you are looking for right on the first search page. According to a 2014 study conducted by Moz, an SEO and data management software site, 71.33 percent of Google search traffic never goes beyond the first page of results, with the number rising to 92 percent in recent years. Second-page results are a distant second, accounting for only around 6% of all website clicks. &lt;/p&gt;




&lt;h3&gt;
  
  
  What is SEO?
&lt;/h3&gt;

&lt;p&gt;SEO is the abbreviation for "search engine optimization." In layman's terms, it's the process of refining your website to make it more visible when people look for products or services relevant to your business.&lt;/p&gt;

&lt;p&gt;An SEO-friendly site, at its most basic level, allows a search engine to browse and read pages throughout the site. The first step to guarantee your exposure in search engine result pages is to ensure that a search engine can simply crawl and understand your material. We can do that by customizing our HTML and CSS.  &lt;/p&gt;

&lt;p&gt;In every web developer's journey, they will come across some HTML and CSS. It's vital for developers to have some basic knowledge of it when building a website from the ground up. Knowing HTML tags and CSS properties is one thing but knowing how to use them to build more traffic to your site is another. &lt;/p&gt;

&lt;p&gt;Here are different ways to utilize HTML:  &lt;/p&gt;

&lt;h4&gt;
  
  
  Title Tag
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;title&amp;gt;Title Tag&amp;lt;/title&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The most essential HTML signal that search engines use to identify what a site is about is the title. It's critical that your titles are distinctive and descriptive in order for users and search engines to understand what your pages are about. In most cases, the clickable link in a search result is the title tag. Search engines will only display the first 50-60 characters of your title, so keep it brief, but avoid one- or two-word titles. It should also accurately represent the content of your page and include the keywords you want to rank for.&lt;/p&gt;




&lt;h4&gt;
  
  
  &lt;a href="https://dev.to/bchau1242"&gt;Anchor Tag&lt;/a&gt;
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;a href="http://www.example.com"&amp;gt;Anchor Tag Text&amp;lt;/a&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Internal links should be prioritized while developing a website to help search engines understand the site structure and to make the browsing process easier for users. Search engines will have trouble crawling and indexing web pages that are not linked to one another, and the web pages will not display on the search engine results page.&lt;/p&gt;




&lt;h4&gt;
  
  
  &lt;h3&gt;Heading Tag&lt;/h3&gt;
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;header&amp;gt;&amp;lt;h1&amp;gt;Heading Tag&amp;lt;/h1&amp;gt;&amp;lt;/header&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Headings are a means to structure and define key sections of your content in a hierarchical manner. A headline is often seen at the top of a page. The content on this page is divided into several sections by a headline and many subheadings. H2 tags, the next "level" down from H1 tags, are being used for those sub-headings. Clear, meaningful headers help search engines understand pages and make your content more user-friendly. &lt;/p&gt;




&lt;p&gt;Meta Description Tag&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;head&amp;gt;
&amp;lt;meta name="description" content="This is an example of a
meta description. This will often show up in search results."&amp;gt;
&amp;lt;/head&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The meta description tag is typically inside the head tag, not to be confused with the header tag that we previously explored. It is an HTML element that allows you to specify how your web pages should be represented in search results. In the search results, descriptions will display below the headlines. It's more of a "success" factor than a ranking factor. A well-written description can persuade consumers to choose your site over others on the search page.&lt;/p&gt;




&lt;h4&gt;
  
  
  &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--otl503VQ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/http://www.easytolearning.com/webroot/ck_files/files/html-image-tag.png" alt="Image Tag" width="880" height="504"&gt;
&lt;/h4&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;img src="http://www.ExampleImageTagAddress.com/image-tag.png" alt="Image Tag"&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Alt text (alternative text) is used in HTML code to explain in text, the appearance and purpose of an image on a website. It is sometimes known as "alt attributes," "alt descriptions," or "alt tags." In the event that an image fails to load on a user's screen, the alt text will appear in its place. Although it is not necessary for terms of being indexed and ranked, it can help visually impaired users who are using screen readers. An alt attribute will be read aloud to them to help them interpret an on-page image. &lt;/p&gt;




&lt;p&gt;CSS: &lt;/p&gt;

&lt;p&gt;Having a responsive website is a requirement in today's world of the web. With smartphone users increasing rapidly, developers must create a website that is suitable for mobile phones, as well as desktops, tablets, and other devices. Search engines favor mobile-friendly websites since they match SEO standards.  &lt;/p&gt;

&lt;h4&gt;
  
  
  Media Query
&lt;/h4&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--VJz41JdR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.seobility.net/en/wiki/images/6/6f/Media-Queries.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--VJz41JdR--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.seobility.net/en/wiki/images/6/6f/Media-Queries.png" width="880" height="665"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Depending on a specified set of conditions regarding the user's device, browser, or system settings, media queries can change the appearance (and possibly functionality) of a website or app. &lt;/p&gt;




&lt;p&gt;Freelance web developers are often web designers and web developers. So it is necessary for them to have knowledge of SEO. It can look good when advertising yourself to have both skills. &lt;/p&gt;

&lt;p&gt;If you are not a freelancer or have not decided to become one, it can still be a very important skill to learn. Any small company or business would be pleased to work with someone who does both SEO and web development.   &lt;/p&gt;

&lt;p&gt;Web developers, especially those who are new to the field, must understand the significance of SEO in web development. It can enhance your résumé and give you more job opportunities.  &lt;/p&gt;

</description>
      <category>career</category>
      <category>codenewbie</category>
      <category>html</category>
      <category>css</category>
    </item>
    <item>
      <title>How does AWS Deployment work?</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Sun, 12 Jun 2022 22:23:45 +0000</pubDate>
      <link>https://dev.to/bchau/head-in-the-clouds-aws-deployment-5ed9</link>
      <guid>https://dev.to/bchau/head-in-the-clouds-aws-deployment-5ed9</guid>
      <description>&lt;h2&gt;
  
  
  What is AWS?
&lt;/h2&gt;

&lt;p&gt;Are you considering deploying your application with Amazon Web Services(commonly known as AWS)? Not entirely sure what deployment service to use for your code? Maybe you're just curious about how AWS works, or if their services would be something you want to use. Well there's a reason more than 45 percent of the world is using AWS today. It is widely used by many small businesses, large-scale companies and government agencies. AWS has a variety of services from data centers to compute services to cloud platforms, just to name a few. Actually, AWS has over 200 services. Some of the few AWS services that we'll be exploring to deploy your next application:  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/concepts.html"&gt;Amazon Elastic Compute Cloud(EC2)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/elasticloadbalancing/latest/userguide/what-is-load-balancing.html"&gt;Amazon Elastic Load Balancing(ELB)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://aws.amazon.com/autoscaling/"&gt;AWS Auto Scaling&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/AMIs.html"&gt;AMI(Amazon Machine Image)&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/codedeploy/latest/userguide/welcome.html"&gt;AWS CodeDeploy&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Deployment before AWS
&lt;/h2&gt;

&lt;p&gt;Let's take it back once more to see how developers would deploy their code. Before AWS dominated the cloud computing industry, developers would manually log into the server and run deployment scripts. The problem with this was that it was extremely risky. Businesses would have to plan for and acquire servers and IT infrastructure weeks or months ahead of time. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Amazon EC2&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Amazon EC2 makes it easy for you to obtain virtual servers(also known as compute instances in the cloud) quickly. AWS gives you the freedom to launch as many or as few virtual servers as you need, configure security and networking, and manage storage.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Mutable Infrastructure&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Manually connecting to a single Amazon EC2 instance to deploy new code has certain drawbacks. There's a possibility something may go wrong with your code or scripts, causing all users to be affected. If you test your code on a development server, there's always the possibility that it won't work on the production server.&lt;br&gt;
This is referred to as mutable infrastructure. &lt;/p&gt;

&lt;p&gt;Assume someone logged in, made a change, and then failed to update the development server. Your deployment in one mutable server may respond differently in another mutable server.&lt;/p&gt;




&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--DioeQqBY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/faude2pkqo4bo6c2cyqn.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--DioeQqBY--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/faude2pkqo4bo6c2cyqn.gif" alt="Mutable Infrastructure vs Immutable Infrastructure" width="880" height="495"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Immutable Infrastructure&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;With immutable infrastructure, there are no changes taking place on the production server. Which allows us to implement control changes so that our running code updates in a predictable manner. The running code only updates when it is completely replaced with a new instance that contains all the necessary changes. &lt;/p&gt;

&lt;p&gt;Consider the example above. &lt;/p&gt;

&lt;p&gt;With two instances, one instance can be for deployment and while the other one keeps serving the traffic. What happens when an instance fails or has an increase in traffic? AWS has a service to solve that problem also.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;AWS Auto Scaling&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--5MHtt2TN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k3c6dlf6xcrtd3igllvn.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--5MHtt2TN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k3c6dlf6xcrtd3igllvn.png" alt="Auto Scaling" width="381" height="481"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/autoscaling/ec2/userguide/what-is-amazon-ec2-auto-scaling.html"&gt;Auto scaling&lt;/a&gt; is an effective method of ensuring the availability and predictable performance of many instances that serve traffic. As the demand on your instances varies, Amazon EC2 Auto Scaling allows you to dynamically raise or reduce the number of instances. When an instance fails or there is a spike in traffic, auto scaling automatically creates new instances immediately by utilizing an &lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/AMIs.html"&gt;AMI (Amazon Machine Image)&lt;/a&gt;. The operating system and all software packages required to run the application are included in AMIs.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Amazon Elastic Load Balancing(Amazon ELB)&lt;/strong&gt;     &lt;/p&gt;

&lt;p&gt;Your incoming application traffic is dynamically distributed across all of your running EC2 instances using Elastic Load Balancing. Elastic Load Balancing distributes incoming requests across several servers, ensuring that no one server is congested.&lt;/p&gt;

&lt;p&gt;Attach the load balancer to your Auto Scaling group if you want to use Elastic Load Balancing with it. This connects your Auto Scaling group to the load balancer, which serves as a central point of contact for any and all incoming web traffic.&lt;/p&gt;

&lt;p&gt;Individual EC2 instances do not need to be registered with the load balancer while using Elastic Load Balancing with your Auto Scaling group. The load balancer automatically registers instances that are launched by your Auto Scaling group. Similarly, instances removed from your Auto Scaling group get deregistered from the load balancer automatically.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Ease of Deploying with AWS CodeDeploy
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/codedeploy/latest/userguide/welcome.html"&gt;AWS CodeDeploy&lt;/a&gt; makes it simple to automate code deployments while still maintaining application uptime. Its automated deployment capabilities make it an excellent solution for updating application and promptly release new features without the risk of errors. &lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Conclusion&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Every coder, programmer, developer(call it what you will) will deploy their application to a server at some point throughout their career. It doesn't matter if it's a large server or a small server. It might be one or a hundred servers. Whatever your requirements are, you'll most likely want to have servers as quickly and efficiently as possible.&lt;/p&gt;

&lt;p&gt;Understanding a bit about AWS can help you advance in your profession and find your next job. You can pursue a variety of certifications and positions that Amazon offers. It's perfectly fine if you're not interested in working for Amazon. AWS skills, on the other hand, are in high demand for almost any developer position. So, are you planning to use any of Amazon's online services?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://aws.amazon.com/about-aws/"&gt;https://aws.amazon.com/about-aws/&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/codedeploy/latest/userguide/welcome.html"&gt;https://docs.aws.amazon.com/codedeploy/latest/userguide/welcome.html&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/concepts.html"&gt;https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/concepts.html&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/autoscaling/ec2/userguide/what-is-amazon-ec2-auto-scaling.html"&gt;https://docs.aws.amazon.com/autoscaling/ec2/userguide/what-is-amazon-ec2-auto-scaling.html&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/AMIs.html"&gt;https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/AMIs.html&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://docs.aws.amazon.com/elasticloadbalancing/latest/userguide/what-is-load-balancing.html"&gt;https://docs.aws.amazon.com/elasticloadbalancing/latest/userguide/what-is-load-balancing.html&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>cloud</category>
      <category>tutorial</category>
      <category>aws</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>Factory Functions vs Constructors</title>
      <dc:creator>b.chau504</dc:creator>
      <pubDate>Sun, 24 Apr 2022 22:39:22 +0000</pubDate>
      <link>https://dev.to/bchau/factory-functions-vs-constructors-500m</link>
      <guid>https://dev.to/bchau/factory-functions-vs-constructors-500m</guid>
      <description>&lt;p&gt;To grasp the concept of factory functions and constructors, you must first understand &lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions"&gt;functions&lt;/a&gt; and &lt;a href="https://www.w3schools.com/js/js_objects.asp"&gt;objects&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;If you're creating numerous amounts of objects with similar properties and functionality, it can be tedious and repetitive. We want to keep in mind the principle of keeping our code D.R.Y., which stands for "Don't Repeat Yourself". There are function patterns that can help us write shorter, cleaner, more efficient code. Factory functions and constructor functions can do just that, but which one should you use? Let's dive a little deeper into what factory functions and constructors are, what they can and can't do, and the similarities and the differences. &lt;/p&gt;

&lt;h2&gt;
  
  
  What are factory functions?
&lt;/h2&gt;

&lt;p&gt;Factory functions can be thought of as an actual factory that takes in raw materials and produces numerous products promptly. Factory functions, on the other hand, take in specific inputs and uses those inputs to create a new object. So, how can this actually be useful to us? We can simply create each object individually, but that might take some time. If you are creating objects with the same properties and different values, then creating one factory function can make this process quicker.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const car1 = {
    make: 'Toyota',
    model: 'Tacoma',
    year: 2018,
    fuelType: 'gas', 
    bodyType: 'mid-size pick-up truck',
    getFullName() {
        return `${this.year} ${this.make} ${this.model}`;
    }
}

console.log(car1.getFullName()); // =&amp;gt; 2018 Toyota Tacoma
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In the example above, we create an object describing a specific car. Now let's make a similar object to this one.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const car2 = {
    make: 'Tesla', 
    model: 'Model S',
    year: 2018,
    fuelType: 'electric',
    bodyType: 'sedan',
    getFullName() {
        return `${this.year} ${this.make} ${this.model}`;
    }
}

console.log(car2.getFullName()); // =&amp;gt; 2018 Tesla Model S 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, I can continue creating objects of more cars, but who has time for that, right? Let's see what this would look like as a factory function.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function createCar (make, model, year, fuelType, bodyType) {
    return {
        make: make, 
        model: model, 
        year: year, 
        fuelType: fuelType, 
        bodyType: bodyType,
        getFullName() {
            return `${year} ${make} ${model}`;
        }
    }
}

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

&lt;/div&gt;



&lt;p&gt;We now have a factory function that creates new objects for us. Now, all we have to do is pass in data and let the factory function do its thing.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function createCar (make, model, year, fuelType, bodyType) {
    return {
        make: make, 
        model: model, 
        year: year, 
        fuelType: fuelType, 
        bodyType: bodyType,
        getFullName() {
            return `${year} ${make} ${model}`;
        }
    }
}

const car1 = createCar('Toyota', 'Tacoma', 2018, 'gas', 'mid-size pick-up truck');
const car2 = createCar('Tesla', 'Model S', 2018, 'electric', 'sedan');

console.log(car1.getFullName()); // =&amp;gt; 2018 Toyota Tacoma
console.log(car2.getFullName()); // =&amp;gt; 2018 Tesla Model S 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You may build any number of objects by utilizing the factory function instead of repeating code.&lt;/p&gt;

&lt;h2&gt;
  
  
  What are constructors?
&lt;/h2&gt;

&lt;p&gt;A constructor function is another javascript pattern, that is very similar to factory functions. Though, unlike factory functions, constructor functions do not actually return an object. To create different objects with the same properties, we would need to use the keyword "new" and the keyword "this". With that being said, let's see how constructor functions work visually.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function Car(make, model, year, fuelType, bodyType) {
    this.make = make
    this.model = model 
    this.year = year
    this.fuelType = fuelType
    this.bodyType = bodyType
    this.getFullName = () =&amp;gt; {
        return `${this.year} ${this.make} ${this.model}`;
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In the example above, the constructor function looks a lot like a factory function, except for the use of the keyword "this"."this" refers to the constructor function that created the instance object. In other words, "this" has no value in a constructor function. You can think of it as a stand-in for the new object.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function Car(make, model, year, fuelType, bodyType) {
    this.make = make
    this.model = model 
    this.year = year
    this.fuelType = fuelType
    this.bodyType = bodyType
    this.getFullName = () =&amp;gt; {
        return `${this.year} ${this.make} ${this.model}`;
    }
}

const car1 = new car('Toyota', 'Tacoma', 2018, 'gas', 'mid-size pick-up truck');
const car2 = new car('Tesla', 'Model S', 2018, 'electric', 'sedan');

console.log(car1.getFullName()); // =&amp;gt; 2018 Toyota Tacoma
console.log(car2.getFullName()); // =&amp;gt; 2018 Tesla Model S
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;To create objects using constructor functions, we use another keyword, "new". When you use the term "new" in front of a function call, javascript does two things for us automatically:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Inside the function, creates an empty object with the name "this".&lt;/li&gt;
&lt;li&gt;Returns the object "this" to the statement that called the function initially.
&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function Car(make, model, year, fuelType, bodyType) {
    // const this = {};
    this.make = make
    this.model = model 
    this.year = year
    this.fuelType = fuelType
    this.bodyType = bodyType
    this.getFullName = () =&amp;gt; {
        return `${this.year} ${this.make} ${this.model}`;
    }
    // return this;
}

const car1 = new car('Toyota', 'Tacoma', 2018, 'gas', 'mid-size pick-up truck');
const car2 = new car('Tesla', 'Model S', 2018, 'electric', 'sedan');
console.log(car1.getFullName()); // =&amp;gt; 2018 Toyota Tacoma
console.log(car2.getFullName()); // =&amp;gt; 2018 Tesla Model S
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Inheritance
&lt;/h2&gt;

&lt;p&gt;Inheritance plays a big part in how factory functions and constructor functions are different.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function createCar (make, model, year, fuelType, bodyType) {
    return {
        make: make, 
        model: model, 
        year: year, 
        fuelType: fuelType, 
        bodyType: bodyType,
        getFullName() {
            return `${year} ${make} ${model}`;
        }
    }
}

const car1 = createCar('Toyota', 'Tacoma', 2018, 'gas', 'mid-size pick-up truck');
const car2 = createCar('Tesla', 'Model S', 2018, 'electric', 'sedan'); 

car1.getFullName = function() {
    return `My ${fuelType} ${bodyType} is a ${year} ${make} ${model}`;
}

console.log(car1.getFullName()); // =&amp;gt; My gas mid-size pick-up truck is a 2018 Toyota Tacoma
console.log(car2.getFullName()); // =&amp;gt; 2018 Tesla Model S
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Let's refer back to the first example of the factory function. What if we wanted to redeclare car1.getFullName()? Well, car1.getFullName() and car2.getFullName() are not the same function in memory. Each object gets its own copy of the function. Meaning, that when the function creates an object and returns it, it copies the properties and values and attaches them to every object calling the function.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function car(make, model, year, fuelType, bodyType) {
    // const this = {};
    this.make = make
    this.model = model 
    this.year = year
    this.fuelType = fuelType
    this.bodyType = bodyType
    this.getFullName = () =&amp;gt; {
        return `${this.year} ${this.make} ${this.model}`;
    }
    // return this;
}

const car1 = new car('Toyota', 'Tacoma', 2018, 'gas', 'mid-size pick-up truck');
const car2 = new car('Tesla', 'Model S', 2018, 'electric', 'sedan');

console.log(car1); // =&amp;gt; car {make: 'Toyota', model: 'Tacoma' , etc.}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, let's take a look at our constructor function above. When a constructor is made, it comes with its own prototype. When we create a new car object using the "new" keyword, it creates an instance of the car type. In other words, car1's prototype is of type "car". Now, car1 is inheriting from the car constructor. This allows us to add properties to the prototype car.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Car.prototype.sentence = function() {
    return `My ${this.fuelType} ${this.bodyType} is a ${this.year} ${this.make} ${this.model}`;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(car1); // =&amp;gt; Car {
//   make: 'Toyota',
//   model: 'Tacoma',
//   year: 2018,
//   fuelType: 'gas',
//   bodyType: 'mid-size pick-up truck',
//   getFullName: [Function (anonymous)]
// }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Notice that the sentence function isn't directly added to the car constructor itself.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(Car.prototype); // =&amp;gt; { sentence: [Function (anonymous)] }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;But when we check its prototype, there it is! Now we're able to access the newly added function.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(car1.sentence()); // =&amp;gt; My gas mid-size pick-up truck is a 2018 Toyota Tacoma
console.log(car2.sentence()); // =&amp;gt; My electric sedan is a 2018 Tesla Model S
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now that we know how each operation works, the question is: Which one should we use? They can both get you the same result. Constructors are great when you want to add or remove a property from every object inheriting from the constructor. However, factory functions can be more straightforward to understand, because, at the end of the day, it's just a function. For factory functions, we don't have to involve the keyword "new". It can be more flexible, with the power of closure. With that, we can accomplish something called "data privacy". Let's look at one more example explaining how this works.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function createCar(make, model, year) {
    return {
        getFullName() {
            return `${year} ${make} ${model}`;
        }
    }
}

const car1 = createCar('Toyota', 'Tacoma', 2018); 

console.log(car1.getFullName()); // =&amp;gt; 2018 Toyota Tacoma
console.log(car1.make); // =&amp;gt; undefined
console.log(car1); // =&amp;gt; { getFullName: [Function: getFullName] }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;car1.make is hidden and it cannot be reached or found in the prototype. This makes it more difficult to accidentally create a bug somewhere in your code.&lt;/p&gt;

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

&lt;p&gt;All in all, the great thing about writing your own code is nothing is necessarily wrong. There is a good practice of keeping our code clean and short. Use factory functions and constructor functions where you think it would be best for your case. &lt;/p&gt;




&lt;p&gt;Sources &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions"&gt;https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.w3schools.com/js/js_objects.asp"&gt;https://www.w3schools.com/js/js_objects.asp&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.javascripttutorial.net/javascript-factory-functions/"&gt;https://www.javascripttutorial.net/javascript-factory-functions/&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor"&gt;https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://www.w3schools.com/js/js_object_constructors.asp"&gt;https://www.w3schools.com/js/js_object_constructors.asp&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes"&gt;https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
