<?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: erfankashani</title>
    <description>The latest articles on DEV Community by erfankashani (@erfankashani).</description>
    <link>https://dev.to/erfankashani</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%2F227877%2F46eb2331-30ba-491a-93f1-08f3c7696295.jpeg</url>
      <title>DEV Community: erfankashani</title>
      <link>https://dev.to/erfankashani</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/erfankashani"/>
    <language>en</language>
    <item>
      <title>Deploy Application on Azure App Services</title>
      <dc:creator>erfankashani</dc:creator>
      <pubDate>Wed, 28 Dec 2022 21:16:53 +0000</pubDate>
      <link>https://dev.to/erfankashani/deploy-application-on-azure-app-services-k32</link>
      <guid>https://dev.to/erfankashani/deploy-application-on-azure-app-services-k32</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;Hello, after a long break of blogging, I am dedicating myself to share my knowledge with the community via series of posts regarding different architecture designs that I have worked on throughout past year. These designs corresponds to my current learning journey and are open to feedbacks and discussions. Without further due, let's dig in.&lt;/p&gt;

&lt;h2&gt;
  
  
  Senario
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjfxvrwlerw9slrvh37hd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fjfxvrwlerw9slrvh37hd.png" alt="demo-senario" width="800" height="538"&gt;&lt;/a&gt;&lt;br&gt;
Imagine you are in process of creating a product in form of web application, mobile application, or API endpoint. You have designed and prototyped your business logic in form of an executable package. While this application undergoes different levels of development maturity, you require a mean of presenting and demoing the proof of concept (POC) to your  client/audiences with different technical skill levels. There are plenty approaches which can achieve this purpose. Some are mentioned below:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ship the application as a package to be installed and tested on other developer's laptops.&lt;/li&gt;
&lt;li&gt;Package and Deploy the application on an internal server, on-premises infrastructure or internal network for few techsavy audiences to test.&lt;/li&gt;
&lt;li&gt;Deploy your application and serve on a public/private cloud provider and create instructions for how the end-user would interact with your app.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;As you can see, you have many choices to deploy and present your application. One of the most important lessons I have learnt is that there will never be a silver-bullet tool, design, or architecture which works for all problems. Each project comes with sets of requirements and constraints. An architect or a developer has to make considerations and trade-off which will affect the product's end-goal. Some of the factors you can consider while choosing the correct approach for your product demo are time, skillset, budget, product's maturity level, and enterprise infrastructure availability. &lt;/p&gt;

&lt;p&gt;having said that, let us assume we decided to deploy our application to a cloud provider (such as Microsoft Azure). There are yet different abstraction levels we can choose to lower the entry-cost of using cloud services. The price of these abstractions are to lose control over certain parts of the infrastructure your application will run on. Some of the available options are as such:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Deploy your application as a serverless architecture using Azure functions&lt;/li&gt;
&lt;li&gt;Containerize and deploy the application using one of the container delivery services on Azure like &lt;a href="https://azure.microsoft.com/en-us/products/app-service/#overview" rel="noopener noreferrer"&gt;App Services&lt;/a&gt;, &lt;a href="https://azure.microsoft.com/en-us/products/container-instances/" rel="noopener noreferrer"&gt;Container Instances&lt;/a&gt;, or &lt;a href="https://azure.microsoft.com/en-us/products/kubernetes-service/" rel="noopener noreferrer"&gt;Kubernetes Services&lt;/a&gt;. &lt;/li&gt;
&lt;li&gt;Deploy the application on a cloud hosted Virtual Machine &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;As mentioned before, there are situations which choosing one solution would be more beneficial than others. In this example, we would like to deploy our application with minimal architecture alteration and scalability in mind. We will try to containerize and deploy the application on Azure App Service. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe40qw6k3lah1x6ameld5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fe40qw6k3lah1x6ameld5.png" alt="azure-app-service" width="800" height="441"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Azure App Service
&lt;/h2&gt;

&lt;p&gt;App Service is an Azure cloud offering which allows fast build, deploy, and scaling of Web, Mobile, and API applications. It supports .NET, .NET Core, Node.js, Java, Python, or PHP programs inside of containers. App Service provide a fully managed infrastructure which deals with maintenance, security patches, and scaling. With it's 99.95 percent service-level agreement (SLA)-backed uptime availability, App Service can be good candidate for some production grade applications. We will deploy our first App Service in the following section.&lt;/p&gt;

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

&lt;ul&gt;
&lt;li&gt;docker&lt;/li&gt;
&lt;li&gt;az-cli&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;
  
  
  Steps:
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Generate a new resource group: We will use this logical container to easier manage, monitor, deploy, scale, grant access of resources to a specific group or identity.&lt;/li&gt;
&lt;li&gt;Create a new Azure Container Registry (ACR): This image registry hosts your docker images on Azure. For enterprise use-cases look into options such as Jfrog Artifactory.&lt;/li&gt;
&lt;li&gt;Create an Azure App Service Plan&lt;/li&gt;
&lt;li&gt;Create an Azure App Service&lt;/li&gt;
&lt;li&gt;Upload your docker image to ACR and configure the App Service to use the image&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;We will configure the components using Azure CLI for more interactive approach. For more advance use-cases we can look into Azure ARM templates or terraform for future blogs. &lt;/p&gt;
&lt;h3&gt;
  
  
  Login using az cli
&lt;/h3&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# install azure-cli on mac-os&lt;/span&gt;
brew update &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; brew &lt;span class="nb"&gt;install &lt;/span&gt;azure-cli

&lt;span class="c"&gt;# login&lt;/span&gt;
az login

&lt;span class="c"&gt;# check the active subscription:&lt;/span&gt;
az account show &lt;span class="nt"&gt;--output&lt;/span&gt; table

&lt;span class="c"&gt;# change the active subscription (if needed):&lt;/span&gt;
az account &lt;span class="nb"&gt;set&lt;/span&gt; &lt;span class="nt"&gt;--subscription&lt;/span&gt; &amp;lt;subscription_name&amp;gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;h3&gt;
  
  
  Create new resource group
&lt;/h3&gt;

&lt;p&gt;Note: Naming conventions should follow consistent rules throughout your developments. It is a good idea to research your organizational naming conventions and follow them. I will use the following convention in a Camel Case format: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;[Compname, Teamname, Projectname, Envname, Resourcelocation (abbreviated), Resourcetype (abbreviated)]&lt;/code&gt; &lt;/li&gt;
&lt;li&gt;example: &lt;code&gt;SpacexFlycontrolLandingtimeProdCcRg&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# create a new resource group:&lt;/span&gt;
az group create &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--location&lt;/span&gt; canadacentral

&lt;span class="c"&gt;# check the resource group list&lt;/span&gt;
az group list
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;h3&gt;
  
  
  Create Azure Container Registry (ACR)
&lt;/h3&gt;


&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# create ACR&lt;/span&gt;
az acr create &lt;span class="nt"&gt;--name&lt;/span&gt; demoflaskappacr &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--sku&lt;/span&gt; Basic &lt;span class="nt"&gt;--admin-enabled&lt;/span&gt; &lt;span class="nb"&gt;true&lt;/span&gt;

&lt;span class="c"&gt;# retrieve the registry's credentials&lt;/span&gt;
az acr credential show &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--name&lt;/span&gt; demoflaskappacr
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;


&lt;p&gt;Note: Copy the "password" (not password2) and username in the step above as we will use this to login via docker.&lt;/p&gt;
&lt;h3&gt;
  
  
  Login and push the image into ACR
&lt;/h3&gt;

&lt;p&gt;In this step you can use the boiler plate flask + docker project from &lt;a href="https://github.com/erfankashani/docker_flask_app" rel="noopener noreferrer"&gt;github&lt;/a&gt; and follow the instructions:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# login to ACR &lt;/span&gt;
docker login demoflaskappacr.azurecr.io &lt;span class="nt"&gt;--username&lt;/span&gt; demoflaskappacr

&lt;span class="c"&gt;# clone the sample flask docker project&lt;/span&gt;
git clone https://github.com/erfankashani/docker_flask_app.git
&lt;span class="nb"&gt;cd &lt;/span&gt;docker_flask_app

&lt;span class="c"&gt;# build the image&lt;/span&gt;
docker build &lt;span class="nt"&gt;-t&lt;/span&gt; docker-flask-app &lt;span class="nb"&gt;.&lt;/span&gt;

&lt;span class="c"&gt;# run the image&lt;/span&gt;
docker run &lt;span class="nt"&gt;-p&lt;/span&gt; 8888:5000 docker-flask-app
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This local container exposes to port 8888 on the host. The successful application can be checked on &lt;code&gt;http://localhost:8888/&lt;/code&gt; URL on your local computer's browser.&lt;/p&gt;

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

&lt;p&gt;Now let us push this built image to docker registry:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# change the image name and tag to latest&lt;/span&gt;
docker tag docker-flask-app demoflaskappacr.azurecr.io/docker-flask-app:latest

&lt;span class="c"&gt;# push to registry&lt;/span&gt;
docker push demoflaskappacr.azurecr.io/docker-flask-app:latest

&lt;span class="c"&gt;# check the ACR for the pushed image&lt;/span&gt;
az acr repository list &lt;span class="nt"&gt;-n&lt;/span&gt; demoflaskappacr
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Create App service
&lt;/h3&gt;

&lt;p&gt;In this step we will create the App Service Plan and then an App Service which can pull images from the registry&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="c"&gt;# create app service plan:&lt;/span&gt;
az appservice plan create &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevAsp &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--is-linux&lt;/span&gt;

&lt;span class="c"&gt;# create the app service (webapp)&lt;/span&gt;
az webapp create &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--plan&lt;/span&gt; DemoFlaskappDevAsp &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevAs &lt;span class="nt"&gt;--deployment-container-image-name&lt;/span&gt; demoflaskappacr.azurecr.io/docker-flask-app:latest

&lt;span class="c"&gt;# expose the container's port 5000&lt;/span&gt;
az webapp config appsettings &lt;span class="nb"&gt;set&lt;/span&gt; &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevAs &lt;span class="nt"&gt;--settings&lt;/span&gt; &lt;span class="nv"&gt;WEBSITES_PORT&lt;/span&gt;&lt;span class="o"&gt;=&lt;/span&gt;5000

&lt;span class="c"&gt;# enable the system assigned managed identity (principle-id):&lt;/span&gt;
az webapp identity assign &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevAs &lt;span class="nt"&gt;--query&lt;/span&gt; principalId &lt;span class="nt"&gt;--output&lt;/span&gt; tsv

&lt;span class="c"&gt;# retrieve az account subscription-id (subscription-id)&lt;/span&gt;
az account show &lt;span class="nt"&gt;--query&lt;/span&gt; &lt;span class="nb"&gt;id&lt;/span&gt; &lt;span class="nt"&gt;--output&lt;/span&gt; tsv


&lt;span class="c"&gt;# grant the pulling access from ACR to the webapp managed identity (use principle-id and subscription-id from above)&lt;/span&gt;
az role assignment create &lt;span class="nt"&gt;--assignee&lt;/span&gt; &amp;lt;principle-id&amp;gt; &lt;span class="nt"&gt;--scope&lt;/span&gt; /subscriptions/&amp;lt;subscription-id&amp;gt;/resourceGroups/DemoFlaskappDevCcRg/providers/Microsoft.ContainerRegistry/registries/demoflaskappacr &lt;span class="nt"&gt;--role&lt;/span&gt; &lt;span class="s2"&gt;"AcrPull"&lt;/span&gt;

&lt;span class="c"&gt;# configure the app to use the managed identity (use subscription-id from above)&lt;/span&gt;
az resource update &lt;span class="nt"&gt;--ids&lt;/span&gt; /subscriptions/&amp;lt;subscription-id&amp;gt;/resourceGroups/DemoFlaskappDevCcRg/providers/Microsoft.Web/sites/DemoFlaskappDevAs/config/web &lt;span class="nt"&gt;--set&lt;/span&gt; properties.acrUseManagedIdentityCreds&lt;span class="o"&gt;=&lt;/span&gt;True

&lt;span class="c"&gt;# configure the web app to use the correct docker registry:&lt;/span&gt;
az webapp config container &lt;span class="nb"&gt;set&lt;/span&gt; &lt;span class="nt"&gt;--name&lt;/span&gt; DemoFlaskappDevAs &lt;span class="nt"&gt;--resource-group&lt;/span&gt; DemoFlaskappDevCcRg &lt;span class="nt"&gt;--docker-custom-image-name&lt;/span&gt; demoflaskappacr.azurecr.io/docker-flask-app:latest &lt;span class="nt"&gt;--docker-registry-server-url&lt;/span&gt; https://demoflaskappacr.azurecr.io
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Grab the URL from azure portal:&lt;/p&gt;

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

&lt;p&gt;use the URL to access the app (please note that the first time load might take longer):&lt;/p&gt;

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

&lt;p&gt;We have a deployed working version of this App Service. There are few more considerations which we make before demoing this application.&lt;/p&gt;

&lt;h2&gt;
  
  
  Networking
&lt;/h2&gt;

&lt;p&gt;The applications hosted on Azure App Service are by default accessible through public internet and can only reachout to public endpoints. There are series of networking features which can help you define guidelines on the app's ingress (inbound traffic) and egress (outbound traffic). It is important to note that some of these capabilities are dependant on your mode of deployment (aka. single-tenant vs. multi-tenant plans). The following features are available on our multi-tenant service hosted App Service:&lt;/p&gt;

&lt;h4&gt;
  
  
  Ingress:
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;App-assigned address&lt;/strong&gt;: Enables IP-based SSL checks and dedicated unshared inbound addresses for your app&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Access restriction&lt;/strong&gt;: Can limit the app access to specific well-defined addresses. This is a good idea for early demo phases when you would want to ensure your application can be viewed only by specific people.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Service endpoints and private endpoints&lt;/strong&gt;: Expose a private endpoint and manage the access from resources within a VNet. There are more advanced techniques such as integrating your application with firewalls and load-balancer services like Azure Front Door. These applications are more useful for production and we can discuss them in future blogs based on interest levels.&lt;/li&gt;
&lt;/ul&gt;

&lt;h4&gt;
  
  
  Egress:
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Hybrid connections&lt;/strong&gt;: Access to private networks that are not connected to Azure.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Gateway-required Vnet-integrations&lt;/strong&gt;: Access to resources  in other VNets in different region via VNet peering. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;VNet Integrations&lt;/strong&gt;: This integration with Virtual Network opens the door to options such as configuring private subnets, exposing static IPs via NAT gateway, defining Network Security Groups (NSGs) for outbound traffic, integrating your app with a secure hub-and-spoke model to communicate with on-premises resources etc.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  User Authentication
&lt;/h2&gt;

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

&lt;p&gt;In this section we will enable user authentication using Microsoft AD Identity provider. Navigate to your App Service resource inside azure portal. Then click on authentication and "Add Identity Provider":&lt;/p&gt;

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

&lt;p&gt;Select "Microsoft" as identity provider:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftrzko31e8i1mfnhjw1sx.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftrzko31e8i1mfnhjw1sx.png" alt="choose-microsoft-identity-provider" width="759" height="782"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Your authenticator will require an app registration or service principal name (SPN) to communicate with the Identity provider. You have the preferred options of creating a new app registration from the same page or use an existing app registration followed by &lt;a href="https://learn.microsoft.com/en-us/azure/app-service/configure-authentication-provider-aad#-create-an-app-registration-in-azure-ad-for-your-app-service-app" rel="noopener noreferrer"&gt;this link&lt;/a&gt;. In this example we:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;allow application access to same tenant users only.&lt;/li&gt;
&lt;li&gt;restrict app access to authenticated requests.&lt;/li&gt;
&lt;li&gt;return 302 Error code on unauthenticated requests.&lt;/li&gt;
&lt;li&gt;enable token storage.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Then press "add" which brings the following result:&lt;/p&gt;

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

&lt;p&gt;To try this feature, attempt to access the URL again. This will require a Microsoft account login and the following pop up would show up:&lt;/p&gt;

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

&lt;h2&gt;
  
  
  Basic Scaling
&lt;/h2&gt;

&lt;p&gt;there are two means of scaling your application to support higher number of requests:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Scaling-up&lt;/strong&gt;: Means adding more resources like CPU, memory, and disk space to your existing app. You can achieve this by altering the App service Plan tier which your App Service is using.&lt;/p&gt;

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

&lt;p&gt;&lt;strong&gt;Scaling-out&lt;/strong&gt;: Create more instances of the VMs that run your application. You can scale out to as many as 30 instances, depending on your pricing tier. There are also autoscaling options to scale up and down your instances based on rules and schedules.&lt;/p&gt;

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

&lt;p&gt;Thank you for following this blog to the end. In the next blog we will look into other aspects of this solution such as:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Secret management &lt;/li&gt;
&lt;li&gt;Deployment options&lt;/li&gt;
&lt;li&gt;Monitoring&lt;/li&gt;
&lt;li&gt;Disaster Recovery&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Resources:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://azure.microsoft.com/en-us/products/app-service/" rel="noopener noreferrer"&gt;https://azure.microsoft.com/en-us/products/app-service/&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://learn.microsoft.com/en-us/azure/app-service/networking-features" rel="noopener noreferrer"&gt;https://learn.microsoft.com/en-us/azure/app-service/networking-features&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://learn.microsoft.com/en-us/azure/app-service/manage-scale-up" rel="noopener noreferrer"&gt;https://learn.microsoft.com/en-us/azure/app-service/manage-scale-up&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://learn.microsoft.com/en-us/azure/architecture/reference-architectures/app-service-web-app/basic-web-app?tabs=cli" rel="noopener noreferrer"&gt;https://learn.microsoft.com/en-us/azure/architecture/reference-architectures/app-service-web-app/basic-web-app?tabs=cli&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>programming</category>
      <category>javascript</category>
      <category>tooling</category>
    </item>
    <item>
      <title>Awesome diagrams using Mermaid.js</title>
      <dc:creator>erfankashani</dc:creator>
      <pubDate>Thu, 14 Apr 2022 13:02:01 +0000</pubDate>
      <link>https://dev.to/erfankashani/awesome-diagrams-using-mermaidjs-3am0</link>
      <guid>https://dev.to/erfankashani/awesome-diagrams-using-mermaidjs-3am0</guid>
      <description>&lt;p&gt;Today I want to share an awesome library which I discovered recently. Creating diagrams for complicated software can be a time consuming and tricky if you are not using the right tool. Maintaining the diagram to show the most recent structure can be struggle. One of the most common go-to is &lt;a href="https://app.diagrams.net/" rel="noopener noreferrer"&gt;diagram.net&lt;/a&gt;:&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fconocimientolibre.mx%2Fwp-content%2Fuploads%2F2020%2F05%2Fdiagrams-660x330.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fconocimientolibre.mx%2Fwp-content%2Fuploads%2F2020%2F05%2Fdiagrams-660x330.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This web application allow users to drag and drop elements on a page and rename them to create variety of graphs. In my experience, this application can create really beautiful graphs which take a long Time to create. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.diagrams.net%2Fassets%2Fsvg%2Fhome-dia2.svg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.diagrams.net%2Fassets%2Fsvg%2Fhome-dia2.svg"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;My search was not done there. I aim to introduce speed in the diagram creations, version control, and easier interface than finding elements, resizing, and renaming them plenty of times. This is where I found &lt;a href="https://mermaid-js.github.io/mermaid/#/" rel="noopener noreferrer"&gt;Mermaid&lt;/a&gt;  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmermaid-js.github.io%2Fmermaid%2Fimg%2Fheader.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmermaid-js.github.io%2Fmermaid%2Fimg%2Fheader.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This library is written in Javascript and allows diagram creation using a markdown like syntax. Mermaid can create the following diagrams:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Flowchart&lt;/li&gt;
&lt;li&gt;Sequence diagram &lt;/li&gt;
&lt;li&gt;Class diagram&lt;/li&gt;
&lt;li&gt;State Diagram&lt;/li&gt;
&lt;li&gt;Entity Relationship diagram&lt;/li&gt;
&lt;li&gt;User journey&lt;/li&gt;
&lt;li&gt;Gantt&lt;/li&gt;
&lt;li&gt;Pie Chart&lt;/li&gt;
&lt;li&gt;Requirement diagram&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Some of the benefits of using Mermaid.js:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;creating graphs as code&lt;/li&gt;
&lt;li&gt;saving time on styling the graphs&lt;/li&gt;
&lt;li&gt;version controlling your graphs&lt;/li&gt;
&lt;li&gt;easy integration with other libraries like diagram.net&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;To start we can install the “Markdown Preview Mermaid Support” extension on VSCode:&lt;/p&gt;

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

&lt;p&gt;Then create a diagram directory in your desired codebase (optional). Finally create a markdown file like “app_diagram.md”. Choose the small (open preview to the side) icon on too right corner of your editor or ( shift + command + v for mac). Now you are ready to edit the file. Lets start with some easy examples:&lt;/p&gt;

&lt;p&gt;The following showcases a Flowchart using mermaid:&lt;/p&gt;

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

    graph TD;
            A--&amp;gt;B;
            A--&amp;gt;C;
            B--&amp;gt;D;
            C--&amp;gt;D;


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

&lt;/div&gt;

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

&lt;p&gt;Any mermaid code should be entered as a code snippet with “mermaid” tag. Each letter represents a &lt;strong&gt;node&lt;/strong&gt; which are connected via &lt;strong&gt;edges&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;There are many samples of diagram creation on &lt;a href="https://mermaid-js.github.io/mermaid/#/" rel="noopener noreferrer"&gt;the mermaid website&lt;/a&gt;. I am going to demonstrate a settup that worked for me while creating flowcharts:&lt;/p&gt;

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


&amp;lt;!-- ```mermaid
flowchart Guide
    direction TB
    f[flow]
    s[[Step]]
    i([input])
    d[(Database)]
    Parameters&amp;gt;Parameters]
``` --&amp;gt;
&amp;lt;!-- Resource: https://mermaid-js.github.io/mermaid/#/ --&amp;gt;
&amp;lt;!-- Look at the graph here: https://mermaid.live --&amp;gt;
&amp;lt;!-- Connect to diagrams.net: https://www.diagrams.net/blog/mermaid-diagrams --&amp;gt;

```mermaid
flowchart LR
    subgraph Guide
        direction TB

        f[flow]
        s[[Step]]
        d[(Database)]
        Parameters&amp;gt;Parameters]
    end

    %% add in-line style
    Guide:::someclass
    classDef someclass fill:#f96;


    %%list of parameters
    p1&amp;gt;bank_name]
    p2&amp;gt;seller_info]


    %%list of steps
    s1[[1-withdraw_money]]
    s2[[2-purchase_bike]]


    %%list of flows
    f1[go_to_bank]
    f2[withdraw_from_atm]
    f3[contact_seller]
    f4[trade_bike]


    %%list of databases
    d1[(reads: customer_identification)]
    d2[(reads/writes: customer_balance)]
    d3[(writes: e_document_sign)]


    %% Create the step flows
    s1-.-&amp;gt;s2;


    %% s1 flow
    p1--&amp;gt;|inputs|s1
    s1--&amp;gt;|calls|f1
    f1--&amp;gt;|calls|f2
    f2--&amp;gt;d1
    f2--&amp;gt;d2


    %% s2 flow
    p2--&amp;gt;|inputs|s2
    s2--&amp;gt;f3
    f3--&amp;gt;f4
    f4--&amp;gt;d3
\```



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

&lt;/div&gt;

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

&lt;p&gt;There are also other resources where you can export your graphs as PNG or SVG like &lt;a href="https://mermaid.live" rel="noopener noreferrer"&gt;mermaid.live&lt;/a&gt;. Moreover, you can checkout &lt;a href="https://www.diagrams.net/blog/mermaid-diagrams" rel="noopener noreferrer"&gt;this blog&lt;/a&gt; regarding how to transfer your graphs from mermaid to diagram.net (FYI, digram.net does not support all mermaid functionalities) &lt;/p&gt;

&lt;p&gt;I hope you have enjoyed this tutorial. Feel free to express your comments.&lt;/p&gt;

&lt;p&gt;Regards,&lt;/p&gt;

&lt;p&gt;Erfan&lt;/p&gt;

</description>
      <category>graph</category>
      <category>diagram</category>
      <category>libraries</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Nail the Fundamentals : Git_Good (Git flow best practices)</title>
      <dc:creator>erfankashani</dc:creator>
      <pubDate>Sat, 28 Mar 2020 19:06:46 +0000</pubDate>
      <link>https://dev.to/erfankashani/nail-the-fundamentals-gitgucci-team-git-pipeline-3p6p</link>
      <guid>https://dev.to/erfankashani/nail-the-fundamentals-gitgucci-team-git-pipeline-3p6p</guid>
      <description>&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--iDdK11d9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://thenypost.files.wordpress.com/2020/01/time-machine-inventor-01.jpg%3Fquality%3D80%26strip%3Dall" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--iDdK11d9--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://thenypost.files.wordpress.com/2020/01/time-machine-inventor-01.jpg%3Fquality%3D80%26strip%3Dall" width="800" height="533"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Have you ever you wished you had a time machine to go back in time and fix that awkward thing you said to someone? or you wanted to choose a different path of decisions for your life? ... as much as I want to write a tutorial on time machines, This blog is about a valuable tool similar to a time machine for developers ...  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--jNnDOMGx--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://cdn.vox-cdn.com/thumbor/ZlgJZZHewoP4X9oOp9v9WiWi7yc%3D/1400x1050/filters:format%28jpeg%29/cdn.vox-cdn.com/uploads/chorus_asset/file/16213725/git.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--jNnDOMGx--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://cdn.vox-cdn.com/thumbor/ZlgJZZHewoP4X9oOp9v9WiWi7yc%3D/1400x1050/filters:format%28jpeg%29/cdn.vox-cdn.com/uploads/chorus_asset/file/16213725/git.jpg" alt="git" width="800" height="600"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Git is your best friend when it comes to coding and I regret not using it enough during my undergraduate education. Today I want to discuss the git flow I use day to day in my workplace and hope it brings value to your development journey.  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6752kbudqalskkmp6sk0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6752kbudqalskkmp6sk0.png" width="800" height="451"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Any repository has two main branches: &lt;strong&gt;Master&lt;/strong&gt; and &lt;strong&gt;Development&lt;/strong&gt;. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Master (Production):&lt;/strong&gt; is the production code which is being used by the customers. This branch should be ideally bug free. This is not a playground to test new lines of code. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Development (Staging):&lt;/strong&gt; is the next version of Staging (Master) environment. This means this branch is still close to the master but has one or more new features  which are being tested.&lt;/p&gt;




&lt;p&gt;To start a new feature in the code base we should:&lt;/p&gt;

&lt;p&gt;1) &lt;strong&gt;Start with the latest version of the development branch&lt;/strong&gt; : This is important to always keep your development branch up to date. In big teams you can usually followup with the newest merge requests via the slack or email. This indicates that someone will be altering the current state of development soon and you should pull the latest version of the code: (this avoids future merge conflicts).&lt;/p&gt;

&lt;p&gt;to perform this task you can:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git checkout development
git pull
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;2) &lt;strong&gt;Create your new branch:&lt;/strong&gt; You should create a new branch to work on your new feature and avoid working on development branch. There is usually a convention for naming your branches among your team. My teams's convention is as such: &lt;code&gt;&amp;lt;initials&amp;gt;-&amp;lt;ticket-number&amp;gt;-&amp;lt;featurename&amp;gt;&lt;/code&gt; for example I would make my branch using following command:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git checkout &lt;span class="nt"&gt;-b&lt;/span&gt; ek-132-slackbotapirouting
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;3) &lt;strong&gt;Work on your branch:&lt;/strong&gt; You can make any changes you like to this branch and make sure you commit your changes often as you can revert to older version of code when needed. The commit messages should be a one liner description of what has changes in that commit. This will help you later if you wish to change or &lt;code&gt;squash&lt;/code&gt; your commits. Couple of useful git commands when adding and committing code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git diff                                &lt;span class="c"&gt;# will show you all the changes you made. Here if you think you don’t want to add a file just add it to the .gitignore file&lt;/span&gt;
git add &lt;span class="nb"&gt;.&lt;/span&gt;                               &lt;span class="c"&gt;# will add all the changes &lt;/span&gt;
git add &lt;span class="nt"&gt;-p&lt;/span&gt;                              &lt;span class="c"&gt;# here you can see the changes one by one and write (y/n) to add or not add a change &lt;/span&gt;
git commit &lt;span class="nt"&gt;-m&lt;/span&gt; “what this change does”   &lt;span class="c"&gt;# to commit the added changes &lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;






&lt;p&gt;4) &lt;strong&gt;Time to push the code up:&lt;/strong&gt; When you have the final version of your code, documented, tested, and refactored, it is the time to add this feature or the development branch. &lt;/p&gt;

&lt;p&gt;First we will rebase with the development branch to compare the latest changes on development with our branch and deal with any possible merge conflicts:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git checkout development
git pull
git checkout ek-132-slackbotapirouting
git rebase &lt;span class="nt"&gt;-i&lt;/span&gt; development.                   
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You triggered the interactive rebasing. Here you can “reword” or “fixup” commits (basically squashing the commits ) and deal with code-conflict. After rebasing is done, it is time for pushing the code up to the development.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git push &lt;span class="nt"&gt;-f&lt;/span&gt;                       &lt;span class="c"&gt;#Force pushing to the ek-132-slackbotapirouting branch&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Currently you have your latest changes pushed to the remote branch and rebased with the current state of development branch. This means you will not face a merge conflict when you submit a merge request.&lt;/p&gt;




&lt;p&gt;5) &lt;strong&gt;Create the Merge request:&lt;/strong&gt; Now you can create a merge request by going on the web version of your remote repository (ex. &lt;a href="https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/about-pull-requests" rel="noopener noreferrer"&gt;Github&lt;/a&gt; or Gitlab). Assign the merge request to your software lead for review and copy the request link into the developer's chat for extra code-review. Enable the checkmark for deleting the branch after merging so your repository stays clean.&lt;/p&gt;




&lt;p&gt;6) &lt;strong&gt;Delete the feature branch:&lt;/strong&gt; It is always recommended to keep the repository clean.&lt;/p&gt;

&lt;p&gt;Deleting the feature branch locally by:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git branch &lt;span class="nt"&gt;--delete&lt;/span&gt; ek-132-slackbotapirouting
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;&lt;br&gt;
 &lt;br&gt;
Deleting the branch remotely by:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;git push origin &lt;span class="nt"&gt;--delete&lt;/span&gt; ek-132-slackbotapirouting
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fyr2ccmc12ouj34krsvm8.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fyr2ccmc12ouj34krsvm8.png" width="624" height="329"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;p&gt;Good Practices:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Delete your local and remote branch after merging to keep the repository clean&lt;/li&gt;
&lt;li&gt;If you have commits like "fixed a bug" or "fixed white space" make sure to squash them before making merge request&lt;/li&gt;
&lt;li&gt;Always rebase before submitting merge request to avoid merge-conflicts&lt;/li&gt;
&lt;li&gt;Avoid committing specific files to your development machine or process(ex. Gemfile.lock, .env).&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>github</category>
      <category>git</category>
      <category>gitflow</category>
      <category>gitlab</category>
    </item>
    <item>
      <title>Nail the Fundamentals : Documenting Using Yardoc (YARD)</title>
      <dc:creator>erfankashani</dc:creator>
      <pubDate>Fri, 11 Oct 2019 23:09:18 +0000</pubDate>
      <link>https://dev.to/erfankashani/nail-the-fundamentals-documenting-using-yardoc-yard-51d5</link>
      <guid>https://dev.to/erfankashani/nail-the-fundamentals-documenting-using-yardoc-yard-51d5</guid>
      <description>&lt;p&gt;&lt;strong&gt;Disclaimer:&lt;/strong&gt; Nail the Fundamental series attempt to discuss good coding practices. Theses are personal industry lessons, taught by senior developers and software architects to enhance my skills. Most of the topics are general coding principles while some of them focus on specific coding language. &lt;/p&gt;

&lt;p&gt;If you are a junior developer, this is the right place for you as I aim to fill the gap between coding lessons taught in the academia and what happens in the the industry. If you are a senior developer, you can compare your methods with the ones practiced by different organizations in &lt;em&gt;the comments&lt;/em&gt;.  &lt;/p&gt;




&lt;p&gt;Without further ado, In this tutorial we will look into YARD! &lt;/p&gt;

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

&lt;p&gt;Not that yard ... but YARD as in (Yay, A Ruby Documentation Tool). &lt;em&gt;YARD&lt;/em&gt; or &lt;em&gt;Yardoc&lt;/em&gt; is a documentation generating gem for the Ruby programming language. &lt;/p&gt;

&lt;p&gt;Before we jump into it, there is an important question to answer!&lt;/p&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;Why should I document?&lt;/em&gt;
&lt;/h4&gt;

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

&lt;p&gt;That is a fair question and I carried it when I started working in a development team. Some of the most important reasons to document your codes are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;You will be using them in 6 months:&lt;/strong&gt; Code that you wrote 6 months ago is often indistinguishable from code that someone else has written. Documentation is the key to understand the code's syntax and implementation. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Increasing usability of the code:&lt;/strong&gt; If you writing a feature, the code most likely will be integrated into a bigger project. Therefore, you should document it to be easily understood and interpreted by other developers. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Enhancing the On-boarding process:&lt;/strong&gt; In case of adding a new developer to your team or on-boarding a new department to use your internal tool, documentation reduces the time and effort for them to adapt the codebase.  &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Simplifying the debugging:&lt;/strong&gt; Software logs help to indicate where to look for a bug and documentations allow pinpointing the issue in low-level.  &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Assisting with test-cases:&lt;/strong&gt; Black-box testing which analyzes functionality of the software relies solely on the requirement specifications document of your code.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I hope by now you have enough reasons to start documenting your code. That definitely makes your code look more professional. so please ...&lt;/p&gt;

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




&lt;h2&gt;
  
  
  Why Yardoc?
&lt;/h2&gt;

&lt;p&gt;&lt;em&gt;Yardoc&lt;/em&gt; is one of the well known ruby documentation tools and its benefits can be summarized as:  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Can be hosted on personal DSL and private servers.&lt;/li&gt;
&lt;li&gt;Generates consistant documentation.&lt;/li&gt;
&lt;li&gt;Customizable documentation template (using markup language).&lt;/li&gt;
&lt;li&gt;Accepts metadata such as &lt;em&gt;tags&lt;/em&gt; along with the documentation (similar to Python, Java, and Objective-C).&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Installation
&lt;/h2&gt;

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

&lt;span class="c"&gt;# First make sure Rdoc is installed (dependancy on Ubuntu)&lt;/span&gt;
&lt;span class="nb"&gt;sudo &lt;/span&gt;apt-get &lt;span class="nb"&gt;install &lt;/span&gt;rdoc

&lt;span class="c"&gt;# Mac users don't need to install rdoc since it is installed with&lt;/span&gt;
&lt;span class="c"&gt;# the newest ruby installation.&lt;/span&gt;

&lt;span class="c"&gt;# Next, install YARD using gem:&lt;/span&gt;
gem &lt;span class="nb"&gt;install &lt;/span&gt;yard

&lt;span class="c"&gt;# Finally, to ensure YARD is installed&lt;/span&gt;
yard &lt;span class="nb"&gt;help&lt;/span&gt;


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

&lt;/div&gt;
&lt;h2&gt;
  
  
  Documentation Styles
&lt;/h2&gt;
&lt;h3&gt;
  
  
  Most common tags:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="mentioned-user" href="https://dev.to/param"&gt;@param&lt;/a&gt;&lt;/strong&gt; = Describes the &lt;em&gt;input parameters&lt;/em&gt; and their types (variable name can place before or after the type).&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @param [String] name Inputs the name of the user&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;Example: &lt;code&gt;# @param [Numeric] age Inputs the age of the user&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;Example: &lt;code&gt;# @param list [Array&amp;lt;String, Symbol&amp;gt;] the list of strings and symbols.&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;@option&lt;/strong&gt; = In case you dealing with different &lt;em&gt;options&lt;/em&gt; for the same input (use this for hash or array-list).&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @param [Hash] area_parameter numeric Inputs&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;Example: &lt;code&gt;# @option area_parameter [Integer] :length&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;Example: &lt;code&gt;# @option area_parameter [Integer] :width&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;@return&lt;/strong&gt; = Documents the &lt;em&gt;return-parameter&lt;/em&gt; from a method.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @return [String] greeting message for the user.&lt;/code&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="mentioned-user" href="https://dev.to/since"&gt;@since&lt;/a&gt;&lt;/strong&gt; = Usually, &lt;code&gt;since&lt;/code&gt; is used to show &lt;em&gt;app versions&lt;/em&gt;.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @since v2.0.0&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;@raise&lt;/strong&gt; = Use it only if method raises any &lt;em&gt;exceptions&lt;/em&gt;.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @raise [ZeroDivisionError] expectation if dividing by zero&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="mentioned-user" href="https://dev.to/see"&gt;@see&lt;/a&gt;&lt;/strong&gt; = Refer user to a &lt;em&gt;URL&lt;/em&gt; or &lt;em&gt;other class&lt;/em&gt; within the documentation for further explanation.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;code&gt;# @see www.yardoc.com&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;&lt;a class="mentioned-user" href="https://dev.to/note"&gt;@note&lt;/a&gt;&lt;/strong&gt; = Miscellaneous messages that are &lt;em&gt;low priority&lt;/em&gt;.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;&lt;a class="mentioned-user" href="https://dev.to/todo"&gt;@todo&lt;/a&gt;&lt;/strong&gt; = Miscellaneous messages that are &lt;em&gt;high priority&lt;/em&gt;.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;@example&lt;/strong&gt; = Demonstrates an &lt;em&gt;example&lt;/em&gt; of how to call the method.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Example: &lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;

&lt;span class="c1"&gt;# @example Raise an exception using a message from +debug_message+&lt;/span&gt;
&lt;span class="c1"&gt;#   raise AppDebug.fetch('job_number', app_name: 'ExampleApp')&lt;/span&gt;


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

&lt;/div&gt;
&lt;h3&gt;
  
  
  Common practice
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;add the file &lt;code&gt;.yardoc&lt;/code&gt; and &lt;code&gt;/doc&lt;/code&gt; to your &lt;code&gt;.gitignore&lt;/code&gt; sine they can be generated easily when needed.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Document your private and protected methods. They will not be seen or used by the users but it helps other developers working on the same codebase. It is important to assure the private methods are not visible if you plan to publish the documentations. You can hide them in generating phase by:&lt;br&gt;
&lt;code&gt;yardoc --no-private --protected&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;When documenting a method, first line holds the &lt;em&gt;Description&lt;/em&gt;. Leave a blank &lt;code&gt;#&lt;/code&gt; between the &lt;em&gt;description&lt;/em&gt; and &lt;em&gt;tags&lt;/em&gt;. For Example:&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;

&lt;span class="c1"&gt;# this is the method's description. &lt;/span&gt;
&lt;span class="c1"&gt;#&lt;/span&gt;
&lt;span class="c1"&gt;# @param [String] text_input input parameter&lt;/span&gt;
&lt;span class="c1"&gt;# @return [String] returns the printed text&lt;/span&gt;
&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;print_text&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;text_input&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="c1"&gt;#some code ...&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;


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

&lt;/div&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Keep the order of &lt;em&gt;input parameters&lt;/em&gt; consistent with the &lt;em&gt;param&lt;/em&gt; orders. This results in easier flow for the reader. &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Wrap the text with &lt;code&gt;+&lt;/code&gt; to highlight&lt;br&gt;
&lt;code&gt;+highlighted_text+&lt;/code&gt;&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Hands-on Demonstration
&lt;/h2&gt;

&lt;p&gt;The code is available on &lt;a href="https://github.com/erfankashani/Yardoc_Practice.git" rel="noopener noreferrer"&gt;GitHub&lt;/a&gt;. clone the repository using:  &lt;/p&gt;

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

git clone https://github.com/erfankashani/Yardoc_Practice.git


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

&lt;/div&gt;

&lt;p&gt;Lets look into the files inside:&lt;/p&gt;

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

&lt;span class="nb"&gt;cd &lt;/span&gt;Yardoc_Practice
nano practise.rb


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

&lt;/div&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffb18x85jpdabbi4bc70d.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ffb18x85jpdabbi4bc70d.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Most of the &lt;em&gt;tags&lt;/em&gt; and the best practices are demonstrated in the code. Feel free to use this file as a reference for &lt;code&gt;yardoc&lt;/code&gt;. Next step is to generate the documentation and spin-up the server.&lt;/p&gt;

&lt;h3&gt;
  
  
  Generate Yardoc
&lt;/h3&gt;

&lt;p&gt;1- Go inside of the repository which you are using&lt;br&gt;
2- Create the documentation by: &lt;code&gt;yardoc &amp;lt;name_of_the_file&amp;gt;&lt;/code&gt;, in our case:&lt;/p&gt;

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

&lt;span class="n"&gt;yardoc&lt;/span&gt; &lt;span class="n"&gt;practise&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;rb&lt;/span&gt;          


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

&lt;/div&gt;

&lt;p&gt;3- Run the web page on your local network (&lt;code&gt;Port:8808&lt;/code&gt;):&lt;/p&gt;

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

&lt;span class="n"&gt;yard&lt;/span&gt; &lt;span class="n"&gt;server&lt;/span&gt;         


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

&lt;/div&gt;

&lt;p&gt;After this step, you will notice a new directory called 'doc'. This is where all the &lt;code&gt;HTML&lt;/code&gt; and &lt;code&gt;css&lt;/code&gt; files are kept to create the documentation webpage. Observe the documentations by typing &lt;code&gt;localhost:8808&lt;/code&gt; in your address-bar of a browser. Take a look at the available methods by choosing &lt;code&gt;methods&lt;/code&gt; option from the top left menu. You should see something like this:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgsafe.org%2F5f%2F5feafca273.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgsafe.org%2F5f%2F5feafca273.jpeg"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;By now, I hope you have a good understanding of why we document and how we do it using 'yardoc'. As you follow these simple but effective practices mentioned in the series, you will notice your code quality's improvement. Take the first step by start documenting all your ruby codebases. Let's get ittt...&lt;/p&gt;

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

&lt;h2&gt;
  
  
  Resources
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/lsegal/yard" rel="noopener noreferrer"&gt;https://github.com/lsegal/yard&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://gist.github.com/chetan/1827484" rel="noopener noreferrer"&gt;https://gist.github.com/chetan/1827484&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.geeksforgeeks.org/differences-between-black-box-testing-vs-white-box-testing/" rel="noopener noreferrer"&gt;https://www.geeksforgeeks.org/differences-between-black-box-testing-vs-white-box-testing/&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>ruby</category>
      <category>rails</category>
      <category>documentation</category>
      <category>doc</category>
    </item>
    <item>
      <title>Long Story Short: Kubernetes</title>
      <dc:creator>erfankashani</dc:creator>
      <pubDate>Mon, 30 Sep 2019 00:05:40 +0000</pubDate>
      <link>https://dev.to/erfankashani/long-story-short-kubernetes-365</link>
      <guid>https://dev.to/erfankashani/long-story-short-kubernetes-365</guid>
      <description>&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi2.wp.com%2Fwww.integrationqa.com%2Fwp-content%2Fuploads%2F2019%2F02%2Fgitlab_gke_banner.png%3Fresize%3D646%252C366%26ssl%3D1" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi2.wp.com%2Fwww.integrationqa.com%2Fwp-content%2Fuploads%2F2019%2F02%2Fgitlab_gke_banner.png%3Fresize%3D646%252C366%26ssl%3D1"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Disclaimer&lt;/strong&gt;: Long Story Short series are personal learning experiences  as I encounter different development journeys. The aim of these series are to summarize and simplify difficult development concepts and teach them in different levels of proficiency.&lt;/p&gt;

&lt;h4&gt;
  
  
  The most important lesson I want you to take from this blog is to understand what kubernetes is? and why we use it?
&lt;/h4&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fickosovo.com%2Fimages%2Fuploads%2Fphotos%2Fmicroservices_architecture.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fickosovo.com%2Fimages%2Fuploads%2Fphotos%2Fmicroservices_architecture.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In the era of &lt;strong&gt;micro-service architecture&lt;/strong&gt;, applications are structured as a collection of services which are &lt;strong&gt;loosely coupled&lt;/strong&gt;, &lt;strong&gt;easily maintained&lt;/strong&gt;, &lt;strong&gt;independently organized&lt;/strong&gt;, and owned by smaller teams. This is possible by &lt;strong&gt;containerizing&lt;/strong&gt; different services within an application and using API calls to communicate among them. &lt;/p&gt;

&lt;p&gt;This all sounds great until your organization thinks of &lt;strong&gt;scaling up&lt;/strong&gt; or achieving above 90% up-time for the application. Managing couple of containers is not an exhausting activity but when thinking of configuring, deploying, and maintaining 100s of containers simultaneously   our approach should be re-evaluated. This is where Kubernetes comes in the picture and automates the container management tasks.        &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.camptocamp.com%2Fwp-content%2Fuploads%2Fkubernetes_training-camptocamp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fwww.camptocamp.com%2Fwp-content%2Fuploads%2Fkubernetes_training-camptocamp.png"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Background Information:
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Kunernetes:&lt;/strong&gt; Is an open-source software which helps managing and orchestrating containers.  &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;It was first developed by google engineers and later donated to Cloud Native Computing Foundation (CNCF).&lt;/li&gt;
&lt;li&gt;It is an orchestration tool to deploy, scale up, and manage multiple containers together, therefore automating and enhancing the maintenance process of micro-services. Kubernetes main benefits are:

&lt;ul&gt;
&lt;li&gt;assist communicating among containers&lt;/li&gt;
&lt;li&gt;Deploy them properly &lt;/li&gt;
&lt;li&gt;Manage them carefully &lt;/li&gt;
&lt;li&gt;Auto scaling: Always making sure there is certain number of container's copies available. &lt;/li&gt;
&lt;li&gt;Load balancing: Distributing the traffic.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;Kubernetes cluster are usually made up of two main parts:

&lt;ul&gt;
&lt;li&gt;Master (schedules application services)&lt;/li&gt;
&lt;li&gt;Nodes (listens to the orders from the master)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/http%3A%2F%2Fblog.newrelic.com%2Fwp-content%2Fuploads%2Fkubernetes_architecture.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/http%3A%2F%2Fblog.newrelic.com%2Fwp-content%2Fuploads%2Fkubernetes_architecture.jpg"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now that we have a bigger picture of kubernetes and why we use it, let's dive inside of the cluster architecture and learn about the different components. &lt;/p&gt;

&lt;h2&gt;
  
  
  Components
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Master:&lt;/strong&gt; Is the control plane (main controller) of the cluster. Usually, users communicate with the master through &lt;strong&gt;dashboard graphical interface (GUI)&lt;/strong&gt; or the &lt;strong&gt;command line interface (CLI)&lt;/strong&gt; via YAML config files. Master's responsibility is to manage all the node events to keep the overall cluster configuration stable and healthy. The multiple components of master are as such:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Kube-APIserver:&lt;/strong&gt; The front-end of kubernetes which exposes API calls and deals with REST services so developers can communicate with the cluster.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;ETCD:&lt;/strong&gt; Manages state of the cluster. Try to look at it as the database of kubernetes. As a developer, you have to find a reliable method to backup these information in case of a master's crash. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Kube-Scheduler:&lt;/strong&gt; As the name suggests, it schedules the newly created pods into the nodes based on the given resource requirements.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;kube-controller-manager:&lt;/strong&gt; consists of multiple controllers which manages the cluster and nodes. For example:

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Replication Controller:&lt;/strong&gt; handles the replicas (series of identical pods) &lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;




&lt;p&gt;&lt;strong&gt;NODE:&lt;/strong&gt; Is a part of the kubernetes run-time environment and is hosted on a separate VM or physical machine than the master. Nodes have a series of pods inside of them which allow containers to run inside of them. Node responsibility is to monitor pods and report back to the master. Node's components consist of:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Pods:&lt;/strong&gt; A logical collection of containers (like &lt;em&gt;docker containers&lt;/em&gt;) which need to interact with each other for an application to work. Furthermore, Pods have series of &lt;code&gt;cgroup&lt;/code&gt;, &lt;code&gt;kernel space&lt;/code&gt;, &lt;code&gt;union file systems&lt;/code&gt; inside of them. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Kubelet:&lt;/strong&gt; Each node has a kubelet which makes sure required &lt;strong&gt;podSpects&lt;/strong&gt; are running healthy on the node. This agent can then report back to the master. their other tasks are to: 

&lt;ul&gt;
&lt;li&gt;Communicate With API server.&lt;/li&gt;
&lt;li&gt;Execute pods' containers via a container-engine. &lt;/li&gt;
&lt;li&gt;Mount and run pod-volumes and secrets. &lt;/li&gt;
&lt;li&gt;Execute health checks and report back to master.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;Podspec: Is a YAML file that describes what each pod should have.&lt;/p&gt;
&lt;/blockquote&gt;



&lt;blockquote&gt;
&lt;p&gt;Good to note that kubelets usually use an endpoint to communicate such as &lt;code&gt;tcp:10255&lt;/code&gt;. &lt;/p&gt;
&lt;/blockquote&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Kube-proxy:&lt;/strong&gt; Allows network traffic finds the right node and right pod inside (learn more about networking).&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;I hope by now you have a high level understanding of different kubernete's components and their role to enable orchestration.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Cool beans, but how do I control and use all of these?&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;As a devops specialist, you should be able to talk to this kubernetes beast by configuring certain &lt;strong&gt;controllers&lt;/strong&gt;. Therefore, you can spin up your cluster and run your containers reliably inside. &lt;/p&gt;

&lt;h2&gt;
  
  
  Controllers
&lt;/h2&gt;

&lt;p&gt;Controllers help with application reliability, scaling, and Load balancing. We need to understand different kinds of controllers within kubernetes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Replicates:&lt;/strong&gt; Ensures the certain number of pods are running at all times. We use replica-sets to scale up and scale down the pods.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Deployments:&lt;/strong&gt; Declare updates for pods and replicates. Basically, a deployment manages replicates and replicates manage pods. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;DaemonSets:&lt;/strong&gt; Ensures all nodes copy a specific pod. Monitoring the pods on the nodes to make sure there are all identical. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Jobs:&lt;/strong&gt; Usually a supervisor process. Jobs are individual processes that happen once or periodically such as database backup. &lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Services:&lt;/strong&gt; Allow communication between a set of deployment. Services can be: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Internal: IP only reachable within cluster. &lt;/li&gt;
&lt;li&gt;External: Endpoint available from node ip.&lt;/li&gt;
&lt;li&gt;Load balancer: Expose the application. &lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;&lt;p&gt;&lt;strong&gt;Labels:&lt;/strong&gt; As the name suggests, it helps us to label and organize components. you can search, delete, and run services based on their labels. We use &lt;em&gt;selectors&lt;/em&gt; to find labels. &lt;/p&gt;&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;&lt;strong&gt;Selectors:&lt;/strong&gt; You can use them in two different method: &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;equality-based selectors:  (==, !=)&lt;/li&gt;
&lt;li&gt;Set-based selectors: (IN , NOTIN, EXISTS)&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;&lt;p&gt;&lt;strong&gt;Namespaces:&lt;/strong&gt; Give authentication and authorization to different users. extremely useful for bigger teams.&lt;/p&gt;&lt;/li&gt;

&lt;/ul&gt;

&lt;h4&gt;
  
  
  Congratulations! now you know the basic knowledge needed to start getting your hands dirty with the code...
&lt;/h4&gt;

&lt;p&gt;Next step .... &lt;strong&gt;code&lt;/strong&gt; &lt;/p&gt;

&lt;h2&gt;
  
  
  resources
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://kubernetes.io/docs" rel="noopener noreferrer"&gt;https://kubernetes.io/docs&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.linkedin.com/learning/learning-kubernetes" rel="noopener noreferrer"&gt;https://www.linkedin.com/learning/learning-kubernetes&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>kubernetes</category>
      <category>devops</category>
      <category>architecture</category>
    </item>
  </channel>
</rss>
