ImageCDN

A modern image optimization and delivery service built with SvelteKit. Upload once, serve everywhere with automatic optimization and lightning-fast delivery.

---

Features

🔽 Smart Optimization

• Automatic image optimization and format conversion
• Supports WebP, JPG, and PNG formats
• Generates multiple size variants automatically

⚡ High Performance

• Global CDN distribution
• Responsive image variants for all devices
• Lightning-fast loading times worldwide

🛠️ Easy Integration

• Simple and intuitive upload interface
• Copy-paste URLs for different sizes
• Dashboard for managing images

🔒 Secure

• User authentication for access control
• Protected image uploads
• Secure CDN delivery with encrypted endpoints

---

Tech Stack

• Frontend: SvelteKit, TailwindCSS
• Backend: Node.js, PostgreSQL (Neon)
• Storage: GitHub as CDN
• Authentication: JWT

---

Installation

Step 1: Clone the Repository

git clone https://github.com/ifsvivek/ImageCDN
cd ImageCDN

Step 2: Install Dependencies

npm install

Step 3: Configure Environment Variables

Create a .env file in the root directory with the following variables:

ACCESS_TOKEN="your_github_personal_access_token"
POSTGRES_URL="your_neon_postgres_connection_string"
JWT_SECRET="your_random_secret_key"

---

Configuration

GitHub Setup

1. Create a new repository named CDN in your GitHub account.

2. Generate a personal access token with repo permissions.

3. Update the following lines in src/routes/api/upload/+server.js with your GitHub username:

   await octokit.repos.createOrUpdateFileContents({
   	owner: 'your-github-username',
   	repo: 'CDN',
   	path,
   	message: `Upload ${path}`,
   	content: resizedImage.toString('base64'),
   	branch: 'main'
   });
   
   const fileData = await octokit.repos.getContent({
   	owner: 'your-github-username',
   	repo: 'CDN',
   	path
   });
   
   await octokit.repos.deleteFile({
   	owner: 'your-github-username',
   	repo: 'CDN',
   	path,
   	message: `Delete ${path}`,
   	sha: fileData.data.sha,
   	branch: 'main'
   });
   
   return json({
   	success: true,
   	urls: sizes.map(
   		(size) =>
   			`https://cdn.your-github-username.io/${userId}/${timestamp}/image_${size}.${format}`
   	)
   });

Database Setup

1. Create a free database on Neon.

2. Execute the following SQL commands to create the required tables:

   CREATE TABLE user_table (
       user_id SERIAL PRIMARY KEY,
       email VARCHAR(255) UNIQUE NOT NULL,
       password VARCHAR(255) NOT NULL,
       user_name VARCHAR(255) NOT NULL
   );
   
   CREATE TABLE user_images (
       id SERIAL PRIMARY KEY,
       user_id INTEGER REFERENCES user_table(user_id),
       foldername VARCHAR(255) NOT NULL,
       format VARCHAR(10) NOT NULL,
       created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
   );
   
   CREATE TABLE api_keys (
       id SERIAL PRIMARY KEY,
       user_id INTEGER REFERENCES user_table(user_id),
       api_key VARCHAR(255) UNIQUE NOT NULL,
       created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
   );
   
   CREATE TABLE api_usage (
       id SERIAL PRIMARY KEY,
       user_id INTEGER REFERENCES user_table(user_id),
       api_key VARCHAR(255) REFERENCES api_keys(api_key),
       used_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
   );

---

Development

Start the development server:

npm run dev

Building for Production

Build the project:

npm run build

Preview the production build:

npm run preview

---

Usage Notes

After uploading images, please allow up to 20 minutes for processing and CDN availability. This ensures optimal compression and format conversion.

---

Environment Variables

• ACCESS_TOKEN: GitHub personal access token with repo permissions
• POSTGRES_URL: Neon PostgreSQL connection string
• JWT_SECRET: Random string used for JWT token generation

---

CDN URLs

Images will be available at:

https://cdn.yourdomain.com/{user_id}/{timestamp}/image_{size}.{format}

Where:

• size: 256, 512, 1024, or 2048
• format: webp, jpg, or png

---

Contributing

1. Fork the repository.
2. Create a new feature branch.
3. Make your changes.
4. Submit a pull request.

---

License

This project is licensed under the MIT License. See the LICENSE file for details.