Advertisement
  1. Web Design
  2. BrowserSync

অটোম্যাটিক ব্রাউজার রিলোডিং এর ৩ টি উপায়

Scroll to top
Read Time: 2 min

Bengali (বাংলা) translation by Arnab Wahid (you can also view the original English article)

এই স্ক্রিনকাস্ট টিউটোরিয়ালে আমরা ব্রাউজার রিলোডিং, স্পেশালি ব্রাউজার রিলোডিং নিয়ে আলোচনা করব-এই কাজ করার জন্য আমরা ভিন্ন ভিন্ন ৩ রকম উপায় শিখবো। চলুন শুরু করা যাক!

স্ক্রিনকাস্ট দেখুন

ধরি আপনি ফ্রন্টেন্ট কোড টেস্টিং এর জন্য ব্রাউজার ব্যবহার করেন। যেটা সবাই করে! প্রতিবার চেঞ্জ দেখার জন্য বার বার refresh ক্লিক করতে হয়, তাই না?

এটা বিরক্তিকর। এটা করার উপায় ইম্প্রুভ করা যায়। আসুন এই কাজ সহজে করার ৩ উপায় দেখে নেই।

LiveReload

LiveReload অনেক আগেই তৈরি একটা টুল। এটা ম্যাক ও উইন্ডোজে ব্যবহার করা যায়। এর মূল্য ৯.৯৯ ডলার।

এটা ব্রাউজারের জন্য একটি জাভাস্ক্রিপ্ট এক্সটেনশন। এটা ব্যবহারের আগে ব্রাউজার সেটিংস এ allow access to files অপশন ওপেন করে নিতে হবে।

অন্যান্য লিংক

Grunt Watch

এটা কমান্ড লাইন ব্যবহারে যারা স্বাচ্ছন্দ্যবোধ করেন তাদের জন্য। গ্রান্ট একটি টাস্ক রানার।

এটা দিয়ে অটো রিফ্রেশিং এর কাজ করা যায়।

gruntfile.js ফাইলে livereload: true সেট করে নিন।

1
watch: {
2
    
3
    files: ['*.*'],
4
    options: {
5
        livereload: true
6
    }
7
8
}

শেষ!

Grunt Resources

Browsersync

৩য় উপায় হচ্ছে Browsersync। Browsersync ব্রাউজার টেস্টিং এর জন্য ধীরেধীরে জনপ্রিয়তা লাভ করছে।

এটা ব্যবহার করতে আপনার node.js লাগবে। বিস্তারিত জানতে এখানে ক্লিক করুন The Command Line for Web Design: Taming 3rd Party Packages. নোড ইন্সটলের পরে, Browsersync ইন্সটল করুনঃ

1
npm install g- browser-sync

এখন BrowserSync ব্যবহারের কমান্ড সেট করতে হবে। রিফ্রেশের সময় সব ফাইল ওয়াচের কমান্ডঃ

1
browser-sync start --server --files "*.*"

অন্যান্য কমান্ড সম্পর্কে জানতে ডকুমেন্টেশন দেখুন।

দরকারি লিংক

পরিশেষ

শেষ! আশা করি এই টিউটোরিয়াল থেকে আপনি সময় বাচানোর মত অন্তত একটি ব্রাউজার রিফ্রেশ মেথড শিখতে পেরেছেন। আপনার যদি অন্য কোন মেথড বিশেষ পছন্দ থাকে তবে সেটা আমাদের নিচভে কমেন্ট করে জানাতে পারেন!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.