AI-জেনারেটেড কোড ডিবাগ করার সহজ উপায় (বিগিনার গাইড)

AI-জেনারেটেড কোড, মানে Claude-এর লেখা কোড, প্রথমবারেই সবসময় নিখুঁতভাবে চলে না। এটা একটা খুবই সাধারণ অভিজ্ঞতা, একটা ফিচার যোগ করার পর সাইট খুলে দেখলেন সাদা স্ক্রিন, বা বাটনে ক্লিক করলে কিছু হচ্ছে না। এই মুহূর্তে অনেকে ঘাবড়ে গিয়ে পুরো কাজ আবার নতুন করে শুরু করার কথা ভাবেন। বাস্তবে এই ধরনের কোড ডিবাগ করা যতটা কঠিন মনে হয় ততটা না, যদি সঠিক পদ্ধতিতে এগোনো যায়। নিজে কোড লিখতে না জানলেও, একটা সমস্যা কীভাবে ধাপে ধাপে খুঁজে বের করতে হয় সেই পদ্ধতিটা জানা থাকলে অনেক বেশি স্বস্তিতে কাজ করা যায়।

এরর মেসেজ পড়া শেখা

কোনো কিছু কাজ না করলে সবার আগে যেটা দেখা দরকার সেটা হলো এরর মেসেজ। ব্রাউজারে এই মেসেজ দেখা যায় ডেভেলপার টুলস খুলে, কীবোর্ডে F12 চাপলে বা রাইট-ক্লিক করে "Inspect" বেছে নিলে, তারপর "Console" ট্যাবে গেলে। এখানে লাল রঙে যে টেক্সট দেখা যায় সেটাই সাধারণত সমস্যার আসল কারণ বলে দেয়, যদিও প্রথম দেখায় সেটা জটিল কোডের মতো লাগতে পারে।

টার্মিনাল-বেসড এজেন্ট দিয়ে কাজ করলে এই কাজ আরও সহজ হয়, কারণ ও নিজেই টার্মিনাল থেকে এরর দেখতে পারে অনেক ক্ষেত্রে, আলাদা করে কপি-পেস্ট করার দরকার পড়ে না। কিন্তু ব্রাউজারে চলা কোনো সমস্যার ক্ষেত্রে, যেমন কোনো বাটন ক্লিক করলে কিছু না হওয়া, কনসোলের এরর মেসেজটা কপি করে Claude-কে দেওয়াটাই সবচেয়ে দ্রুত সমাধানের রাস্তা।

সমস্যাটা যতটা সম্ভব নির্দিষ্ট করে বলা

"কাজ করছে না" বলাটা Claude-এর জন্য যথেষ্ট তথ্য না। এর বদলে ঠিক কী করার চেষ্টা করছিলেন, কী আশা করেছিলেন হবে, আর আসলে কী হয়েছে, এই তিনটা জিনিস বললে সমাধান অনেক দ্রুত পাওয়া যায়। যেমন: "কন্টাক্ট ফর্মে সাবমিট বাটনে ক্লিক করলাম, একটা সাকসেস মেসেজ আসার কথা ছিল, কিন্তু কিছুই হচ্ছে না আর কনসোলে এই এরর দেখাচ্ছে।" এরপর এরর মেসেজটা হুবহু পেস্ট করে দিন।

ছোট ছোট ধাপে টেস্ট করা

একসাথে অনেকগুলো পরিবর্তন করার পর যদি কিছু ভেঙে যায়, তাহলে ঠিক কোন পরিবর্তনটার কারণে সমস্যা হয়েছে সেটা বের করা কঠিন হয়ে পড়ে। এর বদলে একটা করে পরিবর্তন করে সেটা টেস্ট করে দেখাটা অনেক নিরাপদ। Claude Code দিয়ে কাজ করার সময় একটা ফিচার শেষ করে সেটা চেক করে নিয়ে তারপর পরেরটায় যাওয়া, একসাথে পাঁচটা ফিচারের কথা বলে সব একসাথে করানোর চেয়ে ভালো ফল দেয়।

API বা ডাটাবেস সংক্রান্ত সমস্যার ক্ষেত্রে

কখনো কখনো সমস্যাটা কনসোলে সরাসরি দেখা যায় না, বিশেষ করে যখন কোনো ফর্ম সাবমিট করলে বা ডেটা লোড করার সময় কিছু ঘটছে না। এই ধরনের ক্ষেত্রে ব্রাউজারের ডেভেলপার টুলসে "Network" ট্যাবে গিয়ে দেখা যায় কোন রিকোয়েস্টটা ফেইল করছে, আর কী স্ট্যাটাস কোড ফেরত আসছে। এই তথ্যটাও Claude-কে দিলে সমস্যার কারণ বের করা সহজ হয়।

এরর কয়েক ধরনের হয়

সব এরর একরকম না। কিছু এরর হলো সিনট্যাক্স এরর, মানে কোডের লেখার নিয়মেই ভুল আছে, এই ধরনের এরর সাধারণত সাথে সাথে ধরা পড়ে আর ঠিক করাও সহজ। কিছু এরর হলো রানটাইম এরর, মানে কোড লেখায় ভুল নেই কিন্তু চলার সময় কোনো একটা নির্দিষ্ট পরিস্থিতিতে ভেঙে পড়ে, যেমন কোনো ডেটা আশা করা হয়েছিল কিন্তু সেটা খালি এসেছে। আর কিছু সমস্যা লজিক এরর, যেখানে কোড চলে ঠিকঠাক কিন্তু ফলাফল আপনি যা চেয়েছিলেন তা না। এই তিন ধরনের মধ্যে পার্থক্য বুঝতে পারলে Claude-কে সমস্যা বোঝানো আরও সহজ হয়ে যায়।

অস্থায়ী debug মেসেজ যোগ করতে বলা

কোনো সমস্যার কারণ বোঝা না গেলে, Claude-কে বলা যায় কোডের নির্দিষ্ট জায়গায় সাময়িকভাবে কিছু debug মেসেজ যোগ করতে, যা কনসোলে দেখাবে ঠিক কোন পর্যায়ে কী মান পাওয়া যাচ্ছে। এভাবে ধাপে ধাপে দেখা যায় কোথায় গিয়ে জিনিসটা প্রত্যাশা মতো হচ্ছে না। সমস্যা ধরা পড়ে গেলে এই অস্থায়ী মেসেজগুলো পরে সরিয়ে ফেলতে বলাই ভালো, যাতে চূড়ান্ত কোড পরিষ্কার থাকে।

Git-এর সাহায্য নেওয়া

Git ব্যবহারের গুরুত্বের কথা Claude Code সম্পর্কিত লেখায় আগেই বলা হয়েছে। ডিবাগিংয়ের সময় এটা সবচেয়ে বেশি কাজে লাগে। যদি একটা পরিবর্তনের পর সাইট পুরোপুরি ভেঙে যায় আর কারণ বের করা কঠিন মনে হয়, তাহলে সবচেয়ে সহজ সমাধান হলো শেষ ভালো অবস্থায় ফিরে যাওয়া, তারপর আবার ধীরে ধীরে, ছোট ধাপে এগোনো। এটা লজ্জার কিছু না, অভিজ্ঞ ডেভেলপাররাও নিয়মিত এই কাজ করেন।

কখন নতুন করে শুরু করা ভালো, কখন ঠিক করা

কিছু সমস্যা একটা ছোট টাইপো বা ভুল লজিকের কারণে হয়, যেটা এক-দুই বাক্যের ফিডব্যাকেই ঠিক হয়ে যায়। কিন্তু কখনো কখনো Claude একটা ভুল পথে এগোতে থাকে, আর একের পর এক ফিক্স করতে গিয়ে সমস্যা আরও জটিল হয়ে ওঠে। এই পরিস্থিতি চেনা জরুরি। যদি তিন-চারবার একই এরর ঘুরেফিরে আসতে থাকে বা প্রতিটা ফিক্সে নতুন সমস্যা তৈরি হয়, তাহলে থেমে গিয়ে প্রশ্নটা নতুন করে সাজিয়ে বলা, বা সেই নির্দিষ্ট অংশটা শুরু থেকে আবার করানোই ভালো সমাধান।

কয়েকটা কমন এরর মেসেজ আর তার মোটামুটি মানে

কনসোলে ঘুরেফিরে কিছু নির্দিষ্ট ধরনের এরর মেসেজ আসে, আর সেগুলোর মোটামুটি ধারণা থাকলে ভয়টা কমে যায়। "Cannot read properties of undefined" মানে সাধারণত কোনো একটা ডেটা আশা করা হয়েছিল কিন্তু সেটা এখনো লোড হয়নি বা খালি এসেছে। "is not a function" মানে যেটাকে ফাংশনের মতো চালানোর চেষ্টা হচ্ছে সেটা আসলে ফাংশন না, হয়তো বানান ভুল বা ভুল জায়গা থেকে ইম্পোর্ট হয়েছে। "404" মানে যে পেজ বা রিসোর্স খোঁজা হচ্ছে সেটা পাওয়া যায়নি, আর "500" মানে সার্ভারের ভেতরে কোনো একটা সমস্যা হয়েছে। এই নামগুলো মুখস্থ করার দরকার নেই, শুধু এরর মেসেজটা যেভাবেই হোক Claude-কে পুরোপুরি কপি করে দিলেই যথেষ্ট, তবে মেসেজের ধরন একটু চেনা থাকলে Claude-এর ব্যাখ্যাটাও দ্রুত বোঝা যায়।

লোকালে কাজ করছে কিন্তু লাইভ সাইটে করছে না

এটা একটা বিশেষভাবে বিভ্রান্তিকর পরিস্থিতি, নিজের কম্পিউটারে সব ঠিকঠাক চলছে, কিন্তু hosting-এ পাঠানোর পর কোনো একটা ফিচার কাজ করছে না। বেশিরভাগ সময় এর কারণ হয় এনভায়রনমেন্ট ভ্যারিয়েবল, Vercel-এ hosting করার নিয়ম নিয়ে লেখায় এই বিষয়টা বিস্তারিত আলোচনা করা হয়েছে। লোকাল কম্পিউটারে .env ফাইলে যা আছে, hosting প্ল্যাটফর্মেও ঠিক সেই তথ্যগুলো আলাদাভাবে বসাতে হয়, নাহলে ডাটাবেস কানেকশন বা লগইনের মতো ফিচার লাইভে কাজ করবে না যদিও লোকালে ঠিকঠাক চলে।

একই সমস্যায় আটকে থাকলে

মাঝে মাঝে এমন হয়, একটা সমস্যা নিয়ে অনেকক্ষণ ধরে চেষ্টা করেও সমাধান হচ্ছে না। এই অবস্থায় সমস্যাটা আবার নতুন করে, প্রথম থেকে, নিজের ভাষায় লিখে ফেলাটা অনেক সময় কাজে দেয়। ঠিক কী করার চেষ্টা করছিলেন, কোন ধাপ পর্যন্ত ঠিক ছিল, কোন ধাপে গিয়ে সমস্যা শুরু হলো, এভাবে গুছিয়ে লিখতে গেলে অনেক সময় নিজে থেকেই বোঝা যায় সমস্যাটা কোথায়। এই পদ্ধতিটাকে ডেভেলপারদের মধ্যে অনেক সময় "রাবার ডাক ডিবাগিং" বলা হয়, মূল ধারণা হলো সমস্যাটা অন্য কাউকে (বা এক্ষেত্রে Claude-কে) গুছিয়ে ব্যাখ্যা করার প্রক্রিয়াটাই মাথা পরিষ্কার করতে সাহায্য করে।

বিভিন্ন ডিভাইস আর ব্রাউজারে যাচাই করা

একটা ফিচার একটা ব্রাউজারে বা ডেস্কটপে ঠিকঠাক কাজ করলেও মোবাইলে বা অন্য কোনো ব্রাউজারে একই রকম আচরণ নাও করতে পারে। এই ধরনের সমস্যা প্রথম দেখায় খুঁজে পাওয়া কঠিন মনে হতে পারে, কারণ নিজের স্ক্রিনে তো সব ঠিকই আছে। যদি সম্ভব হয়, একটা ফিচার শেষ করার পর অন্তত একবার মোবাইল স্ক্রিনে বা অন্য একটা ব্রাউজারে চেক করে নেওয়া ভালো অভ্যাস। কোনো নির্দিষ্ট ডিভাইসে সমস্যা দেখা দিলে সেটা কোন ডিভাইস, কোন ব্রাউজার, এই তথ্যটাও Claude-কে জানালে সমাধান খুঁজে বের করা সহজ হয়।

ব্রাউজার ক্যাশে নিয়ে একটা সাধারণ ভুল বোঝাবুঝি

মাঝে মাঝে একটা পরিবর্তন করার পরও পেজে সেটা দেখা যায় না, আর মনে হয় হয়তো Claude ঠিকমতো ফাইল বদলায়নি। বেশিরভাগ সময় আসল কারণ হয় ব্রাউজারের ক্যাশে, মানে পুরনো ভার্সনটা ব্রাউজার নিজের মেমোরিতে রেখে দিয়ে সেটাই আবার দেখাচ্ছে। এই পরিস্থিতিতে একটা হার্ড রিফ্রেশ করলে, সাধারণত Ctrl+Shift+R চেপে, সমস্যাটা মিটে যায়। কোনো পরিবর্তনের পর ফলাফল না দেখলে প্রথমে এটা চেক করে নেওয়া ভালো, তারপরই ধরে নেওয়া উচিত যে আসলেই কোনো কোডের সমস্যা আছে।

ডিবাগিংয়ের সময়টাকে শেখার সুযোগ হিসেবে দেখা

প্রতিটা এরর আসলে একটা তথ্য দেয়, কোথায় প্রত্যাশা আর বাস্তবতার মধ্যে ফারাক তৈরি হয়েছে। যারা নিয়মিত Claude দিয়ে কাজ করেন, তারা কিছুদিন পর লক্ষ্য করেন একই ধরনের এরর বারবার ফিরে আসছে, আর প্রতিবার সমাধান করতে করতে সেই নির্দিষ্ট ধরনের সমস্যা চেনাটা সহজ হয়ে যাচ্ছে। এই প্যাটার্ন চেনার অভ্যাসটাই আসলে দক্ষতা তৈরি করে, কোনো একদিনে সব শিখে ফেলার ব্যাপার এটা না। তাই একটা এরর এলে সেটাকে শুধু একটা বাধা হিসেবে না দেখে, ভবিষ্যতে কাজে লাগবে এমন একটা ছোট শিক্ষা হিসেবে দেখাটা প্রক্রিয়াটাকে কম ক্লান্তিকর করে তোলে।

এরর হওয়ার আগেই কিছুটা প্রতিরোধ করা

সব ডিবাগিং এরর হওয়ার পর শুরু হয় না, কিছুটা প্রতিরোধমূলক অভ্যাসও কাজে লাগে। কোনো ফিচার শেষ করার পর সেটা লাইভ করার আগে Claude-কে বলা যায় "এই কোডটা একবার রিভিউ করে দেখো কোনো স্পষ্ট সমস্যা আছে কিনা", বিশেষ করে যেখানে ফর্ম ডেটা বা ইউজারের ইনপুট নিয়ে কাজ হচ্ছে। এই ছোট অভ্যাসটা সবসময় সব সমস্যা ধরতে পারবে না, কিন্তু অনেক সাধারণ ভুল, যেমন খালি ইনপুট চেক না করা, আগে থেকেই ধরা পড়ে যায়, যার ফলে পরে ডিবাগিংয়ে সময় কম লাগে। প্রতিটা বড় ফিচারের পর এভাবে একবার থেমে রিভিউ করিয়ে নেওয়ার অভ্যাসটা প্রথম দিকে বাড়তি একটা ধাপ মনে হতে পারে, কিন্তু সময়ের সাথে এটা রুটিনের একটা স্বাভাবিক অংশ হয়ে যায়, ঠিক যেমন লেখার পর একবার নিজে পড়ে দেখাটা স্বাভাবিক অভ্যাস।

নিজে কিছুটা বোঝার চেষ্টা করা কেন সাহায্য করে

কোড লেখার পুরো কাজটা Claude করলেও, এরর মেসেজে সাধারণত যেসব শব্দ ঘুরেফিরে আসে, যেমন "undefined", "not found", "permission denied", এগুলোর মোটামুটি অর্থ বুঝে নেওয়া কাজে লাগে। এর মানে এই না যে প্রোগ্রামিং শিখতে হবে, বরং এরর মেসেজের প্যাটার্ন চেনাটা ধীরে ধীরে স্বাভাবিক হয়ে আসে, আর তখন Claude-কে সমস্যা বোঝাতে সময় কম লাগে।

ডিবাগিং একটা দক্ষতা যেটা সময়ের সাথে সহজ হয়ে আসে। শুরুর দিকে যা ভীতিকর মনে হয়, কয়েক সপ্তাহ নিয়মিত কাজ করার পর সেটাই রুটিন কাজের একটা অংশ হয়ে দাঁড়ায়। ভুল হওয়াটা প্রক্রিয়ার স্বাভাবিক একটা অংশ, প্রতিটা এরর আসলে একটা তথ্য, যেটা পরের ধাপে কী করতে হবে সেটা বুঝিয়ে দেয়।

Claude দিয়ে কোড লেখা আর ডিবাগ করা দুটোই হাতে-কলমে শেখানো হয় লাইভ ক্লাসে, এই কোর্সে।