<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[Shams Nahid's Blog]]></title><description><![CDATA[Gateway to waterfalls, mountains, and the exhilaration of running in captivating locales.]]></description><link>https://blog.shams-nahid.com</link><generator>RSS for Node</generator><lastBuildDate>Tue, 14 Apr 2026 12:29:33 GMT</lastBuildDate><atom:link href="https://blog.shams-nahid.com/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[The Comprehensive Guide to REST API Architecture and Conventions]]></title><description><![CDATA[Consider that we are interacting with multiple entities. We should build the API path as follows,
domain + /API + /Version + /Entity + /ID Parameter [Optional] + /SubEntity + /ID Parameter + ? + fromDate=01/02/2022 + & + endDate=02/02/2022
For instan...]]></description><link>https://blog.shams-nahid.com/the-comprehensive-guide-to-rest-api-architecture-and-conventions</link><guid isPermaLink="true">https://blog.shams-nahid.com/the-comprehensive-guide-to-rest-api-architecture-and-conventions</guid><category><![CDATA[REST API]]></category><category><![CDATA[API basics ]]></category><category><![CDATA[http requests]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 09 May 2025 22:45:52 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1746815802937/aaf599c0-197e-4081-81c3-9ad82480f586.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Consider that we are interacting with multiple entities. We should build the API path as follows,</p>
<p><code>domain + /API + /Version + /Entity + /ID Parameter [Optional] + /SubEntity + /ID Parameter + ? + fromDate=01/02/2022 + &amp; + endDate=02/02/2022</code></p>
<p>For instance, if we want to get all the items of an order, where the order ID is <code>17</code>, out <code>API</code> should look like this,</p>
<p><a target="_blank" href="https://shams-nahid.com/api/v1/order/17/items"><code>https://mydomain/api/v1/order/17/items</code></a></p>
<h2 id="heading-request">Request</h2>
<p>Let’s debug the previous URL step by step,</p>
<p>Few conventions,</p>
<ol>
<li><p>The <code>api</code> keyword should be somewhere as follows</p>
<ol>
<li><p><a target="_blank" href="http://api.mydomain.com"><code>api.mydomain.com</code></a> [Preferred]</p>
</li>
<li><p><a target="_blank" href="http://mydomainapi.com"><code>mydomainapi.com</code></a></p>
</li>
<li><p><a target="_blank" href="http://mydomain.com/api"><code>mydomain.com/api</code></a></p>
</li>
</ol>
</li>
<li><p>API should support versioning,</p>
<ol>
<li><p>Inside request header [Preferred]</p>
</li>
<li><p>Inside URL. In this case,</p>
<ol>
<li><p><code>Version</code> starts after the <code>api/</code></p>
</li>
<li><p><code>Version</code> should have a prefix <code>v</code></p>
</li>
<li><p><code>Version</code> number should be a natural number, like 1, 2, 3, etc. No decimal should be used</p>
</li>
</ol>
</li>
<li><p>Should not put versioning in the <code>query</code> parameters</p>
</li>
</ol>
</li>
<li><p>The entity should be one word as a name, but not a verb, since the HTTP method is taking care of that</p>
</li>
<li><p>ID Parameter: The ID parameter should come after the <code>entity</code></p>
</li>
<li><p>Subentity: The subentity should come after the entity</p>
</li>
<li><p>Query Parameters: Should come after <code>?</code> and concatenated by the <code>&amp;</code></p>
</li>
</ol>
<h3 id="heading-query-parameters-vs-id-parameters">Query Parameters vs ID Parameters</h3>
<ol>
<li><p>While nothing was found in query parameters, it’s fine. However, missing ID parameters should throw an error.</p>
</li>
<li><p>For an entity, there could be multiple query parameters. But there should be only one ID parameter for the entity.</p>
</li>
<li><p>To extend, query parameters may return one to multiple entities, but if the ID parameter finds nothing, it will throw an error.</p>
</li>
</ol>
<h2 id="heading-response-code">Response Code</h2>
<p>Five Groups</p>
<ul>
<li><p>1xx: Avoid this one, for informational purposes</p>
</li>
<li><p>2xx: Success</p>
</li>
<li><p>3xx: Avoid this one, Redirection in OS low-level</p>
</li>
<li><p>4xx: Client Error</p>
</li>
<li><p>5xx: Server Error</p>
</li>
</ul>
<h3 id="heading-2xx">2XX</h3>
<ul>
<li><p>200 - Ok: Default Status Code</p>
<ul>
<li><p>Get request, get data</p>
</li>
<li><p>Post request created data</p>
</li>
</ul>
</li>
<li><p>201 - Created: On Post request, entity created</p>
</li>
<li><p>202 - Accepted: Request accepted and under processing on the server</p>
</li>
<li><p>204 - No Content: Operation completed and no entity as response</p>
</li>
</ul>
<h3 id="heading-4xx">4XX</h3>
<ul>
<li><p>400 - Bad Request: Client sent a request with invalid parameters or JSON</p>
</li>
<li><p>401 - Unauthorized: Server does not recognize the client</p>
</li>
<li><p>403 - Forbidden: Server recognizes the client, but the client does not have enough permission to access the resource</p>
</li>
<li><p>404 - Page Not Found:</p>
<ul>
<li><p>The resource entity was not found.</p>
</li>
<li><p>Entity with the ID parameter not found</p>
</li>
<li><p>Not Applicable when query parameters are used</p>
</li>
</ul>
</li>
</ul>
<h3 id="heading-5xx">5XX</h3>
<ul>
<li>500 - Internal Server Error: Something is wrong with the server, and the client has nothing to do with it.</li>
</ul>
<h2 id="heading-jwt-in-rest-api">JWT in REST API</h2>
<p>JWT Token should be passed using <code>Authorization Header</code> with a prefix <code>bearer</code></p>
<h2 id="heading-performance">Performance</h2>
<p>To keep up the scalability and availability,</p>
<ol>
<li><p>Using an asynchronous mechanism for long-term operation</p>
</li>
<li><p>Using caching for near-frequently accessed data with expiration</p>
</li>
<li><p>Use a rate limit to reduce the maximum concurrent requests</p>
</li>
<li><p>Rate limit for a specific user</p>
</li>
</ol>
<h2 id="heading-metrics-to-monitor">Metrics to Monitor</h2>
<ol>
<li><p>Request/sec</p>
</li>
<li><p>Failure ratio</p>
</li>
<li><p>Latency between request and response</p>
</li>
<li><p>Memory, CPU Utilization</p>
</li>
<li><p>Users, sessions, geolocation distribution</p>
</li>
</ol>
<h2 id="heading-hateoas"><strong>HATEOAS</strong></h2>
<p>Stands for, Hypermedia as the Engine of Application State. The user should not have prior knowledge of resources. Other relevant resource links should be included in the response.</p>
<h2 id="heading-spider-web">Spider Web</h2>
<p>If the URL of one service is changed, all other services calling that service will go down. To resolve this, we can use <code>Yellow Page Directories</code>, where the service and mapping will be stored. Also, it is possible to use an <code>Gateway</code> as a middleman, it will handle the URL mapping of a specific service.</p>
]]></content:encoded></item><item><title><![CDATA[JavaScript Loading Strategies in Web Page: async and defer]]></title><description><![CDATA[<script> tags are used to download and execute JavaScript on a web page.
Consider these three operations on a web page:

HTML Parsing

JavaScript Download

JavaScript Execution


We can manipulate the sequence of these phases using the following attr...]]></description><link>https://blog.shams-nahid.com/javascript-loading-strategies-in-web-page-async-and-defer</link><guid isPermaLink="true">https://blog.shams-nahid.com/javascript-loading-strategies-in-web-page-async-and-defer</guid><category><![CDATA[js]]></category><category><![CDATA[browser]]></category><category><![CDATA[performance]]></category><category><![CDATA[optimization]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Sat, 26 Apr 2025 21:03:32 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1745701264877/681cffc0-b00f-41a8-9f43-c0f3db2696dc.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p><code>&lt;script&gt;</code> tags are used to download and execute JavaScript on a web page.</p>
<p>Consider these three operations on a web page:</p>
<ul>
<li><p><strong>HTML Parsing</strong></p>
</li>
<li><p><strong>JavaScript Download</strong></p>
</li>
<li><p><strong>JavaScript Execution</strong></p>
</li>
</ul>
<p>We can manipulate the sequence of these phases using the following attributes in the <code>&lt;script&gt;</code> tag:</p>
<ul>
<li><p><strong>async</strong> (<code>&lt;script async src=''&gt;&lt;/script&gt;</code>)</p>
</li>
<li><p><strong>defer</strong> (<code>&lt;script defer src=''&gt;&lt;/script&gt;</code>)</p>
</li>
</ul>
<h3 id="heading-default-behavior">Default Behavior:</h3>
<p>By default (<code>&lt;script src=''&gt;&lt;/script&gt;</code>), the script tag <strong>blocks HTML parsing</strong> until the JavaScript is downloaded and executed. This means that the browser will stop parsing the HTML, download the script, execute it, and then resume parsing the HTML.</p>
<h3 id="heading-async-and-defer-behavior"><code>async</code> and <code>defer</code> Behavior:</h3>
<p>Both <code>async</code> and <code>defer</code> <strong>do not block HTML parsing</strong> during the JavaScript download. The script download and HTML parsing happen simultaneously.</p>
<ul>
<li><p><code>defer</code> ensures that the JavaScript is executed <strong>after the HTML parsing is completed</strong>. This means that all deferred scripts are executed in the order they appear in the document, but only after the entire HTML has been parsed.</p>
</li>
<li><p><code>async</code> ensures that the JavaScript is executed <strong>as soon as it is downloaded</strong>, without waiting for the HTML parsing to complete. This can result in the script executing before, during, or after HTML parsing, potentially interrupting it.</p>
</li>
</ul>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1751094129362/bff004c2-856f-484c-bfa9-482cbe0da8b6.png" alt class="image--center mx-auto" /></p>
<p>Default: JS Download → Execute → HTML Parse</p>
<p>Defer: (HTML Parse + JS Download in Parallel) → JS Execute (after parsing)</p>
<p>Async: HTML Parse + (JS Download → JS Execute when ready, possibly mid-parse)</p>
<p>Use Case</p>
<ol>
<li><p>Use <code>async</code>, when a script has no dependency on others</p>
</li>
<li><p>Use <code>defer</code> when the script depends on other scripts</p>
</li>
</ol>
<p>References:</p>
<ol>
<li><p><a target="_blank" href="https://www.youtube.com/watch?v=BMuFBYw91UQ">Web dev simplified</a></p>
</li>
<li><p><a target="_blank" href="https://www.greatfrontend.com/questions/quiz/describe-the-difference-between-script-async-and-script-defer">Great Front End</a></p>
</li>
</ol>
]]></content:encoded></item><item><title><![CDATA[DOM Positioning]]></title><description><![CDATA[Overview
static: Default position. It does not allow setting properties like top, bottom, left, right, z-index
relative: Acts the same as static. but allows positioning it relatively by putting properties like top, bottom, left, right, z-index
absolu...]]></description><link>https://blog.shams-nahid.com/dom-positioning</link><guid isPermaLink="true">https://blog.shams-nahid.com/dom-positioning</guid><category><![CDATA[CSS]]></category><category><![CDATA[DOM]]></category><category><![CDATA[Frontend Development]]></category><category><![CDATA[Position Property in CSS]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 25 Apr 2025 14:39:11 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1745591845749/94d01071-4a37-4e61-aa7f-182ad4a01361.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h2 id="heading-overview">Overview</h2>
<p><code>static</code>: Default position. It does not allow setting properties like <code>top</code>, <code>bottom</code>, <code>left</code>, <code>right</code>, <code>z-index</code></p>
<p><code>relative</code>: Acts the same as <code>static</code>. but allows positioning it relatively by putting properties like <code>top</code>, <code>bottom</code>, <code>left</code>, <code>right</code>, <code>z-index</code></p>
<p><code>absolute</code>: Remove the DOM from the DOM tree and position it to the root element unless the parent has some position other than <code>static</code>. Ideal way to implemet is, make the current postion <code>absolute</code> and parent element position as <code>relative</code>.</p>
<p><code>fixed</code>: Move to the top, ignores all the parents, stays there even if it is scrolling</p>
<p><code>sticky</code>: With <code>sticky</code> position while the parent is relative, the DOM fixed it to the top while scrolling. It is a combination of <code>fixed</code> and <code>relative</code> position. To implement this, the current element should have <code>sticky</code> position and the parent should have <code>relative</code> position.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1745591439243/5f0936ae-cb22-4079-a2dd-9a868afda7e7.png" alt class="image--center mx-auto" /></p>
<h2 id="heading-static-vs-relative"><code>static</code> vs <code>relative</code></h2>
<p>Both align with regular DOM flow; however, unlike <code>static</code>, in <code>relative</code> We can set the <code>top</code>, <code>bottom</code>, <code>left</code>, <code>right</code> and <code>z-index</code>.</p>
<h2 id="heading-absolute-vs-fixed"><code>absolute</code> vs <code>fixed</code></h2>
<p>Both ignore the Dom and move to the very top. However, unlike <code>absolute</code>The fixed does not scroll.</p>
<h2 id="heading-combination-of-absolute-and-relative">Combination of <code>absolute</code> and <code>relative</code></h2>
<p><code>absolute</code> took the Dom to the very top, unlike there is a parent other than <code>static</code>, like <code>relative</code>.</p>
<h2 id="heading-absolute-vs-translate"><code>absolute</code> vs <code>translate</code></h2>
<p><code>absoulte</code> remove the dom and as a reference use the parent element (other than the <code>static</code>). However, translate also moves the element but uses itself as a reference. Since, <code>translate</code> does not invoke the browser to repaint the DOM, it is more efficient.</p>
<h2 id="heading-references">References</h2>
<ol>
<li><p><a target="_blank" href="https://www.freecodecamp.org/news/learn-the-basics-the-css-position-property">The CSS Position Property Explained with Examples (freecodecamp.org)</a></p>
</li>
<li><p><a target="_blank" href="https://www.youtube.com/watch?v=jx5jmI0UlXU">Learn CSS Position In 9 Minutes (web-dev simplified</a>)</p>
</li>
</ol>
]]></content:encoded></item><item><title><![CDATA[CSS Selector Specificity]]></title><description><![CDATA[Overview
When an element in the browser has a conflict of styles, the browser uses a set of rules to determine which style should be rendered. This set of rules is defined as CSS Selector Specificity.
For instance, for an element, if we have the foll...]]></description><link>https://blog.shams-nahid.com/css-selector-specificity</link><guid isPermaLink="true">https://blog.shams-nahid.com/css-selector-specificity</guid><category><![CDATA[CSS]]></category><category><![CDATA[browser]]></category><category><![CDATA[Frontend Development]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 25 Apr 2025 12:09:23 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1745582875123/3c53ce17-6917-4233-8256-7fe828be7b21.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h2 id="heading-overview">Overview</h2>
<p>When an element in the browser has a conflict of styles, the browser uses a set of rules to determine which style should be rendered. This set of rules is defined as <code>CSS Selector Specificity</code>.</p>
<p>For instance, for an element, if we have the following DOM and CSS classes,</p>
<pre><code class="lang-css"><span class="hljs-selector-class">.myClass</span> {
    <span class="hljs-attribute">color</span>: yellow;
}
</code></pre>
<pre><code class="lang-html"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"color: red;"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"myClass"</span>&gt;</span>My Text<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span>
</code></pre>
<p>In this case, the color will be <code>red</code>, since the inline style has higher weight.</p>
<h2 id="heading-calculation">Calculation</h2>
<p>The browser uses an array of four elements, where the previous index has higher priority. Consider these four elements a <code>a</code>, <code>b</code>, <code>c</code> and <code>d</code>.</p>
<p>[a, b, c, d]</p>
<p>A = Inline styles</p>
<p>B = Number of selector IDs</p>
<p>C = Classes, Pseudo Classes, and Attributes</p>
<p>D = Elements and Pseudo-Elements</p>
<p>We calculate <code>A</code>, <code>B</code>, <code>C</code>, <code>D</code> as follows,</p>
<pre><code class="lang-css"><span class="hljs-selector-tag">body</span><span class="hljs-selector-class">.home</span> <span class="hljs-selector-id">#sidebar</span> <span class="hljs-selector-class">.menu</span> <span class="hljs-selector-tag">li</span> <span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:hover</span> {
  <span class="hljs-attribute">color</span>: gold;
}
</code></pre>
<p>Let’s break it down:</p>
<pre><code class="lang-javascript">body → element → +<span class="hljs-number">1</span> to d
.home → <span class="hljs-class"><span class="hljs-keyword">class</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">c</span>
#<span class="hljs-title">sidebar</span> → <span class="hljs-title">ID</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">b</span>
.<span class="hljs-title">menu</span> → <span class="hljs-title">class</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">c</span>
<span class="hljs-title">li</span> → <span class="hljs-title">element</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">d</span>
<span class="hljs-title">a</span> → <span class="hljs-title">element</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">d</span>
:<span class="hljs-title">hover</span> → <span class="hljs-title">pseudo</span>-<span class="hljs-title">class</span> → +1 <span class="hljs-title">to</span> <span class="hljs-title">c</span></span>
</code></pre>
<p>Specificity: 0,1,3,3</p>
<h2 id="heading-rules-of-specificity">Rules of Specificity</h2>
<ul>
<li><p>Higher specificity wins.</p>
</li>
<li><p>If specificity is the same, the last declared rule in the CSS wins.</p>
</li>
<li><p>Inline styles have the highest specificity (except <code>!important</code>).</p>
</li>
<li><p><code>!important</code> can override normal specificity but should be used sparingly.</p>
</li>
</ul>
<h2 id="heading-best-practices">Best Practices</h2>
<ul>
<li><p>Write CSS with low specificity, so we can override it later</p>
</li>
<li><p>Avoid nested selectors and keep them shallow</p>
</li>
</ul>
]]></content:encoded></item><item><title><![CDATA[Understanding CSS Display Property]]></title><description><![CDATA[In CSS, display is one of the most used CSS properties. As a value of display property, most commons are none, block, inline, inline-block and flex. Additionally, in different cases, grid, table, table-row, table-cell and list-item are used.
Responsi...]]></description><link>https://blog.shams-nahid.com/understanding-the-common-display-property-values-in-css</link><guid isPermaLink="true">https://blog.shams-nahid.com/understanding-the-common-display-property-values-in-css</guid><category><![CDATA[CSS]]></category><category><![CDATA[display]]></category><category><![CDATA[styling]]></category><category><![CDATA[interview]]></category><category><![CDATA[interview questions]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 13 Sep 2024 12:20:43 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1750677294173/5ca319e8-047f-4ef5-aff5-4963a1f7a19c.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>In CSS, <code>display</code> is one of the most used CSS properties. As a value of <code>display</code> property, most commons are <code>none</code>, <code>block</code>, <code>inline</code>, <code>inline-block</code> and <code>flex</code>. Additionally, in different cases, <code>grid</code>, <code>table</code>, <code>table-row</code>, <code>table-cell</code> and <code>list-item</code> are used.</p>
<p>Responsibilities of these values are described below,</p>
<ul>
<li><p><strong>none</strong>: The current elements along with all its children will not be rendered in the browser</p>
</li>
<li><p><strong>block</strong>: Takes up the full width, forces a new line, and allows width/height to be set.</p>
</li>
<li><p><strong>inline</strong>: Takes up only as much width as needed, does not force a new line, and cannot have width/height set.</p>
</li>
<li><p><strong>inline-block</strong>: Combines the behavior of inline (doesn’t force a new line) and block (can have width/height set).</p>
</li>
<li><p><strong>flex</strong>: Use block-level flex container</p>
</li>
<li><p><strong>grid</strong>: Use block-level grid container</p>
</li>
<li><p><strong>table</strong>: Behaves like <code>&lt;table /&gt;</code> component</p>
</li>
<li><p><strong>table-row</strong>: Behaves like <code>&lt;tr /&gt;</code> component</p>
</li>
<li><p><strong>table-cell</strong>: Behaves like <code>&lt;tc /&gt;</code> component</p>
</li>
<li><p><strong>list-item</strong>: Behaves like <code>&lt;li /&gt;</code></p>
</li>
</ul>
<p>Regarding <code>flexbox</code> and <code>grid</code>,</p>
<blockquote>
<p>Use flexbox for one dimentional simple layout. However for multi-dimentional complex layout, where both row and column needs to be managed, use grid layout.</p>
</blockquote>
<p>Understanding the <code>display</code> property and its various values is essential for crafting effective and responsive layouts. While simpler layouts benefit from <code>inline</code>, <code>block</code>, or <code>flex</code>, more complex, multi-dimensional layouts are best handled with the <code>grid</code> property. Choose the appropriate <code>display</code> value based on the layout requirements to create efficient and maintainable web designs.</p>
]]></content:encoded></item><item><title><![CDATA[CSS Box Model]]></title><description><![CDATA[Overview
Box models are the core concept of CSS. We can define box models,

Rectangular Box

Generated for the elements

Reside in the document tree


Each of the CSS models has a content area along with the possible optional surroundings,

Padding

...]]></description><link>https://blog.shams-nahid.com/understanding-css-box-model</link><guid isPermaLink="true">https://blog.shams-nahid.com/understanding-css-box-model</guid><category><![CDATA[CSS]]></category><category><![CDATA[box-model]]></category><category><![CDATA[interview questions]]></category><category><![CDATA[styling]]></category><category><![CDATA[HTML]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 13 Sep 2024 08:46:33 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1745575228758/30875c30-5e01-491b-a14e-8a4b77d4ca65.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h3 id="heading-overview">Overview</h3>
<p>Box models are the core concept of CSS. We can define box models,</p>
<ul>
<li><p>Rectangular Box</p>
</li>
<li><p>Generated for the elements</p>
</li>
<li><p>Reside in the document tree</p>
</li>
</ul>
<p>Each of the CSS models has a content area along with the possible optional surroundings,</p>
<ul>
<li><p>Padding</p>
</li>
<li><p>Border</p>
</li>
<li><p>Margin</p>
</li>
</ul>
<blockquote>
<p>Now regarding margin, it is not included with the actual size of the box. Instead it grows outside the box. Only the padding and border are included with the box size</p>
</blockquote>
<h3 id="heading-rules">Rules</h3>
<p>The rules for the box-sizing,</p>
<ul>
<li><p>Box models are calculated by width, height, padding, and border</p>
</li>
<li><p>If no height is defined, it will take the height same as the content</p>
</li>
<li><p>If no width or max width is defined, it will take the width of the parent. A few exceptions are input, table, figure, span, etc.</p>
</li>
<li><p>The default value of the <code>box-sizing</code> is <code>content-box</code>. For the value <code>content-border</code>, the size of the box includes the padding and border.</p>
</li>
</ul>
<blockquote>
<p>Rules are not applicable for the float component.</p>
</blockquote>
<p>In conclusion, understanding the CSS box model is essential for precise layout control. By mastering properties like <code>box-sizing</code>, padding, border, and margin, you can effectively manage the size and spacing of elements on a webpage.</p>
]]></content:encoded></item><item><title><![CDATA[House Robber: From recursion to memoization and ultimately space-optimized solution]]></title><description><![CDATA[One of the most popular dynamic programming problems is the famous house robber. If we narrow down the category, it is the pick or not pick problem. Based on the basics of house robber problem, a few more problems are available are out there by addin...]]></description><link>https://blog.shams-nahid.com/house-robber-from-recursion-to-memoization-and-ultimately-space-optimized-solution</link><guid isPermaLink="true">https://blog.shams-nahid.com/house-robber-from-recursion-to-memoization-and-ultimately-space-optimized-solution</guid><category><![CDATA[Dynamic Programming]]></category><category><![CDATA[datastructure]]></category><category><![CDATA[algorithms]]></category><category><![CDATA[TypeScript]]></category><category><![CDATA[Programming Blogs]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 12 Sep 2024 13:54:52 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1726149183758/6b50304c-3da2-40d4-a005-bf8382d2ea6e.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>One of the most popular dynamic programming problems is the famous <code>house robber</code>. If we narrow down the category, it is the <code>pick</code> or <code>not pick</code> problem. Based on the basics of <code>house robber</code> problem, a few more problems are available are out there by adding more layers of complexity.</p>
<p>Today, we will get the most basic problem and solve it step by step. We will start by using the recursion and later on top of the recursion problem, we will use the tabulation of dynamic programming. Finally, we will optimize the space.</p>
<p>The house robber problem is explained, as follows,</p>
<p>There are a few houses in a row and as a robber, I can not rob adjacent houses. This implies, if I rob house 1, I can not rob house 2. After house 1, I have to choose house 3 or 4 or so on. However, If I do not rob house 1, then I may rob house 2.</p>
<p>With this in our mind, the simplest solution is, to write a recursion and try all the possibilities.</p>
<h3 id="heading-recursion">Recursion</h3>
<p>Recursion will be the brute force solution, where we will explore all the possibilities and figure out the maximum value. We can consider any of the sequences, from the first to the last index or vice-versa of the array. Here’s a solution, driving from the first to the last index.</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">rob</span>(<span class="hljs-params">nums: <span class="hljs-built_in">number</span>[]</span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> helper = <span class="hljs-function">(<span class="hljs-params">index</span>) =&gt;</span> {
        <span class="hljs-keyword">if</span> (index &gt;= nums.length) {
            <span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;
        }

        <span class="hljs-keyword">const</span> pick = nums[index] + helper(index + <span class="hljs-number">2</span>);
        <span class="hljs-keyword">const</span> notPick = helper(index + <span class="hljs-number">1</span>);

        <span class="hljs-keyword">return</span> <span class="hljs-built_in">Math</span>.max(pick, notPick);
    }

    <span class="hljs-keyword">return</span> helper(<span class="hljs-number">0</span>);
};
</code></pre>
<h3 id="heading-dp-memoization">DP Memoization</h3>
<p>Now, we can see the sub-problems, where, we may calculate the index multiple times using the function. Instead, to persist the already calculated value, we can consider an array <code>dp</code> of the array size.</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">rob</span>(<span class="hljs-params">nums: <span class="hljs-built_in">number</span>[]</span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> dp = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(nums.length).fill(<span class="hljs-number">-1</span>);
    <span class="hljs-keyword">const</span> helper = <span class="hljs-function">(<span class="hljs-params">index</span>) =&gt;</span> {
        <span class="hljs-keyword">if</span> (index &gt;= nums.length) {
            <span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;
        }

        <span class="hljs-keyword">if</span> (dp[index] !== <span class="hljs-number">-1</span>) {
            <span class="hljs-keyword">return</span> dp[index];
        }

        <span class="hljs-keyword">const</span> pick = nums[index] + helper(index + <span class="hljs-number">2</span>);
        <span class="hljs-keyword">const</span> notPick = helper(index + <span class="hljs-number">1</span>);

        dp[index] = <span class="hljs-built_in">Math</span>.max(pick, notPick);
        <span class="hljs-keyword">return</span> dp[index];
    }
    <span class="hljs-keyword">return</span> helper(<span class="hljs-number">0</span>);
};
</code></pre>
<p>Now, if we already calculated the value, we skip the further calculation and get the calculated from the array.</p>
<p>We can calculate the the value from last to the first index as well as follows,</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">rob</span>(<span class="hljs-params">nums: <span class="hljs-built_in">number</span>[]</span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> dp = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(nums.length).fill(<span class="hljs-number">-1</span>);
    <span class="hljs-keyword">const</span> helper = <span class="hljs-function">(<span class="hljs-params">index</span>) =&gt;</span> {
        <span class="hljs-keyword">if</span> (index === <span class="hljs-number">0</span>) {
            <span class="hljs-keyword">return</span> nums[index];
        }

        <span class="hljs-keyword">if</span> (index &lt; <span class="hljs-number">0</span>) {
            <span class="hljs-keyword">return</span> <span class="hljs-number">0</span>;
        }

        <span class="hljs-keyword">if</span> (dp[index] !== <span class="hljs-number">-1</span>) {
            <span class="hljs-keyword">return</span> dp[index];
        } 

        <span class="hljs-keyword">const</span> pick = nums[index] + helper(index - <span class="hljs-number">2</span>);
        <span class="hljs-keyword">const</span> notPick = helper(index - <span class="hljs-number">1</span>);
        dp[index] = <span class="hljs-built_in">Math</span>.max(pick, notPick);

        <span class="hljs-keyword">return</span> dp[index];
    }

    <span class="hljs-keyword">return</span> helper(nums.length - <span class="hljs-number">1</span>);
};
</code></pre>
<h3 id="heading-tabulation">Tabulation</h3>
<p>If we observe closely, we can see, the base value of the recursion,</p>
<ul>
<li><p>If there is only one house, the result is the first house's value</p>
</li>
<li><p>For the first two houses, the result is the maximum of the first two houses, since we can not take these consecutive two houses</p>
</li>
<li><p>For the rest of the houses, if we pick the house, just can not pick the immediate previous one</p>
</li>
</ul>
<p>Considering these, can calculate the final maximum results as below,</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">rob</span>(<span class="hljs-params">nums: <span class="hljs-built_in">number</span>[]</span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> dp = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(nums.length).fill(<span class="hljs-number">0</span>);
    dp[<span class="hljs-number">0</span>] = nums[<span class="hljs-number">0</span>];
    dp[<span class="hljs-number">1</span>] = <span class="hljs-built_in">Math</span>.max(nums[<span class="hljs-number">0</span>], nums[<span class="hljs-number">1</span>]);

    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">2</span>; i &lt; nums.length; i += <span class="hljs-number">1</span>) {
        <span class="hljs-keyword">const</span> take = nums[i] + dp[i - <span class="hljs-number">2</span>];
        <span class="hljs-keyword">const</span> notTake = dp[i - <span class="hljs-number">1</span>];
        dp[i] = <span class="hljs-built_in">Math</span>.max(take, notTake);
    }

    <span class="hljs-keyword">return</span> dp[nums.length - <span class="hljs-number">1</span>];
};
</code></pre>
<h3 id="heading-space-optimization">Space Optimization</h3>
<p>From the last solution, it occurs, that the solution of the current index only depends on the previous two values. With this consideration, we can simply avoid the entire <code>O(n)</code> array with a just two variables,</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">rob</span>(<span class="hljs-params">nums: <span class="hljs-built_in">number</span>[]</span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">let</span> rob1 = <span class="hljs-number">0</span>;
    <span class="hljs-keyword">let</span> rob2 = <span class="hljs-number">0</span>;

    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">0</span>; i &lt; nums.length; i += <span class="hljs-number">1</span>) {
        <span class="hljs-keyword">const</span> take = rob1 + nums[i];
        <span class="hljs-keyword">const</span> notTake = rob2;
        rob1 = rob2
        rob2 = <span class="hljs-built_in">Math</span>.max(take, notTake)
    }

    <span class="hljs-keyword">return</span> rob2;
};
</code></pre>
<p>This is the most optimized solution with constant space and <code>O(n)</code> runtime complexity.</p>
<p>For practice: <a target="_blank" href="https://leetcode.com/problems/house-robber/">https://leetcode.com/problems/house-robber/</a></p>
]]></content:encoded></item><item><title><![CDATA[Fibonacci Number: From recursion to memoization and ultimately space-optimized solution]]></title><description><![CDATA[Let’s evaluate the Classic Dynamic Programming problem, Fibonacci Number in a crispy way.
We will start solving the problem from a recursive solution and later step by step we will use memoization and space optimization.
The Fibonacci Number or Fibon...]]></description><link>https://blog.shams-nahid.com/fibonacci-number-from-recursion-to-memoization-and-ultimately-space-optimized-solution</link><guid isPermaLink="true">https://blog.shams-nahid.com/fibonacci-number-from-recursion-to-memoization-and-ultimately-space-optimized-solution</guid><category><![CDATA[JavaScript]]></category><category><![CDATA[algorithms]]></category><category><![CDATA[datastructure]]></category><category><![CDATA[fibonacci]]></category><category><![CDATA[Dynamic Programming]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Tue, 10 Sep 2024 13:54:00 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1725976324626/edefbda7-cb43-453d-8c1a-d515b3d84dee.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Let’s evaluate the Classic Dynamic Programming problem, <code>Fibonacci Number</code> in a crispy way.</p>
<p>We will start solving the problem from a recursive solution and later step by step we will use memoization and space optimization.</p>
<p>The <code>Fibonacci Number</code> or <code>Fibonacci Sequence</code> is as follows,</p>
<p>0, 1, 1, 2, 3, 5, 8, 13 and so on.</p>
<p>After the first two numbers, each number is the sum of the previous two numbers.</p>
<h3 id="heading-recursive-solution">Recursive Solution</h3>
<p>So, the constant part of the base case of the sequence is first two numbers are always 0 and 1. To calculate the rest of the numbers we will consider,</p>
<pre><code class="lang-javascript">f(n) = f(n - <span class="hljs-number">1</span>) + f(n - <span class="hljs-number">2</span>)
</code></pre>
<p>With the base case and driven formula, our recursive solution will be,</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">fibonacciNumber</span>(<span class="hljs-params">n: <span class="hljs-built_in">number</span></span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> dp = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(n + <span class="hljs-number">1</span>).fill(<span class="hljs-number">-1</span>);
    <span class="hljs-keyword">const</span> helper = <span class="hljs-function">(<span class="hljs-params">step</span>) =&gt;</span> {
        <span class="hljs-keyword">if</span> (dp[step] !== <span class="hljs-number">-1</span>) {
            <span class="hljs-keyword">return</span> dp[step];
        }

        <span class="hljs-keyword">if</span> (step === <span class="hljs-number">0</span> || step === <span class="hljs-number">1</span>) {
            <span class="hljs-keyword">return</span> step;
        }

        <span class="hljs-keyword">const</span> first = helper(step - <span class="hljs-number">1</span>);
        <span class="hljs-keyword">const</span> second = helper(step - <span class="hljs-number">2</span>);

        dp[step] = first + second;

        <span class="hljs-keyword">return</span> dp[step];
    }

    <span class="hljs-keyword">return</span> helper(n);
};
</code></pre>
<p>This is a bottom-up approach. However, if we go to a tabulation format, we can design a top-to-bottom approach.</p>
<h3 id="heading-memoization">Memoization</h3>
<p>We are maintaining an array <code>dp</code> where we are keeping the sequence number. After the first two values, the next one is the sum of the previous two values. In a more simplified way, we can say,</p>
<pre><code class="lang-typescript">dp[n] = dp[n - <span class="hljs-number">1</span>] + dp[n - <span class="hljs-number">2</span>]
</code></pre>
<p>Now, the first two values are known and we will update these two values initially. Then with a simple loop we will calculate the rest of the sequence.</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">fibonacciNumber</span>(<span class="hljs-params">n: <span class="hljs-built_in">number</span></span>): <span class="hljs-title">number</span> </span>{
    <span class="hljs-keyword">const</span> dp = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Array</span>(n + <span class="hljs-number">1</span>);
    dp[<span class="hljs-number">0</span>] = <span class="hljs-number">0</span>;
    dp[<span class="hljs-number">1</span>] = <span class="hljs-number">1</span>;

    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">2</span>; i &lt;= n; i += <span class="hljs-number">1</span>) {
        dp[i] = dp[i - <span class="hljs-number">1</span>] + dp[i - <span class="hljs-number">2</span>];
    }

    <span class="hljs-keyword">return</span> dp[n];
};
</code></pre>
<p>With the implementation, we can see the space complexity is <code>O(n)</code>. With this in mind, can we do more space optimization?</p>
<h3 id="heading-space-optimization">Space Optimization</h3>
<p>Since each of the values just depends on the previous two values, we can just keep these previous two values and calculate the current one.</p>
<pre><code class="lang-typescript"><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">fibonacciNumber</span>(<span class="hljs-params">n: <span class="hljs-built_in">number</span></span>): <span class="hljs-title">number</span> </span>{
     <span class="hljs-keyword">if</span> (n &lt; <span class="hljs-number">2</span>) {
        <span class="hljs-keyword">return</span> n;
    }
    <span class="hljs-keyword">let</span> prev1 = <span class="hljs-number">0</span>;
    <span class="hljs-keyword">let</span> prev2 = <span class="hljs-number">1</span>;

    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> i = <span class="hljs-number">2</span>; i &lt;= n; i += <span class="hljs-number">1</span>) {
        <span class="hljs-keyword">const</span> temp = prev2;
        prev2 = prev1 + prev2;
        prev1 = temp;
    }

    <span class="hljs-keyword">return</span> prev2;
};
</code></pre>
<p>With these constant values, now, we can now optimize the space to <code>O(n)</code></p>
]]></content:encoded></item><item><title><![CDATA[Adrika Eco Cottage, It's been 5 Years!]]></title><description><![CDATA[Back in 2019, I was on the roof of a Jeep and decided to migrate to a premium cottage instead of the regular one. We were on our way to Sajek Valley. Four of us put in additional money and booked the cottage on the way.
Now, in 2024, one of my tour m...]]></description><link>https://blog.shams-nahid.com/adrika-eco-cottage-its-been-5-years</link><guid isPermaLink="true">https://blog.shams-nahid.com/adrika-eco-cottage-its-been-5-years</guid><category><![CDATA[Sajek]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[Solo Travel]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Sat, 15 Jun 2024 11:23:10 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1718450317348/221fdc93-2bc6-48b9-bcaa-e6a6b99502f3.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Back in 2019, I was on the roof of a Jeep and decided to migrate to a premium cottage instead of the regular one. We were on our way to Sajek Valley. Four of us put in additional money and booked the cottage on the way.</p>
<p>Now, in 2024, one of my tour mates coincidentally booked the same cottage.</p>
<p>This time, eight of us decided to embrace the clouds in the beautiful Sajek Valley. Since it was just a week before the Eid festival, the valley was quite empty.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1718450538572/0a580158-4b60-4bb4-acde-afaabf5a0615.jpeg" alt class="image--center mx-auto" /></p>
<p>We reached Khagrachari early in the morning and after having breakfast, took the nicest jeep, called "Chander Gari" locally. On our way to Sajek, we enjoyed the amazing nature and during stops, tasted the local fruits.</p>
<p>Since my last visit, Sajek has changed a lot. There are a lot of cottages now and they have electricity. The Adrika Eco Cottage has merged with Lusai Cottage. I saw the old room and felt nostalgic.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1718450395473/cc7fb9ac-cde4-428c-bc25-a077ca709e46.jpeg" alt class="image--center mx-auto" /></p>
<p>During lunch, we tried their local bamboo-made chicken. Then we headed to a hill called Kanglak. We returned in the evening. At night, a barbecue was arranged for us.</p>
<p>The next day, we heard a warning that the road was blocked by locals for some of their demands. However, after a few hours of negotiation, the army managed to escort us to Khagrachari city.</p>
<p>There, after having our lunch, we first went to the beautiful Risang waterfall. Since the waterfall was slippery and sloped, we used a rope for support. Then we went to a cave and crossed it.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1718450363444/8c1d7763-e874-44ac-addf-9c39e39b6fb8.jpeg" alt class="image--center mx-auto" /></p>
<p>It was almost dark everywhere. We returned to Dhaka that same night.</p>
]]></content:encoded></item><item><title><![CDATA[Cruising over kaptai lake]]></title><description><![CDATA[A few of us were planning a trip, and Rangamati was one of the options. We were also considering some very popular places like Sajek. In the end, we finalized the destination with only one day's notice before the trip.
From the very beginning, we wan...]]></description><link>https://blog.shams-nahid.com/cruising-over-kaptai-lake</link><guid isPermaLink="true">https://blog.shams-nahid.com/cruising-over-kaptai-lake</guid><category><![CDATA[lake]]></category><category><![CDATA[Solo Travel]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[Kaptai]]></category><category><![CDATA[Rangamati]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 23 May 2024 20:24:19 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1716495804139/6415aa41-0863-4c4d-95a8-779dfc2adcb8.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>A few of us were planning a trip, and Rangamati was one of the options. We were also considering some very popular places like Sajek. In the end, we finalized the destination with only one day's notice before the trip.</p>
<p>From the very beginning, we wanted a relaxed trip to enjoy some leisure time. At the last moment, when we were looking for a resort, none of them were available, and some were beyond our budget. I had previously visited Rangamati three times and remembered a park called "Polwel Park," where I noticed some nice resorts. Suddenly, I made a call and found that cottages were available and within our budget. Soon, we bought tickets for a total of seven people.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1716461107838/3ab46d1f-b56b-4686-b519-572ca69b1289.jpeg" alt class="image--center mx-auto" /></p>
<p>We reached Rangamati early in the morning and headed to our cottage. Fortunately, the cottage was empty, and we checked in immediately. On our first day, we had no plans other than being lazy. We ordered our food from the park's cafe and then went to the swimming pool. We spent about three hours in the pool.</p>
<p>Returning from the pool, we took a nap for three to four hours. In the afternoon, we went for our lunch. The park had kayaking facilities, and we did not want to miss it. So, in the evening, we cruised over the beautiful Kaptai Lake with the kayak.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1716461049220/3761c1e7-4e5f-41b6-8b8e-b2e85d79d211.jpeg" alt class="image--center mx-auto" /></p>
<p>The next morning, we rushed to the cafe because of the time limit for the complimentary breakfast. Then we hired a wooden boat for the whole day. It took us to a few remote places around Kaptai Lake. On our way to Shuvlong Waterfall, we ordered our lunch at a cafe that served only local and traditional foods.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1716461038220/9d782a49-abde-4cdb-9b2b-3ea1af957b78.jpeg" alt class="image--center mx-auto" /></p>
<p>We were lucky to have a thunderstorm on our way to Shuvlong, which brought more water to the waterfall. From the waterfall, we visited a temple and then headed back to the restaurant for our lunch. The food items were both unique and delicious.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1717511781385/71ec3fbf-b4d7-4d1f-ba4f-ba8fd1898219.jpeg" alt class="image--center mx-auto" /></p>
<p>It was almost evening when we returned to Rangamati.</p>
]]></content:encoded></item><item><title><![CDATA[Agargaon Night Half Marathon]]></title><description><![CDATA[The Agargaon Half Marathon was the first running event of the summer season in 2024. A few months back, when the event was announced, we all expected very hot weather, high humidity, or thunderstorms. Despite these extreme weather conditions, there w...]]></description><link>https://blog.shams-nahid.com/agargaon-night-half-marathon</link><guid isPermaLink="true">https://blog.shams-nahid.com/agargaon-night-half-marathon</guid><category><![CDATA[running]]></category><category><![CDATA[half marathon]]></category><category><![CDATA[bangladesh]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Sun, 19 May 2024 05:45:39 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1716097491479/897d227b-8b3e-4dee-a1e3-5b293639f6d5.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>The Agargaon Half Marathon was the first running event of the summer season in 2024. A few months back, when the event was announced, we all expected very hot weather, high humidity, or thunderstorms. Despite these extreme weather conditions, there was a huge rush to participate. In about an hour, all the slots were booked. I was one of the lucky ones to register myself in the first chance. However, after fulfilling the first 500 slots, due to high demand, an additional 100 slots were opened.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1716097445700/2e77ab82-3a79-4f34-ab2e-af319236c09a.jpeg" alt class="image--center mx-auto" /></p>
<p>The most special aspect of this event was that it was a night run. Usually, we are used to participating in morning or daytime runs. This one started at 1 AM. Additionally, it was only a 20-minute walking distance from my neighborhood, so I did not want to miss the event.</p>
<p>A month before the event, we observed fasting for religious reasons. I had one month to prepare. I used to run slowly, covering 20-25 km a week. It turns out that was not enough.</p>
<p>During the race, I started very slowly, just jogging. We had four loops of 5 km and one very small loop, around 1.5 km. I completed three loops, totaling 12 km, with slow running. Later, I did not feel well and started walking. For the rest of the track, I alternated between walking and running 1 km each.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1716097457024/c9a2c7c9-8b1f-4f6a-9ecc-342cee5bbbb2.jpeg" alt class="image--center mx-auto" /></p>
<p>I took more than three hours to complete the run, whereas my best time was 2 hours and 18 minutes. This event highlighted my weaknesses, particularly my lack of endurance. I have now started a 10-week training program to increase my endurance.</p>
]]></content:encoded></item><item><title><![CDATA[Vertical Dreamers 25k & Finally Unlocaked Kutubdia]]></title><description><![CDATA[In Bangladesh, the Vertical Dreamers 25k is one of three prestigious events. Before this particular race, I had a two-week rest from the intense running month. Although there were two categories of running, 25k and 52k ultra, I chose to go for the 25...]]></description><link>https://blog.shams-nahid.com/vertical-dreamers-25k-finally-unlocaked-kutubdia</link><guid isPermaLink="true">https://blog.shams-nahid.com/vertical-dreamers-25k-finally-unlocaked-kutubdia</guid><category><![CDATA[Kutubdia]]></category><category><![CDATA[Marathon]]></category><category><![CDATA[running]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[Bandarban]]></category><category><![CDATA[Solo Travel]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 29 Feb 2024 07:32:29 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1713930660357/328480d3-b570-443b-9164-9811952e85cd.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>In Bangladesh, the Vertical Dreamers 25k is one of three prestigious events. Before this particular race, I had a two-week rest from the intense running month. Although there were two categories of running, 25k and 52k ultra, I chose to go for the 25k due to the insane elevation on the track. Initially, it was supposed to happen on the Alikodom-Thanchi road, beside Dimpahar. However, due to political issues near the Myanmar border, the track was relocated to the Bandarban Chimbuk road.</p>
<p>When It was about to happen in the Alikodom, I knew I could not participate as I had an office meeting the previous day. However, when the location changed, I decided to take the shot towards an uncertain journey to reach the Bandarban. Previously I visited Bandarban over 15 times, so I know some routes, so I can reach to the city before 3 AM.</p>
<p>I reached Bandarban very early in the morning, around 2 am. There, I collected my BIB and then encountered some familiar faces.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1709191896585/ecbb718b-7fd3-4056-9d22-bb940a6a2dbe.jpeg" alt class="image--center mx-auto" /></p>
<p>One of my previous running partners was already there, and we surprisingly had a similar pace. So, we started running together. At around 3 km, we reached a U-turn leading to a hill. Although it was physically devastating, the natural beauty was serene. I encountered another mind-blowing view during the last U-turn.</p>
<p>My partner experienced muscle cramps twice and received long massages twice at two hydration points. Overall, it took us around 4 hours and 30 minutes.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1713930819376/c7643d3a-a9cc-41e4-abb9-61e4db93a979.jpeg" alt class="image--center mx-auto" /></p>
<p>After collecting the medal, I opted to visit Kutubdia Island. I had previously tried twice to go there, but due to very bad weather, I was unable to reach it. This time, the weather was nice, and I went there by a small boat. It is famous for <strong>its</strong> lighthouse and windmills. Although the lighthouse was broken, the windmills were still standing.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1709191864919/57b54678-0e18-40d4-a497-120a7d6a2b57.jpeg" alt class="image--center mx-auto" /></p>
<p>This race day adventure was not just another running event. The hill track was exceptionally challenging but worth every bit. Additionally, I enjoyed utilizing the second day on a nice island.</p>
]]></content:encoded></item><item><title><![CDATA[Prepare for your first AWS Certification]]></title><description><![CDATA[If you are in a developer/engineering role and have decided to pursue your first AWS certification, I am here to assist you with the following:

Choosing the right certification

Identifying the courses/resources you will need


In most cases, the fi...]]></description><link>https://blog.shams-nahid.com/prepare-for-your-first-aws-certification</link><guid isPermaLink="true">https://blog.shams-nahid.com/prepare-for-your-first-aws-certification</guid><category><![CDATA[AWS]]></category><category><![CDATA[AWS certification]]></category><category><![CDATA[AWS Certified Solutions Architect Associate]]></category><category><![CDATA[AWS Certified Developer - Associate]]></category><category><![CDATA[Amazon Web Services]]></category><category><![CDATA[cloudcertifications]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 22 Feb 2024 10:09:40 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1708596356340/e00898eb-a80f-4f72-9383-3d319b60e8f0.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>If you are in a developer/engineering role and have decided to pursue your first <a target="_blank" href="https://aws.amazon.com/certification/">AWS</a> certification, I am here to assist you with the following:</p>
<ul>
<li><p>Choosing the right certification</p>
</li>
<li><p>Identifying the courses/resources you will need</p>
</li>
</ul>
<p>In most cases, the first confusing part of certification for engineers/developers is whether to go for <a target="_blank" href="https://aws.amazon.com/certification/certified-solutions-architect-associate/"><code>Solution Architect Associate</code></a> or <a target="_blank" href="https://aws.amazon.com/certification/certified-developer-associate/"><code>Developer Associate</code></a>.</p>
<p>Now, some of you may wonder why I did not consider <code>AWS Cloud Practitioner</code>. There are two reasons for this:</p>
<ul>
<li><p>This Cloud Practitioner certification suits marketing roles more than developer roles.</p>
</li>
<li><p>I assume you are a developer who has been using AWS services for at least a year.</p>
</li>
</ul>
<p>Now, before you proceed, this article is not suitable for you if:</p>
<ul>
<li><p>You are not using AWS services regularly.</p>
</li>
<li><p>You are more interested in obtaining a certificate than gaining hands-on experience.</p>
</li>
</ul>
<p>Assuming you are still here, the perspective of having a certificate is to validate your existing knowledge. One key point to remember is that while you validate your knowledge, AWS acts as a marketing agent to sell its products and services.</p>
<p>Before we proceed further, what are my credentials to write this article? Okay,</p>
<ul>
<li><p>I hold two AWS certificates (Both AWS CSAA and CDA).</p>
</li>
<li><p>I am a senior software engineer with over 5 years of experience.</p>
</li>
</ul>
<h2 id="heading-which-certificate-should-i-go-for">Which certificate should I go for?</h2>
<p>For the first certificate, we have two options, both at the associate level:</p>
<ul>
<li><p>AWS Certified Solution Architect - Associate (CSAA)</p>
</li>
<li><p>AWS Certified Developer - Associate (CDA)</p>
</li>
</ul>
<p>Now, although in my case, I took the CSAA first, I encourage you to go for CDA.</p>
<p>Reasons why I discourage going for CSAA:</p>
<ul>
<li><p>It requires knowledge of networking to a certain degree.</p>
</li>
<li><p>Comparing study content, it is larger than the CDA.</p>
</li>
<li><p>Challenges knowledge on migrating on-premise services to AWS Clouds, which is not a regular job for a developer role.</p>
</li>
<li><p>Tons of hands-on work on the AWS console.</p>
</li>
</ul>
<p>And why I prefer CDA for the first certification:</p>
<ul>
<li><p>This includes serverless services, which are pretty common for developer roles, as we use them in on-premise servers.</p>
</li>
<li><p>Most of the hands-on work is related to existing development tasks.</p>
</li>
<li><p>We have already used most of the tools and services in open-source versions (or from different vendors).</p>
</li>
</ul>
<p>Overall, as developers, we use a lot of open-source tools/services. In the CDA exam, we will become familiar with the AWS versions of these tools. For example, for CI/CD, we use Jenkins, GitHub Actions, Travis CI, etc. Here, we will find the AWS versions of these tools. In our daily jobs, we develop APIs, build UIs, and deploy them. In the course curriculum, we will get used to AWS services for these tasks.</p>
<p>So AWS CDA is not just comparatively easier but also an interesting choice for the first certification.</p>
<p>However, if you are involved in building infrastructure, managing security, handling networking stuff rather than raw coding, I would suggest going with AWS CSAA first.</p>
<h2 id="heading-coursesresources">Courses/Resources</h2>
<p><a target="_blank" href="https://courses.datacumulus.com/">Stephane Maarek</a>, <a target="_blank" href="https://digitalcloud.training/">Neal Davis</a>, <a target="_blank" href="https://learn.cantrill.io/p/home">Adrian Cantrill</a>, <a target="_blank" href="https://tutorialsdojo.com/">Jon Bonso</a>, <a target="_blank" href="https://www.whizlabs.com/">Wizlab</a> have created great resources for both CDA and CSAA certifications. However, if you want a bold outline with minimum resources, you can go with the following:</p>
<p><strong>Courses for AWS CDA</strong></p>
<ul>
<li><p>Video course from Stephane Maarek: <a target="_blank" href="https://www.udemy.com/course/aws-certified-developer-associate-dva-c01/">Ultimate AWS Certificate Developer - Associate</a></p>
</li>
<li><p>Practice Exam from John Bonso: <a target="_blank" href="https://tutorialsdojo.com/courses/aws-certified-developer-associate-practice-exams/">AWS CERTIFIED DEVELOPER ASSOCIATE PRACTICE EXAMS</a></p>
</li>
</ul>
<p><strong>Courses for AWS CSAA</strong></p>
<ul>
<li><p>Video course from Stephane Maarek: <a target="_blank" href="https://www.udemy.com/course/aws-certified-developer-associate-dva-c01/">Ultimate AWS Certificate Solution Architect - Associate</a></p>
</li>
<li><p>Practice Exam from John Bonso: <a target="_blank" href="https://tutorialsdojo.com/courses/aws-certified-developer-associate-practice-exams/">AWS CERTIFIED SOLUTION ARCHITECT ASSOCIATE PRACTICE EXAMS</a></p>
</li>
</ul>
<h2 id="heading-tips">Tips</h2>
<p><strong>Video Course</strong></p>
<p>Video courses are the most boring but impactful resource for the exam. Personally, I could not concentrate for more than 5 minutes on video tutorials. To reduce this issue, I did the following:</p>
<ul>
<li><p>Ran these videos at 1.5x speed</p>
</li>
<li><p>Paused and took personalized notes</p>
</li>
<li><p>Went to the AWS console and played with the services</p>
</li>
<li><p>Tried practice exams and to clarify specific exam topics watched the related video (or video section)</p>
</li>
</ul>
<p><strong>Practice Exam</strong></p>
<p>Practice exams help identify the boundaries of the course. When I found multiple questions on a single topic, I put additional concentration on these topics' video courses.</p>
<p>During practice, even if you are sure about the answers, read the explanation part to learn additional information about the services.</p>
<p>In my real exam, I found around 10 questions pretty close to the practice exam. Although the practice exams are comparatively more challenging than the original exam, try to revisit them until you score over 80% in each exam.</p>
<h2 id="heading-hands-on">Hands-On</h2>
<p>Hands-on experiences are the keys to learning, experimenting, and memorizing the services. For CSAA, the most important hands-on part is creating a custom VPC that includes public and private subnets. Run servers in these subnets along with ALB, ASG, IG, NAT Gateway. This will help to cover a major portion of the syllabus.</p>
<p>For CDA, build a serverless application with SAM, API Gateway, Lambda, and DynamoDB. Use Code Pipeline to deploy code to the EC2 instance (or Beanstalk) using Code Build and Code Deploy. Play with different deployment configurations. This will not just cover the exam syllabus but also keep the certification journey interesting.</p>
<h2 id="heading-conclusion">Conclusion</h2>
<p>This is a personal opinion based on my journey with these two certifications. For queries, comment below or shoot me an email. Good luck on your cloud journey.</p>
]]></content:encoded></item><item><title><![CDATA[200 KM Running In 30 Days: Did I cross my limit?]]></title><description><![CDATA[In the last 30 days, I participated.

Marine Drive Ultra Marathon (50 KM)

Dhaka Marathon (42 KM)

Rajkandi Hill 25K (25 KM)

UCR Half Marahon (21 KM)

And in-house practice 100 KM


As I am going through the recovery training, I wonder, did I push m...]]></description><link>https://blog.shams-nahid.com/200-km-running-in-30-days-did-i-cross-my-limit</link><guid isPermaLink="true">https://blog.shams-nahid.com/200-km-running-in-30-days-did-i-cross-my-limit</guid><category><![CDATA[Marathon]]></category><category><![CDATA[ultra marathon]]></category><category><![CDATA[running]]></category><category><![CDATA[fitness]]></category><category><![CDATA[bangladesh]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 15 Feb 2024 20:04:10 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1708018664091/6b812378-2228-473c-b7c1-3dfddf2a7af2.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>In the last 30 days, I participated.</p>
<ul>
<li><p><a target="_blank" href="https://blog.shams-nahid.com/conquering-ultra-marathon-im-not-surprised">Marine Drive Ultra Marathon</a> (50 KM)</p>
</li>
<li><p><a target="_blank" href="https://blog.shams-nahid.com/the-dhaka-marathon-2024">Dhaka Marathon</a> (42 KM)</p>
</li>
<li><p><a target="_blank" href="https://blog.shams-nahid.com/rajkandi-hill-25k-a-surprising-track">Rajkandi Hill 25K</a> (25 KM)</p>
</li>
<li><p><a target="_blank" href="https://blog.shams-nahid.com/ucr-half-marathon-end-of-a-super-intense-month">UCR Half Marahon</a> (21 KM)</p>
</li>
<li><p>And in-house practice 100 KM</p>
</li>
</ul>
<p>As I am going through the recovery training, I wonder, did I push myself beyond my limits?</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1708026959184/8b30ff44-389c-4f18-9ced-07dd8a5dea3f.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-marine-drive-ultra-marathon">Marine Drive Ultra Marathon</h3>
<p>It all started with the <a target="_blank" href="https://blog.shams-nahid.com/conquering-ultra-marathon-im-not-surprised">Marine Drive Ultra Marathon</a>. Before this one, I never run a full marathon. Since it is one of the most prestigious events for runners and not easy to be selected for the program, I registered with no hope of getting a chance. To my surprise, I was selected for my previous month's consistency. I wrote them in detail, I participated in 7/8 half marathons in the past few months and I am capable of running this ultra distance.</p>
<p>After being selected, I started to run ~15 KM 3 days a week. My target was to increase my endurance so I could stay on track for over 8 hours. Usually, the cut-off time for 50 KM used to be 10 hours which was reduced this year to 8 hours. The week before the run, I stopped running and only did free training. It was one of these feelings, I practiced my best and there was nothing more I could do. No matter, if I can complete it or not, there will be no regret.</p>
<p>During the run day, I started slowly and on the track, I found a partner with the same pace. Or I should say, I found a mathematician. He opened the Strava app and calculated each KM with the time. We were together the entire 50 KM and his precious calculation helped me to complete the run in the cut-off time.</p>
<p>I went around 35 KM pretty much comfortably and after 35 KM I mixed both running and walking to the rest of the track. The amazing part was kids were standing by the side of the road and giving high-fives all the way.</p>
<p>I completed the run around 7 and a half hours duration. It was a mixed feeling when you saw lots of good runners who were not able to complete the run under the cut-off time for different challenges. Because this also glorifies the achievement.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1708027056636/f516471c-8bbf-4695-ae9c-c7ca6a2924f5.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-dhaka-marathon">Dhaka Marathon</h3>
<p>In the immediate next week, there was the <a target="_blank" href="https://blog.shams-nahid.com/the-dhaka-marathon-2024">Dhaka Marathon</a>. I was not quite confident about this run. Although my muscle memory now has a distance of 50 KM I have not completely recovered from the last Ultra distance run. In Bangladesh, a full marathon is not very frequent and I was desperate to put a full marathon in my resume.</p>
<p>Leaving all the confusion behind, I decided to participate in the event. For the first 21 KM, I run quite easily at a slow pace. This time the cut-off time was 6 hours. As I recall, I completed half of the distance in under 2 hours and 23 minutes. I kept the same pace till 30 KM. I had around 2 hours left for the last 10 KM. Since I run previous week a long distance and in the upcoming weeks I have a couple of running events, I did not push myself. I kept my heart calm by running and walking.</p>
<p>This time, I completed the full marathon in around five and a half hours. The consequence of two consecutive long-distance runs injured my left foot.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1708027090886/7d6ed5dd-8cf9-4906-9d23-e9957c97f5e0.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-rajkandi-hill-25k">RajKandi Hill 25K</h3>
<p>In Bangladesh, <a target="_blank" href="https://blog.shams-nahid.com/rajkandi-hill-25k-a-surprising-track">Rajkandi Hill 25K</a> is the most beloved running event. Not only it is organized by the dedicated community runners, but also the track surprises the runners every 5 KM.</p>
<p>I was not fit to run this event due to the left foot injury. But hearing the stories from fellow runners about the track could not resist myself. This week, I did not practice and slept a lot. I was worried this time If I would be able to complete this hill track.</p>
<p>On the run day, surprisingly I was feeling very good. On the track, we started running in the rice field. Later, the track was going through the tea garden of the Dankan Brothers. The surprises start after the tea garden. There were rubber gardens on the hills and our tack was under these large rubber trees. Then comes the cascade all over the track. At the end of the run, I found a hill, that will be around 300 meters high.</p>
<p>All these beauties of the track and support from the locals made the run very easy and I completed the run in around three and a half hours.</p>
<p>We also visited few places in the Sylhet region after the run.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1708027145619/f006cf8b-674f-4065-a438-0d8df6ffe194.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-ucr-half-marathon-edition-2">UCR Half Marathon (Edition 2)</h3>
<p>Again, this is the event I should not participate in as I have not recovered yet. However, since I was in Dhaka I would retreat not participate in the event in terms of staying home idle during the weekend. So I decided to participate <a target="_blank" href="https://blog.shams-nahid.com/ucr-half-marathon-end-of-a-super-intense-month">UCR Half Marahon</a> before going into a long recovery training.</p>
<p>The best part was, I found the best pacer in BD with a close time to my target. I planned to complete the run in under 2 and a half hours. Since the pacer had a time of 3 hours, I decided to accompany him around 10-15 KM and then push myself. Since I was not completely fit this time, I started to struggle after 10 KM. After half of the distance, my leg, especially my injured left foot cramped a few times. This time, I could not walk because walking was causing more pain than running.</p>
<p>Along with the pain, I never left the pacer bus and after 15 KM pushed myself to my regular pace. This time, I met my personal best in half marathon distance, 2 hours and 27 minutes.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1708027225165/f15d883e-b6a4-4ca2-81ec-556242ea1b98.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-back-to-the-answer">Back To The Answer</h3>
<p>So, back to my early question, did I cross my limit? I thought and it appeared to me, we can never cross our limit because the term "LIMIT" does not exist in this context.</p>
<p>I am under recovery training and in the next month, I will be back on track. Till then, signed off.</p>
<p>To stay tuned, check out my running blog series <a target="_blank" href="https://blog.shams-nahid.com/series/rising-beyond-miles">Rising Beyond Miles</a>.</p>
]]></content:encoded></item><item><title><![CDATA[Scalable Design of a Mapping application]]></title><description><![CDATA[A mapping application stores and manages millions of road data to accurately navigate individual users and applications. For example, the Google Maps application processes billions of nodes and edges to guide people all over the world. A feature reac...]]></description><link>https://blog.shams-nahid.com/scalable-design-of-a-mapping-application</link><guid isPermaLink="true">https://blog.shams-nahid.com/scalable-design-of-a-mapping-application</guid><category><![CDATA[System Architecture]]></category><category><![CDATA[System Design]]></category><category><![CDATA[high level design]]></category><category><![CDATA[google maps]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Thu, 15 Feb 2024 04:31:52 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1707971466315/920f1792-19e8-4966-965a-841c04c38c50.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>A mapping application stores and manages millions of road data to accurately navigate individual users and applications. For example, the Google Maps application processes billions of nodes and edges to guide people all over the world. A feature reach mapping application serves both individuals and companies.</p>
<p>For individuals:</p>
<ul>
<li><p>Allow searching tracks from source to destination.</p>
</li>
<li><p>Allow direction on the track.</p>
</li>
<li><p>Show the ETA (estimated time of arrival).</p>
</li>
</ul>
<p>For companies:</p>
<ul>
<li><p>Allow driving the self-driving cars (Waymo's self-driving car).</p>
</li>
<li><p>Allow ride-sharing services (Lyft).</p>
</li>
<li><p>Allow parcel services (Uber).</p>
</li>
</ul>
<h2 id="heading-requirements">Requirements</h2>
<hr />
<h3 id="heading-functional-requirements">Functional Requirements</h3>
<ul>
<li><p><strong>Detect the current location:</strong> It requires finding out the latitude and longitude of the current location. This is the basis for providing other services.</p>
</li>
<li><p><strong>Provide a route:</strong> According to the source and destination, the application should provide multiple faster routes based on the vehicles.</p>
</li>
<li><p><strong>Directions:</strong> On the way from the source to the destination, the app will guide users in the right direction.</p>
</li>
</ul>
<h3 id="heading-non-functional-requirements">Non-Functional Requirements</h3>
<ul>
<li><p><strong>Availability:</strong> The system should be highly available.</p>
</li>
<li><p><strong>Scalability:</strong> The system should be scalable as both individuals and enterprise applications like Uber, Lyft, Waymo, etc., use the application internally.</p>
</li>
<li><p><strong>Performance:</strong> This includes the accuracy and latency of finding and providing routes.</p>
</li>
</ul>
<h3 id="heading-challenges">Challenges</h3>
<ul>
<li><p><strong>Scalability:</strong> The map application will be dealing with billions of nodes and edges when finding the path all over the world. Typical pathfinding algorithms like Dijkstra's algorithm will not scale to this volume and may provide a poor experience. We will require a modified and improved version of the algorithm.</p>
</li>
<li><p><strong>ETA Computation:</strong> The ETA should consider different factors like road constructions, traffic volumes, and different incidents on the way to the destination and update accordingly.</p>
</li>
</ul>
<h3 id="heading-resource-estimation">Resource Estimation</h3>
<p>Let's consider the map application has a total of 30 million daily users.</p>
<p><strong>Servers:</strong></p>
<p>If a single server can handle 8000 requests per second, and a user makes 50 requests per day, we will make a total of (50 <em>30</em> 10^6) requests per day.</p>
<p>This implies (50 <em>30</em> 10^6) / (24 <em>60</em> 60) requests per second.</p>
<p>TOTAL_REQUEST_PER_DAY = (50 <em>30</em> 10^6) / (24 <em>60</em> 60);</p>
<p>Total number of servers we will need is (TOTAL_REQUEST_PER_DAY/8000).</p>
<p><strong>Storage:</strong></p>
<p>Storage requirement for the map is pretty much consistent. Reading route data from various sources is persisted for one time.</p>
<p><strong>Bandwidth:</strong></p>
<p>Based on the following assumptions:</p>
<ul>
<li><p>Total active users: 30 million</p>
</li>
<li><p>Each user makes 50 requests per day</p>
</li>
<li><p>Each request size is 200 bytes</p>
</li>
<li><p>Each response size will be 2050 bytes</p>
</li>
</ul>
<p>Incoming Bandwidth:</p>
<p>INCOMING_BANDWIDTH = ((TOTAL_ACTIVE_USERS <em>REQUEST_PER_DAY_BY_EACH_USER</em> EACH_REQUEST_SIZE) / 24_HOURS_IN_SECONDS) bytes/s</p>
<p>In numbers: (30 <em>10^6</em> 50 <em>200) / (24</em> 60 * 60) bytes/s</p>
<p>Outgoing Bandwidth:</p>
<p>Unlike the incoming request, the response will have both textual and visual content to build up a map.</p>
<p>OUTGOING_BANDWIDTH = ((TOTAL_ACTIVE_USERS <em>REQUEST_PER_DAY_BY_EACH_USER</em> EACH_RESPONSE_SIZE) / 24_HOURS_IN_SECONDS) bytes/s</p>
<h3 id="heading-building-blocks">Building Blocks</h3>
<p><strong>Load Balancer:</strong> To distribute traffic between different services and servers.</p>
<p><strong>Database:</strong> To store the location data and metadata in graph format.</p>
<p><strong>Pub-Sub System:</strong> Navigate users on the right directions and also invoke related services.</p>
<p><strong>Key-Value Storage:</strong> Also, store the metadata information.</p>
<h2 id="heading-high-level-design">High-Level Design</h2>
<hr />
<h3 id="heading-components">Components</h3>
<ul>
<li><p><strong>Location Finder:</strong> Reads the user's current position. May use GPS/WIFI/Cellular technology to find out the current accurate location.</p>
</li>
<li><p><strong>Distributed Search:</strong> This determines the latitude and longitude of a place entered by the user. It's a mapping service that translates the place name to the latitude and longitude.</p>
</li>
<li><p><strong>Route Finder:</strong> Using two positions, will generate all possible routes.</p>
</li>
<li><p><strong>Graph Processing Service:</strong> Between multiple routes, will determine the optimal route.</p>
</li>
<li><p><strong>Area Search Service:</strong> Orchestrates the distributed search, route finder, and graph processing service. At any time, using two places, get the actual position by invoking the distributed search. From these two locations, find the routes using the route finder. Later, use the graph processing service to get the optimal route.</p>
</li>
<li><p><strong>Database:</strong> Stores the routes, nodes, and edge data. Perhaps, utilize the graph database like DataStax.</p>
</li>
<li><p><strong>Pub-Sub System:</strong> While the user moves through the route, to navigate and guide, the pub-sub model will be used.</p>
</li>
<li><p><strong>Third-Party Data Receiver:</strong> Gets data from various sources about city, roads, and places. Pre-processes the third-party data so later these data can be used to store in the DB in native graph format.</p>
</li>
<li><p><strong>Graph Building:</strong> Graph building will be used to store the route data in the graph database that is suitable for making queries.</p>
</li>
<li><p><strong>User:</strong> The programs and people who are using the service.</p>
</li>
<li><p><strong>Load Balancer:</strong> Used to distribute traffic between different servers and services.</p>
</li>
</ul>
<h3 id="heading-workflow">Workflow</h3>
<ul>
<li><p>User enters the source (uses location finder for current location) and destination.</p>
</li>
<li><p>The area search service will find the optimal route using distributed search, route finder, and graph processing service.</p>
</li>
<li><p>Navigator will track the user's route. In case of distraction, the navigator will send an event to Kafka. Upon receiving the event, Kafka will recalculate the route using the area search service and send it back.</p>
</li>
</ul>
<h3 id="heading-api-design">API Design</h3>
<ul>
<li><p>Current location: Returns the user's current location.</p>
</li>
<li><p>Get route: Based on source, destination, and transport type, return the optimal route.</p>
</li>
<li><p>Get direction: At any point in time, based on the current location, give the next steps.</p>
</li>
</ul>
<h2 id="heading-challenges-of-google-map-design">Challenges of Google Map Design</h2>
<hr />
<h3 id="heading-scalability">Scalability</h3>
<p>We have a mesh of billions of nodes and edges. When we need to calculate the shortest path between two nodes, we cannot simply run the shortest path algorithm on the entire graph. Because, first of all, it is both impractical and impossible to load the entire nodes and edges into memory. Additionally, it will lead to performance issues for the users. Instead, we can divide the graph into different small segments. This will lead to:</p>
<ul>
<li><p>Smaller polygons to calculate the shortest path.</p>
</li>
<li><p>We can query them in parallel, improving performance.</p>
</li>
</ul>
<p><strong>Segment</strong></p>
<p>Calculate the shortest path between two nodes in a single segment:</p>
<ul>
<li><p>In a single segment, there will be a weight between each edge that connects two nodes.</p>
</li>
<li><p>Weight will be calculated by the traffic density, average speed of the vehicles, and other criteria.</p>
</li>
<li><p>Load the segment in memory and run the regular shortest path algorithm like Dijkstra.</p>
</li>
<li><p>Cache the results to reuse in the future.</p>
</li>
</ul>
<p>Calculate the shortest path between two places that are not nodes:</p>
<ul>
<li><p>Calculate the nearest nodes from the point of edge.</p>
</li>
<li><p>Use the shortest path using these nodes.</p>
</li>
</ul>
<p>Calculate the shortest path when the source and destination are from different segments:</p>
<ul>
<li><p>We will use the term 'Exit Point', where an exit point is the connecting point between two segments.</p>
</li>
<li><p>Exit points will be shared by two or more segments.</p>
</li>
<li><p>Using latitude and longitude, we can find the source and destination segments.</p>
</li>
<li><p>Instead of going to all the segments, we will use a radius of approximate distance and discard any segment outside the radius during path computation.</p>
</li>
<li><p>While finding the shortest path over segments, we only consider the exit point and do not consider the internals of the segments.</p>
</li>
<li><p>For finding the shortest</p>
</li>
</ul>
<p>segments path, we will do the rest of the computation inside the segments.</p>
<h3 id="heading-eta-computation">ETA Computation</h3>
<ul>
<li><p>Using the pub-sub model, the navigation service will collect live location data.</p>
</li>
<li><p>Considering the current location, traffic density (high, medium, low), traffic pattern (rush hour or not), find out the ETA.</p>
</li>
</ul>
<h2 id="heading-detailed-design-of-google-maps">Detailed Design of Google Maps</h2>
<h3 id="heading-segment-setup-and-request-handling">Segment Setup and Request Handling</h3>
<p><strong>Storage schema</strong></p>
<p>We will use 3 types of data storage:</p>
<ul>
<li><p>Key-value store</p>
</li>
<li><p>Graph database</p>
</li>
<li><p>Relational database</p>
</li>
</ul>
<p>After generating a segment, we will store the segment id and nodes (along with the edge) in the graph database.</p>
<p>We will utilize the key-value store to store the segment server id (where the segment is stored), boundaries (or exit points), and neighbor segment ids against the segment id.</p>
<p>In the traditional relational database, we will keep the information of the edges like weight, their traffic rush hours, and the related segment and node id.</p>
<p><strong>Design/Create Segment</strong></p>
<ul>
<li><p>First, get the data of the segment and get a segment id by a UUID generator.</p>
</li>
<li><p>Store the segment in the server using a 'server allocator service'.</p>
</li>
<li><p>Now we have saved the segment with the segment id.</p>
</li>
<li><p>Create the key-value store using segment id and its boundaries, neighbors, and server id.</p>
</li>
<li><p>Insert the edges' information of the segment into the relational database.</p>
</li>
</ul>
<p><strong>Handle User Request</strong></p>
<ul>
<li><p>When the user gives us the source and destination, find the latitude and longitude using the 'distributed search' service.</p>
</li>
<li><p>Find out the source and destination segments from the graph database.</p>
</li>
<li><p>Find all the relevant neighbors/segments using a radius.</p>
</li>
<li><p>The 'route finder' will find all the optimal routes using these segments.</p>
</li>
<li><p>The 'graph processing service' will find the appropriate route from the list of optimal routes.</p>
</li>
</ul>
<h3 id="heading-improve-estimation-using-live-data">Improve estimation using live data</h3>
<ul>
<li><p><strong>Web-socket &amp; Load-balancer</strong>: Using the WebSocket, the server can do two-way communication. A load balancer can be used to limit the number of socket connections on the server.</p>
</li>
<li><p><strong>Pub-Sub</strong>: The pub-sub model collects the data streams and puts them into a data analytics service like Apache Spark. The 'map update service' listens to the analytics result and updates the data storage.</p>
</li>
</ul>
<h2 id="heading-performance">Performance</h2>
<p>Our target is:</p>
<ul>
<li><p>The system can handle millions of user requests.</p>
</li>
<li><p>The system can handle a large amount of data.</p>
</li>
</ul>
<h3 id="heading-availability">Availability</h3>
<ul>
<li><p>Instead of storing the graph on a single server, we are utilizing individual servers for each segment.</p>
</li>
<li><p>This will help load the relevant segment into memory and query; otherwise, loading the entire graph will lead to out-of-memory errors.</p>
</li>
<li><p>We will utilize lazy loading so only relevant segments will load up in memory.</p>
</li>
</ul>
<h3 id="heading-scalability-1">Scalability</h3>
<ul>
<li><p>Since we load segments only based on user requests, we can scale to a degree.</p>
</li>
<li><p>Also, for more segment data, we will utilize more servers that will not degrade individual server performance.</p>
</li>
</ul>
<h3 id="heading-reduce-response">Reduce response</h3>
<ul>
<li><p>We will query smaller subgraphs (only relevant segments).</p>
</li>
<li><p>Cache the results of the query.</p>
</li>
</ul>
<h3 id="heading-accuracy">Accuracy</h3>
<ul>
<li><p>Use live location from the user to guide accordingly.</p>
</li>
<li><p>Update the edge weight based on traffic patterns.</p>
</li>
</ul>
]]></content:encoded></item><item><title><![CDATA[UCR Half Marathon: End of a super intense month]]></title><description><![CDATA[I was not completely prepared for this half marathon. Even the Rasjkandi Hill 25K was troublesome for me. In the last three weeks, I ran an ultra-marathon, a full marathon, and then 25 kilometers over the hills. Instead of making an immediate decisio...]]></description><link>https://blog.shams-nahid.com/ucr-half-marathon-end-of-a-super-intense-month</link><guid isPermaLink="true">https://blog.shams-nahid.com/ucr-half-marathon-end-of-a-super-intense-month</guid><category><![CDATA[running]]></category><category><![CDATA[Marathon]]></category><category><![CDATA[half marathon]]></category><category><![CDATA[bangladesh]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Wed, 14 Feb 2024 08:32:01 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1707899407803/96c4b8f8-1be3-49ff-af01-72fbb2f61a96.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>I was not completely prepared for this half marathon. Even the Rasjkandi Hill 25K was troublesome for me. In the last three weeks, I ran an ultra-marathon, a full marathon, and then 25 kilometers over the hills. Instead of making an immediate decision, I waited until the last day before the event. Fortunately, the day before the event, I felt good and decided to take the shot.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1707899440673/e3a9ead4-caef-4759-8b95-01271f6c94c2.jpeg" alt class="image--center mx-auto" /></p>
<p>I reached the raceground quite early, around 4:30 PM. I collected the kit; however, the jersey was not available by then. In about an hour, I found some familiar faces and had some conversations about the previous events.</p>
<p>The starting point of the 21KM race was 1.5 KM away from the raceground. After reaching there, I found my favorite pacer. He was aiming to complete the run in 2 hours and 40 minutes. My plan was to run with him for at least 1 hour and later, if possible, increase the speed.</p>
<p>During the run, we discussed a lot of things, including the motive behind the run. It was great to hear the different backgrounds of other runners and their initial inspirations. All the way, he guided us with stepping and breathing instructions.</p>
<p>After crossing 15 KM, I decided to push myself further. Until that date, my personal best for the half marathon was 2 hours and 33 minutes. This time, I reduced it by 6 minutes, achieving a new personal best.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1707899471741/eae24e2c-328e-49c6-871d-817e52e66f49.jpeg" alt class="image--center mx-auto" /></p>
<p>After the run, I met a few fellow runners, collected the medal, food, and returned home.</p>
<p>This was the last event of my intense month of running. Now, I am focusing on recovery training and will continue with recovery exercises until the end of the month.</p>
]]></content:encoded></item><item><title><![CDATA[Rajkandi Hill 25K: A surprising track]]></title><description><![CDATA[Rajkandi Hill 25K is the most beloved event for runners. Since I started running, runners have always talked about two events: the Marine Drive Ultra and the Rajkandi event. One of the renowned running communities is developed in the Rajkandi area. I...]]></description><link>https://blog.shams-nahid.com/rajkandi-hill-25k-a-surprising-track</link><guid isPermaLink="true">https://blog.shams-nahid.com/rajkandi-hill-25k-a-surprising-track</guid><category><![CDATA[Marathon]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[running]]></category><category><![CDATA[Travel]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Fri, 09 Feb 2024 13:56:28 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1707486910808/418f2629-a176-4890-a98c-4466379f3198.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Rajkandi Hill 25K is the most beloved event for runners. Since I started running, runners have always talked about two events: the Marine Drive Ultra and the Rajkandi event. One of the renowned running communities is developed in the Rajkandi area. It is one of the very few running events organized by runners. I registered for the event a few months back. All of a sudden, in two consecutive weeks, I participated in an ultra-marathon and a full marathon. Usually, after these long-distance runs, a long recovery period is required. However, after hearing all the good stories from the runners, I decided to move forward and participate in the Rajkandi Hill 25K. It was a tough decision for my body but worth every bit.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1707486662411/d2e1a4a4-4318-407b-b3e5-2564c35c3852.jpeg" alt class="image--center mx-auto" /></p>
<p>I reached there very early in the morning by train. Moulavibazar is one of the most favorite places in Bangladesh, and I've always been fond of running through the tea gardens. Fortunately, this running track was also on the Dankan Brothers tea estate, and my surprises started along the route.</p>
<p>We started our run on time. After 200 meters on the road, we moved to an open rice field. Then, after one and a half kilometers, we went to a hill in a tea garden. According to my previous knowledge from other runners, this should be the rest of the track. To my surprise, after a few kilometers, we left the tea garden and entered a rubber tree garden. My reaction at the time was, "Nice one." But things changed dramatically when we were done completing the rubber garden area. There were cascades here and there. The beauty of nature confused me—was I in a running event or on another expedition in the Bandarban area? After 10 kilometers, we had to cross a 200-meter hill and found a very old temple.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1707486677754/bf042b85-183d-4a66-b600-e878069c772e.jpeg" alt class="image--center mx-auto" /></p>
<p>The last time I completed a 25K distance in 3 hours, and initially this time, I planned to take more time as I was tired from the last two weeks of long-distance runs. But the road was too beautiful. In some places, instead of running, we were doing a photoshoot. When I reached the finish point, the organizers had arranged a feast just like a wedding festival.</p>
<p>A few of my friends were coming to the next district to travel, and I had plans to accompany them. I rushed to Sylhet from Moulavibazar. Their bus was late, so I reached there before them. In two days, we visited Lovachora, Dibir Hor, and Lalakhal. Among these places, I had visited Lalakhal before, but with the right company, travel is always fun.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1707486696693/2666f0de-b115-497b-a67c-a4446c64871e.jpeg" alt class="image--center mx-auto" /></p>
<p>It was a great memory, especially finding stories while running the Rajkandi Hill 25K and visiting Lovachora.</p>
]]></content:encoded></item><item><title><![CDATA[Exploring the System Design of a Q&A Site]]></title><description><![CDATA[As the digital landscape evolves, the demand for robust question-and-answer platforms continues to rise. Understanding the underlying architecture of such platforms, like Quora, is essential for engineers and developers aiming to create scalable and ...]]></description><link>https://blog.shams-nahid.com/exploring-the-system-design-of-a-qa-site</link><guid isPermaLink="true">https://blog.shams-nahid.com/exploring-the-system-design-of-a-qa-site</guid><category><![CDATA[System Architecture]]></category><category><![CDATA[System Design]]></category><category><![CDATA[high level design]]></category><category><![CDATA[distributed system]]></category><category><![CDATA[architecture]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Wed, 07 Feb 2024 07:48:39 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1707292061127/0a50c781-0c71-4b08-becf-691dfdfd8c23.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>As the digital landscape evolves, the demand for robust question-and-answer platforms continues to rise. Understanding the underlying architecture of such platforms, like Quora, is essential for engineers and developers aiming to create scalable and efficient systems. In this exploration, we dissect the functional and non-functional requirements, building blocks, workflow, and potential limitations of a Q&amp;A site.</p>
<h2 id="heading-functional-requirements"><strong>Functional Requirements</strong></h2>
<p>When designing a Q&amp;A site, we only consider the following features and also ensure that, in the future, we can extend the features.</p>
<ul>
<li><p>Questions and answers functionality</p>
</li>
<li><p>Commenting to the questions along with upvote and downvote capabilities</p>
</li>
<li><p>Recommendation system for personalized home feeds and advertising</p>
</li>
<li><p>Ranking mechanism for answers</p>
</li>
</ul>
<h2 id="heading-non-functional-requirements"><strong>Non Functional Requirements</strong></h2>
<p>The site should have the following characteristics due to the large number of users all over the world,</p>
<ul>
<li><p><strong>Scalability:</strong> The architecture should accommodate additional features and support a growing user base seamlessly.</p>
</li>
<li><p><strong>Consistency:</strong> The questions and answers should be consistent with any set of users. This does not imply, that the newly added Q&amp;A should be available to all the users right away.</p>
</li>
<li><p><strong>Availability:</strong> The system should be highly available. It should handle a large number of concurrent requests and also be able to perform in case of a few server failures.</p>
</li>
<li><p><strong>Performance:</strong> The system should serve the user without noticeable delay.</p>
</li>
</ul>
<h2 id="heading-resource-estimation"><strong>Resource Estimation</strong></h2>
<p>Consider 300 million active users. Each user will make 20 requests per day. With these assumptions, we are going to calculate the,</p>
<ul>
<li><p>Number of servers</p>
</li>
<li><p>Storage size that includes database and blob storage</p>
</li>
<li><p>Network bandwidth</p>
</li>
</ul>
<h3 id="heading-servers">Servers</h3>
<ul>
<li><p>Each server can handle 8000 requests per second</p>
</li>
<li><p>Total request per day, TOTAL_REQUEST_PER_DAY = (3x10^6) * 20</p>
</li>
<li><p>Requests per second, TOTAL_REQUEST_PER_SECOND = (TOTAL_REQUEST_PER_DAY) / (24 <em>60</em> 60)</p>
</li>
<li><p>Number of servers required (TOTAL_REQUEST_PER_SECOND / 8000)</p>
</li>
</ul>
<h3 id="heading-storage">Storage</h3>
<ul>
<li><p>15% Q&amp;A will have the image</p>
</li>
<li><p>5% Q&amp;A will have video</p>
</li>
<li><p>For a Q&amp;A there will be either an image or video or nothing. Both video and image can not be in a single Q&amp;A</p>
</li>
<li><p>Consider 1 question from each active user</p>
</li>
<li><p>Two responses from each question</p>
</li>
</ul>
<p><strong>Calculate the storage</strong></p>
<p>Let's assume</p>
<ul>
<li><p>Each image size is 250 KB</p>
</li>
<li><p>Each video size is 5 MB</p>
</li>
<li><p>Text content and metadata regarding a question is 100 KB</p>
</li>
</ul>
<p><strong>Image Storage</strong></p>
<ul>
<li><p>15% of total Q&amp;A has image</p>
</li>
<li><p>Size 15% of 300 Million * 250 KB = ~ 11 TB</p>
</li>
</ul>
<p><strong>Video Storage</strong></p>
<ul>
<li><p>5% of total Q&amp;A has video</p>
</li>
<li><p>Size (5% of 300 Million) * 5 MB = ~75 TB</p>
</li>
</ul>
<p><strong>Text Content</strong></p>
<ul>
<li><p>1 Q&amp;A per active user</p>
</li>
<li><p>Total 300 million active user</p>
</li>
<li><p>Each Q&amp;A has an estimated of 100 KB textual content and metadata</p>
</li>
<li><p>Total 30 TB</p>
</li>
</ul>
<p>Each of the day, we will require 11 + 75 + 30 = ~116 TB of storage</p>
<h3 id="heading-bandwidth"><strong>Bandwidth</strong></h3>
<p><strong>Incoming Bandwidth</strong></p>
<ul>
<li><p>we will send 116 TB = (116 * 8) GB data per day</p>
</li>
<li><p>Bandwidth per second (116 * 8) / (24 hours in seconds) ~ 11 Gb/s</p>
</li>
</ul>
<p><strong>Outgoing Bandwidth</strong></p>
<ul>
<li><p>Consider 300 million active user</p>
</li>
<li><p>Consider each user sees 20 questions each day</p>
<ul>
<li><p>300 million * 20 Q&amp;A, each Q&amp;A has 100 KB of textual and metadata</p>
</li>
<li><p>~600 TB</p>
</li>
</ul>
</li>
<li><p>Consider that 15% of Q&amp;A has an image</p>
<ul>
<li><p>300 million active user</p>
</li>
<li><p>Each user fetches 20 Q&amp;A</p>
</li>
<li><p>15% of this Q&amp;A have an image</p>
</li>
<li><p>Each image has a size of 250 KB</p>
</li>
<li><p>~225 TB</p>
</li>
</ul>
</li>
<li><p>Consider 5% of Q&amp;A has video</p>
<ul>
<li><p>300 million active user</p>
</li>
<li><p>Each user fetches 20 Q&amp;A</p>
</li>
<li><p>5% of these images have video</p>
</li>
<li><p>Each video has a size of 5 MB</p>
</li>
<li><p>~1500 TB</p>
</li>
</ul>
</li>
<li><p>Now total size of data: 600 + 225 + 1500 = 2325 TB ~ 2500 TB ~ 2500000 GB ~ 20000000 Gb</p>
</li>
<li><p>Outgoing bandwidth 20000000 / (24 hours in seconds) = 231 Gb/s</p>
</li>
</ul>
<h2 id="heading-building-blocks"><strong>Building Blocks</strong></h2>
<ul>
<li><p>Load Balancer: Distribute traffic between servers and services</p>
</li>
<li><p>Database: Store textual content in the DB</p>
</li>
<li><p>Distributed Caching: Schedule tasks and reduce loads to db and services</p>
</li>
<li><p>Blob Store: Store the images and videos</p>
</li>
</ul>
<p><strong>Web and Application Server</strong></p>
<ul>
<li><p>To handle requests</p>
<ul>
<li><p>web server for the manager processes</p>
</li>
<li><p>application server for the worker process</p>
</li>
</ul>
</li>
<li><p>Application servers maintain an in-memory queue to process different user requests</p>
</li>
<li><p>A router library between the web and application server</p>
</li>
<li><p>Manager process enqueued the tasks</p>
</li>
<li><p>Application process dequeued the tasks</p>
</li>
</ul>
<p><strong>Data Stores</strong></p>
<ul>
<li><p>A relational database MySQL for storing Q&amp;A and comments, as it has a high level of consistency</p>
</li>
<li><p>An hBase to store metadata as it has a very high throughput in storing and retrieving data. Use these</p>
</li>
<li><p>Stats for recommendation later</p>
</li>
<li><p>Blob storage for the images and videos</p>
</li>
</ul>
<p><strong>Distributed Cache</strong></p>
<ul>
<li><p>memcacheD for critical data caching</p>
</li>
<li><p>Redis for upvote type data as it has in-store increment</p>
</li>
<li><p>CDN for serving images and videos</p>
</li>
</ul>
<p><strong>Computer Servers</strong></p>
<ul>
<li><p>For recommendation engine or ranking</p>
</li>
<li><p>The process will be online and offline</p>
</li>
<li><p>Probably running some ML operations</p>
</li>
<li><p>May have lots of memory and high processing power</p>
</li>
</ul>
<h2 id="heading-workflow"><strong>Workflow</strong></h2>
<p><strong>Posting Q&amp;A and comments</strong></p>
<ul>
<li><p>The web server receives the request and passes it to the application server</p>
</li>
<li><p>Web servers also manipulate the web page like the request is in progress</p>
</li>
<li><p>The worker process will manipulate the database, ex: fetch or save data</p>
</li>
<li><p>The task will be prioritized by different queue</p>
<ul>
<li><p>User requests will be served earlier</p>
</li>
<li><p>The weekly digest will have less priority</p>
</li>
</ul>
</li>
<li><p>Images and videos will be stored in the blob storage</p>
</li>
<li><p>The answer ranking system will rank the answers based on upvotes, views, dates, and some other properties. An ML engine will back it up.</p>
</li>
<li><p>Extract and store metadata of answers, comments, images, and videos in hBase and feed these metadata to ML and rank offline</p>
</li>
</ul>
<p><strong>Recommendation System</strong></p>
<ul>
<li><p>Run both online and offline, used for</p>
<ul>
<li><p>User feed</p>
</li>
<li><p>Find duplicate</p>
</li>
<li><p>Generate add</p>
</li>
</ul>
</li>
</ul>
<p><strong>Search</strong></p>
<ul>
<li><p>Build index and store in DB and keep frequently used in hBase</p>
</li>
<li><p>Make an index by tokenizing from Q&amp;A, level, and comments</p>
</li>
</ul>
<h2 id="heading-limitations"><strong>Limitations</strong></h2>
<p><strong>Latencies of web and application servers:</strong> Latency of web and application servers communications.</p>
<p><strong>In Memory Queue Failure:</strong> Tasks are queued in the queue. If a queue is failed, a lot of manual engineering will be required. Replicating the queue can be a solution but it will require extra memory. Tasks like view count should not hamper comparatively more important tasks like saving answers or questions.</p>
<p><strong>MySQL QPS:</strong> Since we offer a lot of services, it is possible to encounter a lot of queries in our MySQL server. This will result in a huge latency in getting the query results.</p>
<p><strong>HBase Latency:</strong> Although the HBase has a high throughput, it has slow latency. On top of that, since, we rely on the ML, at one point, it will have a poor performance.</p>
<h2 id="heading-adjustment-for-the-mentioned-limitations"><strong>Adjustment for the mentioned limitations</strong></h2>
<p><strong>Latencies of web and application servers:</strong> Using a service host. A large powerful machine to handle all web and application processes at once in a single place.</p>
<p><strong>In Memory Queue Failure:</strong> Use Kafka instead.</p>
<p><strong>MySQL QPS:</strong> Use vertical sharding. If there are joins involved between two tables, put them in the same shard.</p>
<p><strong>hBase Latency:</strong> Use MyRocks instead. Allows improved latency and data transfer tools between RocksDB and MySQL.</p>
<h2 id="heading-conclusion"><strong>Conclusion</strong></h2>
<p>Understanding the intricate system design of a Q/A site like Quora offers invaluable insights into creating scalable, efficient, and reliable platforms in the digital age. By addressing functional and non-functional requirements, designing robust building blocks, establishing efficient workflows, and implementing mitigation strategies for potential limitations, developers can craft high-performance systems capable of meeting the demands of millions of users worldwide.</p>
]]></content:encoded></item><item><title><![CDATA[The Dhaka Marathon 2024]]></title><description><![CDATA[In Bangladesh, the prevalence of full marathons is a rarity. Running events predominantly feature half marathons, with occasional ultra marathons sprinkled throughout the year. One event that stands out in this landscape is the Dhaka Marathon, organi...]]></description><link>https://blog.shams-nahid.com/the-dhaka-marathon-2024</link><guid isPermaLink="true">https://blog.shams-nahid.com/the-dhaka-marathon-2024</guid><category><![CDATA[running]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[Marathon]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Mon, 29 Jan 2024 13:07:44 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1706533406541/7600c2c5-5d57-492a-b1dc-da0ed3b2d7c0.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>In Bangladesh, the prevalence of full marathons is a rarity. Running events predominantly feature half marathons, with occasional ultra marathons sprinkled throughout the year. One event that stands out in this landscape is the Dhaka Marathon, organized by the Bangladesh Military and attracting elite runners from across the globe.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1706533474137/89dec898-4fd1-473b-8200-d9099c1a274e.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-from-ultra-to-dhaka-marathon">From Ultra to Dhaka Marathon</h3>
<p>Just a week prior to the Dhaka Marathon, I undertook the daunting challenge of a 50 KM Ultra Marathon. Acknowledging the limited recovery time between these two demanding races, I faced the dilemma of participating in both. The Marine Drive Ultra Marathon, a prestigious event in Bangladesh, presented an opportunity I couldn't ignore.</p>
<p>Despite the physical toll of the Ultra Marathon, the allure of the Dhaka Marathon was too strong to resist. With a mere week between the two events, I carefully gauged my fitness. Feeling surprisingly good after the Ultra, I made the decision to take on the Dhaka Marathon, fully aware of the challenges that lay ahead.</p>
<h3 id="heading-the-dhaka-marathon-experience">The Dhaka Marathon Experience</h3>
<p>The Dhaka Marathon, renowned for its punctuality, commenced at 5:15 AM amidst the speeches of esteemed guests. The initial kilometers were invigorating, with the absence of scorching sunlight. However, the race presented its own challenges, including heavy winds that added an element of discomfort.</p>
<p>The first 20 KM of the race were filled with camaraderie as fellow runners cheered each other on. As the race progressed, energy began to wane, and temperatures soared. With a strategic plan in mind, I aimed to run until the 32 KM mark and then adopt a walking pace. Preserving energy was crucial, as another challenging event awaited—a 25 KM run in a reserve forest the following week.</p>
<p>Executing my plan, I walked the final 10 KM, completing the marathon in 5 hours and 35 minutes. Despite the inevitable fatigue, the sense of accomplishment overshadowed any minor injuries. The pain under my left foot was a testament to the challenges faced and overcome.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1706612955260/69b7bfe4-d73b-41a7-b679-0614a5b27be7.jpeg" alt class="image--center mx-auto" /></p>
<h3 id="heading-post-race-reflections">Post-Race Reflections</h3>
<p>After crossing the finish line, I joined fellow runners, exchanged stories, and collected my well-deserved medal and refreshments. The post-race moments, captured in group photos, serve as lasting memories of conquering a remarkable long-distance running challenge.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1706612944912/3866aedc-924b-44f4-bd89-1a977b48ed67.jpeg" alt class="image--center mx-auto" /></p>
<p>Embark on a journey through the unique landscape of long-distance running in Bangladesh, as I navigate the challenges of back-to-back marathons, sharing the highs and lows of conquering extraordinary distances.</p>
]]></content:encoded></item><item><title><![CDATA[Conquering Ultra Marathon: I'M NOT SURPRISED ...]]></title><description><![CDATA[The Marine Ultra Marathon stands as one of Bangladesh's most prestigious running events, offering three challenging distances of 50 KM, 100 KM, and 161 KM. Having never participated in an ultra marathon before, I opted for the 50 KM distance. While t...]]></description><link>https://blog.shams-nahid.com/conquering-ultra-marathon-im-not-surprised</link><guid isPermaLink="true">https://blog.shams-nahid.com/conquering-ultra-marathon-im-not-surprised</guid><category><![CDATA[ultra marathon]]></category><category><![CDATA[bangladesh]]></category><category><![CDATA[running]]></category><category><![CDATA[Travel]]></category><category><![CDATA[Coxbazar]]></category><category><![CDATA[Marathon]]></category><dc:creator><![CDATA[Shams Nahid]]></dc:creator><pubDate>Sun, 21 Jan 2024 05:32:20 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1705814858951/3d6962fa-0f2b-4279-b87b-a7e3dd80e6b1.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>The Marine Ultra Marathon stands as one of Bangladesh's most prestigious running events, offering three challenging distances of 50 KM, 100 KM, and 161 KM. Having never participated in an ultra marathon before, I opted for the 50 KM distance. While the event demands significant preparation, the journey to participate proved to be a unique and rewarding experience.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1705814897267/5a1e6207-5fee-432c-9ab3-49ba999480cb.jpeg" alt class="image--center mx-auto" /></p>
<p><strong>Preparation Challenges:</strong></p>
<p>Participation in the Marine Ultra Marathon requires participants to meet rigorous prerequisites, including completing at least four half marathons in the four months leading up to the event. Despite my reluctance to adopt modern tracking apps like Strava, I successfully navigated these requirements by providing detailed documentation, certificates, and personal motivation in the application form.</p>
<p><strong>Countdown to Race Day:</strong></p>
<p>In the week leading up to the marathon, I pushed my limits with an almost 50 KM run and an eight-hour regular workout regimen. The logistical challenges were not to be underestimated, involving a 600 KM journey by bus and train. The pressure mounted, and sleep eluded me the night before the race.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1705814879560/57ca2132-582c-40eb-a064-c3ee473c9131.jpeg" alt class="image--center mx-auto" /></p>
<p><strong>The Marathon Journey:</strong></p>
<p>Once the race commenced, the pre-race anxieties dissipated, and my focus shifted solely to the next steps. Unlike my usual strategy of adhering to a strict time frame per kilometer, this time I adopted a more intuitive approach – it was not a strategy, just running until I was alive and facing no major injury. Hydration stations every 5 KM became my lifeline, with brief 1-2 minute breaks to refuel. Surprisingly, an abundance of chocolate, water, saline, glucose, biscuits, and fruits provided the sustenance needed for the miles ahead.</p>
<p><strong>The Challenge Unfolds:</strong></p>
<p>The initial 25 KM unfolded seamlessly, but the true test began as my body entered uncharted territory. I always knew that after 20 KM, my energy started to drain linearly. However, after 30 KM, I discovered that it started to drain exponentially. Between 30 and 40 KM, running and walking sustained me. However, the last 10 KM proved to be a monumental struggle, with every bone and joint seemingly at its breaking point. Despite the physical toll, I pressed on, determined to reach the 50 KM mark before the cut-off time.</p>
<p><strong>Triumph at the Finish Line:</strong></p>
<p>After a grueling 7 and a half hours, I crossed the finish line. The overwhelming joy and sense of accomplishment brought tears to my eyes. The cheers of children and the celebratory atmosphere marked the culmination of a test of endurance at its peak.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1705814920908/56971e90-e4d2-4dad-96d6-6dad61052f37.jpeg" alt class="image--center mx-auto" /></p>
<p><strong>Post-Marathon Reflection:</strong></p>
<p>The undeniable toll on my body quickly altered post-run plans for a relaxing island visit. Despite the initial intention to get a massage, the fatigue was so profound that even walking 200 meters became a daunting task. I spent a few hours recuperating, had lunch, and made the journey back to Dhaka that same night. Like always, I took the same bus, at the same time while returning to Dhaka, It has a special 360-degree view (not exactly!). It was special, because, I took this bus for the 4th time in a row in the last 4 months.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1705815019295/6ca72b42-331b-413c-b1b9-7348938570fa.jpeg" alt class="image--center mx-auto" /></p>
<p>The Marine Ultra Marathon was not just a race but a profound journey that tested my physical and mental resilience. Overcoming challenges, embracing the unknown, and triumphing at the finish line made it an experience worth every step.</p>
]]></content:encoded></item></channel></rss>