Socket.io ও node.js দিয়ে ইমেজ স্লাইডিং অ্যাপ
আমরা সকেট এবং নোড জেএস ব্যবহার করে একটি ইমেজ স্লাইডিং অ্যাপ তৈরি করবো। সেজন্য প্রথমে আপনাকে নোড জেএস সম্পর্কে জানতে হবে।Node.js Basic জানুন আপনার পিসি তে নোড জেএস ইনস্টল করা থাকলে আপনি টার্মিনাল ওপেন করুন।
প্রথমে একটি ফোল্ডার(বা directory) তৈরি করুন। নিজের পছন্দ মতো নাম দিন এবং টার্মিনাল থেকে সেই ফোল্ডার-এ একসেস করুন। এখন টাইপ করুন
কোনো সমস্যা হলে যোগাযোগ করুন কিংবা কমেন্ট করুন।
অ্যাপটি দেখুন
ভিডিও দেখুনবাকোডগুলোর ব্যাখ্যা
প্রথমে একটি ফোল্ডার(বা directory) তৈরি করুন। নিজের পছন্দ মতো নাম দিন এবং টার্মিনাল থেকে সেই ফোল্ডার-এ একসেস করুন। এখন টাইপ করুন
>npm init>npm install -- save express http socketconst path = require('path');
const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http);
const slideNumber = 10;
var currentSlide = 0;
app.use(express.static(path.join(__dirname, 'www')));
setInterval(function() {
var slide = currentSlide++ % slideNumber;
io.emit('showSlide', slide);
}, 2000)
http.listen(3000, function({
console.log('server is running');
});<html lang="en">
<head>
<title>socket app</title>
<style>
body { margin:0; }
.Slide { width:650px;
height:780px;
margin:50px auto;
}
</style>
</head>
<body>
<div class="Slide">
<img alt="" id="mySlide" src="" width="450px" />
</div>
<script src="/socket.io/socket.io.js"></script>
<script>
var img = document.getElementById("mySlide");
var socket = io();
socket.on('showSlide', function(slide){
img.src = '/images/' + slide + '.jpg';
});
</script>
</body>
</html>>node index.jsকোনো সমস্যা হলে যোগাযোগ করুন কিংবা কমেন্ট করুন।
অ্যাপটি দেখুন
ভিডিও দেখুনবাকোডগুলোর ব্যাখ্যা
Comments