nostalcade/catcha

Simple Client-side integration of reCAPTCHA v2 to obtain response tokens for testing purposes.

---

Simple Client-side integration of reCAPTCHA v2 to obtain response tokens for testing purposes.

Features

• PWA Support

• Mobile-Friendly

Tech Stack

• Runtime Environment

  • Node.js

• Build

  • Vite

• UI

  • React

• Router

  • React Router

• Style

  • Tailwind CSS

  • Prettier plugin for Tailwind CSS

  • PostCSS

  • Autoprefixer

• reCAPTCHA

  • React Google reCAPTCHA

Environment Variables

⚠️ Before running it, you must obtain the following values to initialize the required variables.

Variable	Value	Description
VITE_RECAPTCHA_PUBLIC_KEY	Private/Public Site Key	Required. Public Site Key for React Google reCAPTCHA and Private Site Key for Server-side validation. In Domains, you have to add "localhost".

Run

Install required

• Node.js/npm

Locally

Clone the repository

• HTTPS

  git clone https://github.com/nostalcade/catcha.git

• SSH

  git clone [email protected]:nostalcade/catcha.git

Go to the repository directory

cd catcha/

Install dev/Dependencies

npm i

Add Environment Variables to .env file

• You must replace "somevalue" with your own values.

echo $'VITE_RECAPTCHA_PUBLIC_KEY=somevalue' >> .env

Clear Bash History

history -cw

Start dev server

npm run dev

In the browser, go to

http://localhost:5173

All-In-One

• HTTPS

  git clone https://github.com/nostalcade/catcha.git; cd catcha/; npm i; echo $'VITE_RECAPTCHA_PUBLIC_KEY=somevalue' >> .env; history -cw; npm run dev;

• SSH

  git clone [email protected]:nostalcade/catcha.git; cd catcha/; npm i; echo $'VITE_RECAPTCHA_PUBLIC_KEY=somevalue' >> .env; history -cw; npm run dev;

Screenshots

Desktop

Mobile

License

• MIT