npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@snowdog/pigeon

v1.1.1

Published

<p align="center"> <img src="./assets/logo.svg" height="200"> </p>

Downloads

3

Readme

Pigeon

Simple open-source serverless API for sending emails and building forms effortlessly.

Features

  • Simple - Designed to remove the necessity of using Wordpress or another big backend just to have a contact form on the landing page
  • Fast and lightweight - Serverless oriented, no framework, no database or other system-wide requirements
  • Form fields config - You don't have to hardcode your form fields on front-end anymore, get them from API and build UI on the fly.
  • All well-knows SMTP services support - Under the hood, we are using nodemailer and it supports a bunch of well-known SMTP services
  • No Admin Panel - You are not limited by the UI or poor UX, just you and one JS config file
  • Front-end agnostic - Simple REST API can be used by any application

Demo

Demo

Source code

API

POST /

Endpoint used to handle form submits

const form = document.querySelector('#form')
const bodyFormData =  new FormData(form)
axios({
  method: 'post',
  url: '/',
  data: bodyFormData,
  headers: { 'Content-Type': 'multipart/form-data' },
  params: { id: 'myFormId' }
})

GET /

Get configuration of form fields

const { data } = axios.get('/', { params: { id: 'myFormId' } })
console.log(data)
// [
//   {
//     id: 'email',
//     type: 'email',
//     name: 'email',
//     label: 'Email',
//     required: true
//   }
// ]

Config file

Defaults

{
  locale: 'en-US',
  dev: {
    port: 8080
  },
  cors: {
    allowedOrigins: []
  },
  transport: {
    service: SERVICE,
    secure: true,
    auth: {
      user: USER,
      pass: PASS
    }
  },
  forms: {
    default: {
      mail: (params) => ({
        from: '[email protected]',
        to: '[email protected]',
        subject: 'Default subject',
        text: Object.keys(params).map(key => `${key}: ${params[key]}\n`).join('')
      }),
      fields: []
    }
  }
}

You can overwrite each part of this config by creating pigeon.config.js.

transport is nodemailer's SMTP transport config object. By default, we are taking ENV variables SERVICE, USER and PASS to hydrate it.

cors is used to set Access-Control-Allow-Origin header acordingly to the settings.

forms object keys are used as IDs in requests params.

For security reasons you shouldn't keep user and password directly in the config file, but for example, keep them as a secret variables if you are using Vercel.

Local testing

To test and expose mailer locally on your machine run yarn dev / npm run dev Development emails are send via ethereal.email service, instead of your desired SMTP transport, to preview sent messages.