Shopify Custom Career Form with Backend API Setup

A robust and secure Node.js/Express backend designed to handle job application submissions. This project is specifically tailored for integration with Shopify stores, providing a professional way to collect applicant data and resumes.

🚀 Features

• Form Submission: Processes detailed applicant information (Name, Email, Experience, CTC, etc.).
• Resume Upload: Securely handles file uploads (PDF, DOC, DOCX) using Multer.
• Email Notifications: Sends professional, HTML-formatted emails to HR via Nodemailer with the resume attached.
• Security First:
  • HMAC Signature Verification: Validates requests using a shared secret key and timestamp to prevent unauthorized access.
  • Rate Limiting: Protects against spam by limiting applications to 5 per hour per IP.
  • Honeypot Protection: Secret field to detect and block automated bot submissions.
  • Security Headers: Uses Helmet to secure Express apps by setting various HTTP headers.
• Input Validation: Uses validator to ensure data integrity (e.g., valid email formats).

🛍️ Shopify Integration

This repository includes a ready-to-use Shopify component: application-form.liquid.

• Plug & Play: This file can be added directly to any Shopify store as a new Section.
• Career Form: It provides a professional UI for job seekers to submit their applications.
• API Key Mandatory: To enable email verification and secure submission, you must configure your API_KEY in the Liquid file to match the one in your backend .env file. This key is used to generate the HMAC signature required for every request.

🛠️ Tech Stack

• Runtime: Node.js
• Framework: Express.js
• File Uploads: Multer
• Emails: Nodemailer
• Security: Helmet, Express-Rate-Limit
• Validation: Validator.js

📋 Prerequisites

• Node.js (v14 or higher)
• npm or yarn
• An SMTP server (like Gmail, SendGrid, or Outlook) for sending emails.

⚙️ Installation & Setup

1. Clone the repository:

   git clone https://github.com/rahul-hytrox/Shopify-Email-Form-API-V1.0.0.git
   cd Shopify-Email-Form-API-V1.0.0

2. Install dependencies:

   npm install

3. Configure Environment Variables: Create a .env file in the root directory and add the following:

   PORT=5000
   API_KEY=your_secret_api_key_here
   
   # SMTP Configuration
   SMTP_HOST=smtp.gmail.com
   SMTP_PORT=587
   SMTP_USER=your-email@gmail.com
   SMTP_PASS=your-app-password
   SMTP_FROM=Careers Portal <your-email@gmail.com>
   
   # Recipient Configuration
   HR_EMAIL=hr-inbox@yourcompany.com

📧 How to get Gmail SMTP Credentials

To send emails using a Gmail account, you should use an App Password instead of your regular Gmail password for better security.

1. Enable 2-Step Verification: Go to your Google Account Security settings and ensure 2-Step Verification is turned ON.

2. Generate App Password:

   • In the search bar at the top of your Google Account page, type "App passwords".
   • Select App passwords.
   • Enter a name for the app (e.g., "Shopify Careers Backend").
   • Click Create.

3. Copy the Password: A 16-character code will appear in a yellow box. Copy this code and use it as your SMTP_PASS in the .env file.

   • Note: Do not include the spaces when pasting the password.

4. SMTP Details:

   • SMTP_HOST: smtp.gmail.com
   • SMTP_PORT: 587 (TLS) or 465 (SSL)

5. Start the server:

   For Production:

   npm start

   For Development (with auto-reload):

   npm run dev

   (Note: Ensure nodemon is installed globally or as a dev dependency for the dev script to work.)

🔌 API Endpoints

Submit Application

• URL: /shop-api/submit-application
• Method: POST
• Auth Required: Yes (HMAC Signature)
• Content-Type: multipart/form-data

Field	Type	Description
firstName	String	Applicant's first name.
lastName	String	Applicant's last name.
email	String	Applicant's email address.
contactNum	String	Applicant's phone number.
experience	String	Years of experience.
ctc	String	Current CTC.
ectc	String	Expected CTC.
noticePeriod	String	Notice period (e.g., 30 days).
jobId	String	Unique ID of the job listing.
jobTitle	String	Title of the job.
resume	File	The applicant's resume (PDF/DOC/DOCX).
website	String	Honeypot field - Must be left empty.

Required Headers

To successfully call the API, you must provide the following headers:

• X-Timestamp: Current Unix timestamp in seconds.
• X-Signature: HMAC-SHA256 hash of the X-Timestamp using your API_KEY.

💻 Manual AJAX Submission (JavaScript)

If you are building a custom frontend, you can submit the form manually using JavaScript. Note that you must generate the HMAC signature to pass the security check.

async function submitApplication(formData) {
    const API_KEY = 'your_shared_secret_key'; // Keep this safe!
    const timestamp = Math.floor(Date.now() / 1000).toString();
    
    // Generate HMAC Signature using CryptoJS (or similar)
    const signature = CryptoJS.HmacSHA256(timestamp, API_KEY).toString();

    try {
        const response = await fetch('https://your-api-url.com/shop-api/submit-application', {
            method: 'POST',
            headers: {
                'X-Timestamp': timestamp,
                'X-Signature': signature
            },
            body: formData // Must be FormData object for file uploads
        });

        const result = await response.json();
        if (result.success) {
            console.log('Application submitted!', result.message);
        } else {
            console.error('Submission failed:', result.message);
        }
    } catch (error) {
        console.error('Error:', error);
    }
}

🛡️ Security Implementation

HMAC Signature Logic

The server verifies that the request is legitimate by calculating an expected signature:

const crypto = require('crypto');
const expectedSignature = crypto
    .createHmac('sha256', process.env.API_KEY)
    .update(timestamp)
    .digest('hex');

If the provided X-Signature doesn't match, the request is rejected.

📁 Project Structure

shopify-application-form/
├── controllers/
│   └── applicationController.js  # Main logic for processing submissions
├── middleware/
│   └── auth.js                   # Security & Rate limiting middleware
├── routes/
│   └── applicationRoutes.js      # API route definitions
├── uploads/                      # Temporary storage for uploaded resumes
├── server.js                     # App entry point
├── package.json                  # Dependencies and scripts
└── .env                          # Environment configuration (Sensitive!)

🤝 Contributing & Collaboration

This project is open-source and I welcome contributions from the community! Whether it's fixing bugs, adding new features, or improving documentation, feel free to:

1. Fork the repository.
2. Create a new branch (git checkout -b feature-name).
3. Commit your changes.
4. Push to the branch.
5. Open a Pull Request.

For any queries or suggestions, feel free to reach out or follow my work:

• GitHub: @rahul-hytrox
• Our Shopify Team : @Aditya,@Rushi,@shailesh,@Sonu

📄 License

This project is licensed under the MIT License. Feel free to use, modify, and distribute it.