Git Product home page Git Product logo

andrewensley-com's Introduction

andrewensley-com's People

Contributors

aensley avatar dependabot[bot] avatar

Watchers

 avatar  avatar

andrewensley-com's Issues

Webpack CSS

https://www.npmjs.com/package/mini-css-extract-plugin#user-content-recommended

const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const options = {
      module: {
        rules: [
          {
            test: /\.(sa|sc|c)ss$/i,
            use: [
              {
                loader: MiniCssExtractPlugin.loader,
                options: {
                  publicPath: '../'
                }
              },
              'css-loader',
              'postcss-loader',
              'sass-loader'
            ]
          }
        ]
      },
      plugins: [].concat([new MiniCssExtractPlugin({
        filename: '[name].css',
        chunkFilename: '[id].css'
      })])
}

Add browser-side performance and UI testing

New Stack

Requirements

  • First-class Blog support with tags and categories
  • MarkDown or MDX source for content
  • Search support
  • Cloudflare pages support
  • Syntax highlighting support

Wants

  • Node-driven installation/build process
  • TypeScript support

Considerations

  • Rendered site performance (download size, and LCP metrics)
  • Build performance
  • Plugins
  • Community support/development
  • SEO

SSG

Next.js

Language: JavaScript, Templates: React

Eleventy

Language: JavaScript, Templates: Liquid, Nunjucks, Handlebars, Mustache, EJS, Haml, Pug, JavaScript, HTML, Markdown

Astro

Language: JavaScript, Templates: Svelte, React, Preact, Vue, HTML

Hugo

Theme

Content

Search

Consider Gmail for sending emails

If problems arise with SendGrid, consider the following solution from AnalyzePlatypus:

Sending email with serverless functions

You can deploy this function on any of the serverless platforms - AWS Lambda, Google Cloud Functions, Azure Functions, Netlify, Cloudflare Workers, etc.

  1. Create a new function and paste in the following code.
  2. You will need to add nodemailer to your package.json (npm i nodemailer), and follow your platform's instructions on bundling dependencies.
  3. Obtain Gmail API credentials for your account. You will need clientID, clientSecret, and refreshToken. Follow this YouTube tutorial
  4. Expose these credentials as the follwing environment variables:
GMAIL_EMAIL_ADDRESS
GMAIL_API_CLIENT_ID
GMAIL_API_CLIENT_SECRET
GMAIL_API_REFRESH_TOKEN
  1. Deploy!
  // Docs on event and context https://www.netlify.com/docs/functions/#the-handler-method
const nodemailer = require("nodemailer");

function createMailClient() {
  return nodemailer.createTransport({
    host: "smtp.gmail.com",
    port: 587,
    secure: false, // true for 465, false for other ports
    auth: {
      type: 'OAuth2',
      user: process.env.GMAIL_EMAIL_ADDRESS,
      clientId: process.env.GMAIL_API_CLIENT_ID,
      clientSecret: process.env.GMAIL_API_CLIENT_SECRET,
      refreshToken: process.env.GMAIL_API_REFRESH_TOKEN,
    }
  });
}


const mailClient = createMailClient();

exports.handler = async (event, context) => {
  try {
    const json = JSON.parse(event.body);
    const gmailResponse = await mailClient.sendMail({
      from: '"Benedict Arnold" <[email protected]>', // sender address
      to: "Sir Henry Clinton <[email protected]>", // list of receivers
      subject: json.subject,
      text: json.text, // plain text body
      html: json.html
    });

    return {
      statusCode: 200,
      body: "Message sent!" + gmailResponse.messageId
    }
  } catch (err) {
    return { statusCode: 500, body: err.toString() }
  }
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.