Visual Studio তে ঝটপট কোড স্নিপেট তৈরীর রেসিপি

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

আজকের রান্নার টিউটোরিয়ালে আমরা শিখব কিভাবে সচরাচর ব্যাবহার করা কোড লাইন কে স্নিপেট আকারে সেভ করে কোড লেখার গতি বৃদ্ধি করা যায়। আর তা আমাদের সবার প্রিয় ভিজুয়াল স্টুডিওতে। ছোট্ট এই রান্না শিখতে সময় লাগবে মাত্র কয়েক মিনিট, কিন্ত আপনার কোড লেখার সময় বাঁচাতে পারে কয়েক ঘন্টা। তাহলে দেরী না করে চলুন শুরু করি।

কোড স্নিপেট কি?

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

[অনেক ইংরেজী শব্দ হয়ে যাচ্ছে না! কিন্ত কি আর করা, এগুলোর সরাসরি বাংলা শব্দ নেই বা বাংলা ব্যাবহার করলে শ্রুতি মধুর হবে না 😛]

যেমন সিশার্প কোড লেখার সময় আমরা cw লিখে দুইবার ট্যাব চাপ দিলে Console.WriteLine(); লেখা চলে আসে। এখানে Console.WriteLine(); হচ্ছে স্নিপেট আর cw হচ্ছে শর্টকোড। এমন অনেকগুলো স্নিপেট মাইক্রোসফট ডিফল্ট ভাবে দিয়ে দিয়েছে ভিজুয়াল স্টুডিওর সাথে। এসব স্নিপেটের লিস্ট দেখতে চাইলে আপনাকে যেতে হবে Tools > Snippets Manager অথবা আপনি Ctrl+K + Ctrl+B প্রেস করেও স্নিপেট ম্যানেজার উইন্ডোটি ওপেন করতে পারবেন। 😉

এখন আমরা দেখব কিভাবে আমাদের পছন্দমত স্নিপেট তৈরি করা যায়।

কাস্টম স্নিপেট তৈরি

প্রথমেই আমরা .snippet এক্সটেনশনের একটি ফাইল তৈরি করব এবং পছন্দ মত একটি নাম দেবো। (পছন্দমত দেব মানে এই নয় যে আমরা hzasd.snippet এমন ধরনের নাম দেবো! পরবর্তীতে জেনো বুঝতে পারি সেজন্য সামঞ্জস্য পূর্ণ একটি নাম দেবো।)

এখন, আমাদের চাহিদা হচ্ছে আমরা ভিজুয়াল স্টুডিও তে cr টাইপ করব এবং Console.ReadLine(); এসে হাজির হবে। তাহলে আমরা একটি নতুন ফাইল তৈরি করে ফাইলের নাম দিলাম ReadLine.snippet​। এর পর ফাইলটিকে যেকোন টেক্সট এডিটরে ওপেন করে নিচের কোডব্লকটি হুবাহুব কপি করে পেস্ট করব।

Copycopy code to clipboard
1<?xml version="1.0" encoding="utf-8"?>
2<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
3    <CodeSnippet Format="1.0.0">
4        <Header>
5           <Title></Title>
6           <Author></Author>
7           <Description></Description>
8           <Shortcut></Shortcut>
9         </Header>
10        <Snippet>
11            <Code Language="">
12                <![CDATA[]]>
13            </Code>
14        </Snippet>
15    </CodeSnippet>
16</CodeSnippets>

ব্যাস আমাদের কাজ শেষ, এখন বিশ্বের যেকোন প্রান্ত থেকে আমরা আমাদের স্নিপেট ব্যাবহার করতে পারব। 😛

হাহা, মজা করলাম। কাজ তো কেবল শুরু, তবে আর মাত্র কয়েক ধাপ বাকি।

<Header></Header> এই ব্লকটি মূলত স্নিপেট সম্পর্কে জেনারেল তথ্য ধারন করে। যেমন কে বানিয়েছে, বর্ণনা, শর্টকোড ইত্যাদি। তাহলে চলুন এই ব্লকের প্রয়োজনীয় তথ্যদিয়ে ব্লকটিকে পূর্ণ করি।

Copycopy code to clipboard
1<Header>
2 <Title>ReadLine</Title>
3    <Author>Mahmudul Hasan</Author>
4    <Description>Code snippet for Console.ReadLine</Description>
5    <Shortcut>cr</Shortcut>
6</Header>

এর পরে হচ্ছে আসল কাজ। স্নিপেট তৈরি। <Snippet></Snippet> ব্লকের মাঝে বেশ কয়েকটি ব্লক রাখা যায়। এর মধ্যে প্রধান ব্লক হচ্ছে <Code Language=""></Code> যা মূল স্নিপেট কে ধারণ করে। এখানে Language অ্যাট্রিবিউটের মাধ্যমে ডিফাইন করে দিবো যে আসলে স্নিপেট টা কোন ভাষার জন্য। ভিজুয়াল স্টুডিও বেশ কয়েকটি ভাষা সাপোর্ট করে আস সব ভাষার জন্যই কিন্ত স্নিপেট ব্যাবহার করা যায়। এখন আমি যদি সি++ এর স্নিপেট সি# এ ব্যাবহার করি, তাহলে কি হবে! এজন্য আমাদের বলে দিতে হবে যে স্নিপেট টা কোন ভাষার জন্য। C# এর জন্য CSharp, Visual Basic এর জন্য VB এবং C++ এর জন্য CPP ল্যাঙ্গুয়েজ অ্যাট্রিবিউটে লিখে দিতে হবে।

এই ব্লকের মাঝে আছে <![CDATA[]]> যেটার মাঝে আমরা আমাদের স্নিপেট কে লিখব। আচ্ছে এই অদ্ভুত অক্ষরগুচ্ছের মানে কি? ইচ্ছে জাগে? জাগলে উইকিপিডিয়া থেকে একটু ঢুঁ মেরে আসুন এখান দিয়ে।

আমরা যেহেতু Console.ReadLine(); এর জন্য স্নিপেট বানাচ্ছি, তাই আমরা [] এর মাঝে লিখব Console.ReadLine();। সব প্রয়োজনীয় তথ্য দেয়ার পর ব্লকটি দেখতে হবে এমন -

Copycopy code to clipboard
1<Snippet>
2 <Code Language="CSharp">
3     <![CDATA[Console.ReadLine();]]>
4 </Code>
5</Snippet>

আমাদের কাজ শেষ আপাতত। মানে বেসিক স্নিপেট তৈরি করা শেষ। এখন এটিকে আমরা ভিজুয়াল স্টুডিওতে ইমপোর্ট করব দৈনন্দিন ব্যাবহারের জন্য।

ভিজুয়াল স্টুডিও তে স্নিপেট ইম্পোরট করা

কোড স্নিপেট তৈরির থেকে ইম্পোরট করা আরো সহজ।

• প্রথমেই স্নিপেট ম্যানেজার ওপেন করতে হবে। (কিভাবে ওপেন করতে হয় তা ভুলে গেলে আবার বলে দিচ্ছি। ​Tools > Snippet Manager)

• এর পরে ড্রপ ডাউন মেনু থেকে সঠিক ভাষা সিলেক্ট করতে হবে (এক্ষেত্রে CSharp সিলেক্ট করতে হবে কেননা আমরা C# এর জন্য স্নিপেট বানাচ্ছি)।

• এরপর ​Import ​বাটনে ক্লিক করবেন। একটি ফাইল পিকার ওপেন হবে। যেখানে স্নিপেট ফাইলটি তৈরি করেছেন সেই ফোল্ডারে যান ও স্নিপেট টি সিলেক্ট করে ওকে করে ফিনিস করুন। ব্যাস কাজ শেষ। হয়ে গেলো স্নিপেট ইম্পোরট করা।

• এবার ​cr ​লিখে দুইবার ট্যাব প্রেস করলেই ​Console.ReadLine();​ লেখাটি চলে আসবে। আর যদি না আসে তো ভিজুয়াল স্টুডিও কে একবার রিস্টার্ট করুন।

এর পর থেকে আর কষ্ট করে ​Console.ReadLine(); ​লিখতে হবে না বা ইন্টেলিসেন্সের জন্য বসে থাকতে হবে না যে কখন শাজেশনে দেখাবে আর ওখান থেকে টুক করে বসিয়ে দেবো! 😀😀😀

ঝাল লবণ বেশি দিয়ে স্নিপেট তৈরি

আমাদের বেসিক স্নিপেট তৈরি করা শেষ। এবার আমরা দেখব কিভাবে একটু এডভান্স স্নিপেট কিভাবে তৈরি করতে হয়। আপনি যদি কখনো ​prop ​দিয়ে প্রোপার্টি স্নিপেট এনে থাকেন, তাহলে দেখবেন যে এডিট করা যায় এমন সম্ভাব্য সব শব্দগুলো হাইলাইট হয়ে থাকে এবং একটি সিলেক্ট হয়ে থাকে। আমরা যদি ট্যাব প্রেস করি তাহলে পরের হাইলাইট করা শব্দে যেতে পারি। আমরা এখন রান্নার এই পর্যায়ে দেখব কিভাবে স্নিপেটে এমন মজাদার ফ্লেভার নিয়ে আসা যায়। তবে এজন্য আমাদের টেমপ্লেটকে একটু বর্ধিত করতে হবে। আমাদের নতুন টেমপ্লেট হবে এমন -

Copycopy code to clipboard
1<?xml version="1.0" encoding="utf-8"?>
2<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
3    <CodeSnippet Format="1.0.0">
4        <Header>
5           <Title></Title>
6           <Author></Author>
7           <Description></Description>
8           <Shortcut></Shortcut>
9         </Header>
10        <Snippet>
11            <Code Language="">
12                <![CDATA[]]>
13            </Code>
14            <Declarations>
15                  <Literal>
16                    <ID></ID>
17                    <ToolTip></ToolTip>
18                    <Default></Default>
19                  </Literal>
20            </Declarations>
21        </Snippet>
22    </CodeSnippet>
23</CodeSnippets>

লক্ষ্য করলে দেখা যাবে যে টেমপ্লেট টি প্রায় একই, শুধু <Snippet></Snippet> এ <Declarations></Declarations> নামে আরেকটি ব্লক এসে হাজির। এটি আবার <Literal></Literal> ধরনের একাধিক ব্লক ধারণ করতে পারে। আমাদের যত গুলো শব্দ পরবর্তীতে পরিবর্তন করার প্রয়োজন হতে পারে সেগুলো কে হাইলাইট করার জন্য সবার জন্য আলাদা ভাবে <Literal></Literal> ব্লক টি ব্যাবহার করব। ধাপ গুলো হচ্ছে - <Literal></Literal> এ <ID></ID> ব্লকের মাঝে আমরা দিব শব্দটির জন্য একটি ইউনিক আইডি। এই আইডির মাধ্যমে আমরা আমাদের স্নিপেটে $ID$ ব্যাবহার করে শব্দটিকে একাধিকস্থানে ব্যাবহার করতে পারব, আর সব শব্দ হবে কানেক্টেড। ফলে একস্থানে শব্দটিকে পরিবর্তন করলে স্নিপেটের সবস্থানেই পরিবর্তন হয়ে যাবে। মজার না! এরপর আমরা <ToolTip></ToolTip> ব্লকে দিবো টুলটিপ। যেনো শব্দটির উপরে কার্সর রাখলে সেই শব্দ সম্পর্কে কিছু তথ্য দেখায়। মনে রাখতে হবে যে টুলটিপ হতে হবে অল্প শব্দে আর যেন পরিষ্কার ভাবে বর্ণিত। এরপর আমরা দিবো শব্দটির জন্য ডিফল্ট ভ্যালু <Default></Default> ব্লকের মাঝে। ফলে স্নিপেট টা ইনসার্ট করার সাথে সাথে এই ভ্যালুটি দেখাবে এবং আমরা আমাদের ইচ্ছে মত শব্দ লিখে এন্টার বাটনে প্রেস করলেই স্নিপেটের সব স্থানেই আমাদের পছন্দের শব্দ বসে যাবে। এভাবে আমরা প্রয়োজন মত লিটেরাল বসিয়ে নেবো। চলুন এবার হাতে কলমে করা যাক। এবার আমরা জিনেরিক অব্জেক্ট প্রোপার্টির জন্য স্নিপেট বানাবো। যেমন -

Copycopy code to clipboard
1private T tName;
2public T TName
3{
4 get => tName ??= new T();
5    set => tName = value;
6}

আমরা এই ব্লক টিকে স্নিপেটে রুপান্তর করব যেনো আমরা বার বার এটি সহজেই ইনসার্ট করতে পারি।

এখন প্রথমের মত আমরা একটি .snippet ​এক্সটেনশন দিয়ে একটি ফাইল বানিয়ে ফেলি এবং টেমপ্লেটটিকে কপি করে নিয়ে পেস্ট করে দি। এরপর উপরে বর্ণিত নিয়ম অনুসারে আমরা টেমপ্লেটটিকে তথ্যে ভরপুর করে ফেলি। সকল ফিল্ড পূরন করার পর আমাদের ফাইলটি দেখতে হবে কিছুটা এমন -

Copycopy code to clipboard
1<?xml version="1.0" encoding="utf-8"?>
2<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
3    <CodeSnippet Format="1.0.0">
4        <Header>
5           <Title>T type property</Title>
6           <Author>Mahmudul Hasan</Author>
7           <Description>Code snippet for an automatically implemented property of type T.</Description>
8           <Shortcut>propt</Shortcut>
9         </Header>
10        <Snippet>
11            <Code Language="CSharp">
12                <![CDATA[
13                private $T$ $tName$;
14                public $T$ $TName$
15                {
16                    get => $tName$ ??= new $T$();
17                    set => $tName$ = value;
18                }
19                ]]>
20            </Code>
21        <Declarations>
22            <Literal>
23                <ID>T</ID>
24                <ToolTip>Choose the type of the object.</ToolTip>
25                <Default>T</Default>
26              </Literal>
27            <Literal>
28              <ID>TName</ID>
29              <ToolTip>Choose property name.</ToolTip>
30              <Default>TName</Default>
31            </Literal>
32            <Literal>
33              <ID>tName</ID>
34              <ToolTip>Choose the private field name.</ToolTip>
35              <Default>tName</Default>
36            </Literal>
37          </Declarations>
38        </Snippet>
39    </CodeSnippet>
40</CodeSnippets>

এখন আমরা পূর্বে বলা নিয়ম অনুসারে স্নিপেট ফাইলটাকে ভিজুয়াল স্টুডিওতে ইম্পোরট করে ফেলি। ব্যাস, রান্না হয়ে গেলো আমাদের ডেলিসিয়াস স্নিপেট। এবার আপনাদের পালা। নিত্য প্রয়োজনীয় কোডব্লকের স্নিপেট বানিয়ে ফেলুন আর কোড রাইটিং কে নিয়ে যান রকেট স্পীডে।

শেষ কথা

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