() translation by (you can also view the original English article)
এই স্ক্রিনকাস্ট টিউটোরিয়ালে আমরা ব্রাউজার রিলোডিং, স্পেশালি ব্রাউজার রিলোডিং নিয়ে আলোচনা করব-এই কাজ করার জন্য আমরা ভিন্ন ভিন্ন ৩ রকম উপায় শিখবো। চলুন শুরু করা যাক!
স্ক্রিনকাস্ট দেখুন
ধরি আপনি ফ্রন্টেন্ট কোড টেস্টিং এর জন্য ব্রাউজার ব্যবহার করেন। যেটা সবাই করে! প্রতিবার চেঞ্জ দেখার জন্য বার বার refresh ক্লিক করতে হয়, তাই না?
এটা বিরক্তিকর। এটা করার উপায় ইম্প্রুভ করা যায়। আসুন এই কাজ সহজে করার ৩ উপায় দেখে নেই।
LiveReload
LiveReload অনেক আগেই তৈরি একটা টুল। এটা ম্যাক ও উইন্ডোজে ব্যবহার করা যায়। এর মূল্য ৯.৯৯ ডলার।
এটা ব্রাউজারের জন্য একটি জাভাস্ক্রিপ্ট এক্সটেনশন। এটা ব্যবহারের আগে ব্রাউজার সেটিংস এ allow access to files অপশন ওপেন করে নিতে হবে।
অন্যান্য লিংক
- LiveReload Chrome extension
- LiveReload Firefox extension
- LiveReload Internet Explorer extension
- The Command Line for Web Design: Live Reload & BrowserSync
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 "*.*" |
অন্যান্য কমান্ড সম্পর্কে জানতে ডকুমেন্টেশন দেখুন।
দরকারি লিংক
পরিশেষ
শেষ! আশা করি এই টিউটোরিয়াল থেকে আপনি সময় বাচানোর মত অন্তত একটি ব্রাউজার রিফ্রেশ মেথড শিখতে পেরেছেন। আপনার যদি অন্য কোন মেথড বিশেষ পছন্দ থাকে তবে সেটা আমাদের নিচভে কমেন্ট করে জানাতে পারেন!
