ক্রোম gầnো ইন্টারনেট ব্রাউজার বাজারের ২৫% শেয়ার দখল করেছে, ইন্টারনেট এক্সপ্লোরার (যা প্রজেক্ট স্পার্টানে রূপান্তরিত হচ্ছে) এর পরে দ্বিতীয় सर्वাধিক ব্যবহৃত ব্রাউজার হয়ে। আশারূপে, এর মানে হলো ক্রোম হলো ওয়েব ডেভেলপারদের ডি ফ্যাক্টো ঘর।
যদিও আমি ফায়ারফক্স পছন্দ করি, আমি বুঝতে পারি কেন লোকজন ক্রোম ভালোবাসেন। এটি ব্রাউজার বেঞ্চমার্কে শীর্ষে থাকে এবং সাধারণ ব্যবহারকারীদের ক্রোম পাওয়ার ইউজার বানাতে সহজ করে দেয়। অন্যদের আসলে ক্রোম থেকে ঘৃণা করলেও নির্দিষ্ট এক্সটেনশনের উপলব্ধতার কারণে এতে আটকে থাকতে হয়।
ওয়েব ডেভেলপারদের জন্য ক্রোম ততটকু ভালো হওয়ার সেটিই একটি কারণ: ক্রোম ওয়েব স্টোর এবং এর এক্সটেনশনের পুল। আপনি যদি কখনো ওয়েবসাইট ডিজাইন বা কোডিং করার পরিকল্পনা করেন, তবে এখানে কিছু অপরিহার্য টুল আছে যা আপনাকে অবিলম্বে ইনস্টল করা উচিত।
ColorZilla
ColorZilla একটি ফায়ারফক্স অ্যাড-অন হিসেবে শুরু করেছিল, কিন্তু এতটাই জনপ্রিয় হয়েছে যে অনেকেই ক্রোম সংস্করণের জন্য অনুরোধ করেছিল। এখন সেটি এখানে। এই হ্যান্ডি এক্সটেনশন মূলত পেইন্ট বা ফটোশপের মতো প্রোগ্রামে পাওয়া আই ড্রপার টুলের একটি উন্নত সংস্করণ।
এই দিয়ে আপনি ব্রাউজারের যেকোনো স্পটে পয়েন্ট করলেই সেখানে রঙের তথ্য পেতে পারেন। একবার পাওয়া গেলে, আপনি সেটি টweak করতে পারেন (RGB, HSV, বা সরাসরি হেক্স দ্বারা) তারপর ক্লিপবোর্ডে কপি করতে পারেন। ব্যবহার করা অত্যন্ত সহজ।
এছাড়াও এতে CSS গ্রেডিয়েন্ট জেনারেটর, ওয়েবপেজ কালার অ্যানালাইজার, এবং আপনার সুবিধার জন্য কয়েকটি প্রি-ইনস্টলড কালার প্যালেট থাকে।
Window Resizer
ওয়েব ডেভেলপারের এক বড় বিপদ হলো নিশ্চিত করা যে একটি ওয়েবসাইটের ভিউইং অভিজ্ঞতা সব ধরনের ডিভাইসে উপভোগ্য। আমরা শুধু মোবাইল বনাম ডেস্কটপের কথা বলছি না—যা মহত্বপূর্ণ—বরং ছোট ট্যাবলেট এবং বিশাল মনিটরের পার্থক্যও।
Window Resizer ব্রাউজার উইন্ডো রিয়েল-টাইমে রিসাইজ করার সহজ উপায়। এক ক্লিকে আপনি আপনার ওয়েবসাইট বিভিন্ন রেজোলিউশনে টেস্ট করতে পারবেন যেন দেখতে পান আপনার ব্যবহারকারীরা কী দেখছে—তারপর উপযুক্তভাবে সমন্বয় করতে পারবেন।
IE Tab
ওয়েব ডেভেলপারের অন্য একটি বড় বিপদ হলো ব্রাউজার স্ট্যান্ডার্ডস (অথবা তার অভাব)। ইন্টারনেট এক্সপ্লোরার, ফায়ারফক্স, ক্রোম, অপেরা, এবং অন্যান্য মাইনর ব্রাউজারগুলো কিছুটা ভিন্নভাবে ওয়েবসাইট রেন্ডার করে। তবু কিছু ব্রাউজার স্ট্যান্ডার্ডস গ্রহণে ধীর।
অথবা ইন্টারনেট এক্সপ্লোরারের ক্ষেত্রে, স্ট্যান্ডার্ডস জানালায় ফেলে দেওয়া হয়ে থাকে এবং ওয়েব ডেভেলপারদের বাধ্য করা হয় সমন্বয় করার জন্য যা তাদের চুল নোচে ফেলতে বাধ্য করে।
IE Tab দিয়ে এই প্রক্রিয়া কিছুটা সহজ হয়ে যায়। এটি আপনাকে একটি নতুন ক্রোম ট্যাবে ওয়েবসাইট দেখতে দেয়, কিন্তু রেন্ডার করে IE-র মত। IE-এর সমস্যার একটি বিপ্লবকari সমাধান নয়, কিন্তু কমপক্ষে কিছুটা তো।
Validity
সব HTML কোড সমান নয়। ব্রাউজাররা স্ট্যান্ডার্ডস কম্প্লায়েন্সে বড় ভূমিকা পালন করলেও, części 웹 ডেভেলপারের ওপরও ভালো HTML অনুশীলন মেনে চলার দায়িত্ব থাকে। তাই HTML টেস্ট ও ভ্যালিডেশন করার টুলগুলো আছে।
Validity একটি এক্সটেনশন যা আপনাকে থার্ড-পার্টি সাইটে যেতে না হয়ে সारा কাজ করতে দেয়। শুধু আপনার ওয়েবসাইট খুলুন, বাটনে ক্লিক করুন, এবং ব্রাউজার কনসোলে সকল অবৈধ HTML মেসেজ দেখাবে। ভ্যালিডেশন W3C ভ্যালিডেশন সার্ভিসের মাধ্যমে করা হয়।
BuiltWith
ওয়েব ডেভেলপমেন্টে একটা জিনিস আমার খারাপ লাগে—লাইব্রেরি, ফ্রেমওয়ার্ক, এবং ইঞ্জিনের অপরিমেয় অপশন থাকা। পছন্দের স্বাধীনতা ভালো, কিন্তু প্রযুক্তির সংখ্যা যখন এতটাই বেশি হয়ে যায় যে সবগুলো ট্র্যাক রাখা অসম্ভব হয়।
আপনি কি কখনো কোনো ওয়েবসাইট দেখে কৌতূহলী হয়েছেন যে এর আন্ডারলাইনিং টেকনোলজি কী?
BuiltWith এক্সটেনশন একটি একক বাটন যা বর্তমান ওয়েবপেজ বিশ্লেষণ করে সকল ওয়েব লাইব্রেরি, ফ্রেমওয়ার্ক, এবং ইঞ্জিন দেখায় যা এটিকে চালাচ্ছে, এডভার্টাইজিং নেটওয়ার্ক, কন্টেন্ট ডিস্ট্রিবিউশন প্ল্যাটফর্ম, এবং এ التمثيلে হোস্টিং সফটওয়্যার পর্যন্ত।
Postman REST Client [এখন উপলব্ধ নেই]
যারা REST API-র সাথে কাজ করেন, Postman হলো স্ট্রিমলাইনড ওয়ার্কফ্লোর জন্য একমাত্র টুল। এর দিয়ে আপনি HTTP রিকোয়েস্ট নির্মাণ করতে পারেন এবং JSON ও XML-এ ফরম্যাটকৃত রেসপন্স পেতে পারেন। রেসপন্স HTML-এ আলাদা উইন্ডোতে খুলে।
আপনি একাধিক রিকোয়েস্ট গ্রুপ করে একটি কলেকশনে রাখতে পারেন, যা سازمانবদ্ধ এবং দক্ষ থাকার একটি চমৎকার উপায়। আপনি এনভায়রনমেন্টাল ভেরিয়েবল স্যুইচ করে এক্সটেনশনের ভিতরেই একাধিক এনভায়রনমেন্টে টেস্ট করতে পারেন।
Corporate Ipsum
ফিলার টেক্সট জেনারেট করার একটি উপায় হলো "asdf" কপি-পেস্ট করে সেটাকে সैकডের বার दुहरানো। আরও ভালো উপায় হলো Corporate Ipsum ইনস্টল করা এবং একক্ষণে ফিলার টেক্সট জেনারেট করা।
আমরা 앞서 몇몇 লোরেম ইপসাম জেনারেটর কভার করেছি, কিন্তু Corporate Ipsum-এর আকর্ষণ হলো এটি আপনার ব্রাউজারে থাকে। এক ক্লিকে আপনি এটি পুল আপ করতে পারেন। আমার মতে এটি ব্যবহার না করার কোনো কারণ নেই। এখন আপনি আপনার ওয়েবসাইট কোডিং-এ ফিরে যান!
TabCloud
ওয়েব ডেভেলপমেন্ট কখনো কখনো একাধিক মেশিনে হয়। যদিও সোর্স কন্ট্রোল ডেভেলপারদের সিঙ্ক এবং আপ টু ডেট রাখার প্রধান উপায়, কিন্তু যদি আপনি একাধিক ট্যাব কম্পিউটার জুড়ে ট্রান্সফার করতে চান? সেখানে TabCloud কাজে লাগে।
TabCloud আপনার ট্যাবগুলো ক্লাউডে সিঙ্ক করে, যাতে আপনি সেগুলো অন্য কোথাও পুনরায় খুলতে পারেন। এটি লোকালি সেশন সেভারের ওপরও ব্যবহার করা যায়, যাতে আপনি ট্যাবের একটি সেট.afterward জন্য সংরক্ষণ করতে পারেন। ট্যাবগুলো আপনার গুগল অ্যাকাউন্টে সংরক্ষিত হয়।
WhatFont
ফন্ট ডিজাইন ওয়েব ডেভেলপমেন্টের একটি বড় অংশ, তাই গুগল ওয়েব ফন্টসের মতো সার্ভিসগুলো এতটাই জনপ্রিয় হয়েছে। ভালো খবর হলো এই ফ্রি ফন্টগুলো এখন ওয়েবের সবচেয়ে সুন্দর ফন্টগুলোর মধ্যে।
একদম স্বীকার করুন: ব্রাউজিং করার সময় আপনি কখনো কখনো এমন একটি চমৎকার ফন্ট দেখেন যা আপনি আগে কখনো দেখেননি। সেটি চিনতে অনেক উপায় আছে, কিন্তু সবচেয়ে দ্রুত উপায় হলো WhatFont ব্যবহার করা। এর সাথে, আপনি শুধু হভার করলে ফন্ট ইন্সপেক্ট করতে পারেন। এর চেয়ে সহজ কী হতে পারে?
Awesome Screenshot [এখন উপলব্ধ নেই]
যদি স্ক্রিনশট আপনার নিয়মিত ওয়েব ডেভেলপমেন্ট রুটিনের অংশ না হয়, তবে Awesome Screenshot তা পরিবর্তন করতে সাহায্য করবে। স্ক্রিন ক্যাপচার ডিজাইন পরিবর্তন ডকুমেন্ট করার এবং ক্লায়েন্ট বা টিম মেম্বারদের সাথে進行-মধ্যবর্তী কাজ শেয়ার করার জন্য চমৎকার।
এই এক্সটেনশনে কয়েকটি ক্যাপচার ফাংশন আছে, যथा পূর্ণ পৃষ্ঠা, নির্বাচিত এলাকা, বা দৃশ্যমান এলাকা। এছাড়াও এটি আপনাকে এনোটেশন যোগ করতে দেয়, চিত্রের সংবেদনশীল অংশ ব্লার করতে দেয়, এবং এক ক্লিকে শেয়ার করতে দেয়। অথবা গুগল ড্রাইভে আপলোড করুন।
যদি কনসেপ্টটি আপনাকে আকর্ষণ করলেও আপনি আরও শক্তিশালী ডেস্কটপ প্রোগ্রাম পছন্দ করেন, তবে এই স্ক্রিনশট টুল তুলনা চেক আউট করুন এবং যেটি আপনার জন্য সবচেয়ে ভালো কাজ করে সেটি ব্যবহার করুন।
Check My Links
অনেক ওয়েব ডেভেলপমেন্ট এরর ভিজিটরদের বাধা দেয়, এবং ব্রোকেন লিংক 그중 সবচেয়ে খারাপ অপরাধীদের মধ্যে একটি। একটা ব্রোকেন লিংক চলে, কিন্তু এর চেয়ে বেশি হলে আপনার ওয়েবসাইট আস্থা এবং খ্যাতি হারাতে শুরু করে। خوشকবুলি, এটি সহজে এড়ানো সম্ভব।
Check My Links ঠিকই যা обещает করে সেটি করে: আপনার লিংকগুলো চেক করে। বৈধ লিংকগুলো সবুজ চিহ্নিত হয় এবং ব্রোকেন লিংকগুলো লাল, এবং শেষে একটি পার্সেন্টেজ স্কোর দেয়। আপনার কাজ শুধু সেই লিংকগুলো রিপেয়ার করা!।
আপনি কোন এক্সটেনশনগুলো ব্যবহার করেন?
উৎপাদনশীলতার জন্য আর একটি এক্সটেনশন সুপারিশ করছি: StayFocusd। এটি আরও ziyादा জেনারেল পারপাস এক্সটেনশন, ওয়েব ডেভেলপমেন্ট এক্সটেনশন নয়, তবে নিঃসন্দেহে এটি কার্যকর। এটি কাজ করার সময় ওয়েব দ্বারা ডিসট্র্যাক্ট হওয়া থেকে আপনাকে বাঁচায়!
এগুলো সম্পর্কে আপনার কী মতে? অন্য কোনো অপরিহার্য ওয়েব ডেভেলপমেন্ট এক্সটেনশন সুপারিশ করবেন? কমেন্টে আমাদের সাথে শেয়ার করুন!