How to create your own AI agent using Javascript

 

You can create your own AI Agent in JavaScript (Node.js) using:

• OpenAI API
• Memory
• Tools/functions
• Chat interface

Create AI Agent

<script>

require("dotenv").config();

const express = require("express");

const cors = require("cors");

const OpenAI = require("openai");

const app = express();

app.use(cors());

app.use(express.json());

const client = new OpenAI({

  apiKey: process.env.OPENAI_API_KEY,

});

// Simple Tool

function calculator(a, b) {

  return a + b;

}

app.post("/chat", async (req, res) => {

  const userMessage = req.body.message;

  try {

    // Tool Logic

    if(userMessage.includes("add")) {

      const result = calculator(10, 20);

      return res.json({

        reply: "Answer is " + result

      });

    }

    // AI Response

    const response = await client.chat.completions.create({

      model: "gpt-4.1-mini",

      messages: [

        {

          role: "system",

          content: "You are a helpful AI agent."

        },

        {

          role: "user",

          content: userMessage

        }

      ]

    });

    res.json({

      reply: response.choices[0].message.content

    });

  } catch (error) {

    console.log(error);

    res.json({

      reply: "Error occurred"

    });

  }

});

app.listen(3000, () => {

  console.log("Server running on port 3000");

});

</script>

Please comment if want video on that.

How to Add AI to Your Website

index.php file

<form method="POST" action="chat.php">

    <input type="text" name="message" placeholder="Ask anything..." required>

    <button type="submit">Send</button>

</form>

chat.php file

<?php

$apiKey = "YOUR_API_KEY_HERE";

$userMessage = $_POST['message'];

$data = [

    "model" => "gpt-4o-mini",

    "messages" => [

        ["role" => "user", "content" => $userMessage]

    ]

];

$ch = curl_init("https://api.openai.com/v1/chat/completions");

curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

curl_setopt($ch, CURLOPT_HTTPHEADER, [

    "Content-Type: application/json",

    "Authorization: Bearer " . $apiKey

]);

curl_setopt($ch, CURLOPT_POST, true);

curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));

$response = curl_exec($ch);

curl_close($ch);

$result = json_decode($response, true);

echo $result['choices'][0]['message']['content'];

?>

Image Compressor (JavaScript)

 

<input type="file" id="upload" accept="image/*">

<br><br>

<img id="preview" style="max-width:300px;"><br><br>

<a id="download" download="compressed.jpg">Download Compressed Image</a>

<script>

document.getElementById("upload").addEventListener("change", function(e) {

    const file = e.target.files[0];

    if (!file) return;

    const reader = new FileReader();

    reader.onload = function(event) {

        const img = new Image();

        img.onload = function() {

            const canvas = document.createElement("canvas");

            const ctx = canvas.getContext("2d");

            // 🔹 Resize (optional)

            const maxWidth = 800;

            const scale = maxWidth / img.width;

            canvas.width = maxWidth;

            canvas.height = img.height * scale;

            ctx.drawImage(img, 0, 0, canvas.width, canvas.height);

            // 🔹 Compress (0.0 - 1.0)

            const quality = 0.6;

            const compressedData = canvas.toDataURL("image/jpeg", quality);

            // Preview

            document.getElementById("preview").src = compressedData;

            // Download link

            document.getElementById("download").href = compressedData;

        };

        img.src = event.target.result;

    };

    reader.readAsDataURL(file);

});

</script>

SQL Prepared Statements ( Very Important Concept )

 

<?php

//database connection

$connect = mysqli_connect("localhost","root","","user");

//prepare statement

$sql = $connect->prepare("insert into datas(name)values(?)");   //?-placeholder

//binding parameters

$sql->bind_param("s",$name);    //s - string, i - integer, d - double

//setting value

$name = "phpecho";  //$_POST['name'];

$sql->execute();   //execute the query

echo "Data inserted successfully.";

?>

Video Link (Sql Prepared Statement)

Promises in JavaScript

 Create Promise

let myPromise = new Promise(function(resolve, reject) {

Condition

let success = true;

If Condition

if (success) {

    resolve("Task Completed");

}

Else Condition

else {

    reject("Task Failed");

}

Handle Success

.then(function(result) {

    console.log(result);

})

Handle Error

.catch(function(error) {

    console.log(error);

});

Full Code :

let myPromise = new Promise(function(resolve, reject) {

    let success = true;

    if (success) {

        resolve("Task Completed");

    } else {

        reject("Task Failed");

    }

});

myPromise

.then(function(result) {

    console.log(result);

})

.catch(function(error) {

    console.log(error);

});

⚡ Flow Summary

Promise created
     ↓
Check condition (success)
     ↓
If true → resolve() → then()
If false → reject() → catch()

🎯 Real-life Example

You ordered food 🍔


If delivered → 
If delivered → resolve("Food arrived")


If not → 
If not → reject("Delivery failed")

MYSQL vs MYSQLI vs PDO

 
<?php

//mysql

//$conn = mysql_connect("localhost","root","");

//$db = mysql_select_db("Your_database_name", $conn);

//mysqli

//$conn = mysqli_connect("localhost","root","","Your_database_name");

//PDO

$conn = new PDO("mysql:host=localhost;dbname=Your_database_name","root","");  

if(!$conn){

echo "Not connected";

}

else{

echo "Connected PDO";

}

?>

Video Link

HTML & CSS Coding The Web s Story

 

🚀 Start Your Coding Journey with WDS!

Students are now stepping into the world of web development by learning HTML & JavaScript at WDS! 💻✨

From building simple web pages to creating interactive features, our training helps students develop real-world skills that matter in today’s digital era.

🔹 Learn HTML to design beautiful web structures
🔹 Master JavaScript to make websites dynamic
🔹 Hands-on projects for practical experience
🔹 Step-by-step guidance from basics to advanced

Whether you're a beginner or looking to upgrade your skills, WDS is the perfect place to grow and succeed in coding!

📈 Build. Learn. Grow.

#WebDevelopment #HTML #JavaScript #CodingStudents #WDS #LearnToCode

🚀 Start Your Coding Journey with WDS – Build Your Future Today! 💻✨

Are you ready to step into the world of technology and innovation?
Join WDS (Web Development Skills) and unlock the power of coding with the most in-demand languages:

🌐 HTML – Build the structure of websites
⚡ JavaScript – Add life and interactivity to your pages
🐍 Python – Dive into powerful programming, automation, and AI

🔥 Why Learn with WDS?
✔ Beginner to Advanced Friendly
✔ Real Projects & Practical Learning
✔ Clean & Simple Teaching Style
✔ Career-Oriented Skills

💡 Whether you want to create websites, build apps, or become a developer — this is your first step!

📚 What You’ll Learn:
• Website Design from Scratch
• Interactive Web Applications
• Backend Logic & Automation
• Problem Solving & Coding Logic

🎯 No Experience Needed – Just Passion to Learn!

👉 Start today and transform your future with coding!    Call or Whatsapp  : +91-7080234447

#LearnCoding #WebDevelopment #HTML #JavaScript #Python #WDS #CodingJourney #FutureReady

Define constant in Php

If you're working with PHP, one of the most important concepts you should know is constants — and that’s where define() comes in 🚀

🔹 What is define()?
define() is a built-in PHP function used to create a constant value that cannot be changed during script execution.

🔹 Why use constants?
Constants are perfect for storing values that should remain fixed, like:

• Website name
• Database credentials
• API keys
• Company details

🔹 Basic Syntax:

define("CONSTANT_NAME", "value");


Check the video

Code 

<?php

define("channel","youtube@phpecho");

define("contact","+91-2221221221");

?>

<?php echo channel; ?>

<?php echo contact; ?>