<?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[Haseeb AI Blog]]></title><description><![CDATA[Technical insights on production RAG systems, AI agents, LLM pipelines, and building AI that ships to production. By Muhammad Haseeb — Freelance AI & Backend Engineer specializing in Agentic RAG, chatbots, and voice agents.]]></description><link>https://blog.haseebai.tech</link><image><url>https://cdn.hashnode.com/res/hashnode/image/upload/v1654328978561/HdJ1nL4lV.png</url><title>Haseeb AI Blog</title><link>https://blog.haseebai.tech</link></image><generator>RSS for Node</generator><lastBuildDate>Sat, 11 Apr 2026 14:55:36 GMT</lastBuildDate><atom:link href="https://blog.haseebai.tech/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[Unlock the Power of Keras Callbacks!]]></title><description><![CDATA[Machine learning/Deep Learning, with its ever-evolving algorithms and complex models, has evolved into a powerful tool in the hands of Data Scientists and AI practitioners. The process of training a Deep Learning model is intricate and often unpredic...]]></description><link>https://blog.haseebai.tech/unlock-the-power-of-keras-callbacks</link><guid isPermaLink="true">https://blog.haseebai.tech/unlock-the-power-of-keras-callbacks</guid><category><![CDATA[keras]]></category><category><![CDATA[Machine Learning]]></category><category><![CDATA[callback functions]]></category><category><![CDATA[Python]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Thu, 09 Nov 2023 13:45:03 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1699537179565/784508c7-162f-4305-a4de-a0a86f3a2a25.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Machine learning/Deep Learning, with its ever-evolving algorithms and complex models, has evolved into a powerful tool in the hands of Data Scientists and AI practitioners. The process of training a Deep Learning model is intricate and often unpredictable. It requires careful tuning and monitoring. Sometimes we set some parameters for training the model and end up with the model being overfitted. This is where the callback functions come into play, serving as the secret sauce that empowers us to own our model training game.</p>
<p>In this article, we are going to explore the essential role of callbacks in controlling and optimizing the training of deep learning models, exploring their significance, usage, and how to implement them using Keras. This guide will help you master the art of callbacks and optimize your training process.</p>
<h1 id="heading-understanding-callbacks"><strong>Understanding Callbacks</strong></h1>
<p>Callbacks are a widely used concept in most programming languages. It is a concept of passing functions/methods or pieces of code as an argument to other functions or methods. These functions are intended to be executed at a later time, often in response to a specific event or condition, such as completing a task or handling user interaction.</p>
<p>Callbacks in Deep Learning work on the same principle enabling us to monitor, adapt, and optimize the training process of our models. Keras provides built-in API to their callback object which has some amazing callback methods used for a variety of tasks. They come to the rescue when we need to implement real-time actions based on the model’s performance. The possibilities with callbacks are endless, and they play a pivotal role in ensuring that your Deep Learning model evolves into a powerful asset.</p>
<p>These Callback methods can be passed to Keras methods including <code>fit</code>, <code>evaluate</code>, and <code>predict</code> as a list in order to hook into the various stages of the model training and inference lifecycle.</p>
<pre><code class="lang-python">model.fit(
    train_data, 
    epochs=<span class="hljs-number">2</span>, 
    batch_size=<span class="hljs-number">32</span>,
    callbacks=[early_stopping]
)
</code></pre>
<p>This was a basic introduction to Keras Callbacks, Now let’s dive into these callbacks and their practical implementations.</p>
<p><img src="https://miro.medium.com/v2/resize:fit:700/1*0VqUxIzLeQMLe3oUGDPm8w.png" alt="Keras Callback" /></p>
<h1 id="heading-built-in-callbacks-in-keras"><strong>Built-in Callbacks in Keras</strong></h1>
<p>Keras provides some built-in Callbacks that help to boost the training process. This includes early stopping, Model Checkpoint, and Learning Rate Scheduler. Let's check out all the amazing callbacks from Keras and their usage.</p>
<h2 id="heading-earlystopping"><strong><em>EarlyStopping</em></strong></h2>
<p>One of the most common challenges in training machine learning or deep learning models is overfitting. EarlyStopping is a callback that allows us to address this issue effectively. By monitoring the model’s performance on a validation set, this callback can halt the training process when no improvement is observed, preventing overfitting and saving valuable time and resources.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> EarlyStopping

early_stopping = EarlyStopping(
    monitor=<span class="hljs-string">"val_loss"</span>,
    min_delta=<span class="hljs-number">0</span>,
    patience=<span class="hljs-number">5</span>,
    verbose=<span class="hljs-number">0</span>,
    mode=<span class="hljs-string">"auto"</span>,
    baseline=<span class="hljs-literal">None</span>,
    restore_best_weights=<span class="hljs-literal">False</span>,
    start_from_epoch=<span class="hljs-number">0</span>,
)
</code></pre>
<p><strong>Arguments</strong></p>
<ul>
<li><p><strong>monitor:</strong> This parameter specifies the quantity to be monitored for improvements. It can be metrics like “val_loss,” “val_accuracy,” etc.</p>
</li>
<li><p><strong>min_delta</strong>: Minimum change required in the monitored quantity to be considered for improvement. If the change is less than <code>min_delta</code>, it won’t count as an improvement.</p>
</li>
<li><p><strong>patience</strong>: The number of epochs with no improvement after which training will be stopped. For instance, if <code>patience=5,</code> training will stop if there is no improvement for 5 consecutive epochs.</p>
</li>
<li><p><strong>verbose</strong>: It controls the verbosity mode. Use <code>0</code> for silent mode, which means no messages are displayed. Set it to <code>1</code> for mode where messages are displayed when the callback takes action.</p>
</li>
<li><p><strong>mode</strong>:<code>{"auto", "min", "max"}</code>. In <code>min</code> mode, training stops when the monitored quantity stops decreasing; In <code>"max"</code> mode, it stops when the monitored quantity stops increasing; In <code>"auto"</code> mode, the direction is automatically determined based on the name of the monitored metric.</p>
</li>
<li><p><strong>baseline</strong>: Baseline value for the monitored quantity. Training will stop if the model doesn’t show improvement over this baseline.</p>
</li>
<li><p><strong>restore_best_weights</strong>: When set to True, it restores model weights from the epoch with the best value of the monitored quantity. If set to False, the model uses weights obtained at the last step of training, regardless of performance relative to the <code>baseline</code>.</p>
</li>
<li><p><strong>start_from_epoch</strong>: This parameter allows you to specify the number of warm-up epochs before monitoring for improvement. During this period, no improvement is expected, and training won’t be stopped.</p>
</li>
</ul>
<h2 id="heading-modelcheckpoint"><strong><em>ModelCheckpoint</em></strong></h2>
<p>Saving the model’s weights at regular intervals is crucial to ensure that your progress is not lost. ModelCheckpoint comes to the rescue by saving the model’s weights in a structured manner. This allows you to resume training from where you left off, ensuring continuity in your Deep Learning journey.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> ModelCheckpoint 

model_checkpoint = ModelCheckpoint(
    filepath,
    monitor: <span class="hljs-string">"val_loss"</span>,
    verbose: <span class="hljs-number">0</span>,
    save_best_only: <span class="hljs-literal">False</span>,
    save_weights_only: <span class="hljs-literal">False</span>,
    mode: <span class="hljs-string">"auto"</span>,
    save_freq=<span class="hljs-string">"epoch"</span>,
    options=<span class="hljs-literal">None</span>,
    initial_value_threshold=<span class="hljs-literal">None</span>,
    **kwargs
)
</code></pre>
<p><strong>Arguments</strong></p>
<ul>
<li><p><strong>filepath</strong>: file path to save the model weights.</p>
</li>
<li><p><strong>monitor</strong>: This parameter specifies the quantity to be monitored for improvements. It can be metrics like “val_loss,” “val_accuracy,” etc.</p>
</li>
<li><p><strong>verbose</strong>: Controls the verbosity mode. Use 0 for silent, and 1 for displaying messages when the callback takes action.</p>
</li>
<li><p><strong>save_best_only</strong>: For <code>True</code>, the callback saves only the best model (based on the monitored quantity). If set <code>False</code>, it saves the model at every checkpoint according to the specified frequency.</p>
</li>
<li><p><strong>save_weights_only</strong>: For <code>True</code>, it saves only the model’s weights. If set to <code>False</code>, it saves the entire model.</p>
</li>
<li><p><strong>mode</strong>:<code>{"auto", "min", "max"}</code>. In <code>min</code> mode, training stops when the monitored quantity stops decreasing; In <code>"max"</code> mode, it stops when the monitored quantity stops increasing; In <code>"auto"</code> mode, the direction is automatically determined based on the name of the monitored metric.</p>
</li>
<li><p><strong>save_freq</strong>: Determines how often to save the model. It can be set to “epoch” (saves at the end of each epoch) or an integer value (saves every <code>n</code> batches or steps).</p>
</li>
<li><p><strong>options</strong>: Additional options for saving the model, such as compression options.</p>
</li>
<li><p><strong>initial_value_threshold</strong>: To skip some initial epochs based on some initial value for monitored quantity, so as to save the model when the monitored quantity when threshold exceeds</p>
</li>
<li><p><strong>**kwargs</strong>: Additional keyword arguments that are passed to the underlying object for backward compatibility.</p>
</li>
</ul>
<h2 id="heading-tensorboard"><strong><em>TensorBoard</em></strong></h2>
<p>Visualization is key to understanding your model’s behavior. TensorBoardCallback helps you create visual representations of training progress. By monitoring metrics like loss and accuracy, you can spot issues and optimize your model training effectively.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> TensorBoard 

tensorboard_callback = TensorBoard(
    log_dir=<span class="hljs-string">"logs"</span>,
    histogram_freq=<span class="hljs-number">0</span>,
    write_graph=<span class="hljs-literal">True</span>,
    write_images=<span class="hljs-literal">False</span>,
    write_steps_per_second=<span class="hljs-literal">False</span>,
    update_freq=<span class="hljs-string">"epoch"</span>,
    profile_batch=<span class="hljs-number">0</span>,
    embeddings_freq=<span class="hljs-number">0</span>,
    embeddings_metadata=<span class="hljs-literal">None</span>,
    **kwargs
)
</code></pre>
<p><strong>Arguments</strong></p>
<ul>
<li><p><strong>log_dir:</strong> Path to the directory where the TensorBoard logs will be saved</p>
</li>
<li><p><strong>histogram_freq:</strong> It controls how frequently histograms of your tensors are computed for visualization. Set to 0 for no histograms or a positive integer to define the frequency.</p>
</li>
<li><p><strong>write_graph:</strong> <code>True</code>, saves the computation graph for visualization in TensorBoard.</p>
</li>
<li><p><strong>write_image:</strong> <code>True</code>, save images like model architecture graphs and feature maps.<code>False</code>, these images won't be saved.</p>
</li>
<li><p><strong>write_steps_per_second:</strong> <code>True</code>, records the number of steps per second, giving you insights into training speed. Useful for performance monitoring.</p>
</li>
<li><p><strong>update_freq:</strong> Determines how often the logs are updated. It can be set to "epoch" (updating once per epoch) or a positive integer for a different frequency.</p>
</li>
<li><p><strong>profile_batch:</strong> allows you to profile the performance of your model. Setting 0 will disable profiling, while a positive integer specifies the batch to profile.</p>
</li>
<li><p><strong>embeddings_freq:</strong> Set to a positive integer to determine how frequently the embeddings are computed and visualized.</p>
</li>
<li><p><strong>embeddings_metadata:</strong> A file path to metadata that describes your embeddings, providing context for visualization.</p>
</li>
<li><p><strong>**kwargs</strong>: Additional keyword arguments that are passed to the underlying object for backward compatibility.</p>
</li>
</ul>
<h2 id="heading-reducelronplateau"><strong><em>ReduceLROnPlateau</em></strong></h2>
<p>Learning rate optimization is a critical aspect of training deep learning models. ReduceLROnPlateau automatically adjusts the learning rate when the validation loss plateaus. This dynamic adaptation ensures your model converges efficiently.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> ReduceLROnPlateau 

reduce_lr = ReduceLROnPlateau(
    monitor=<span class="hljs-string">"val_loss"</span>,
    factor=<span class="hljs-number">0.1</span>,
    patience=<span class="hljs-number">10</span>,
    verbose=<span class="hljs-number">0</span>,
    mode=<span class="hljs-string">"auto"</span>,
    min_delta=<span class="hljs-number">0.0001</span>,
    cooldown=<span class="hljs-number">0</span>,
    min_lr=<span class="hljs-number">0</span>,
    **kwargs
)
</code></pre>
<p><strong>Arguments</strong></p>
<ul>
<li><p><strong>monitor</strong>: This parameter specifies the quantity to be monitored for learning rate reduction. It can be metrics like “val_loss,” “val_accuracy,” etc.</p>
</li>
<li><p><strong>factor:</strong> The factor by which the learning rate will be reduced. For example, if is set to 0.1, the learning rate will be reduced to 10% of its current value when the condition is met.</p>
</li>
<li><p><strong>patience</strong>: The number of epochs with no improvement after which the learning rate will be reduced.</p>
</li>
<li><p><strong>verbose</strong>: Controls the verbosity mode. Use 0 for silent, and 1 for displaying messages when the callback takes action.</p>
</li>
<li><p><strong>mode</strong>:<code>{"auto", "min", "max"}</code>. In <code>min</code> mode, training stops when the monitored quantity stops decreasing; In <code>"max"</code> mode, it stops when the monitored quantity stops increasing; In <code>"auto"</code> mode, the direction is automatically determined based on the name of the monitored metric.</p>
</li>
<li><p><strong>min_delta</strong>: Minimum change required in the monitored quantity to be considered for improvement. If the change is less than <code>min_delta</code>, it won’t count as an improvement.</p>
</li>
<li><p><strong>cooldown:</strong> The No. of epochs to wait after a learning rate reduction before resuming normal monitoring. During this “cooldown” period, learning rate changes won’t occur.</p>
</li>
<li><p><strong>min_lr:</strong> The lower limit on the learning rate. If the learning rate falls below this value, it won’t be reduced further.</p>
</li>
<li><p><strong>**kwargs</strong>: Additional keyword arguments that are passed to the underlying object for backward compatibility.</p>
</li>
</ul>
<h2 id="heading-learningratescheduler"><strong><em>LearningRateScheduler</em></strong></h2>
<p>Sometimes, standard learning rate schedules may not be suitable for your specific problem. LearningRateScheduler gives you the flexibility to craft custom learning rate schedules tailored to your model’s needs.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> LearningRateScheduler

<span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">custom_schedule</span>(<span class="hljs-params">epoch</span>):</span>
    <span class="hljs-keyword">if</span> epoch &lt; <span class="hljs-number">10</span>:
        <span class="hljs-keyword">return</span> <span class="hljs-number">0.001</span>
    <span class="hljs-keyword">else</span>:
        <span class="hljs-keyword">return</span> <span class="hljs-number">0.0001</span>

lr_scheduler = LearningRateScheduler(custom_schedule)
</code></pre>
<p><strong>Arguments</strong></p>
<ul>
<li><p><strong>schedule:</strong> A custom function with the user-defined rule that takes an epoch index (integer) and current learning rate (float) as parameters and returns the new learning rate.</p>
</li>
<li><p><strong>verbose</strong>: Controls the verbosity mode. Use 0 for silent, and 1 for displaying messages when the callback takes action.</p>
</li>
</ul>
<h2 id="heading-terminateonnan"><strong><em>TerminateOnNaN</em></strong></h2>
<p>It’s crucial to maintain data integrity during training. TerminateOnNaN is a simple yet effective callback that stops training if NaN values appear in your model’s outputs, acting as a data guardian to keep your training on track.</p>
<pre><code class="lang-python"><span class="hljs-keyword">from</span> keras.callbacks <span class="hljs-keyword">import</span> TerminateOnNaN

terminate_on_nan = TerminateOnNaN()
</code></pre>
<h1 id="heading-creating-custom-callbacks"><strong>Creating Custom Callbacks</strong></h1>
<p>While pre-built callbacks are incredibly useful, there are situations where you might need a callback tailored to your specific needs. Fortunately, Keras provides a straightforward way to create custom callbacks. Keras has an Abstract base class that can be used to build new callbacks. This base class is parent to each callback method in Keras.</p>
<pre><code class="lang-python">keras.callbacks.Callback()
</code></pre>
<p>Let’s dive into how you can do it:</p>
<p><strong>Step 1: Define Your Custom Callback Class</strong></p>
<p>You can create a custom callback by defining a Python class that inherits the Keras base class. This class should include methods for the events you want to monitor and customize.</p>
<p>Here’s a basic structure to get you started:</p>
<pre><code class="lang-python"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">CustomCallback</span>(<span class="hljs-params">keras.callbacks.Callback</span>):</span>
    <span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">on_train_begin</span>(<span class="hljs-params">self, logs=None</span>):</span>
        <span class="hljs-comment"># Called at the beginning of training</span>
        <span class="hljs-keyword">pass</span>
    <span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">on_epoch_end</span>(<span class="hljs-params">self, epoch, logs=None</span>):</span>
        <span class="hljs-comment"># Called at the end of each epoch</span>
        <span class="hljs-keyword">pass</span>    <span class="hljs-comment"># You can add more event-specific methods here</span>
</code></pre>
<p><strong>Step 2: Implement Your Callback Logic</strong></p>
<p>Within your custom callback class, you can implement your specific logic for each callback event. For example, you might want to save the model’s weights at the end of every epoch. Here’s how you can achieve this:</p>
<pre><code class="lang-python"><span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">CustomCallback</span>(<span class="hljs-params">keras.callbacks.Callback</span>):</span>
    <span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">on_epoch_end</span>(<span class="hljs-params">self, epoch, logs=None</span>):</span>
        model.save_weights(<span class="hljs-string">f"model_weights_epoch_<span class="hljs-subst">{epoch}</span>.h5"</span>)
</code></pre>
<p>This code will save the model’s weights to a file at the end of each epoch.</p>
<p><strong>Step 3: Incorporate Your Custom Callback</strong></p>
<p>Once you’ve defined your custom callback, you can use it by passing an instance of your class to the callback parameter when fitting your model. For example:</p>
<pre><code class="lang-python">model.fit(
    x_train, y_train,
    batch_size=<span class="hljs-number">32</span>, epochs=<span class="hljs-number">10</span>,
    callbacks=[CustomCallback()]
)
</code></pre>
<p>Your custom callback will now be executed during training, and you can tailor it to perform actions that suit your project’s needs.</p>
<p>Creating custom callbacks gives you the flexibility to track and manipulate various aspects of the training process, making it a powerful tool in your deep learning toolkit.</p>
<p>You have seen several Keras callback methods for different tasks. These callback methods will boost your training process, saving time and resources. So, what are you waiting for? Start implementing these powerful Keras callbacks in your projects and witness the transformation of your deep learning journey. Your AI-powered solutions are just a callback away from greatness!</p>
]]></content:encoded></item><item><title><![CDATA[How to use Picture Tag for Responsive and Optimized Front End Design]]></title><description><![CDATA[What is a picture tag and how to use it for Responsive Design
The HTML5 element <picture> tag is intended to provide more flexible and highly functional responsive image. Rather than loading a single image and adjusting it to match all potential view...]]></description><link>https://blog.haseebai.tech/how-to-use-picture-tag-for-responsive-and-optimized-front-end-design</link><guid isPermaLink="true">https://blog.haseebai.tech/how-to-use-picture-tag-for-responsive-and-optimized-front-end-design</guid><category><![CDATA[HTML5]]></category><category><![CDATA[Responsive Web Design]]></category><category><![CDATA[Web Design]]></category><category><![CDATA[Web Development]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Wed, 06 Jul 2022 06:27:23 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1656749680505/xHqaN0utG.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h1 id="heading-what-is-a-picture-tag-and-how-to-use-it-for-responsive-design">What is a picture tag and how to use it for Responsive Design</h1>
<p>The HTML5 element <b>&lt;picture&gt; tag</b> is intended to provide more flexible and highly functional responsive image. Rather than loading a single image and adjusting it to match all potential viewport widths and layouts, the picture element loads multiple images of varying sizes and resolutions, selecting the best fit for various scenarios. </p>
<p>The picture tag can have "source" attributes and one img attribute to provide an alternative copy of a picture for various browsers and displays. The browser will evaluate each child's &lt;source&gt; element and select the best match from among them. If no matches are discovered, or if the browser does not support the &lt;picture&gt; element, the URL specified in the &lt;img&gt; element's src property is used. The selected picture is then shown in the &lt;img&gt; element's area.</p>
<p>Let's see an example</p>
<pre><code><span class="hljs-operator">&lt;</span>picture<span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source media<span class="hljs-operator">=</span><span class="hljs-string">"(min-width:769px)"</span> srcset<span class="hljs-operator">=</span><span class="hljs-string">"img-medium.png"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source media<span class="hljs-operator">=</span><span class="hljs-string">"(min-width:465px)"</span> srcset<span class="hljs-operator">=</span><span class="hljs-string">"img-small.png"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>img src<span class="hljs-operator">=</span><span class="hljs-string">"img.jpg"</span> alt<span class="hljs-operator">=</span><span class="hljs-string">"Flowers"</span> style<span class="hljs-operator">=</span><span class="hljs-string">"width:auto;"</span><span class="hljs-operator">&gt;</span>
<span class="hljs-operator">&lt;</span><span class="hljs-operator">/</span>picture<span class="hljs-operator">&gt;</span>
</code></pre><p>srcset, media, and other basic characteristics of each &lt;source&gt; element in the picture tag are analyzed by the browser and find the best compatible picture for the current layout and capabilities of the display device. The picture tag helps us to select and choose the best-fit image for different device sizes and browser compatibility. It will help us save bandwidth and will speed up the page load times by loading these best-fit images for the viewer's display. </p>
<h2 id="heading-attributes-of-picture-tag">Attributes of Picture Tag</h2>
<h3 id="heading-1-srcset">1. srcset</h3>
<p>The srcset attribute is used to provide a list of potential pictures based on their size.
It consists of a list of image descriptions separated by commas. 
Each image descriptor consists of</p>
<ul>
<li>Image URL</li>
<li>Width Descriptor (such as 300w, 500w)</li>
<li>Pixel Density Descriptor (such as 1x, 2x) to deliver a high-resolution picture for high-DPI devices.</li>
</ul>
<pre><code><span class="hljs-operator">&lt;</span>picture<span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"pic.png 768w, pic-1.5x.png 1.5x"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"pic-480.png 480w, pic-480-2x.png 2x"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>img src<span class="hljs-operator">=</span><span class="hljs-string">"pic-320.png"</span><span class="hljs-operator">&gt;</span>
<span class="hljs-operator">&lt;</span><span class="hljs-operator">/</span>picture<span class="hljs-operator">&gt;</span>
</code></pre><h3 id="heading-2-media">2. Media</h3>
<p>For each &lt;source&gt; the element that the user agent will examine, the media attribute specifies a media condition (similar to a media query). If the media condition of the &lt;source&gt; evaluates as false, the browser skips it and moves on to the next element within &lt;picture&gt;.</p>
<pre><code><span class="hljs-operator">&lt;</span>picture<span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"mdn-logo-wide.png"</span> media<span class="hljs-operator">=</span><span class="hljs-string">"(min-width: 600px)"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>img src<span class="hljs-operator">=</span><span class="hljs-string">"mdn-logo-narrow.png"</span> alt<span class="hljs-operator">=</span><span class="hljs-string">"MDN"</span><span class="hljs-operator">&gt;</span>
<span class="hljs-operator">&lt;</span><span class="hljs-operator">/</span>picture<span class="hljs-operator">&gt;</span>
</code></pre><h3 id="heading-3-type">3. Type</h3>
<p>The type attribute specifies a MIME type (Multipurpose Internet Mail Extensions)  for the resource URL(s) in the srcset attribute of the &lt;source&gt;  element. The &lt;source&gt;  element is skipped if the user agent does not support the specified type.
This will help us to load an image with high quality and low size so that the loading speed of the image will be less.</p>
<pre><code><span class="hljs-operator">&lt;</span>picture<span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"pic.png"</span> <span class="hljs-keyword">type</span><span class="hljs-operator">=</span><span class="hljs-string">"image/png"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"pic.avif"</span> <span class="hljs-keyword">type</span><span class="hljs-operator">=</span><span class="hljs-string">"image/avif"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>source srcset<span class="hljs-operator">=</span><span class="hljs-string">"pic.webp"</span> <span class="hljs-keyword">type</span><span class="hljs-operator">=</span><span class="hljs-string">"image/webp"</span><span class="hljs-operator">&gt;</span>
  <span class="hljs-operator">&lt;</span>img src<span class="hljs-operator">=</span><span class="hljs-string">"pic.jpg"</span> alt<span class="hljs-operator">=</span><span class="hljs-string">"photo"</span><span class="hljs-operator">&gt;</span>
<span class="hljs-operator">&lt;</span><span class="hljs-operator">/</span>picture<span class="hljs-operator">&gt;</span>
</code></pre><h2 id="heading-browser-compatibility">Browser Compatibility</h2>
<p>You can check in detail in <a href="https://caniuse.com/?search=picture">caniuse</a></p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1656751208300/up9cHQ2Lq.PNG" alt="Browser support.PNG" /></p>
]]></content:encoded></item><item><title><![CDATA[How to deploy Flask app on Heroku using GitHub]]></title><description><![CDATA[Flask is one of the most popular frameworks for web development when it comes to python. It is small and lightweight, providing valuable tools and features that make web development in python easier. If you're a beginner, try flask as it's flexible a...]]></description><link>https://blog.haseebai.tech/how-to-deploy-flask-app-on-heroku</link><guid isPermaLink="true">https://blog.haseebai.tech/how-to-deploy-flask-app-on-heroku</guid><category><![CDATA[GitHub]]></category><category><![CDATA[Flask Framework]]></category><category><![CDATA[Python]]></category><category><![CDATA[Heroku]]></category><category><![CDATA[Python 3]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Sun, 19 Jun 2022 16:00:01 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1655638625652/8e5rr9P2Y.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Flask is one of the most popular frameworks for web development when it comes to python. It is small and lightweight, providing valuable tools and features that make web development in python easier. If you're a beginner, try flask as it's flexible and more accessible for newbies. here you can create a web app using only a single python file. In this article, we will deploy a simple flask app on Heroku using GitHub.</p>
<h3 id="heading-prerequisites">Prerequisites :</h3>
<ul>
<li>Python</li>
<li>Git</li>
<li>Pip</li>
<li>VSCode (You can use any code editor of your choice)</li>
</ul>
<h2 id="heading-creating-a-simple-flask-app">Creating a Simple Flask App</h2>
<p>Open a folder in your favorite code editor and create a virtual environment using pip in terminal using the command written below. Once the virtual environment setup is completed now we have to activate it using a script. Before executing the activation script make sure you're in the folder that contains the virtual environment you just created.</p>
<h4 id="heading-windows">Windows</h4>
<pre><code>python <span class="hljs-operator">-</span>m venv <span class="hljs-operator">&lt;</span>name_for_virtualenv<span class="hljs-operator">&gt;</span>
<span class="hljs-operator">&lt;</span>name_for_virtualenv<span class="hljs-operator">&gt;</span>\Scripts\Activate.ps1
</code></pre><h4 id="heading-linuxmacos">Linux/MacOs</h4>
<pre><code>python3 <span class="hljs-operator">-</span>m venv <span class="hljs-operator">&lt;</span>name_for_virtualenv<span class="hljs-operator">&gt;</span>
source  <span class="hljs-operator">&lt;</span>name_for_virtualenv<span class="hljs-operator">&gt;</span><span class="hljs-operator">/</span>bin<span class="hljs-operator">/</span>activate
</code></pre><p>Now you can see (name_for_virtualenv). if you don't see this then your venv is not activated. Once the virtual environment is activated now we will install the necessary python packages for our Flask app. we will need to install Flask and Gunicorn engine. Gunicorn is a Python HTTP server for WSGI applications. </p>
<pre><code><span class="hljs-attribute">pip</span> install flask gunicorn
</code></pre><p>You can check the list of python packages installed in the virtual environment using a code i.e. </p>
<pre><code>pip <span class="hljs-keyword">list</span>
</code></pre><p>You will see a list of packages installed in your virtual environment. pip and setuptools are the base packages that are default in a new virtual environment. Other packages include flask, gunicorn, and some other lists that are by default installed with flask.</p>
<h3 id="heading-flask-app">Flask App</h3>
<p>Now you're ready to start with your flask app. Create a file i.e. main.py and paste the following code</p>
<pre><code><span class="hljs-keyword">from</span> flask <span class="hljs-keyword">import</span> <span class="hljs-title">Flask</span>

<span class="hljs-title">app</span> <span class="hljs-operator">=</span> <span class="hljs-title">Flask</span>(<span class="hljs-title">__name__</span>)

@<span class="hljs-title">app</span>.<span class="hljs-title">route</span>(<span class="hljs-string">"/"</span>)
<span class="hljs-title">def</span> <span class="hljs-title">home_view</span>():
        <span class="hljs-title"><span class="hljs-keyword">return</span></span> <span class="hljs-string">"&lt;h1&gt;My Flask App&lt;/h1&gt;"</span>

<span class="hljs-title"><span class="hljs-keyword">if</span></span> <span class="hljs-title">__name__</span> <span class="hljs-operator">=</span><span class="hljs-operator">=</span> <span class="hljs-string">"__main__"</span>:
  <span class="hljs-title">app</span>.<span class="hljs-title">run</span>()
</code></pre><p>Now create a file with the name Procfile and make sure the Procfile has no extension and paste the following code</p>
<pre><code><span class="hljs-attribute">web</span>: gunicorn <span class="hljs-attribute">main</span>:app
</code></pre><p>Your flask app is ready to deploy. you can check your flask app by running a command in the terminal i.e.</p>
<pre><code><span class="hljs-selector-tag">python</span> <span class="hljs-selector-tag">main</span><span class="hljs-selector-class">.py</span>
</code></pre><p>you will see an address of localhost where your site is currently running. You can check it in your browser. Paste the LocalHost URL in the browser.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655630190565/QcCCi3L82.PNG" alt="flask.PNG" />
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655630200134/BKeoHEvby.PNG" alt="flask in browser.PNG" /></p>
<p>Now we will create a text file for all the necessary python package names and versions that we'll need on our server. We don't need to write these names manually we'll do it using a built-in command i.e.</p>
<pre><code>pip <span class="hljs-keyword">freeze</span>&gt;requirements.txt
</code></pre><p>This will create a file of name requirements with all the packages and their versions. below is the list of packages.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655631351523/0bh1Ya2ub.PNG" alt="requirements.PNG" /></p>
<h2 id="heading-setting-up-github-repository">Setting Up GitHub Repository</h2>
<p>Now create a new GitHub repository with an appropriate name.
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655630467115/eIcEK2EWo.PNG" alt="github.PNG" />
After you created an empty repository you will get a page</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655630880557/sRzZelhq1.PNG" alt="flasl.PNG" />
On this page, all the necessary commands are already provided you can use these commands to push your code to GitHub. First Open your terminal in the project's directory and write the following commands step by step to upload your project to GitHub. Before writing these commands make sure you have installed git in your operating system</p>
<h4 id="heading-initialize-your-folder-to-the-repository">Initialize your Folder to the Repository:</h4>
<pre><code>git <span class="hljs-keyword">init</span>
</code></pre><h4 id="heading-add-gitignore-file">Add gitignore file</h4>
<p>Now add gitignore to ignore the virtual environment folder because we don't need to upload it.
Create a file using the name .gitignore in the project's directory. Add the folders that need to be ignored we're ignoring environment directed so write <strong>env/</strong> in the .gitignore file.</p>
<h4 id="heading-add-file-to-git">Add file to Git</h4>
<pre><code>git <span class="hljs-keyword">add</span> .
</code></pre><p>Use the above command to add all the files to git</p>
<h4 id="heading-add-comment">Add comment</h4>
<pre><code>git <span class="hljs-keyword">commit</span> -m "message here"
</code></pre><p>the above comment will set a message to the commit so it will be easy for backtracking. Make sure the comment describes your changes.</p>
<h4 id="heading-change-branch-to-main">Change Branch to main</h4>
<pre><code><span class="hljs-attribute">git</span> branch -M main
</code></pre><p>The above command is one time you don't need to write this command on every change. When you initialize a directory the default branch is master so we need to change it to the appropriate one.</p>
<h4 id="heading-linked-to-github">Linked to GitHub</h4>
<pre><code>git remote <span class="hljs-keyword">add</span> origin https://github.com/&lt;username&gt;/&lt;repository-<span class="hljs-type">name</span>&gt;.git
</code></pre><p>The above command is also one-time. This command is used to link your local repository to the GitHub repository. You can find this link in your GitHub repository.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655632962886/ERd31DeT-.PNG" alt="flasl.PNG" /></p>
<h4 id="heading-push-to-github">Push to GitHub</h4>
<pre><code>git <span class="hljs-keyword">push</span> -u origin main
</code></pre><p>The above command is used to upload your code to GitHub. After successfully uploading refresh the GitHub page to see your files on your repository.</p>
<h2 id="heading-deploy-on-heroku">Deploy on Heroku</h2>
<p>Login/Signup to your Heroku account. Once you have logged in to your Heroku Account you will find a button with text new. Click on the button you will get a dropdown menu. In the dropdown menu click on create a new app. then provide the appropriate name for your app and click on 'create app'.</p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655634854961/YvdntXl52.PNG" alt="flaskcreateapp.PNG" />
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655634716462/ZKk5xvIdi.PNG" alt="createapp.PNG" /></p>
<p>when you have created the app you'll redirect toward the main dashboard. From Dashboard click on connect to GitHub.
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655635193259/iXU-YMoYy.PNG" alt="appdashboard.PNG" />
Then a Menu will appear where you can search for the repository you want to deploy on Heroku.
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655635425183/XMc7NY3Ki.PNG" alt="connectGithub.PNG" />
Now select Enable Automatic Deploys and click on deploy branch to deploy your project. 
<img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1655635858180/dExztIjAG.PNG" alt="deploy branch.PNG" />
After successful deployment, a message will show i.e. "Your app was successfully deployed". Now you can see your site online by clicking on the open app button at top of the dashboard.</p>
<p>Congratulations you have successfully deployed your app on Heroku. whenever you push a change on GitHub Heroku will automatically deploy it and changes can be seen live.</p>
]]></content:encoded></item><item><title><![CDATA[Matching in Python as a Switch in other languages]]></title><description><![CDATA[Switch in Python as a Match
Have you ever tried the switch statement in Python? If you have been programming in other languages such as C++, C#, Java, etc, you will have used the switch statement, but when you shifted to Python, you noticed there is ...]]></description><link>https://blog.haseebai.tech/matching-in-python-as-a-switch-in-other-languages</link><guid isPermaLink="true">https://blog.haseebai.tech/matching-in-python-as-a-switch-in-other-languages</guid><category><![CDATA[Python]]></category><category><![CDATA[Python 3]]></category><category><![CDATA[learn coding]]></category><category><![CDATA[python 3.10]]></category><category><![CDATA[switch in Python]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Sat, 11 Jun 2022 07:31:50 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1654930557055/xQG01lh-C.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h2 id="heading-switch-in-python-as-a-match">Switch in Python as a Match</h2>
<p>Have you ever tried the switch statement in Python? If you have been programming in other languages such as C++, C#, Java, etc, you will have used the switch statement, but when you shifted to Python, you noticed there is no switch statement in Python.</p>
<p>But here's some good news. Python's new release, i.e., Python 3.10.5, provides switch statements to Python users. A switch statement has been added to Python in the form of match statements and case statements of patterns with corresponding actions. Pattern matching allows programs to extract information from complex data types, branch based on data structures, and perform specified actions based on various data types.</p>
<p>Before proceeding to Syntax &amp; Examples, make sure you have upgraded to the latest version of Python, i.e., Python 3.10.5, by downloading it from <a href="https://www.python.org/downloads/">Python's Official Website</a></p>
<p><img src="https://cdn.hashnode.com/res/hashnode/image/upload/v1654701910206/_0dMD9Zx3.PNG" alt="python 3.10.5 download pic.PNG" /></p>
<h2 id="heading-match-general-syntax">Match General Syntax</h2>
<p>The syntax is pretty much the same as other programming languages use. Instead of the "switch" keyword, we use the "match" keyword in Python.</p>
<p>The generic syntax of pattern matching is:</p>
<pre><code>match subject:
    <span class="hljs-keyword">case</span> <span class="hljs-number">1</span>:
        <span class="hljs-meta"># code here</span>
    <span class="hljs-keyword">case</span> <span class="hljs-number">2</span>:
        <span class="hljs-meta"># code here</span>
    <span class="hljs-keyword">case</span> <span class="hljs-number">3</span>:
        <span class="hljs-meta"># code here</span>
    <span class="hljs-keyword">case</span> _:
        # _ is used <span class="hljs-keyword">for</span> <span class="hljs-keyword">default</span>. <span class="hljs-keyword">if</span> in <span class="hljs-keyword">case</span> the value is <span class="hljs-keyword">not</span> matched with any <span class="hljs-keyword">case</span> <span class="hljs-keyword">default</span> will execute 
        <span class="hljs-meta"># code here</span>
</code></pre><ul>
<li>First, a variable of various types will be passed to match the operator.</li>
<li>Then, the match statement will evaluate the value of the variable.</li>
<li>After that, the variable value will be compared with each case from top to bottom until matched with a suitable case.</li>
<li>Then the code inside the matched case will be executed.</li>
<li>If there is no case-matched, then a wildcard  "_". If a wildcard is provided and provided cases do not match, then the wildcard will be used as a matched case. (Such as the default case in various programming languages).</li>
</ul>
<h2 id="heading-match-example">Match Example</h2>
<p>Let us check a simple example of pattern matching: A value, the subject, is matched to several literals, the patterns. The subject of the match statement in the example below is status. Each of the case statements is a pattern, with literals representing request status codes. After a match, the case's corresponding action is carried out:</p>
<pre><code><span class="hljs-attribute">num1</span>, num<span class="hljs-number">2</span> = <span class="hljs-number">5</span>, <span class="hljs-number">6</span>
<span class="hljs-attribute">op</span> = input(<span class="hljs-string">"Enter Operator"</span>)
<span class="hljs-attribute">result</span> = <span class="hljs-number">0</span>
<span class="hljs-attribute">match</span> op:
     <span class="hljs-attribute">case</span> <span class="hljs-string">"+"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>+num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"-"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>-num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"/"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>/num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"*"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>*num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> _:
          <span class="hljs-attribute">print</span>(<span class="hljs-string">"Operator Not Found"</span>)
</code></pre><p>If op is selected "+", the sum operation will be performed. If op is selected "%", the case statement with <em> will match as a wildcard, and “Operator Not Found” will be printed. Note the last block: the variable name, </em>, acts as a wildcard and insures the op will always match. The use of _ is optional.</p>
<p>You can combine several literals into a single pattern using | ("or"):</p>
<pre><code>case <span class="hljs-string">"+"</span> <span class="hljs-operator">|</span> <span class="hljs-string">"sum"</span> <span class="hljs-operator">|</span> <span class="hljs-string">"add"</span>:
    result <span class="hljs-operator">=</span> num1 <span class="hljs-operator">+</span> num2
</code></pre><h2 id="heading-match-without-the-wildcard-how-would-it-behave">Match Without the wildcard, how would it behave?</h2>
<p>If we remove the last case block from the above example, it becomes:</p>
<pre><code><span class="hljs-attribute">num1</span>, num<span class="hljs-number">2</span> = <span class="hljs-number">5</span>, <span class="hljs-number">6</span>
<span class="hljs-attribute">op</span> = input(<span class="hljs-string">"Enter Operator"</span>)
<span class="hljs-attribute">result</span> = <span class="hljs-number">0</span>
<span class="hljs-attribute">match</span> op:
     <span class="hljs-attribute">case</span> <span class="hljs-string">"+"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>+num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"-"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>-num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"/"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>/num<span class="hljs-number">2</span>
     <span class="hljs-attribute">case</span> <span class="hljs-string">"*"</span>:
          <span class="hljs-attribute">result</span> = num<span class="hljs-number">1</span>*num<span class="hljs-number">2</span>
</code></pre><p>A match may not exist without the use of _ a case statement. If there is no match, then the behavior is a no-op. For example, if op is set to "%", a no-op occurs.</p>
<h2 id="heading-matching-with-literals-and-variables">Matching with literals and variables</h2>
<p>Patterns can resemble unpacking assignments, and they can also be used to bind variables. A data point in this example can be unpacked to its x- and y-coordinates:</p>
<pre><code>x, y = <span class="hljs-number">1</span>, <span class="hljs-number">2</span>

point = (<span class="hljs-number">1</span>, <span class="hljs-number">0</span>)

match point:
     <span class="hljs-keyword">case</span> (<span class="hljs-number">0</span>, <span class="hljs-number">0</span>):
          <span class="hljs-keyword">print</span>(<span class="hljs-string">"Origin"</span>)
     <span class="hljs-keyword">case</span> (<span class="hljs-number">0</span>, y):
          <span class="hljs-keyword">print</span>(f<span class="hljs-string">"Y={y}"</span>)
     <span class="hljs-keyword">case</span> (x, <span class="hljs-number">0</span>):
          <span class="hljs-keyword">print</span>(f<span class="hljs-string">"X={x}"</span>)
     <span class="hljs-keyword">case</span> (x, y):
          <span class="hljs-keyword">print</span>(f<span class="hljs-string">"X={x}, Y={y}"</span>)
     <span class="hljs-keyword">case</span> _:
          <span class="hljs-keyword">print</span>(<span class="hljs-string">"not a point"</span>)
</code></pre><p>The first pattern has two literals, (0, 0), and is an extension of the literal pattern mentioned above. The next two patterns combine a literal and a variable, with the variable binding a subject value (point). The fourth pattern catches two variables, it is essentially identical to the unpacking assignment (x, y) = point.</p>
<h2 id="heading-matching-with-class-or-class-object">Matching with Class or Class Object</h2>
<p>If you use classes to structure your data, you can use the class name followed by an argument list similar to a constructor as a pattern. This pattern can grab class characteristics and store them in variables:</p>
<pre><code><span class="hljs-keyword">class</span> <span class="hljs-type">Point</span>:
    x: <span class="hljs-type">int</span>
    y:<span class="hljs-type">int</span>

x, y = <span class="hljs-number">1</span>, <span class="hljs-number">1</span>

<span class="hljs-type">point</span> = (<span class="hljs-number">0</span>, y)

match <span class="hljs-type">point</span>:
    <span class="hljs-keyword">case</span> <span class="hljs-type">Point</span>(x=<span class="hljs-number">0</span>, y=<span class="hljs-number">0</span>):
        print("Origin is the point's location.")
    <span class="hljs-keyword">case</span> <span class="hljs-type">Point</span>(x=<span class="hljs-number">0</span>, y=y):
        print(f"Y={y} and the point is on the y-axis.")
    <span class="hljs-keyword">case</span> <span class="hljs-type">Point</span>(x=x, y=<span class="hljs-number">0</span>):
        print(f"X={x} and the point is on the x-axis.")
    <span class="hljs-keyword">case</span> <span class="hljs-type">Point</span>():
        print("The point is located somewhere else on the plane.")
    <span class="hljs-keyword">case</span> _:
        print("Not a point")
</code></pre><p>Or you can simply match using class object also</p>
<pre><code>class Point:
    def __init__(<span class="hljs-built_in">self</span>, x, y):
        <span class="hljs-built_in">self</span>.x, <span class="hljs-built_in">self</span>.y <span class="hljs-operator">=</span> x, y

x, y <span class="hljs-operator">=</span> <span class="hljs-number">1</span>, <span class="hljs-number">1</span>

point <span class="hljs-operator">=</span> Point(<span class="hljs-number">0</span>, y)

match point:
    case Point(x<span class="hljs-operator">=</span><span class="hljs-number">0</span>, y<span class="hljs-operator">=</span><span class="hljs-number">0</span>):
        print(<span class="hljs-string">"Origin is the point's location."</span>)
    case Point(x<span class="hljs-operator">=</span><span class="hljs-number">0</span>, y<span class="hljs-operator">=</span>y):
        print(f<span class="hljs-string">"Y={y} and the point is on the y-axis."</span>)
    case Point(x<span class="hljs-operator">=</span>x, y<span class="hljs-operator">=</span><span class="hljs-number">0</span>):
        print(f<span class="hljs-string">"X={x} and the point is on the x-axis."</span>)
    case Point():
        print(<span class="hljs-string">"The point is located somewhere else on the plane."</span>)
    case <span class="hljs-keyword">_</span>:
        print(<span class="hljs-string">"Not a point"</span>)
</code></pre><p>An if clause, known as a "guard," can be added to a pattern. If the guard is false, the match proceeds to the next case block. It's worth noting that value capture occurs before the guard is evaluated:</p>
<pre><code>match point:
    <span class="hljs-keyword">case</span> Point(x, y) <span class="hljs-keyword">if</span> x == y:
        <span class="hljs-keyword">print</span>(f<span class="hljs-string">"The point is on the diagonal Y=X at {x}."</span>)
    <span class="hljs-keyword">case</span> Point(x, y):
        <span class="hljs-keyword">print</span>(f<span class="hljs-string">"Point is not on the diagonal."</span>)
</code></pre><h2 id="heading-matching-with-complex-pattern">Matching with Complex pattern</h2>
<p>You have seen in the above examples we have used wildcard alone. but we can also use it in a more complex manner:</p>
<pre><code><span class="hljs-selector-tag">match</span> <span class="hljs-selector-tag">response</span>:
    <span class="hljs-selector-tag">case</span> (<span class="hljs-string">'success'</span>, code, <span class="hljs-number">200</span>):
        <span class="hljs-selector-tag">print</span>(<span class="hljs-string">"Response received."</span>)
    <span class="hljs-selector-tag">case</span> (<span class="hljs-string">'error'</span>, code, _):
        <span class="hljs-selector-tag">print</span>(f<span class="hljs-string">"An error {code} occurred while responding."</span>)
</code></pre><p>Stay tuned and follow for new updates</p>
]]></content:encoded></item><item><title><![CDATA[How to use Lambda Function in Python? An impressive method in Python]]></title><description><![CDATA[In this blog, I am going to cover the lambda function. It is a function that creates a function object using the lambda keyword. The function object lasts only as long as it's called and then disappears. It can be called by using the keyword 'lambda'...]]></description><link>https://blog.haseebai.tech/lambda-function-in-python</link><guid isPermaLink="true">https://blog.haseebai.tech/lambda-function-in-python</guid><category><![CDATA[Python]]></category><category><![CDATA[python beginner]]></category><category><![CDATA[Python 3]]></category><category><![CDATA[#codingNewbies]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Mon, 06 Jun 2022 16:38:43 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/upload/v1654533322827/Z3RcQBKnc.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>In this blog, I am going to cover the lambda function. It is a function that creates a function object using the lambda keyword. The function object lasts only as long as it's called and then disappears. It can be called by using the keyword 'lambda' following with parameters in the function and then the function body. <br />
The syntax is</p>
<pre><code><span class="hljs-keyword">lambda</span> arguments: expression
</code></pre><p>It can take any number of arguments, but can only have one expression. Lambda Function Example
Below is a simple lambda function example.</p>
<pre><code>x = <span class="hljs-keyword">lambda</span> a, b: a + b
print(x(<span class="hljs-number">5</span>,<span class="hljs-number">6</span>))
</code></pre><pre><code><span class="hljs-attr">Output:</span>
<span class="hljs-number">11</span>
</code></pre><h2 id="heading-uses-of-lambda-functions">Uses of Lambda Functions</h2>
<p>Lambda function is better shown when they are used as an anonymous function inside another function.
Let's suppose you have a function definition that takes one argument, and that argument will be powered by an unknown number:</p>
<pre><code><span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">power</span>(<span class="hljs-params">n</span>):</span>
     <span class="hljs-keyword">return</span> <span class="hljs-keyword">lambda</span> a: a ** n
</code></pre><p>Use that function definition to make a function that always squares the number you send</p>
<pre><code><span class="hljs-attribute">square</span> = power(<span class="hljs-number">2</span>)
<span class="hljs-attribute">print</span>(square(<span class="hljs-number">3</span>))
</code></pre><p>Or similarly, we can generate tons of other functions from that single function
such as</p>
<pre><code><span class="hljs-keyword">cube</span> = power(<span class="hljs-number">3</span>)
print(<span class="hljs-keyword">cube</span>(<span class="hljs-number">3</span>))
</code></pre><pre><code><span class="hljs-attribute">IVTimes</span> = power(<span class="hljs-number">4</span>)
<span class="hljs-attribute">print</span>(IVTimes(<span class="hljs-number">3</span>))
</code></pre>]]></content:encoded></item><item><title><![CDATA[How does Guido van delight with an amazing & unique idea of creating Python?]]></title><description><![CDATA[How does Guido van delight with the amazing idea of creating Python Programming?
The idea of Python programming was conceived in the late 1980s by Guido van Rossum. In late 1989, He was looking to work on a Hobby project that will keep him busy near ...]]></description><link>https://blog.haseebai.tech/brief-history-of-python</link><guid isPermaLink="true">https://blog.haseebai.tech/brief-history-of-python</guid><category><![CDATA[Python]]></category><category><![CDATA[#codenewbies]]></category><category><![CDATA[python beginner]]></category><category><![CDATA[Python 3]]></category><dc:creator><![CDATA[Muhammad Haseeb]]></dc:creator><pubDate>Thu, 02 Jun 2022 19:00:00 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/unsplash/ZIPFteu-R8k/upload/v1654257466426/rFyhQ8hLx.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<h2 id="heading-how-does-guido-van-delight-with-the-amazing-idea-of-creating-python-programming">How does Guido van delight with the amazing idea of creating Python Programming?</h2>
<p>The idea of Python programming was conceived in the late 1980s by Guido van Rossum. In late 1989, He was looking to work on a Hobby project that will keep him busy near Christmas days. So he decided to write an interpreter for the language he had been thinking of.</p>
<p>Python, as a successor of ABC language, with the ability of Exceptional Handling and interfacing with the Amoeba OS. Since he had a wide experience with the implementation of the interpreted language in the ABC group at CWI. (Centrum Wiskunde &amp; Informatica is a research center in mathematics &amp; theoretical computer science). So as he has written he learned a lot about language design at CWI and this is the main origin of most Python features.</p>
<h2 id="heading-python-090-first-release-of-todays-top-level-programming-language">Python 0.9.0, First Release of today's top-level Programming language</h2>
<p>Python was first released on 20th Feb 1991 as Python 0.9.0 at alt. source. During its first release, It was already enriched with exceptional handling, core data types, and functions. Python was object-oriented from its first release and has a module system at that time also. In Jan 1994, Python version 1.0 has released with major new features like lambda, filter, and map and reduces. which were more functional programming tools.</p>
<h2 id="heading-python-20-a-major-update-in-the-history-of-python-programming">Python 2.0. A major update in the history of Python Programming</h2>
<p>Python version 2.0 was released on October 16, 2000, with many major new features. that includes a cycle-detecting garbage collector for memory management and support for Unicode. Yet, the most important change was the development process in Python 2.0. with a shift to a more transparent and community-backed process.</p>
<h2 id="heading-python-30-the-latest-version-that-created-history-in-python-programming">Python 3.0, The latest version that created history in Python Programming</h2>
<p>Python version 3.0 has released on December 3, 2008, after a long period of testing. The new version was incompatible with the previous 2. x line releases. In this new version, many details such as Built-in objects have changed. And removed many deprecated features.</p>
]]></content:encoded></item></channel></rss>