Back to templates

Template details

Edgy

Full-stack React website template for a fictional Instagram growth agency with user accounts and a reCAPTCHA-protected contact form.

About this template

Edgy is a full-stack website template for a fictional Instagram growth agency, built with React, Node.js, Express, and Tailwind CSS, that demonstrates a complete marketing site with user account management and a secured contact form. Created by Catherine (catherineisonline on GitHub), the project serves as a portfolio-ready demonstration of a real-world agency site without being a real business.

What is Edgy?

Edgy is a full-stack website template for a fictional social media marketing agency specializing in Instagram growth. It combines a React frontend with a Node.js/Express backend, styled with Tailwind CSS, and includes user authentication, profile management, and a contact form protected by Google reCAPTCHA. The project is released under the MIT License and is fork-friendly, so developers can adapt it for their own use.

Key Features

  • User authentication — Sign up and log in with an email address and password; authenticated users receive a personalized account.
  • Profile management — Users can view, update, or delete their profile, which stores full name, email, account creation date, and optional gender and pricing plan preference.
  • Password update — Logged-in users can change their passwords at any time to improve account security.
  • Secure contact form — The contact form collects name, email, subject, and message, validates the input, and requires a Google reCAPTCHA verification step before submission.
  • Customizable pricing plans — The site presents flexible pricing options that can be tailored to a user's needs, though no real payments are processed.
  • Blog and career pages — Included sections for Instagram marketing articles and job opportunities, giving the template a complete agency site structure.
  • Integrations — Uses Airtable for data storage, Express with cors and dotenv for the backend, uuid for identifiers, and Moment.js for date formatting.

Who is it for?

  • Full-stack developers — They can study how a React frontend communicates with an Express API and Airtable, and use the code as a base for similar projects.
  • Job seekers and portfolio builders — The MIT license allows developers to fork the project, customize it, and showcase it in a personal portfolio.
  • Agency website designers — They can use Edgy as a starting point for a client site that needs account features, a lead-capture form, and a blog.
  • Social media marketing students — The fictional setup provides a realistic practice environment for exploring Instagram growth strategies and web design.

What can you do with Edgy?

  • Build a demo agency site — Replace the fictional branding with your own agency name and services to create a polished landing page.
  • Implement user account flows — Test signup, login, profile editing, and password changes in a working React/Express application.
  • Capture leads securely — Use the reCAPTCHA-protected contact form to collect inquiries from visitors while blocking automated spam.
  • Learn integration patterns — Explore how a React app talks to an Express backend and Airtable as a database, a common full-stack pattern.

FAQ

Is Edgy a real business?

No, Edgy is a fictional social media marketing agency created for demonstration purposes. The website does not offer real services or consultations and is intended to showcase a hypothetical business model.

What tech stack does Edgy use?

Edgy's frontend is built with React and React Router, and its backend uses Node.js with Express. Styling is handled by Tailwind CSS, and key integrations include Airtable for data, Google reCAPTCHA for form security, and utilities like cors, dotenv, uuid, and Moment.js.

Is Edgy free to use?

Yes, the project is released under the MIT License. You are free to use, modify, and distribute it, and you can include your adaptations in a personal portfolio as long as you follow the license terms.

Can I contribute to Edgy?

The author is not currently accepting external contributions like pull requests, but welcomes suggestions and ideas via GitHub discussions or the creator's social media channels. The project is fork-friendly for those who want to create their own version.

Does Edgy have a working contact form?

Yes, the contact form accepts a name, email address, subject, and message. It includes input validation and a Google reCAPTCHA verification step to prevent spam submissions.