DevTools
Chrome DevTools হল ওয়েব ডেভেলপার টুলগুলির একটি সেট যা সরাসরি Google Chrome ব্রাউজারে তৈরি করা হয়েছে৷ DevTools আপনাকে উড়তে থাকা পৃষ্ঠাগুলি সম্পাদনা করতে এবং দ্রুত সমস্যাগুলি নির্ণয় করতে দেয়, যা আপনাকে আরও ভাল ওয়েবসাইটগুলি দ্রুত তৈরি করতে সহায়তা করে৷
DevTools সাধারণ ওয়েব ডেভেলপমেন্ট কাজগুলির একটি বিস্তৃত পরিসর সমর্থন করে। এই পৃষ্ঠায় এগিয়ে যান এবং DevTools-এর মূল বৈশিষ্ট্যগুলির কিছু অন্বেষণ করুন৷ জানেন না কোথায় শুরু করবেন বা আপনার প্রথমবার DevTools ব্যবহার করবেন? DevTools-এর একটি ভূমিকা দেখুন ।
এআই সহায়তা পান
কনসোল অন্তর্দৃষ্টি এবং এআই সহায়তা আপনাকে জাভাস্ক্রিপ্ট ত্রুটি, কর্মক্ষমতা এবং স্টাইলিং আরও দক্ষতার সাথে ডিবাগ এবং ঠিক করতে সহায়তা করে।
কর্মক্ষমতা বুঝুন
আপনার পৃষ্ঠার পারফরম্যান্সের একটি বিস্তৃত এবং কার্যকর দৃশ্য পান।
সম্পদ পরিদর্শন করুন
আপনার পৃষ্ঠা দ্বারা লোড করা সংস্থানগুলি কীভাবে পরিদর্শন করবেন এবং আপনার ব্রাউজার থেকে সেগুলি সম্পাদনা করবেন তা শিখুন৷
নেটওয়ার্ক বিশ্লেষণ করুন
ফ্লাইতে নেটওয়ার্ক অনুরোধ এবং প্রতিক্রিয়াগুলি বিশ্লেষণ এবং ওভাররাইট করুন।
এআই সহায়তা এবং কনসোল অন্তর্দৃষ্টি
DevTools-এ AI উদ্ভাবন কীভাবে আপনাকে আরও, দ্রুত করতে দেয় তা অন্বেষণ করুন।
শুরু করুন
আপনার ওয়েবসাইটের স্টাইলিং, নেটওয়ার্ক, উত্স এবং কর্মক্ষমতা বিশ্লেষণ এবং উন্নত করতে জেমিনিকে সাহায্য করুন৷
অনুপ্রাণিত হও
Chrome DevTools-এ AI সহায়তার জন্য ব্যবহারের কেসগুলি অন্বেষণ করুন এবং এটি কীভাবে স্টাইলিং, পারফরম্যান্স এবং আরও অনেক কিছু জুড়ে আপনার ডিবাগিং ওয়ার্কফ্লোকে সমর্থন করতে পারে তা জানুন।
কনসোল বার্তাগুলি বুঝুন
DevTools-এ কনসোল বার্তা এবং ত্রুটিগুলি বুঝুন এবং সেগুলি কীভাবে ঠিক করবেন তা শিখুন - কোনও কপি-পেস্টিং ছাড়াই৷
ডেভেলপার টুলিং টিপস
DevTools-এ সাধারণ ডিবাগিং পরিস্থিতিগুলি মজাদারভাবে তুলে ধরার জন্য আমাদের মাসিক ভিডিও সিরিজটি ঘুরে দেখুন।
পারফরম্যান্স অপ্টিমাইজেশন পিটস্টপ
আপডেট করা পারফরম্যান্স প্যানেলটি ঘুরে দেখুন, যেখানে আপনাকে দেখানো হবে কিভাবে কোর ওয়েব ভাইটালস (LCP, CLS, INP) পরিমাপ করতে হয় এবং কিভাবে জেমিনি থেকে উপযুক্ত পরামর্শ পেতে হয়।
পিক্সেল পাইরেট
DevTools দিয়ে যাত্রা শুরু করুন এবং একজন ডিবাগিং পাইরেট হয়ে উঠুন! ফোকাস স্টাইল অনুকরণ, অটোফিলের মাধ্যমে ফর্ম পরীক্ষা এবং নেটওয়ার্ক ওভাররাইডের মাধ্যমে ব্যাকএন্ড ত্রুটি সমাধানের কৌশল আবিষ্কার করুন।
এআই উদ্ভাবন, এআই উদ্ভাবন
Chrome DevTools-এর সাহায্যে Al-সহায়তাযুক্ত ডিবাগিংয়ের শক্তি অন্বেষণ করুন! কনসোল ইনসাইটস, স্টাইলিং, পারফরম্যান্স, নেটওয়ার্ক এবং উৎসের জন্য Al সহায়তা কীভাবে আপনার কর্মপ্রবাহকে সুপারচার্জ করতে পারে তা আবিষ্কার করুন।
Chrome DevTools ব্যবহার করে উন্নত নেটওয়ার্ক বিশ্লেষণ
উন্নত নেটওয়ার্ক প্যানেল কৌশলগুলি অন্বেষণ করুন, যার মধ্যে রয়েছে পারফরম্যান্সের বাধাগুলি কীভাবে খুঁজে বের করা যায়, পপআপগুলি ডিবাগ করা যায়, নেটওয়ার্কের অবস্থা কনফিগার করা যায়, নেটওয়ার্ক অনুরোধ শুরুকারী নির্ধারণের জন্য শর্টকাট ব্যবহার করা যায় এবং আরও অনেক কিছু।
কর্মক্ষমতা অন্তর্দৃষ্টি পান
আপনার রানটাইম পারফরম্যান্সের বিভিন্ন দিক পরিমাপ এবং অপ্টিমাইজ করতে আপনাকে সাহায্য করার জন্য সরঞ্জামগুলির একটি বিস্তৃত পরিসর: পারফরম্যান্স প্যানেল, লাইটহাউস এবং আরও অনেক কিছু।
কর্মক্ষমতা টুল ওভারভিউ
পারফরম্যান্স প্যানেলের সমস্ত বৈশিষ্ট্য সম্পর্কে জানুন: কীভাবে একটি পারফরম্যান্স ট্রেস রেকর্ড করতে হয়, কীভাবে ট্রেসটি দেখতে এবং বিশ্লেষণ করতে হয় এবং আরও অনেক কিছু।
DevTools-এ আপনার স্থানীয় এবং বাস্তব-ব্যবহারকারীর Core Web Vitals পারফরম্যান্স নিরীক্ষণ করুন
CPU থ্রোটলিং ক্যালিব্রেশনের মতো নতুন DevTools বৈশিষ্ট্যগুলি সম্পর্কে জানুন যাতে আপনি বাস্তব জগতের ডেটার উপর আপনার পারফরম্যান্স ডিবাগিং সিদ্ধান্তগুলিকে ভিত্তি করতে পারেন
DevTools পারফরম্যান্স প্যানেলে অন্তর্দৃষ্টি সাইডবার
সরাসরি DevTools পারফরম্যান্স প্যানেলে নতুন পারফরম্যান্সের অন্তর্দৃষ্টি, Lighthouse এর শক্তি সম্পর্কে জানুন।
খবর এবং আপডেট
সম্পদ পরিদর্শন এবং সম্পাদনা
বৈশিষ্ট্য উল্লেখ
উত্স প্যানেলের সমস্ত বৈশিষ্ট্য সম্পর্কে জানুন: কীভাবে ফাইলগুলি দেখতে এবং সম্পাদনা করতে হয়, জাভাস্ক্রিপ্ট ডিবাগ করতে হয় এবং একটি ওয়ার্কস্পেস সেট আপ করতে হয়৷
একটি কর্মক্ষেত্র সেট আপ করুন
ওয়ার্কস্পেস আপনাকে আপনার কম্পিউটারে সঞ্চিত সোর্স কোডে DevTools-এর মধ্যে করা পরিবর্তনগুলি সংরক্ষণ করতে দেয়। আপনার নিজের প্রকল্পে একটি কর্মক্ষেত্র কিভাবে সেট আপ করবেন তা শিখুন।
নেটওয়ার্ক কার্যকলাপ বিশ্লেষণ
নেটওয়ার্ক প্যানেল
নেটওয়ার্ক প্যানেলের সমস্ত বৈশিষ্ট্য সম্পর্কে জানুন: প্রতিক্রিয়া পরিদর্শন করুন এবং সংস্থাগুলির অনুরোধ করুন, শিরোনামগুলি ওভাররাইট করুন এবং আরও অনেক কিছু৷
নেটওয়ার্ক কার্যকলাপ পরিদর্শন করুন
নেটওয়ার্ক প্যানেলের মধ্যে সাধারণ কাজগুলির মাধ্যমে আপনাকে গাইড করার জন্য একটি হ্যান্ডস-অন টিউটোরিয়াল৷
আরও সরঞ্জাম
DevTools-এ অন্যান্য সমস্ত বৈশিষ্ট্য এবং ক্ষমতা আবিষ্কার করুন।
উপাদান
কিভাবে একটি পৃষ্ঠার DOM দেখতে এবং পরিবর্তন করতে হয় তা জানুন।
শৈলী, শৈলী, শৈলী
কিভাবে একটি পৃষ্ঠার CSS দেখতে এবং পরিবর্তন করতে হয় তা জানুন।
পরিবর্তন
HTML, CSS, এবং JavaScript-এ পরিবর্তনগুলি ট্র্যাক করুন।
কনসোল
বার্তা লগ করুন এবং JavaScript চালান।
কর্মক্ষমতা
ওয়েবসাইট কর্মক্ষমতা মূল্যায়ন.
স্মৃতি
মেমরির সমস্যাগুলি খুঁজুন যা পৃষ্ঠার কার্যক্ষমতাকে প্রভাবিত করে, মেমরি লিক সহ, এবং আরও অনেক কিছু।
আবেদন
ওয়েব অ্যাপ্লিকেশানগুলি পরিদর্শন করুন, সংশোধন করুন এবং ডিবাগ করুন, ক্যাশে পরীক্ষা করুন, সঞ্চয়স্থান দেখুন এবং আরও অনেক কিছু করুন৷
অ্যানিমেশন
পরিদর্শন এবং অ্যানিমেশন পরিবর্তন.
রেকর্ডার
রেকর্ড করুন, রিপ্লে করুন, ব্যবহারকারীর প্রবাহ পরিমাপ করুন এবং তাদের পদক্ষেপগুলি সম্পাদনা করুন৷
রেন্ডারিং
বিকল্পগুলির একটি সংগ্রহ আবিষ্কার করুন যা ওয়েব সামগ্রী রেন্ডারিংকে প্রভাবিত করে৷
অটোফিল
সংরক্ষিত ঠিকানাগুলি পরিদর্শন এবং ডিবাগ করুন।
ইস্যু
আপনার ওয়েবসাইটের সমস্যাগুলি খুঁজুন এবং ঠিক করুন।
গোপনীয়তা এবং নিরাপত্তা
নিশ্চিত করুন যে একটি পৃষ্ঠা সম্পূর্ণরূপে HTTPS দ্বারা সুরক্ষিত।
মিডিয়া
ব্রাউজার ট্যাবে তথ্য দেখুন এবং মিডিয়া প্লেয়ার ডিবাগ করুন।
সেন্সর
ডিভাইস সেন্সর অনুকরণ.
WebAuthn
প্রমাণীকরণকারীদের অনুকরণ করুন।