DEV Community: Prakhar Doneria

🚀 GSSoC 2025 Applications Are LIVE — Here’s Everything You Need to Know!

Prakhar Doneria — Thu, 03 Jul 2025 10:28:28 +0000

GirlScript Summer of Code 2025 has officially launched its application season — and it’s bigger, bolder, and better than ever before. Whether you're an aspiring contributor, a seasoned mentor, or a code wizard ready to run your own open-source project, GSSoC 2025 has a role for you.

🔥 What is GSSoC?

GirlScript Summer of Code (GSSoC) is a 3-month-long open-source extravaganza where tech enthusiasts from all backgrounds come together to build, learn, and grow. With real-world projects, mentorship from top industry professionals, and an epic community of learners — GSSoC isn't just a program, it's a movement.

💡 Why You Should Join GSSoC 2025

This year, GSSoC brings a fresh energy and powerful upgrades to the table. Here's what makes it a can't-miss opportunity:

Real-World Projects – Work on open-source repositories that solve actual problems.
Industry Mentors – Learn from developers and tech leads with years of experience.
Boost Your GitHub – Showcase meaningful contributions that stand out.
Track Progress With Smartly – Download the Insights by Smartly app to stay on top of your goals and engagement.

🎮 Choose Your Role

At GSSoC 2025, everyone has a place. Pick the one that fits you best:

Contributor – Dive into code, fix bugs, add features, and create magic.
Mentor – Share your knowledge, guide others, and grow with the community.
Project Admin – Lead a project, manage contributions, and drive innovation.
Campus Ambassador – Represent GSSoC at your campus, organize events, and be the face of the initiative.

📝 How to Apply (Step-by-Step)

Getting started is easier than ever. Here's the quick 6-step guide:

Download Insights by Smartly

Android
iOS

Log in with your email
Hit the Explore tab
Smash the GSSoC 2025 banner
Pick your role
Fill out the form and BOOM — you're in!

🎁 Bonus: Use This Referral Code

Want extra brownie points during signup?

Use Referral Code: 076d5f01-f3f6-4bed-b824-af045362a7b8

This code gives you a head start in your application ranking and might unlock bonus perks.

🔗 Must-Have Links

Stay connected and never miss an update:

✨ Final Words

GSSoC 2025 isn't just about code — it’s about impact, collaboration, and transformation. Whether you’re writing your first pull request or mentoring the next generation of devs, this summer is your chance to shine.

Let’s build, learn, and grow — together.

🔗 Apply Now and start your open-source journey today.

Set up and integrate Hugging Face's MCP-powered Tiny Agent into your backend server as an API

Prakhar Doneria — Fri, 25 Apr 2025 18:27:01 +0000

Here's how to set up and integrate Hugging Face's MCP-powered Tiny Agent into your backend server as an API.

Build a MCP-powered AI Agent API in Your Backend with Hugging Face

Have you ever wanted to plug tool-using AI agents into your backend like magic? Thanks to Hugging Face's new MCP protocol, it’s now easier than ever to do just that—in just 50 lines of code.

In this post, we’ll go from installing the MCP Agent locally to wrapping it in an API using Node.js, so your backend can use it like any other service.

What’s MCP?

MCP (Model Context Protocol) is an emerging standard that lets LLMs access external tools like web browsers, file systems, or even your own microservices. It's model-agnostic and fully open-source.

Think of it like a plug-and-play layer between LLMs and real-world functions. Hugging Face’s @huggingface/mcp-client lets you spin up an agent that speaks MCP and use tools via local MCP servers.

Quickstart: Run the Agent Locally

To try it out:

npx @huggingface/mcp-client

Or using pnpm:

pnpx @huggingface/mcp-client

You’ll see it connect to:

a local file system server (interacts with files on your Desktop)
a Playwright browser server (opens URLs using Chromium)

Then it’ll ask you what to do—something like:

“Write a haiku about Hugging Face and save it as hf.txt on my Desktop.”

Behind the scenes, this is all powered by a loop that connects an LLM to MCP tools. It’s simple, but powerful.

Installing the MCP Client in Your Backend

First, add the package to your backend project:

npm install @huggingface/mcp-client

pnpm add @huggingface/mcp-client

You’ll also need:

Node.js 18+
A Hugging Face token (HF_TOKEN)
Local MCP-compatible tool servers (these are CLI binaries that you spawn as subprocesses)

Wrap It in an API (Express Example)

Let’s build a basic Express server that exposes the agent as an API endpoint.

// server.ts
import express from "express";
import { Agent } from "@huggingface/mcp-client";
import dotenv from "dotenv";

dotenv.config();

const app = express();
app.use(express.json());

const agent = new Agent({
  provider: "nebius",
  model: "Qwen/Qwen2.5-72B-Instruct",
  apiKey: process.env.HF_TOKEN!,
  servers: [
    { command: "mcp-fs" },
    { command: "mcp-playwright" },
  ],
});

(async () => {
  await agent.loadTools();

  app.post("/agent", async (req, res) => {
    const input = req.body?.message;
    if (!input) return res.status(400).send("Missing input");

    const result: string[] = [];
    for await (const output of agent.chat(input)) {
      if (typeof output === "string") result.push(output);
    }

    res.json({ result: result.join("") });
  });

  const PORT = process.env.PORT || 3000;
  app.listen(PORT, () => console.log(`Agent API running on http://localhost:${PORT}`));
})();

Now you can POST to http://localhost:3000/agent with a prompt like:

{
  "message": "Search for the latest Hugging Face models and save links to Desktop."
}

Under the Hood: What's Happening

The agent is:

Loading tools from MCP servers (via mcp-fs, mcp-playwright)
Sending your prompt to an LLM
Letting the LLM decide what tools to call
Executing those tools and feeding the result back
Looping until the task is complete

This is all managed by the Agent class built on top of InferenceClient and @modelcontextprotocol/sdk.

Bonus: Custom Tools

You can build your own MCP server (it’s just a CLI with tool metadata and input/output JSON) and plug it into the same architecture. Think internal services, databases, or even IoT control panels.

Next Steps

Swap in different models: e.g., mistralai/Mistral-Small-3.1-24B-Instruct
Run inference on your own infrastructure
Build tools for internal microservices
Add authentication, rate limiting, and caching

Links

Got questions or ideas for new tools? Drop them in the comments!

How to use Sketchub Telegram Bot ?

Prakhar Doneria — Sat, 03 Feb 2024 09:21:03 +0000

Sketchub Telegram Bot

In this blog post, we'll delve into the usage of a Telegram bot powered by the Telegraf library, providing seamless interaction with the Sketchub API. This bot allows users to explore and retrieve information about projects and users on Sketchub, a platform for sharing creative projects.

Setting Up the Bot

The bot is initialized using the Telegraf library in Node.js. The start command welcomes users, and the /categories command fetches and displays project categories from Sketchub.

bot.start((ctx) => ctx.reply('Welcome! Use /categories to view categories.'));
bot.command('categories', async (ctx) => {
  // ... (code to fetch and display categories)
});

Project Categories

The /categories command sends a request to the Sketchub API to retrieve project categories. It then formats and displays the categories along with the total number of projects in each.

Example Usage:

User: /categories
Bot: Displays a list of categories and project counts.

Project Details

Commands like /id and /projectList provide detailed information about a specific project or a list of projects.

bot.command('id', async (ctx) => {
  // ... (code to fetch and display project details by ID)
});

bot.command('projectList', async (ctx) => {
  // ... (code to fetch and display a list of projects)
});

Example Usage:

User: /id 123
Bot: Displays detailed information about the project with ID 123.

Finding Users

Commands like /find and /detail allow users to search for Sketchub users and retrieve detailed user profiles.

bot.command('find', async (ctx) => {
  // ... (code to find and display user information)
});

bot.command('detail', async (ctx) => {
  // ... (code to fetch and display detailed user profile)
});

Example Usage:

User: /find JohnDoe
Bot: Displays a list of relevant users with their IDs and names.

Handling Errors

The bot is equipped to handle errors gracefully, providing users with informative messages in case of any issues during API requests.

Example Usage:

User: /categories
Bot: Displays an error message if there's an issue with fetching categories.

Conclusion

This Sketchub Telegram bot allows users to seamlessly interact with the Sketchub platform directly from their Telegram app. Whether exploring project categories, retrieving project details, or finding user profiles, the bot provides a convenient interface for users to engage with Sketchub's creative community.

How to make FREE Website in 2023 - 2024

Prakhar Doneria — Fri, 01 Dec 2023 08:46:01 +0000

I know many of you must have wished to make your own personal website atleast ones in your life!
In this blog I will share you the method that I used to make my personal Website with ₹0 investment , without using PC 💻 and 0 Coding knowledge (it's good if you can code 😅).

1. SET UP

We will use our Mobile (Android) to make a basic but cool ui web page.

• First and most important is to download a Code Editor

For this I strongly recommend you to download HTML Editor PRO it's FREE and is available on Uptodown and Galaxy Store with a great number of features and good rating.

• Second is choosing a free host

Their are many free host like
Neocities, 000WebHost, GitHub Pages

For now I will go with Neocities. As its quick and easy to begin.

• Third is Coding

I think you must have downloaded HTML Editor PRO till now, if you did not then press the home tab and download it.

» Now make a new project say, index.html
» Go back to Settings > Developer Tools > Enter your OpenAI API key and save it
» Reopen your project
» Tap on the top most ROBOT icon
» It would show a prompt like

Write a program to (Enter your prompt) in HTML

» Inside the bracket write what things you want for your website (HERE IS AN EXAMPLE OF MY PROMPT I USED FOR MY SITE)

Write a program to make a portfolio website for me a software developer also add a iOS style toggle button for dark mode and add a fab as Message to open email use font as jet brains mono

» Now simply re-tap the ROBOT icon

» It will write a code for your within 1 minutes

• Deploying Website

Open neocities and sign in to dashboard now either upload your HTML file from your device location or copy the code from app and paste it.

Click on Save in Neocities

Hurray 🙌🏻 Your site is deployed 👏🏻 do share your project link in comment.

The best point of HTML Editor PRO is you can inspect any website using built-in tool and if you are on the latest version of HTML Editor PRO you can upload your images in app cloud to use in your project. It's all Free.

Supercharge Your Web Development Skills with HTML Editor PRO: The Ultimate Coding Companion | Ai code Writer for Android

Prakhar Doneria — Sat, 08 Jul 2023 12:49:15 +0000

Introduction:
In the world of web development, finding the right coding tool can make all the difference. Enter HTML Editor PRO, a powerful app that is set to revolutionize the way we code, collaborate, and build stunning websites and applications. With its impressive range of features and user-friendly interface, HTML Editor PRO is the ultimate coding companion for developers of all skill levels.

Download Links:

Uptodown: Download HTML Editor PRO from Uptodown
Galaxy Store: Download HTML Editor PRO from the Galaxy Store

Features That Make HTML Editor PRO Stand Out:

Online Collaboration: Experience real-time coding with others, enabling seamless teamwork and collaboration.
Website and Project Hosting: Host your websites and projects directly within the app, eliminating the need for external hosting platforms.
Easy Project Share/Upload and Download: Effortlessly share your projects with others or download them for offline access.
Syntax Highlighting: Enhance code readability with syntax highlighting, making it easier to spot errors and improve overall code quality.
Code Preservation: Rest easy knowing that your progress is always saved, ensuring that your hard work is never lost.
User-Friendly Interface: Navigate through the app effortlessly with a clean and intuitive interface designed for smooth coding.
Lightweight and Ad-Free Environment: Enjoy a distraction-free coding experience in a lightweight app that is free from intrusive ads.
Visually Appealing Themes: Customize your coding environment with three stunning themes—light, dark, and gradient.
Collab Coding: Collaborate with other developers in real-time, leveraging the power of collective creativity and problem-solving.
Code Prediction: Boost your coding speed with AI-powered code prediction, which suggests code snippets based on context.
Desktop View: Experience a full-screen coding experience with the desktop mode, allowing for enhanced productivity.
JavaScript Console: Debug your code effectively with the built-in JavaScript console, streamlining the debugging process.
AI Code Writer: Harness the power of artificial intelligence to generate code snippets, saving you time and effort.

How HTML Editor PRO Stands Out:
HTML Editor PRO is more than just another coding app in the Play Store. It offers a comprehensive set of features that make it a standout choice for developers worldwide. Here's what sets HTML Editor PRO apart:

Seamless Collaboration: The ability to collaborate in real-time sets HTML Editor PRO apart from other coding apps, fostering teamwork and creativity.
All-in-One Solution: With website hosting, project management, and code editing capabilities, HTML Editor PRO eliminates the need for multiple apps or platforms.
Enhanced Productivity: The app's intuitive interface, code prediction, and syntax highlighting features help streamline coding workflows and boost productivity.
Distraction-Free Environment: By providing a lightweight and ad-free coding experience, HTML Editor PRO ensures developers can focus solely on their projects.
Personalization: The availability of visually appealing themes and customizable settings allows developers to create their ideal coding environment.

Conclusion:
HTML Editor PRO is a game-changer in the world of web development. With its extensive features, collaborative capabilities, and intuitive interface, it provides a superior coding experience. Download HTML Editor PRO today from Uptodown or the Galaxy Store and unlock your coding potential.

Discover how this app can revolutionize your coding journey, empower collaboration, and bring your web development projects to new heights. Say goodbye to the limitations of traditional IDEs and embrace the future of coding with HTML Editor PRO.

Chatroom

Prakhar Doneria — Sun, 20 Feb 2022 09:20:39 +0000

Voice Search with JavaScript (Web Speech API)

Prakhar Doneria — Sat, 22 Jan 2022 02:48:20 +0000

Use speech recognition to perform a Google search. For this purpose, the Web Speech API is used (currently only supported by Chrome).