Hong Nhung

Hong Nhung

1658977380

Gửi Email AWS SES Bằng NodeJS & TypeScript

Làm cách nào để gửi email với AWS SES? Tại đây, chúng tôi gửi một email xác nhận đăng ký đến người dùng.

import { getHTMLTemplate, fillHtmlTemplate, sendEmail } from "../email"

export const sendEmailConfirmationLink = async (
  email: string,
  authLink: string
) => {
  const html = await getHTMLTemplate("auth")

  await sendEmail({
    email,
    body: fillHtmlTemplate(html, {
      "auth-link": authLink,
      email,
    }),
    subject: "Log in to Increaser",
    source: `Login <noreply@increaser.org>`,
  })
}

Đầu tiên, chúng tôi muốn lấy một mẫu HTML. Hàm lấy tên mẫu và đọc nó từ tệp. Tôi đặt tên mẫu giống như HtmlTemplatekiểu.

export const getHTMLTemplate = memoize((template: HtmlTemplate) => {
  return readFile(
    path.resolve(__dirname, `../../templates/${template}.html`),
    "utf8"
  )
})

Tôi không thường gửi email có kiểu dáng lạ mắt để không xuất hiện trong các tab thư rác hoặc quảng cáo của người nhận.

Trong auth-emailmẫu, chúng tôi mong đợi hai biến - liên kết auth và email.

<p>Click the link below to sign in to <b>Increaser</b>.</p>

<p>This link will expire in 20 minutes.</p>

<a href={{auth-link}}>Sign in to Increaser</a>

<p>Confirming this request will securely sign you in using {{email}}.</p>

- Increaser Team

Khi chúng tôi đã đọc tệp thành một chuỗi, chúng tôi sẽ sử dụng fillHtmlTemplatehàm để chèn các biến vào một email html.

export const fillHtmlTemplate = (
  html: string,
  variables: Record<string, string>
) => {
  let result = html
  Object.entries(variables).forEach(([key, value]) => {
    result = result.split(`{{${key}}}`).join(value)
  })

  return result
}

Chúng tôi chuyển email người nhận, nội dung HTML, chủ đề và nguồn cho sendEmailhàm.

Tôi đã chạy Lambda của mình ở khu vực Châu Âu, nhưng AWS SES không hoạt động ở đó. Vì vậy, tôi chuyển vùng Virginia một cách rõ ràng cho hàm tạo SES.

interface SendEmailParameters {
  email: string
  body: string
  subject: string
  source: string
}

const ses = new aws.SES({ region: "us-east-1" })

export const sendEmail = ({
  email,
  body,
  subject,
  source,
}: SendEmailParameters) =>
  ses
    .sendEmail({
      Destination: {
        ToAddresses: [email],
      },
      Message: {
        Body: {
          Html: {
            Data: body,
          },
        },
        Subject: {
          Data: subject,
        },
      },
      Source: source,
    })
    .promise()

Chúng tôi vượt qua Destination, Messagevà Sourceđến phương pháp SES và biến nó thành một lời hứa.

Nguồn: https://radzion.com/blog/ses-send

#typescript #nodejs #aws 

What is GEEK

Buddha Community

Gửi Email AWS SES Bằng NodeJS & TypeScript

Ayan Code

1656193861

Simple Login Page in HTML and CSS | Source Code

Hello guys, Today in this post we’ll learn How to Create a Simple Login Page with a fantastic design. To create it we are going to use pure CSS and HTML. Hope you enjoy this post.

A login page is one of the most important component of a website or app that allows authorized users to access an entire site or a part of a website. You would have already seen them when visiting a website. Let's head to create it.

Whether it’s a signup or login page, it should be catchy, user-friendly and easy to use. These types of Forms lead to increased sales, lead generation, and customer growth.


Demo

Click to watch demo!

Simple Login Page HTML CSS (source code)

<!DOCTYPE html>
  <html lang="en" >
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
  <link rel="stylesheet" href="styledfer.css">
  </head>

  <body>
   <div id="login-form-wrap">
    <h2>Login</h2>
    <form id="login-form">
      <p>
      <input type="email" id="email" name="email" placeholder="Email " required><i class="validation"><span></span><span></span></i>
      </p>
      <p>
      <input type="password" id="password" name="password" placeholder="Password" required><i class="validation"><span></span><span></span></i>
      </p>
      <p>
      <input type="submit" id="login" value="Login">
      </p>

      </form>
    <div id="create-account-wrap">
      <p>Don't have an accout? <a href="#">Create One</a><p>
    </div>
   </div>
    
  <script src='https://code.jquery.com/jquery-2.2.4.min.js'></script>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js'></script>
  </body>
</html>

CSS CODE

body {
  background-color: #020202;
  font-size: 1.6rem;
  font-family: "Open Sans", sans-serif;
  color: #2b3e51;
}
h2 {
  font-weight: 300;
  text-align: center;
}
p {
  position: relative;
}
a,
a:link,
a:visited,
a:active {
  color: #ff9100;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
a:focus, a:hover,
a:link:focus,
a:link:hover,
a:visited:focus,
a:visited:hover,
a:active:focus,
a:active:hover {
  color: #ff9f22;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
#login-form-wrap {
  background-color: #fff;
  width: 16em;
  margin: 30px auto;
  text-align: center;
  padding: 20px 0 0 0;
  border-radius: 4px;
  box-shadow: 0px 30px 50px 0px rgba(0, 0, 0, 0.2);
}
#login-form {
  padding: 0 60px;
}
input {
  display: block;
  box-sizing: border-box;
  width: 100%;
  outline: none;
  height: 60px;
  line-height: 60px;
  border-radius: 4px;
}
#email,
#password {
  width: 100%;
  padding: 0 0 0 10px;
  margin: 0;
  color: #8a8b8e;
  border: 1px solid #c2c0ca;
  font-style: normal;
  font-size: 16px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  display: inline-block;
  background: none;
}
#email:focus,
#password:focus {
  border-color: #3ca9e2;
}
#email:focus:invalid,
#password:focus:invalid {
  color: #cc1e2b;
  border-color: #cc1e2b;
}
#email:valid ~ .validation,
#password:valid ~ .validation 
{
  display: block;
  border-color: #0C0;
}
#email:valid ~ .validation span,
#password:valid ~ .validation span{
  background: #0C0;
  position: absolute;
  border-radius: 6px;
}
#email:valid ~ .validation span:first-child,
#password:valid ~ .validation span:first-child{
  top: 30px;
  left: 14px;
  width: 20px;
  height: 3px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
#email:valid ~ .validation span:last-child
#password:valid ~ .validation span:last-child
{
  top: 35px;
  left: 8px;
  width: 11px;
  height: 3px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.validation {
  display: none;
  position: absolute;
  content: " ";
  height: 60px;
  width: 30px;
  right: 15px;
  top: 0px;
}
input[type="submit"] {
  border: none;
  display: block;
  background-color: #ff9100;
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  font-size: 18px;
  position: relative;
  display: inline-block;
  cursor: pointer;
  text-align: center;
}
input[type="submit"]:hover {
  background-color: #ff9b17;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

#create-account-wrap {
  background-color: #eeedf1;
  color: #8a8b8e;
  font-size: 14px;
  width: 100%;
  padding: 10px 0;
  border-radius: 0 0 4px 4px;
}

Congratulations! You have now successfully created our Simple Login Page in HTML and CSS.

My Website: codewithayan, see this to checkout all of my amazing Tutorials.

Hong Nhung

Hong Nhung

1658977380

Gửi Email AWS SES Bằng NodeJS & TypeScript

Làm cách nào để gửi email với AWS SES? Tại đây, chúng tôi gửi một email xác nhận đăng ký đến người dùng.

import { getHTMLTemplate, fillHtmlTemplate, sendEmail } from "../email"

export const sendEmailConfirmationLink = async (
  email: string,
  authLink: string
) => {
  const html = await getHTMLTemplate("auth")

  await sendEmail({
    email,
    body: fillHtmlTemplate(html, {
      "auth-link": authLink,
      email,
    }),
    subject: "Log in to Increaser",
    source: `Login <noreply@increaser.org>`,
  })
}

Đầu tiên, chúng tôi muốn lấy một mẫu HTML. Hàm lấy tên mẫu và đọc nó từ tệp. Tôi đặt tên mẫu giống như HtmlTemplatekiểu.

export const getHTMLTemplate = memoize((template: HtmlTemplate) => {
  return readFile(
    path.resolve(__dirname, `../../templates/${template}.html`),
    "utf8"
  )
})

Tôi không thường gửi email có kiểu dáng lạ mắt để không xuất hiện trong các tab thư rác hoặc quảng cáo của người nhận.

Trong auth-emailmẫu, chúng tôi mong đợi hai biến - liên kết auth và email.

<p>Click the link below to sign in to <b>Increaser</b>.</p>

<p>This link will expire in 20 minutes.</p>

<a href={{auth-link}}>Sign in to Increaser</a>

<p>Confirming this request will securely sign you in using {{email}}.</p>

- Increaser Team

Khi chúng tôi đã đọc tệp thành một chuỗi, chúng tôi sẽ sử dụng fillHtmlTemplatehàm để chèn các biến vào một email html.

export const fillHtmlTemplate = (
  html: string,
  variables: Record<string, string>
) => {
  let result = html
  Object.entries(variables).forEach(([key, value]) => {
    result = result.split(`{{${key}}}`).join(value)
  })

  return result
}

Chúng tôi chuyển email người nhận, nội dung HTML, chủ đề và nguồn cho sendEmailhàm.

Tôi đã chạy Lambda của mình ở khu vực Châu Âu, nhưng AWS SES không hoạt động ở đó. Vì vậy, tôi chuyển vùng Virginia một cách rõ ràng cho hàm tạo SES.

interface SendEmailParameters {
  email: string
  body: string
  subject: string
  source: string
}

const ses = new aws.SES({ region: "us-east-1" })

export const sendEmail = ({
  email,
  body,
  subject,
  source,
}: SendEmailParameters) =>
  ses
    .sendEmail({
      Destination: {
        ToAddresses: [email],
      },
      Message: {
        Body: {
          Html: {
            Data: body,
          },
        },
        Subject: {
          Data: subject,
        },
      },
      Source: source,
    })
    .promise()

Chúng tôi vượt qua Destination, Messagevà Sourceđến phương pháp SES và biến nó thành một lời hứa.

Nguồn: https://radzion.com/blog/ses-send

#typescript #nodejs #aws 

Adolphus Tillman

Adolphus Tillman

1658934720

Send AWS SES Emails with NodeJS & TypeScript

How to send an email with AWS SES? Here we send a signup confirmation email to a user.

See more at: https://radzion.com/blog/ses-send

#typescript #nodejs #aws 

Luis Rodrigues

Luis Rodrigues

1604162762

Sending Email using AWS Lambda and Amazon SES

In this article, we’ll discuss the procedure to build a Lambda function that will send an email to the specified recipient from the specified sender using Amazon Simple Email Service (SES). In this project, we’ll do everything in AWS console.

Before beginning, let’s understand some key concepts.

Amazon Simple Email Service (SES)

Amazon SES is an email platform that provides an easy, cost-effective way for us to send and receive email using our own email addresses and domains.

Using SES, we can send marketing emails such as special offers, transactional emails such as order confirmations, and other types of correspondence such as newsletters. When we use Amazon SES to receive mail, we can develop software solutions such as email autoresponders, email unsubscribe systems, and applications that generate customer support tickets from incoming emails.

Amazon SES eliminates infrastructure challenges such as email server management, network configuration etc.

#programming #nodejs #aws #aws-lambda #aws-simple-email-service

Everett Collier

Everett Collier

1622821020

How AWS SES differ from other Email Services?

How does AWS SES Works?

Amazon Web Services, or AWS, is probably the most widely adopted Cloud Computing Platform. Amongst virtual servers, artificial intelligence services, and numerous types of databases, they offer a simple email service as well. This is known as Amazon SES or Simple Email Service. If your app is already hosted on Amazon, you can definitely consider integrating it into your email infrastructure.

What is Amazon SES or Simple Email Service?

As the name describes, it is an email service for sending both Transactional and Mass emails. It is cloud-based and offers a wide list of possible integrations. You have your SMTP interface, which is your Simple Mail Transfer Protocol, which is a communication protocol for email transmission. As an Internet standard, your SMTP is an application that is used to send, receive and relay outgoing emails between senders and receivers. When an email is sent, it’s transferred over the Internet from one server to another using SMTP. In simpler terms, an SMTP email is just an email sent using the SMTP server. You also have the AWS SDK with seamless integration with your applications and even email clients or other types of software.

#aws #amazon #email #cloud-computing #aws ses