Tech Journey With Gagan: January 2025

Monday, January 20, 2025

Refreshing/Clean a Database with SQL and Entity Framework

Quick steps to refresh your database: 1. Drop All Tables
Run the following SQL script to drop all existing tables:

Code Snippet

DECLARE @sql NVARCHAR(MAX) = N'';
SELECT @sql += 'DROP TABLE IF EXISTS [' + SCHEMA_NAME(schema_id) + '].[' + name + '];' + CHAR(13)
FROM sys.tables;
EXEC sp_executesql @sql;

Note: when you try above than you got some errors but don't its because of relationship execute multiple times. 2. Recreate EF Migration Table Recreate the EF migration table with this script:

Code Snippet

CREATE TABLE [dbo].[__EFMigrationsHistory] (
    [MigrationId] NVARCHAR(150) NOT NULL PRIMARY KEY,
    [ProductVersion] NVARCHAR(32) NOT NULL
);

3. Update the Database Run the following command to reapply migrations and update the schema: update-database These steps ensure a clean database reset while maintaining EF migration compatibility.

Monday, January 13, 2025

Send Emails Through SendGrid using DotNet

This tutorial guides you through building an email notification system in ASP.NET Core using SendGrid. We’ll cover user registration, OTP email verification, and templated email functionality with best practices.

Step 1: Setting Up SendGrid

Follow this guide to set up your SendGrid account, obtain the API key, and configure it for email delivery.

Step 2: Email Message Structure

The `EmailMessage` class encapsulates the data required for sending emails:

Code Snippet

 public class EmailMessage { public EmailAddress To { get; set; } public string Subject { get; set; } public IDictionary<string, string> TemplateData { get; set; } public EmailTemplateType EmailTemplateType { get; set; }
vbnet
Copy code
public EmailMessage(string to, string subject, 
                    IDictionary<string, string> templateData, 
                    EmailTemplateType emailTemplateType)
{
    To = new EmailAddress(to);
    Subject = subject;
    TemplateData = templateData;
    EmailTemplateType = emailTemplateType;
}
}

Step 3: Email Settings

The `EmailSettings` class manages configuration values for SendGrid:

Code Snippet

 public class EmailSettings { public const string EmailConfiguration = "EmailConfiguration"; public string ApiKey { get; set; } public string From { get; set; } public string Username { get; set; } }

Step 4: SendGrid Email Service

The `SendGridEmailService` handles email sending using SendGrid’s API:

Code Snippet

 public class SendGridEmailService : ISendGridEmailService { private readonly EmailSettings _emailConfig;
csharp
Copy code
public SendGridEmailService(EmailSettings emailConfig)
{
    _emailConfig = emailConfig;
}

public async Task Send(EmailMessage emailMessage)
{
    var client = new SendGridClient(_emailConfig.ApiKey);
    var msg = CreateEmailMessage(emailMessage);
    var response = await client.SendEmailAsync(msg);

    if ((int)response.StatusCode >= 400)
    {
        throw new Exception($"Failed to send email. Status code: {response.StatusCode}");
    }
}

private SendGridMessage CreateEmailMessage(EmailMessage message)
{
    var htmlBody = GenerateEmailBody(message.EmailTemplateType, message.TemplateData);
    var from = new EmailAddress(_emailConfig.From, _emailConfig.Username);
    return MailHelper.CreateSingleEmail(from, message.To, message.Subject, null, htmlBody);
}

private string GenerateEmailBody(EmailTemplateType emailTemplate, 
                                 IDictionary<string, string> templateData)
{
    var templateContent = File.ReadAllText($"EmailTemplates/{emailTemplate}.template.html");
    var template = Template.Parse(templateContent);
    var renderedContent = template.Render(Hash.FromDictionary(templateData));
    return renderedContent;
}
}

Step 5: Email Template

Create an HTML email template for OTP delivery:

Code Snippet

 <html> <body> <h3>Welcome to Our Service</h3> <p>Your OTP for registration is: <b>{{ OTP }}</b></p> <p>This OTP is valid for 5 minutes.</p> </body> </html>

Step 6: User Registration Workflow

Implement user registration with OTP email verification:

Code Snippet

 public class RegisterUserHandler : IRequestHandler<RegisterUserCommand, bool> { private readonly ApplicationDbContext _dbContext; private readonly ISendGridEmailService _emailService;
csharp
Copy code
public RegisterUserHandler(ApplicationDbContext dbContext, 
                           ISendGridEmailService emailService)
{
    _dbContext = dbContext;
    _emailService = emailService;
}

public async Task<bool> Handle(RegisterUserCommand request, 
                               CancellationToken cancellationToken)
{
    var otp = new Random().Next(100000, 999999).ToString();
    var user = new User
    {
        Email = request.Email,
        Password = request.Password,
        OTP = otp,
        OtpExpiry = DateTime.UtcNow.AddMinutes(5)
    };

    _dbContext.Users.Add(user);
    await _dbContext.SaveChangesAsync(cancellationToken);

    var emailMessage = new EmailMessage(
        user.Email,
        "Your OTP for Registration",
        new Dictionary<string, string> { { "OTP", otp } },
        EmailTemplateType.OtpEmail
    );

    await _emailService.Send(emailMessage);
    return true;
}
}

Step 7: Configuring Program.cs

Set up services and middleware in the `Program.cs` file:

Code Snippet

 var builder = WebApplication.CreateBuilder(args);
builder.Services.Configure<EmailSettings>( builder.Configuration.GetSection(EmailSettings.EmailConfiguration));

builder.Services.AddTransient<ISendGridEmailService, SendGridEmailService>(); builder.Services.AddControllers(); builder.Services.AddEndpointsApiExplorer(); builder.Services.AddSwaggerGen();

var app = builder.Build();

if (app.Environment.IsDevelopment()) { app.UseSwagger(); app.UseSwaggerUI(); }

app.UseHttpsRedirection(); app.UseAuthorization(); app.MapControllers(); app.Run();

Copy Code Functionality

Include the following JavaScript in your blog to enable the one-click copy functionality:

Code Snippet

 <script> function copyCode(targetId) { const codeBlock = document.getElementById(targetId); navigator.clipboard.writeText(codeBlock.value).then(() => { alert("Code copied to clipboard!"); }); } </script>

How To Setup SendGrid Account

Step 1 : Do SignUp on SendGrid Website and Create Sender Identity As per shown in Screenshots.

Step 2 : Create API Just Click on API Key than click on Full Success.

Step 3 : Copy the API Key Because Its not Show Again.

Thankyou.......🤗

Friday, January 10, 2025

How to Run Python in .NET: A Step-by-Step Guide for Developers

Step1: Install Python.Runtime in dotnet.

Step2: Install Python in local.

Step3: Add Script at same directory "hello.py".

Code Snippet

# hello.py
import sys

def main():
    print("Hello from Python!")

if __name__ == "__main__":
    main()

Step4: Copy Code For Run Script. and Paste into Controller.

Code Snippet

[HttpGet("python/test-python")]
public IActionResult TestPython()
{
    try
    {
        // Path to your Python executable
        string pythonExe = "C:\\Program Files\\Python313\\python.exe"; // Change this to the full path if Python is not in your PATH
        string pythonScript = "hello.py"; // Ensure the script is in the correct location

        var process = new Process
        {
            StartInfo = new ProcessStartInfo
            {
                FileName = pythonExe,
                Arguments = pythonScript,
                RedirectStandardOutput = true,
                RedirectStandardError = true,
                UseShellExecute = false,
                CreateNoWindow = true
            }
        };

        process.Start();

        string output = process.StandardOutput.ReadToEnd();
        string error = process.StandardError.ReadToEnd();

        process.WaitForExit();

        if (!string.IsNullOrWhiteSpace(error))
        {
            return StatusCode(500, $"Python Error: {error}");
        }

        return Ok(output.Trim());
    }
    catch (Exception ex)
    {
        return StatusCode(500, $"Error: {ex.Message}");
    }
}

Now you can Enjoy with Python in DotNet😉

Monday, January 6, 2025

How to open Blob Files in New Tab using dot net and angular

Step 1: Add This code to Angular app

Angular code


  async openImageInNewTab(url:any){
    
   await this.blobService.getFile(url).then(res=>{
      if(res.success){
        this.openFile(res.result.fileContent,res.result.contentType);
      }
    })
  }

  openFile(base64Data: string, mimeType: string): void {
    const fileUrl = `data:${mimeType};base64,${base64Data}`;
    const newTab = window.open(); // Open a new tab
    if (newTab) {
      if (mimeType.startsWith('image/')) {
        newTab.document.write(`
          <html>
            <head><title>Image Viewer</title></head>
            <body style="margin: 0; display: flex; justify-content: center; align-items: center; height: 100vh;">
              <img src="${fileUrl}" style="max-width: 100%; max-height: 100%;" />
            </body>
          </html>
        `);
      } else if (mimeType === 'application/pdf') {
        newTab.document.write(`
          <html>
            <head><title>PDF Viewer</title></head>
            <body style="margin: 0; display: flex; justify-content: center; align-items: center; height: 100vh;">
              <embed src="${fileUrl}" style="width: 100%; height: 100%;" type="application/pdf" />
            </body>
          </html>
        `);
      } else {
        // For unsupported types, force download
        const link = document.createElement('a');
        link.href = fileUrl;
        link.download = 'file';
        link.click();
      }
      newTab.document.close();
    } else {
      console.error('Failed to open a new tab.');
    }
  }

Html Side Code

HTML Code

<!-- Paste your HTML, CSS, or JS code here -->
<button (click)="yourbloblink" class="blue-text" >view</button>

Step 2: Add DotNet Code To Download blob File.

Dot Net Code

public async Task<IActionResult> DownloadBlobFileAsync(string blobUrl)
{
    // Parse the Blob URL
    Uri blobUri = new Uri(blobUrl);
    string[] segments = blobUri.AbsolutePath.TrimStart('/').Split('/');
    if (segments.Length < 2)
    {
        throw new ArgumentException("Invalid Blob URL.", nameof(blobUrl));
    }

    // Extract container name and blob name
    string containerName = segments[0];
    string blobName = string.Join('/', segments[1..]);

    BlobContainerClient containerClient = _blobServiceClient.GetBlobContainerClient(containerName.ToLower());
    if (!(await containerClient.ExistsAsync()))
    {
        throw new ArgumentException("Container does not exist.", nameof(containerName));
    }

    BlobClient blobClient = containerClient.GetBlobClient(blobName);

    // Check if the blob exists
    if (!await blobClient.ExistsAsync())
    {
        return new NotFoundObjectResult("Blob not found.");
    }

    // Download the blob
    var response = await blobClient.DownloadAsync();

    // Determine content type using GetMimeType method
    string contentType = response.Value.Details.ContentType ?? GetMimeType(blobName);

    // Create a new memory stream to hold blob content
    var memoryStream = new MemoryStream();
    await response.Value.Content.CopyToAsync(memoryStream);
    memoryStream.Position = 0;

    // Return the file as a FileStreamResult without disposing the stream here
    return new FileStreamResult(memoryStream, contentType)
    {
        FileDownloadName = blobName
    };
}

private string GetMimeType(string fileName)
{
    var extension = Path.GetExtension(fileName).ToLowerInvariant();
    return extension switch
    {
        ".jpg" or ".jpeg" => "image/jpeg",
        ".png" => "image/png",
        ".gif" => "image/gif",
        ".bmp" => "image/bmp",
        ".tif" or ".tiff" => "image/tiff",
        ".pdf" => "application/pdf",
        ".txt" => "text/plain",
        ".html" or ".htm" => "text/html",
        ".css" => "text/css",
        ".js" => "application/javascript",
        ".json" => "application/json",
        ".xml" => "application/xml",
        _ => MediaTypeNames.Application.Octet
    };
}

Note: use this in your api service

Saturday, January 4, 2025

How to Add Image Slider in Blogger

For images Link => just normally upload files and copy links and replace with href For Add Slider
Note: After Take Link remove that.

Add In Post

<!-- Slider Start -->
<div class="slider-container">
  <div class="slider">
    <div class="slide active">
      <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrvEOic5BEH8CA3fsaotQy38EBrrpJSkLJcKa9WWCljgt_bOWKutWlgLQYaCEfPxDwhyphenhyphend30gSyBRS8EMscVpIo2miDkgMjmyFABLkybSWGA0pXF0_2X7nchRLwCqPcTqwGNbn8ULm0b9ldh2OI4awp2HdXrio_se_kI7j0oYKuGcfUcC8F6p8_AdaQrss/s1600/favicon-16x16.png" target="_blank">
        <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrvEOic5BEH8CA3fsaotQy38EBrrpJSkLJcKa9WWCljgt_bOWKutWlgLQYaCEfPxDwhyphenhyphend30gSyBRS8EMscVpIo2miDkgMjmyFABLkybSWGA0pXF0_2X7nchRLwCqPcTqwGNbn8ULm0b9ldh2OI4awp2HdXrio_se_kI7j0oYKuGcfUcC8F6p8_AdaQrss/s1600/favicon-16x16.png" alt="Slide 1">
      </a>
    </div>
    <div class="slide">
      <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj51C3kv5iNoWOvqDhdub2Jf9UwdOfbYP7-VDJnOECeAlo7XHm2QMdLeBru0bGBdp6pqvvl9gcKJrVVGmKVmbY4CbcAJTW2qe9RAuvUEQOOTFlBozlbAhNinu9fnDWulA2u2zj536RRhnPrgFFagpEJraXifRVAJ222KG8JH6__S7DMiN_3wajONku79Q8/s320/DALL%C2%B7E%202025-01-04%2018.57.19%20-%20A%20highly%20professional%20and%20creative%20favicon%20design%20for%20a%20tech%20blog%20titled%20'Tech%20Journey%20with%20Gagan'.%20The%20icon%20should%20include%20futuristic,%20sleek%20design%20e.webp" target="_blank">
        <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj51C3kv5iNoWOvqDhdub2Jf9UwdOfbYP7-VDJnOECeAlo7XHm2QMdLeBru0bGBdp6pqvvl9gcKJrVVGmKVmbY4CbcAJTW2qe9RAuvUEQOOTFlBozlbAhNinu9fnDWulA2u2zj536RRhnPrgFFagpEJraXifRVAJ222KG8JH6__S7DMiN_3wajONku79Q8/s320/DALL%C2%B7E%202025-01-04%2018.57.19%20-%20A%20highly%20professional%20and%20creative%20favicon%20design%20for%20a%20tech%20blog%20titled%20'Tech%20Journey%20with%20Gagan'.%20The%20icon%20should%20include%20futuristic,%20sleek%20design%20e.webp" alt="Slide 2">
      </a>
    </div>
    <div class="slide">
      <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1W6midCPvNrelt7oTHMLDA8AI954egeJq3duKntN4IZbb4WMrz6wKXKvsKqkhLIgU724ZcJC6Ny0UdsUcnQDi-HOisuizP6I83zR5hZD3dee5XA4W5B_sD7SoQniBY_WB7qWq5UrSSD7MJ2jgo63yXqF1c30L4XdqKqQ7Ot6tZ_dXacbJzagHEYZ9VQE/s1600/favicon-32x32.png" target="_blank">
        <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1W6midCPvNrelt7oTHMLDA8AI954egeJq3duKntN4IZbb4WMrz6wKXKvsKqkhLIgU724ZcJC6Ny0UdsUcnQDi-HOisuizP6I83zR5hZD3dee5XA4W5B_sD7SoQniBY_WB7qWq5UrSSD7MJ2jgo63yXqF1c30L4XdqKqQ7Ot6tZ_dXacbJzagHEYZ9VQE/s1600/favicon-32x32.png" alt="Slide 3">
      </a>
    </div>
  </div>
  <button class="prev" onclick="moveSlide(-1)">❮</button>
  <button class="next" onclick="moveSlide(1)">❯</button>
</div>
<!-- Slider End -->

Go To Theme ==> Click Customize Drop Down ==> Click Edit HTML ==> Add Below Code Before Body Closing Tag

CSS And JavaScript Code

  <!-- Slider Styles -->
<style>
  .slider-container {
    position: relative;
    max-width: 800px;
    margin: auto;
    overflow: hidden;
  }

  .slider {
    display: flex;
    transition: transform 0.5s ease-in-out;
  }

  .slide {
    min-width: 100%;
    transition: opacity 0.5s ease-in-out;
  }

  .slide img {
    width: 100%;
    border-radius: 10px;
  }

  .prev, .next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    z-index: 10;
  }

  .prev {
    left: 10px;
  }

  .next {
    right: 10px;
  }

  .prev:hover, .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
  }

  .slide:not(.active) {
    display: none;
  }
</style>

<!-- Slider Script -->
<script>
  let currentSlide = 0;
  const slides = document.querySelectorAll('.slide');

  function showSlide(index) {
    slides[currentSlide].classList.remove('active');
    currentSlide = (index + slides.length) % slides.length;
    slides[currentSlide].classList.add('active');
  }

  function moveSlide(step) {
    showSlide(currentSlide + step);
  }
</script>

Note: Some Time It is not working properly because of html parser than you need to first convert html parser code than put in textarea.

Friday, January 3, 2025

How to hide navbar and footer of blogger

navbar (showing at top):

Footer:

Here I am trying to hide using below steps:

Go To Theme ==> Click Customize Drop Down ==> Click Edit HTML ==> Add Below Css Code

Code Snippet

#Attribution1 {

    display: none !important;

    visibility: hidden !important;

}

#navbar {

    display: none !important;

    visibility: hidden !important;

}



#b-navbar {

    display: none !important;

    visibility: hidden !important;

}

Wednesday, January 1, 2025

How to add input box with copy to Clipboard Functionality in Blogger

For Title Change => Code Snippet
For Input Add Content in TextArea Tag

Add In Post

<div class="code-container">
  <div class="code-header">
    <h3>Code Snippet</h3>
    <button class="copy-button" data-target="code-content">
      Copy Code
    </button>
  </div>
  <textarea id="code-content" class="code-block" rows="10" cols="50" readonly>
<!-- Paste your HTML, CSS, or JS code here -->
<div class="example">
  <h1>Hello World</h1>
  <p>This is a sample HTML code.</p>
</div>
  </textarea>
  <div id="new-toast" class="new-toast"></div>
</div>

Go To Theme ==> Click Customize Drop Down ==> Click Edit HTML ==> Add Below Code Before Body Closing Tag

CSS And JavaScript Code

  <style>
        .code-container {
            position: relative;
            background: #ffffff;
            border: 1px solid #dcdcdc;
            border-radius: 8px;
            padding: 10px;
            margin: 20px 0;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }

        .code-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-bottom: 8px;
            border-bottom: 1px solid #eaeaea;
        }

        .code-header h3 {
            margin: 0;
            font-size: 1.2rem;
            font-family: system-ui;
            font-weight: 700;
            color: #333;
        }

        .copy-button {
            background-color: transparent;
            border: 1px solid #dcdcdc;
            border-radius: 4px;
            cursor: pointer;
            padding: 5px;
            transition: background-color 0.3s ease, border-color 0.3s ease;
            display: flex;
            align-items: center;
        }

        .copy-button:hover {
            background-color: #f9f9f9;
            border-color: #ccc;
        }

        .copy-button.copied {
            background-color: #28a745;
            border-color: #28a745;
            color: #fff;
        }

        .copy-icon {
            width: 18px;
            height: 18px;
            color: currentColor;
        }

        .code-block {
            padding: 10px;
            border-radius: 4px;
            font-family: 'Courier New', monospace;
            font-size: 0.9rem;
            color: #333;
            overflow-x: auto;
            margin-top: 10px;
        }

        .new-toast {
            position: fixed;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            background-color: #333;
            color: white;
            padding: 12px 20px;
            font-size: 1rem;
            border-radius: 6px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.5s ease, visibility 0s 0.5s;
            z-index: 9999;
        }

        .new-toast.show {
            opacity: 1;
            visibility: visible;
            transition: opacity 0.5s ease;
        }

        .new-toast.success {
            background-color: #28a745;
        }

        .new-toast.error {
            background-color: #dc3545;
        }

        .new-toast.info {
            background-color: #17a2b8;
        }
    </style>

 <script>
        document.addEventListener("DOMContentLoaded", function () {
            const copyButtons = document.querySelectorAll('.copy-button');
            
            copyButtons.forEach(button => {
                button.addEventListener('click', function () {
                    const targetId = button.getAttribute('data-target');
                    copyCode(targetId, button);
                });
            });
        });

        function copyCode(contentId, button) {
            const content = document.getElementById(contentId);
            content.select();
            content.setSelectionRange(0, 99999); // For mobile devices

            try {
                document.execCommand("copy");
                showToast("Code copied to clipboard!", "success");
                button.classList.add("copied");
            } catch (err) {
                console.error("Failed to copy", err);
                showToast("Failed to copy the code!", "error");
            }

            setTimeout(() => button.classList.remove("copied"), 2000);
        }

        function showToast(message, type = "info") {
            const toast = document.getElementById("new-toast");
            toast.textContent = message;
            toast.classList.add("show", type);

            setTimeout(() => toast.classList.remove("show", type), 3000);
        }
    </script>

Note: Some Time It is not working properly because of html parser than you need to first convert html parser code than put in textarea.

Tech Journey With Gagan

Monday, January 20, 2025

Refreshing/Clean a Database with SQL and Entity Framework

Code Snippet

Code Snippet

Monday, January 13, 2025

Send Emails Through SendGrid using DotNet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

How To Setup SendGrid Account

Friday, January 10, 2025

How to Run Python in .NET: A Step-by-Step Guide for Developers

Code Snippet

Code Snippet

Monday, January 6, 2025

How to open Blob Files in New Tab using dot net and angular

Angular code

HTML Code

Dot Net Code

Saturday, January 4, 2025

How to Add Image Slider in Blogger

Add In Post

CSS And JavaScript Code

Friday, January 3, 2025

How to hide navbar and footer of blogger

navbar (showing at top):

Footer:

Here I am trying to hide using below steps:

Go To Theme ==> Click Customize Drop Down ==> Click Edit HTML ==> Add Below Css Code

Code Snippet

Wednesday, January 1, 2025

How to add input box with copy to Clipboard Functionality in Blogger

Add In Post

CSS And JavaScript Code

How to Do Cross-Browser Testing on Windows — Including Safari via Playwright

Labels

Monday, January 20, 2025

Code Snippet

Code Snippet

Monday, January 13, 2025

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Code Snippet

Friday, January 10, 2025

Code Snippet

Code Snippet

Monday, January 6, 2025

Angular code

HTML Code

Dot Net Code

Saturday, January 4, 2025

Add In Post

CSS And JavaScript Code

Friday, January 3, 2025

navbar (showing at top):Footer: Here I am trying to hide using below steps:

Go To Theme ==> Click Customize Drop Down ==> Click Edit HTML ==> Add Below Css Code

Code Snippet

Wednesday, January 1, 2025

Add In Post

CSS And JavaScript Code

navbar (showing at top):

Footer:

Here I am trying to hide using below steps: