HTML Code Play

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

পড়ুন, সম্পাদনা করুন এবং চালান

লার্নিং ক্যাটালগটি ঘুরে দেখুন, একটি টিউটোরিয়াল খুলুন এবং একটি সম্পূর্ণ কোড উদাহরণের পাশাপাশি এর ব্যাখ্যা পড়ুন। উদাহরণটি এডিটরে পাঠান, মূল কোডটি চালান, তারপর একটি ট্যাগ, স্টাইল বা এক্সপ্রেশন পরিবর্তন করে আউটপুট তুলনা করুন। এই হাতে-কলমে শেখার প্রক্রিয়াটি আপনার পড়া সিনট্যাক্সকে তার দ্বারা তৈরি পেজ বা আচরণের সাথে সংযুক্ত করে।

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

নির্দেশিত শিক্ষা ও অনুশীলন

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

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

অনুশীলনের ছয়টি উপায়

একটি ভিন্ন দক্ষতা নিয়ে কাজ করার জন্য একটি কোডিং গেম বেছে নিন:

কোড বিল্ডার: কার্যকরী কোড পুনর্নির্মাণের জন্য ব্লকগুলোর ক্রম পরিবর্তন করুন।

আউটপুট ডিটেকটিভ: একটি কোড স্নিপেট কী তৈরি করবে তা অনুমান করুন।

বাগ হান্ট: একটি ত্রুটিপূর্ণ লাইন শনাক্ত করুন।

শূন্যস্থান পূরণ করুন: অনুপস্থিত কোড টোকেনটি বেছে নিন।

ম্যাচ ল্যাব: পরিভাষাগুলোর সাথে তাদের অর্থ সংযুক্ত করুন।

- র‍্যাপিড ফায়ার: একটি টাইমারের মধ্যে সত্য-মিথ্যা প্রশ্নের উত্তর দিন।

অ্যাক্টিভিটি লেভেলগুলো ফলাফল রেকর্ড করে এবং পরবর্তী ধাপ আনলক করে। আপনার স্কোর উন্নত করতে উপলব্ধ লেভেলগুলো পুনরায় খেলুন, অথবা উপলব্ধ হলে মিশ্র অনুশীলনের প্লেলিস্টগুলো ব্যবহার করুন।

আপনার শেখাকে সুসংগঠিত রাখুন

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

আপনার পাঠের অগ্রগতি, নোট এবং গেমের ফলাফল ডিভাইসে সংরক্ষিত থাকে। লার্নিং স্ক্রিন কন্ট্রোলগুলোর মধ্যে রয়েছে বড় ফন্ট, হাই কনট্রাস্ট এবং কম মোশন। পৃথক HTML, CSS এবং জাভাস্ক্রিপ্ট অ্যাসেসমেন্টগুলো অ্যাপের মধ্যেই অ্যাচিভমেন্ট সার্টিফিকেট প্রদান করে; এগুলো অ্যাপের মাধ্যমে শেখার রেকর্ড, কোনো স্বীকৃত যোগ্যতা নয়।

অনলাইন কমিউনিটির পোস্টগুলো সংযুক্ত থাকাকালীন কোড অন্বেষণের জন্য আরেকটি উৎস প্রদান করে। নেটওয়ার্ক-সমর্থিত কন্টেন্ট এবং উদাহরণ যা বাহ্যিক রিসোর্স লোড করে, সেগুলোর জন্য ইন্টারনেট অ্যাক্সেস প্রয়োজন; স্থানীয় অগ্রগতি স্টোরেজ ক্লাউড সিনক্রোনাইজেশন প্রদান করে না।

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