Bir sohbet uygulaması, etkileşimli ve ilgi çekici bir kullanıcı deneyimi oluşturmak için nasıl kullanılacağına real-time dair mükemmel bir örnektir. Bu yazıda, ve kullanarak bir sohbet uygulamasının nasıl oluşturulacağını keşfedeceğiz. WebSocket Node.js real-time WebSocket Node.js
1. Adım: Ortamı Kurma
Node.js İlk olarak, bilgisayarınıza yüklediğinizden emin olun. Projeniz için yeni bir klasör oluşturun ve Terminal veya kullanarak bu klasöre gidin Command Prompt.
2. Adım: Kitaplığı WebSocket Yükleme
Daha önce olduğu gibi, kütüphaneyi kurmak için "ws" kütüphanesini kullanın WebSocket:
npm install ws
3. Adım: WebSocket Sunucuyu Oluşturma
adlı bir dosya oluşturun server.js
ve aşağıdaki kodu yazın:
// Import the WebSocket library
const WebSocket = require('ws');
// Create a WebSocket server
const server = new WebSocket.Server({ port: 8080 });
// List of connections(clients)
const clients = new Set();
// Handle new connections
server.on('connection',(socket) => {
console.log('Client connected.');
// Add connection to the list
clients.add(socket);
// Handle incoming messages from the client
socket.on('message',(message) => {
// Send the message to all other connections
for(const client of clients) {
if(client !== socket) {
client.send(message);
}
}
});
// Handle connection close
socket.on('close',() => {
console.log('Client disconnected.');
// Remove the connection from the list
clients.delete(socket);
});
});
Adım 4: Kullanıcı Arayüzünün Oluşturulması(İstemci)
adlı bir dosya oluşturun index.html
ve aşağıdaki kodu yazın:
<!DOCTYPE html>
<html>
<head>
<title>Real-Time Chat</title>
</head>
<body>
<input type="text" id="message" placeholder="Type a message">
<button onclick="send()">Send</button>
<div id="chat"></div>
<script>
const socket = new WebSocket('ws://localhost:8080');
socket.onmessage =(event) => {
const chat = document.getElementById('chat');
chat.innerHTML += '<p>' + event.data + '</p>';
};
function send() {
const messageInput = document.getElementById('message');
const message = messageInput.value;
socket.send(message);
messageInput.value = '';
}
</script>
</body>
</html>
Adım 5: Sunucuyu Çalıştırma ve Tarayıcıyı Açma
içinde Terminal, sunucuyu başlatmak için aşağıdaki komutu çalıştırın WebSocket:
node server.js
Bir web tarayıcısı açın ve sohbet uygulamasını kullanmak için " http://localhost:8080 " adresine gidin real-time.
Çözüm
Tebrikler! ve real-time kullanarak başarıyla bir sohbet uygulaması oluşturdunuz. Bu uygulama, kullanıcıların. Çeşitli heyecan verici özellikler oluşturmak için bu uygulamayı genişletmeye ve özelleştirmeye devam edebilirsiniz! WebSocket Node.js real-time