/copii

Copy button for GitHub Readme files 🎉 🎉 🎉 Ready to use

Primary LanguageHTMLMIT LicenseMIT

Copii

Copy button for GitHub Readme files 🎉 🎉 🎉 Ready to use

Every example below is fully functional, you can test it by clicking the buttons.



Table of Contents



Features

  1. Dark mode for redirecting page
  2. Support for custom logo in redirecting page
  3. Can be used to copy upto 1,500 characters ( can vary depending upon the length of URL of custom logo ).
  4. And many more coming


Demo 👇

Demo



How to use Copii 👇

How to use Copii's

image.png

  • Check the check box if you want Dark Mode in redirecting page ( optional )

image.png

  • Enter the text/code you want to be copied when the user clicks on Copy button in README file

image.png

  • Enter the URL ( optional ) for custom logo in redirecting page

image.png

  • Click on Generate

image.png

  • Now you will be able to see 3 buttons that you can use

image.png

  • Click on any of the button to copy its markdown code. When a user clicks on any of button in README or any other rendered markdown file, user will be taken to https://copii.vercel.app/?ct=hi( for example ) and the text/code gets copied to clipboard there. Now, the user will be redirected back to same part webpage/github readme back with the help of History API

  • Paste the markdown code in your markdown file/readme file and you are good to go 😲



Default Copy button

Click on Copy button to see Copii in action
After clicking it, you will find Hello Copii !! in your clipboard

copy



Copy below code button

copy

const stripe = require("stripe")(process.env.STRIPE_API_KEY);

export default async (req, res) => {
  const session = await stripe.checkout.sessions.create({
    payment_method_types: ["card"],
    line_items: [
      {
        name: "Serverless Functions – The Complete Guide",
        description: "100 page e-book on serverless functions.",
        images: ["https://site.com/image.png"],
        amount: "5000", // Cents
        currency: "usd",
        quantity: 1,
      },
    ],
    success_url: "https://site.com/success?session_id={CHECKOUT_SESSION_ID}",
    cancel_url: "https://site.com",
  });

  return res.status(200).json(session);
};


Copy above code button

import fetch from "isomorphic-unfetch";

export default async (req, res) => {
  const { email } = req.body;

  if (!email) {
    return res.status(400).json({ error: "Email is required" });
  }

  try {
    const LIST_ID = process.env.MAILCHIMP_LIST_ID;
    const API_KEY = process.env.MAILCHIMP_API_KEY;
    const DATACENTER = API_KEY.split("-")[1];

    const data = {
      email_address: email,
      status: "subscribed",
    };

    const response = await fetch(
      `https://${DATACENTER}.api.mailchimp.com/3.0/lists/${LIST_ID}/members`,
      {
        body: JSON.stringify(data),
        headers: {
          Authorization: `apikey ${API_KEY}`,
          "Content-Type": "application/json",
        },
        method: "POST",
      }
    );

    if (response.status >= 400) {
      return res.status(400).json({
        error: `There was an error subscribing to the newsletter. Shoot me an email at [me@leerob.io] and I'll add you to the list.`,
      });
    }

    return res.status(201).json({ error: "" });
  } catch (error) {
    return res.status(500).json({ error: error.message || error.toString() });
  }
};

copy

Code snippets copied from https://leerob.io/snippets