Release v1.5.0 – Portfolio Polish & Project Section Tweak

feat: custom pinned projects with detailed pages and JSON data structure

Author: Amitminer

.env example

@@ -3,3 +3,4 @@ NEXT_PUBLIC_LOCAL_BACKEND_URL=http://localhost:8000/api/github
 NEXT_PUBLIC_FORMSPREE_FORM_ID=your-formspree-form-id
 NEXT_PUBLIC_TURNSTILE_SITE_KEY=your-turnstile-site-key
 NEXT_PUBLIC_EMAIL=your@email.com
+NEXT_PUBLIC_UPI_ID=your_name@upi

.github/workflows/nextjs.yml

@@ -18,6 +18,7 @@ jobs:
       NEXT_PUBLIC_FORMSPREE_FORM_ID: ${{ secrets.FORMSPREE_FORM_ID }}
       NEXT_PUBLIC_TURNSTILE_SITE_KEY: ${{ secrets.TURNSTILE_SITE_KEY }}
       NEXT_PUBLIC_EMAIL: ${{ secrets.EMAIL }}
+      NEXT_PUBLIC_UPI_ID: ${{ secrets.UPI_ID }}
     steps:
       - name: Checkout
         uses: actions/checkout@v4

README.md

@@ -1,19 +1,19 @@
 # 🧑‍💻 Portfolio Website
 
-This is my personal developer portfolio built using **Next.js**, styled with **Tailwind CSS**, and integrated with a dynamic GitHub API backend.
+Welcome to my personal portfolio — a fast, minimal, and modern site built with **Next.js**, styled using **Tailwind CSS**, and powered by a custom **GitHub API backend**.
 
----
+🔗 **Live Preview**: [amitminer.github.io](https://amitminer.github.io/)  
+📁 **Backend Repo**: [github-api-backend](https://github.com/amitxd75/github-api-backend)
 
 ## 🚀 Quick Start
 
 ### 1. Clone & Install Dependencies
 
 ```bash
-git clone [https://github.com/amitminer/amitminer.github.io.git](https://github.com/amitminer/amitminer.github.io.git)
+git clone https://github.com/Amitminer/amitminer.github.io.git
 cd amitminer.github.io
 pnpm install
 ```
-
 ### 2. Set Up Environment Variables
 
 Create the `.env.local` file:
@@ -24,25 +24,25 @@ cp .env.example .env.local
 
 Then edit `.env.local` with your values. See the [Environment Variables](#environment-variables) section below for the complete list of required variables.
 
------
+---
 
 ### 3. Backend Setup (Required)
 
 > 📦 GitHub Stats & Projects require a backend API.
 
 To enable dynamic GitHub stats and repositories:
 
-1.  Clone the backend repo:
-    👉 https://github.com/amitxd75/github-api-backend
+1. Clone the backend repo:
+   👉 [https://github.com/amitxd75/github-api-backend](https://github.com/amitxd75/github-api-backend)
 
-2.  Follow its `README.md` to deploy it:
+2. Follow its `README.md` to deploy it:
 
-      * Locally (for dev)
-      * Or via Netlify Functions (recommended)
+   * Locally (for dev)
+   * Or via Netlify Functions (recommended)
 
 Once deployed, use that backend URL as `NEXT_PUBLIC_BACKEND_URL` in `.env.local`.
 
------
+---
 
 ### 4. Run Development Server
 
@@ -51,13 +51,13 @@ pnpm dev
 ```
 
 Visit your local site at:
-📍 http://localhost:3000
+📍 [http://localhost:3000](http://localhost:3000)
 
------
+---
 
-## Environment Variables
+## 🌐 Environment Variables
 
-Create a `.env` file in the root directory with the following variables:
+Create a `.env.local` file in the root directory with the following variables:
 
 ```env
 # Backend API URLs
@@ -72,28 +72,39 @@ NEXT_PUBLIC_FORMSPREE_FORM_ID=
 
 # Cloudflare Turnstile Site Key for anti-spam protection
 NEXT_PUBLIC_TURNSTILE_SITE_KEY=
+
+# UPI ID for support/donations
+NEXT_PUBLIC_UPI_ID=your_name@upi
 ```
 
+---
+
 ## 📡 API Backend
 
 Backend Repo → [github-api-backend](https://github.com/amitxd75/github-api-backend)
 Set it up properly, deploy to your server or Netlify, and configure `NEXT_PUBLIC_BACKEND_URL` in `.env.local`.
 
 This enables real-time GitHub stats, repo data, and caching.
 
-## 🚀 Docker
+---
+
+## 🐳 Docker
 
 You can now run this app using Docker for easy deployment and local development.
 
 ### Build the Docker image
+
 ```sh
 docker build -t my-portfolio-app .
 ```
 
 ### Run the Docker container
+
 ```sh
-docker run -p 3000:3000 --env-file .env my-portfolio-app
+docker run -p 3000:3000 --env-file .env.local my-portfolio-app
 ```
 
-- The app will be available at [http://localhost:3000](http://localhost:3000)
-- Make sure to set up your `.env` file with the required environment variables before running.
+The app will be available at [http://localhost:3000](http://localhost:3000)
+Make sure to set up your `.env.local` file before running.
+
+```

app/assets/projects/compressorx.webp

@@ -0,0 +1,27 @@
+import Portfolio from './portfolio.webp';
+import CompressorX from './compressorx.webp';
+import EncryptX from './encryptx.webp';
+import DocsX from './docsx.webp';
+
+// Note: For preview images, I'm using the project's thumbnail image as the preview.
+// For CompressorX, a dedicated preview image is used.
+import CompressorXPreview from './preview/compressorx_hero.webp';
+import PortfolioPreview from './portfolio.webp'; // using thumbnail as preview
+import EncryptXPreview from './encryptx.webp';   // using thumbnail as preview
+import DocsXPreview from './docsx.webp';         // using thumbnail as preview
+
+import { StaticImageData } from 'next/image';
+
+export const projectImages: Record<string, StaticImageData> = {
+  'amitminer-portfolio': Portfolio,
+  'compressorx': CompressorX,
+  'encryptx': EncryptX,
+  'docsx': DocsX,
+};
+
+export const previewImages: Record<string, StaticImageData> = {
+  'amitminer-portfolio': PortfolioPreview,
+  'compressorx': CompressorXPreview,
+  'encryptx': EncryptXPreview,
+  'docsx': DocsXPreview,
+}; 

app/assets/projects/docsx.webp

@@ -1,7 +1,7 @@
 /**
  * Footer component that displays website footer content with dynamic elements.
  * 
- * - Responsive design with desktop detection
+ * - Design with desktop detection
  * - Shows visitor counter only on desktop when scrolled to bottom
  * - Displays copyright year, love animation, and social links
  * - Includes open source project link