DEV Community: Azeem Akhtar

How to Send Emails with Django: A Step-by-Step Guide

Azeem Akhtar — Wed, 02 Aug 2023 17:24:34 +0000

Django, a powerful web framework for Python, makes it easy to build web applications, including ones that involve sending emails. Sending emails is a common requirement in many web applications, whether it's for user registration, password reset, notifications, or any other communication with users. In this step-by-step guide, we will walk you through the process of setting up and sending emails using Django.

Step 1: Set up Django Project

Assuming you have Python installed on your system, start by creating a new Django project if you haven't already:

django-admin startproject projectname
cd projectname

Step 2: Create Django App

Next, create a new Django app within your project:

python manage.py startapp appname

Step 3: Configure Email Settings

In your Django project's settings.py file, configure the email settings. Open the settings.py file and find the EMAIL_BACKEND and EMAIL_HOST settings. You can use Django's built-in SMTP backend for development and testing purposes, but for production, you'll need to use a proper email service provider.

For production, you should use a proper email service provider like Gmail, Mailgun, SendGrid, etc.:

# settings.py

EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
EMAIL_HOST = 'your_email_host'
EMAIL_PORT = 587
EMAIL_USE_TLS = True
EMAIL_HOST_USER = 'your_email_username'
EMAIL_HOST_PASSWORD = 'your_email_password'

Remember to replace 'your_email_host', 'your_email_username', and 'your_email_password' with your actual email service provider details.

Step 4: Create Email Template (Optional)

You can create an HTML email template to make your emails look more professional and engaging. Create a folder named templates within your app directory and then create a sub-folder named emails. Inside this folder, create an HTML file for your email content. For example, registration_email.html:

<!-- registration_email.html -->

<!DOCTYPE html>
<html>
<head>
    <title>Welcome to our website!</title>
</head>
<body>
    <h2>Hello {{ username }},</h2>
    <p>Thank you for registering on our website. We're excited to have you onboard!</p>
    <p>Best regards,</p>
    <p>The Website Team</p>
</body>
</html>

Step 5: Sending Emails from Django Views

Now that your email settings are configured, and the email template (if you have one) is ready, it's time to send emails from your Django views. Open your app's views.py file and import the necessary modules:

# views.py

from django.core.mail import send_mail
from django.template.loader import render_to_string
from django.utils.html import strip_tags

Next, define a function to send the email:

# views.py

def send_registration_email(request):
    # Get the user's email and username
    email = 'user@example.com'  # Replace with the user's email address
    username = 'John Doe'       # Replace with the user's username

    # Prepare the email content
    subject = 'Welcome to Our Website!'
    html_message = render_to_string('emails/registration_email.html', {'username': username})
    plain_message = strip_tags(html_message)

    # Send the email
    send_mail(subject, plain_message, 'your_email_sender@example.com', [email], html_message=html_message)

    return HttpResponse('Email sent successfully!')

In this example, we're sending a welcome email to a user who has just registered on our website. The send_mail() function is used to send the email, and it takes the subject, plain text message, sender email address, recipient list, and the HTML message as parameters.

Step 6: Configure URL and Test

Finally, you need to configure a URL in your app's urls.py file to trigger the email sending process. Add a URL pattern that maps to the view function you created earlier:

# urls.py

from django.urls import path
from . import views

urlpatterns = [
    path('send_email/', views.send_registration_email, name='send_email'),
]

Now, you can run your Django development server and visit the URL http://127.0.0.1:8000/send_email/. This will trigger the send_registration_email view, and the welcome email will be sent to the specified email address.

Conclusion

Congratulations! You have successfully set up and sent emails using Django. You can extend this functionality to other parts of your web application, such as sending password reset emails, notifications, and more.

Keep in mind that when deploying your application to production, you should use a proper email service provider for reliability and security. Always handle sensitive information like email passwords securely and follow best practices for email communication in your web application.

Learn to Code: Create a Random Number Guessing Game in Python

Azeem Akhtar — Sat, 03 Jun 2023 17:12:17 +0000

In this article, we will walk through the process of creating a simple program that generates a random number and asks the user to guess it. This can be a fun and interactive way to learn about programming and practice your coding skills. We will be using a programming language of your choice, but for the sake of simplicity, we will provide examples in Python.

Generating a Random Number

The first step is to generate a random number that the user will have to guess. In Python, we can make use of the random module to accomplish this. Here's an example code snippet:

import random

def generate_random_number():
    return random.randint(1, 100)

The random.randint(a, b) function generates a random integer between a and b, inclusive. In this case, we are generating a random number between 1 and 100. Feel free to adjust the range according to your preferences.

Asking the User for Guesses

Now that we have a random number, we can start asking the user to guess it. We will prompt the user for input and compare their guess with the randomly generated number. Here's an example code snippet to get you started:

def ask_user_for_guess():
    guess = int(input("Take a guess: "))
    return guess

def check_guess(random_number, user_guess):
    if user_guess < random_number:
        print("Too low!")
    elif user_guess > random_number:
        print("Too high!")
    else:
        print("Congratulations! You guessed it!")

# Main program
random_number = generate_random_number()

while True:
    user_guess = ask_user_for_guess()
    check_guess(random_number, user_guess)
    if user_guess == random_number:
        break

In this code, we define two functions: ask_user_for_guess() and check_guess(random_number, user_guess). The ask_user_for_guess() function prompts the user to enter their guess and returns it as an integer. The check_guess() function compares the user's guess with the randomly generated number and provides feedback accordingly.

We then use a while loop to continuously ask the user for guesses until they guess the correct number. Once the user guesses the correct number, the loop breaks, and the program ends.

Conclusion

Congratulations! You have successfully written a program that generates a random number and asks the user to guess it. This exercise is a great way to practice your coding skills and understand the basics of user input and random number generation in programming.

Feel free to modify the code and add additional features to make the game more interesting. You could keep track of the number of guesses the user takes, provide hints, or even create a high-score system.

Remember to have fun and keep exploring my profile!

React Native Notes Download Complete Learn React Native

Azeem Akhtar — Thu, 01 Jun 2023 20:10:26 +0000

In the dynamic world of mobile app development, React Native has emerged as a game-changer, empowering developers to build captivating applications for both iOS and Android platforms using a single codebase. In this blog post, I’ll share my journey and insights into harnessing the power of React Native, from learning the fundamentals to successfully deploying my first app. Join me as we delve into cross-platform mobile development and discover its limitless possibilities.

React Native Notes

React Native Notes Download Learn mobile app development 2023 | by Azeem Akhtar | Medium

Azeem Akhtar ・ Jun 1, 2023 ・
bigprogrammer.Medium

Master Flexbox: A Comprehensive Guide to Understanding and Using CSS Flexbox

Azeem Akhtar — Thu, 06 Apr 2023 08:14:57 +0000

CSS Flexbox is a powerful layout system that has revolutionized the way we design and structure web pages. With Flexbox, you can easily create complex and responsive layouts that adapt to different screen sizes and devices. In this article, we will take an in-depth look at CSS Flexbox and show you how to master it for your web development projects.

What is CSS Flexbox?

CSS Flexbox, also known as Flexible Box Layout, is a CSS module that enables you to create flexible and responsive layouts for web pages. With Flexbox, you can align and distribute content within a container in any direction, including horizontally and vertically. This is particularly useful for creating complex layouts with multiple columns, rows, and nested elements.

Flexbox Terminology

Before diving into the details of Flexbox, it's essential to understand the terminology used to describe the layout system. Here are some key terms to know:

Flex container: The parent element that contains the flex items.
Flex item: The child element that is placed inside the flex container.
Main axis: The primary axis along which the flex items are arranged. This can be either horizontal or vertical, depending on the flex direction.
Cross axis: The secondary axis perpendicular to the main axis. This is the opposite of the main axis.

Flexbox Properties

There are several Flexbox properties that you can use to customize the layout of your web page. Here are some of the most commonly used properties:

display: This property sets the display mode of the element to "flex" and enables the Flexbox layout.
flex-direction: This property specifies the direction of the main axis. You can set it to "row" for a horizontal layout or "column" for a vertical layout.
justify-content: This property aligns the flex items along the main axis. You can use values like "flex-start," "flex-end," "center," and "space-between" to adjust the spacing and alignment of the items.
align-items: This property aligns the flex items along the cross axis. You can use values like "flex-start," "flex-end," "center," and "stretch" to adjust the positioning of the items.
flex-wrap: This property specifies whether the flex items should wrap to a new line when the container is full. You can use values like "nowrap," "wrap," and "wrap-reverse" to control the wrapping behavior.
align-content: This property aligns the lines of flex items when there are multiple lines within the flex container. You can use values like "flex-start," "flex-end," "center," and "space-between" to adjust the spacing and alignment of the lines.

Flexbox Examples

Let's take a look at some examples of Flexbox in action:

Creating a Simple Flexbox Layout
To create a simple Flexbox layout with two columns, you can use the following CSS code:

.container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.item {
  width: 50%;
}

In this example, we set the display mode of the container to "flex" and specify a horizontal layout with two columns. We also use the "space-between" value for the justify-content property to evenly distribute the columns within the container.

Centering Items with Flexbox

To center an element both horizontally and vertically within a Flexbox container, you can use the following CSS code:

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

In this example, we set the display mode of the container to "flex" and use the "center" value for both the justify-content and align-items properties to center the child element within the container.

Creating a Responsive Flexbox Layout

To create a responsive Flexbox layout that adapts to different screen sizes, you can use media queries to adjust the layout based on the screen width. Here's an example:

.container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.item {
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .container {
    flex-direction: row;
  }
}

In this example, we use a media query to change the flex direction of the container from column to row when the screen width is 768 pixels or larger. This allows the layout to adapt to smaller screen sizes by stacking the items vertically, and then switching to a horizontal layout for larger screens.

Conclusion

CSS Flexbox is a powerful layout system that offers a lot of flexibility and control over the positioning and alignment of elements on a web page. With its intuitive syntax and powerful properties, Flexbox has become a staple of modern web design and development. By mastering Flexbox, you can create beautiful and responsive layouts that work seamlessly across different devices and screen sizes.
How to Learn Django in 2023 as beginners to win Job

DEV Community: Azeem Akhtar

How to Send Emails with Django: A Step-by-Step Guide

Step 1: Set up Django Project

Step 2: Create Django App

Step 3: Configure Email Settings

Step 4: Create Email Template (Optional)

Step 5: Sending Emails from Django Views

Step 6: Configure URL and Test

Conclusion

Learn to Code: Create a Random Number Guessing Game in Python

Generating a Random Number

Asking the User for Guesses

Conclusion

React Native Notes Download Complete Learn React Native

React Native Notes

React Native Notes Download Learn mobile app development 2023 | by Azeem Akhtar | Medium

Azeem Akhtar ・ Jun 1, 2023 ・ bigprogrammer.Medium

Master Flexbox: A Comprehensive Guide to Understanding and Using CSS Flexbox

What is CSS Flexbox?

Flexbox Terminology

Flexbox Properties

Flexbox Examples

Centering Items with Flexbox

Creating a Responsive Flexbox Layout

Conclusion

Azeem Akhtar ・ Jun 1, 2023 ・
bigprogrammer.Medium