Feb 08

সি এস এস পরিচিতি (CSS Introduction)

মোঃ রফিকুল ইসলাম

 

এই সিএসএস টিউটোরিয়াল এর মাধ্যমে সিএসএস কিভাবে স্টাইল নিয়ন্ত্রণ করে এবং একইসাথে একাধিক ওয়েব পেজ এ ব্যবহার করা যায় সে সম্পর্কে জানতে পারবেন।

প্রতি অধ্যায় এ উদাহরণ

এই টিউটোরিয়াল এ শত শত সিএসএস টিউটোরিয়াল সন্নিবেশ করা হয়েছে।

সিএসএস উদাহরণঃ

 body {
    background-color: #d0e4fe;
}

h1 {
    color: orange;
    text-align: center;
}

p {
    font-family: "Times New Roman";
    font-size: 20px;
}

 

সিএসএস কুইজ

সিএসএস কুইজ এর মাধ্যমে আপনার সিএসএস দক্ষতা যাচাই করুন।

আপনাকে কি আগে থেকেই জানতে হবে

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

সিএসএস কি?

  • সিএসএস এর এব্রিবিয়েশন হচ্ছে ক্যাসকাইডিং স্টাইল শীট (Cascading Style Sheets)
  • সিএসএস এইচটিএমএল উপাদানসময়হ কিভাবে প্রদর্শন করা হবে তা নির্ধারণ করে।
  • এইচটিএমএল ৪.০ এর একটি সমস্যা সমাধানের জন্য স্টাইল তৈরি করা হয়েছে।
  • সিএসএস প্রচুর পরিমাণে কাজ করার হাত থেকে রক্ষা করে।
  • বহিস্থিত স্টাইল শীট একটি আলাদা সিএসএস ফাইলে সংরক্ষণ করা হয়।

সিএসএস একটি বড় সমস্যার সমাধান করেছে

ডকুমেন্ট ফরমেটিং করার জন্য ট্যাগ ধারণ করার উদ্দেশ্যে এইচটিএমএল তৈরি করা হয় নাই।

এইচটিএমএল ডকুমেন্টের উপাদান বা বিষয়বস্তু নির্ধারণ করার উদ্দেশ্যেই তৈরি করা হয়েছিল। যেমন:

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

যখন ট্যাগ যেমন <font> এবং কালার এট্রিবিউট এইচটিএমএল 3.2 এ যোগ করা হয়েছিল, এটি ওয়েব ডেবেলপারদের জন্য একটি দুঃস্বপ্নের সূচনা করেছিল। একটি বিশাল ওয়েব সাইট ডেবেলপ করার ক্ষেত্রে, যখন ফন্ট এবং কালার এর তথ্য প্রত্যেকটি  পৃষ্ঠায় যোগ করা হতো, তখন এটি দীর্ঘ সময় সাপেক্ষ এবং ব্যয়বহুল হয়ে উঠেছিল।

এই সমস্যা সমাধানের জন্য World Wide Web Consortium (W3C) সিএসএস তৈরি করেছে।

এইচটিএমএল 4.0 এ, এইচটিএমএল ডকুমেন্ট থেকে সকল ফরমেটিং মুছে ফেলা হতে পারে এবং আলাদা সিএসএস ফাইলে সঞ্চিত করা হতে পারে।

সিএসএস প্রচুর কাজ করা থেকে রক্ষা করে!

স্টাইল ডিফাইনেশন সাধারণত আলাদা সিএসএস ফাইলে সংরক্ষণ করা হয়।

বহিস্থিত সিএসএস ফাইল দিয়ে, আপনি শুধু একটি ফাইল পরিবর্তন করে আপনি একটি ওয়েব সাইটের চেহারা পরিবর্তন করতে পারেন।

 

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

বর্তমানে সিএসএস ৩ চলে এসেছে। এর আগের ভার্সন হল সিএসএস ২.১। তবে সিএসএস ৩ এখন অধিকাংশ ব্রাউজারে সাপোর্ট করে এবং CSS 3 ব্যবহার দিন দিন বেড়েই চলছে।

Feb 07

পিএইচপি ৫ ভূমিকা (PHP 5 Introduction)

আক্তারুজ্জামান
Department of CSE, University of Chittagong.

 

পিএইচপি কি?

  • পিএইচপি হল “PHP: Hypertext Preprocessor” এর সংক্ষিপ্ত রূপ।
  • এটি বহুল ব্যবহৃত open source ল্যাংগুয়েজ যেটা মূলত ওয়েব ডেভেলপেমেন্টের জন্য ব্যবহার করা হয়।
  • সার্ভার সাইড স্ক্রিপ্টিং ল্যাংগুয়েজ অর্থাৎ পিএইচপি স্ক্রিপ্ট রান হয় সার্ভারে।
  • পিএইচপি ফ্রিতে ডাউনলোড এবং ব্যাবহার করা যায়।

 

পিএইচপি শেখার আগে কি জানা থাকা দরকার

পিএইচপি ভালভাবে বুঝতে হলে HTML, CSS এবং JavaScript সম্পর্কে বেসিক ধারনা থাকা জরুরী।

পিএইচপি ফাইল কি?

  • একটি পিএইচপি ফাইলে text, html, css, JavaScript এবং PHP কোড থাকতে পারে।
  • পিএইচপি ফাইল রান হয় সার্ভারে এবং রেজাল্ট এইচটিএমএল কোড হিসেবে ব্রাউজারে রিটার্ন হয় ।
  • পিএইচপি ফাইলের এক্সটেনশন হল .php ।

 

পিএইচপি দিয়ে কি কি করা যায়?

ওয়েব পেজে ডাইনামিক কনটেন্ট সৃষ্টি করার জন্য পিএইচপি ব্যাবহার করা হয়।

  • সার্ভারে কোন ফাইল তৈরি, ওপেন, রিড, রাইট, ডিলিট এবং ক্লোজ করতে পিএইচপি ব্যাবহার করা হয়।
  • পিএইচপি এইচটিএমএল ফরমের ডাটা সংগ্রহ করতে পারে।
  • cookies সেন্ড এবং রিসিভ করতে পিএইচপি ব্যাবহার করা হয়।
  • ডাটাবেজের কাজ, যেমনঃ ডাটাবেজে ডাটা এড, ডিলিট এবং পরিবর্তন করতে পিএইচপি ব্যাবহার করা হয়।
  • ইউজার এর এক্সেস নিয়ন্ত্রণ করতে পিএইচপি ব্যাবহার করা যেতে পারে।
  • ডাটা এনক্রিপ্ট করার কাজেও পিএইচপি ব্যাবহার হয়।
  • পিএইচপি দিয়ে এইচটিএমএল কোড প্রদর্শন করার পাশাপাশি ইমেজ, PDF এমনকি flush মুভিও প্রদর্শন করা যায়।

 

পিএইচপি কেন শিখব?

  • প্রায় সব প্লাটফর্ম (Windows, Linux, Unix, Mac OS X, etc) পিএইচপি সাপোর্ট করে।
  • সব সার্ভারে পিএইচপি ব্যাবহার উপযোগী।
  • পিএইচপি বিস্তৃত ডাটাবেজ সাপোর্ট করে।
  • পিএইচপি সম্পূর্ণ ফ্রি এবং ওপেন সোর্স।
  • পিএইচপি শেখা সহজ।
  • ওয়েবে সবচাইতে জনপ্রিয় কন্টেন্ট ম্যানেজমেন্ট সিস্টেম ওয়ার্ডপ্রেস (WordPress) পিএইচপি দিয়ে বানানো।
  • সবচাইতে জনপ্রিয় সামাজিক মিডিয়া সাইট ফেসবুকে পিএইচপি ব্যাবহার করা হয়।

Feb 07

পিএইচপি ৫ ফর্ম ভেলিডেশন (PHP 5 Form Validation)

কিভাবে ফর্ম কে validate করতে হয় তা আমরা এক এক করে কোড এর মাধ্যমে দেখব এবং তার বর্ণনা দেখব

টেক্সট ফিল্ডের এর এইচটিএমএল ফর্ম

Name:

E-mail:

Website:

Comment:

Gender:

Female
Male

 

 

টেক্সট ফিল্ডের এর এইচটিএমএল ফর্ম :
Name: <input type=”text” name=”name”>
E-mail: <input type=”text” name=”email”>
Website: <input type=”text” name=”website”>
Comment: <textarea name=”comment” rows=”5″ cols=”40″>রেডিও বাটন ব্যবহার করে এর পরবর্তী অংশ :

Gender:
<input type=”radio” name=”gender” value=”female”>Female
<input type=”radio” name=”gender” value=”male”>Male

ফর্মের এর শুরুতে পোস্ট করার element

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

 

যখন ফর্ম সাবমিট করা হয় তখন পোস্ট মেথড এর মাধ্যমে ডাটা সেন্ড করা হয়

ফর্মে আমরা ব্যবহার করেছি $_SERVER[“PHP_SELF”] যার অর্থ এই কোড ব্যবহার করার ফলে সাবমিট করা ডাটা অন্য কোন পেজ এ না গিয়ে এই পেজ এই পোস্ট হবে এবং এরর মেসেজ দেখাবে।

htmlspecialchars() ফাংশন এইচটিএমএল এর special characters গুলো কে এইচটিএমএল entities এ পরিবর্তন করে থাকে।

 

PHP নিরাপত্তা

$_SERVER[“PHP_SELF”] variable হ্যাকার রা ব্যবহার করে থাকে

যদি পেজ এ এই ফাংশন ব্যবহার করা হয়ে থাকে তখন কোন ইউজার slash(/) চিহ্ন ব্যবহার করতে পারে তখন কিছু ক্রস সাইট scripting (XSS) গননা হতে পারে।

মনে করি আমাদের এই ফর্মটি “test_form.php”নামে আছে।

<form method="post" action="<?php echo $_SERVER["PHP_SELF"];?>">

 

যদি কোন ইউজার এড্রেস বারে লিখে http://www.example.com/test_form.php তাহলে সেটা রিড করবে

<form method="post" action="test_form.php">

 

যদি কোন ইউজার এড্রেস বারে লিখে

http://www.example.com/test_form.php/%22%3E%3Cscript%3Ealert(‘hacked’)%3C/script%3E

 

তাহলে রিড করবে

<form method="post" action="test_form.php/"><script>alert('hacked')</script>

 

যখন পেজ লোড হবে ইয়খন javascript কোড গণনা হবে। সুতরাং আমাদের এইখানে সতর্ক থাকতে হবে যে একজন হ্যাকার কোন ইউজার কে অন্য কোন সার্ভারে নিয়ে জেতে পারে।

 

কিভাবে $_SERVER[“PHP_SELF”] এর অপব্যবহার থেকে রক্ষা পাওয়া যাবে

আমরা htmlspecialchars() function ব্যবহার করার মাধ্যমে এই সমস্যা থেকে মুক্ত হতে পারি। ফর্মের পুর কোড টা আমরা এইভাবে লিখতে পারি

<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">

যেহেতু htmlspecialchars() function এইচটিএমএল এর special character কে এইচটিএমএল entities এ পরিবর্তন করে সেহেতু কোন ইউজার যদি PHP_SELF এর অপব্যবহার করতে চেষ্টা করে তাহলে অউতপুত টা আসবে

<form method="post" 
action="test_form.php/&quot;&gt;&lt;script&gt;alert('hacked')&lt;/script&gt;">

 

তাতে কোন ক্ষতি হবে না।

 

পিএইচপি এর মাধ্যমে ডাটা validate করা

htmlspecialchars() ফাংশন ব্যবহার করে আমাদের সমস্ত ডাটাকে পাস করতে হবে। এখন যদি কেওএইটা পোস্ট করতে চায় তাহলে এটা কখনই গণনা হবে না কারন এইচটিএমএল escaped কোড দ্বারা এটি একটি নিরাপদ জায়গায় রাখা হয়েছে।

আমরা আরও দুটি জিনিস দেখব

  1. PHP trim() function ব্যবহার করে অপ্রয়োজনীয় ফাকা জায়গা, নতুন কোন লাইন এই character গুলো কে রিমুভ করতে পারি
  2. PHP stripslashes() ব্যবহার করে backslashes (\) দূর করতে পারি। এখন আমরা test_input() নামে একটি ফাংশন তৈরি করব যা সব ডাটাগুলোকে $_POST এর মাধ্যমে চেক করবে
<?php
 // define variables and set to empty values
 $name = $email = $gender = $comment = $website = "";
 
 if ($_SERVER["REQUEST_METHOD"] == "POST") {
   $name = test_input($_POST["name"]);
   $email = test_input($_POST["email"]);
   $website = test_input($_POST["website"]);
   $comment = test_input($_POST["comment"]);
   $gender = test_input($_POST["gender"]);
 }
 
 function test_input($data) {
   $data = trim($data);
   $data = stripslashes($data);
   $data = htmlspecialchars($data);
   return $data;
 }
 ?>

এইখানে $_SERVER[“REQUEST_METHOD”] যদি post মেথড ব্যবহার করা হয় তাহলে ফর্ম এর সকল ডাটা সাবমিট করা হবে এবং তা validate হবে। এই কোডটি রান করার পর যদি কোন ইউজার ফর্মের ডাটা ফাকা রেখে সাবমিট করে তাহলে এর ফলাফল বুঝা যাবে।

 

Feb 07

পিএইচপি ৫ if…else…elseif স্ট্যাটমেন্ট (PHP 5 if…else…elseif Statements)

PHP তে আমরা কোন variable ঘোষণা করলে তা $ চিহ্ন দিয়ে প্রকাশ করে থাকি। আমরা যদি if-else statement এর কাজ করতে যাই তাহলে আমাদের এই চিহ্ন নিয়ে কাজ করতে হবে। কোন উদাহরন দেওয়ার আগে আমরা একটু if-else বিষয় টা বুঝে নেই।

পিএইচপি ফাইল রান করার ক্ষেত্রে আমাদের অনেক condition থাকতে পারে if-else এর মাধ্যমে আমরা সেই condition গুলো প্রকাশ করতে পারি এবং প্রিন্ট করতে পারি।

< ?php
 $t = date("H");            /*variable ঘোষণা করেছি */
if ($t < "20")              /*এর মাধ্যমে আমরা শর্ত দিয়ে দিয়েছি*/
 {
 echo "Have a good day!";   /*এবং শর্ত যদি মিলে তাহলে তা প্রিন্ট করবে */
 }
 ?>

যদি আমরা if এর সাথে else ব্যবহার করি তাহলে দেখুন

< ?php
 $t = date("H");          /*variable ঘোষণা করেছি */
if ($t < "20")            /*এর মাধ্যমে আমরা শর্ত দিয়ে দিয়েছি*/
 {
 echo "Have a good day!"; /*এবং শর্ত যদি মিলে তাহলে তা প্রিন্ট করবে */
 }
 else {
 echo "Have a good night!";/*যদি শর্ত না মিলে তাহলে এটা প্রিন্ট হবে*/
 }
 অনেক সময় অনেকগুলো if-else ব্যবহার করতে হতে পারে।
  $t = date("H");   /*এই কোড এর মাধ্যমে খুঁজে পাবে দিনের ঘণ্টা*/
if ($t < "10")      /*প্রথম শর্ত দেওয়া হল*/ {
 echo "Have a good morning!";/*শর্ত মিললে এটি প্রকাশ করবে।*/
 } elseif ($t < "20")/*যদি না মিলে তাহলে দ্বিতীয় শর্ত প্রকাশ করা হোল*/ {
 echo "Have a good day!"/*দ্বিতীয় শর্ত মিললে এটা প্রকাশ করবে। */;
 } else {
 echo "Have a good night!/*যদি কোনটাই না মিলে তাহলে এটি প্রিন্ট করবে।*/";
 }
 ?>

নোটপ্যাড ওপেন করে এই example টুকু টাইপ করে ফাইল টি সেভ করুন if-else.php extension দিয়ে। আপনার ফাইল টি localhost > htdocs> test ফোল্ডার এর ভিতর রাখুন। ব্রাউজার ওপেন করে এড্রেস বারে লিখুন localhost/test/if-ese.php. Go বাটন এ ক্লিক করলে একটি ফলাফল আপনি খুজে পাবেন।

Feb 06

পিএইচপি মাইএসকিউএল ডাটাবেজ (PHP MySQL Database)

পিএইচপি মাইএসকিউল ডাটাবেজ এর পরিচিতি

Ali Hossain
Student of English Literature, Jahangirnagar University.

 

আজাকে আমরা পিএইচপি মাইএসকিউল ডাটাবেজ এর সম্পর্কে জানব। PHP (পিএইচপি) ব্যবহার করে আপনি ডাটাবেজের সাথে সংযোগ করতে পারবেন এবং তা নিপূনভাবে পরিচালনা করতে পারবেন। MySQL (মাইএসকিউল) হচ্ছে সবচেয়ে জনপ্রিয় ডাটাবেজ সিস্টেম যেটা পিএইচপি এর সাথে ব্যবহৃত হচ্ছে।

মাইএসকিউল কি ?

১. মাইএসকিউল একটা ডাটাবেজ সিস্টেম যেটা ওয়েব এ ব্যবহার করা হয় এবং সার্ভারে পরিচালনা করা হয়।

২. মাইএসকিউল ছোট এবং বড় উভয়ের জন্য আদর্শ ডাটাবেজ সিস্টেম।

৩. মাইএসকিউল খুব দ্রত, নির্ভরযোগ্য এবং সহজে ব্যবহার করা যায়।

৪. মাইএসকিউল মানসম্পন্ন এসকিউল ব্যবহার করে।

৫. মাইএসকিউল কয়েকটি প্লাটফর্মের উপর প্রনয়ন করা হয়েছে।

৬. মাইএসকিউল ওরাকল দারা উন্নতকরন, বিতরন এবং সমর্থিত এবং এটি বিনামূল্যে ডাউনলোড করে ব্যবহার করা যাবে।

৭. মাইএসকিউল এর সহ-প্রতিষ্ঠাতা Monty Widenius (মন্টি উইডেনিয়াস) এর মেয়ের নামে নামকরন করা হয়।

মাইএসকিউল ডাটাবেজের ডাটা টেবিলে জমা রাখা হয়। মাইএসকিউলে একটি টেবিল হলো সংশ্লিষ্ট তথ্যের ভান্ডার যেটি কলাম ও সারির সমন্নয়ে গঠিত। ডাটাবেজ নিরপেক্ষভাবে তথ্য সংরক্ষনের জন্য দরকারী। একটি কোম্পানির নিম্মলিখিত টেবিলের সমন্নয়ে ডাটাবেজ থাকতে পারে :

১. কর্মচারী

২. পন্য

৩. গ্রাহক

৪. আদেশ

পিএইচপি + মাইএসকিউল ডাটাবেজ সিস্টেম

মাইএসকিউএল এর সঙ্গে মিলিত পিএইচপি হলো ক্রস প্ল্যাটফর্ম (যা আপনি উইন্ডোজে উন্নত করে একটি ইউনিক্স প্ল্যাটফর্মের উপর ব্যবহার করতে পারেন)।

ডাটাবেজ অনুসন্ধান

অনুসন্ধান হলো একটি প্রশ্ন বা অনুরোধ। আমরা নির্দিষ্ট তথ্যের জন্য ডাটাবেজ অনুসন্ধান করতে পারি এবং রেকর্ডসেট ফিরে পেতে পারি।

নিচের অনুসন্ধানটি দেখুন (মানসম্পন্ন এসকিউল ব্যবহারে তৈরি):

SELECT LastName FROM Employees

উপরের অনুসন্ধানটি “Employees” টেবিলের “LastName” কলামের সকল ডাটাকে নির্বাচন করবে। আরো শিখতে এসকিউএল এর সবার নিচের লিঙ্কে ভ্রমন করুন।

ডাউনলোড মাইএসকিউল ডাটাবেজ

আপনার যদি পিএইচপি সার্ভার যুক্ত মাইএসকিউল ডাটাবেজ না থাকে, তাহলে এখান থেকে বিনামূল্যে ডাউনলোড করুন : http://www.mysql.com

মাইএসকিউল সম্পর্কে তত্থ্য

মাইএসকিউল (ফেসবুক, টুইটার এবং উইকিপিডিয়ার মত) তথ্য এবং শেষ ব্যবহারকারীদের বিপুল ভলিউমের ওয়েব সাইটের জন্য একটি de-facto মানসম্পন্ন ডাটাবেজ সিস্টেম। মাইএসকিউএল সম্পর্কে আরেকটি বড় ব্যাপার হল এটার সংখ্যা কমিয়ে আনা যায় যা এমবেডেড ডাটাবেসের অ্যাপ্লিকেশন সমর্থন করে। মাইএসকিউল ব্যবহার করে কোম্পানির ওভারভিউ দিতে দেখুন : http://www.mysql.com/customers/

Feb 05

পিএইচপি ৫ স্ট্রিংস (PHP 5 Strings)

আক্তারুজ্জামান
Department of CSE,University of Chittagong

 

যে কোন প্রুগ্রামিং ল্যাঙ্গুয়েজে স্ট্রিং এর উপর পরিষ্কার ধারনা থাকাটা খুবয় জরুরি। একটা স্ট্রিং তৈরি হয় এক বা একাধিক ক্যারেক্টার মিলে । সোজা কথায় স্ট্রিং হচ্ছে ক্যারেক্টারের সমষ্টি ।

যেমন “Hello World” হচ্ছে একটি স্ট্রিং।

পিএইচপি স্ট্রিং ফাংশন

পিএইচপিতে স্ট্রিং মেনিপুলেট করার অনেক ফাংশন রয়েছে। নিচে কিছু কমন ফাংশনের বর্ণনা দেওয়া হয়েছে।

স্ট্রিং এর দৈর্ঘ্য (number of characters) বের করা

strlen() ফাংশনের মাধ্যমে স্ট্রিং এর দৈর্ঘ্য বের করতে হয়, নিচে উদাহরন দেওয়া হল।
উদাহরণঃ

< ?php
 $text = “Hello World!”
 echo strlen($text); // outputs 12
 ?>

 

এই কোডটার আউটপুট হবে 12

স্ট্রিং এর ওয়ার্ড এর সংখ্যা বের করা

স্ট্রিং এর ওয়ার্ড এর সংখ্যা বের করার জন্য str_word_count() ফাংশনটা ব্যাবহার করা হয়
উদাহরণঃ

< ?php
 $text = “Hello World!”
 echo str_word_count($text);// outputs 2
 ?>

এই কোডটার আউটপুট হবে 2

স্ট্রিং রিভার্স করা

strrev()ফাংশনের মাধ্যমে একটি স্ট্রিং কে রিভার্স করা যায়।
উদাহরণঃ

< ?php
 echo strrev("Hello world!"); // outputs !dlrow olleH
 ?>

 

আউটপুট হবে !dlrow olleH।

স্ট্রিং এ নির্দিষ্ট একটা টেক্সট কোজে বের করা

strpos()ফাংশন এর মাধ্যমে এই কাজটি করা হয়।
উদাহরণঃ

< ?php
 echo strpos("Hello world!", "world"); // outputs 6
 ?>

 

আউটপুট হবে 6 যেহেতু “Hello world!” এ “world” এর পজিশন 6।

স্ট্রিং এ টেক্সট রিপ্লেস করাঃ
এই কাজটি করতে হয় str_replace() ফাংশনের মাধ্যমে।
উদাহরণঃ

< ?php
 echo str_replace("world", "Dolly", "Hello world!"); // outputs Hello Dolly!
 ?>

 

এই কোডটির আউটপুট হবে
Hello Dolly!

Feb 04

SQL(এসকিউএল) Wildcards (ওয়াইল্ডকার্ড) . SQL Wildcards

SQL(এসকিউএল) Wildcards (ওয়াইল্ডকার্ড)

Author: Protap Chandra | sincerely.yours2512[at]gmail.com

ডাটাবেজ সিস্টেমে ডাটা তল্লাশি বা সার্চ করার ক্ষেত্রে wildcard (ওয়াইল্ডকার্ড) একটি গুরুত্বপূর্ণ টার্ম। স্ট্রিং ডাটার কোনো অংশ ‌‌’অজ্ঞাত’ উল্লেখ করে ডাটা তল্লাশি করতে ওয়াইল্ডকার্ড ব্যবহার করা হয়। এই অজ্ঞাত অংশ এক থেকে বহু character (অক্ষর) পর্যন্ত হতে পারে।
একটি টেবিলের ভেতর থেকে ডাটা তল্লাশি করার জন্য এসকিউএল LIKE অপারেটরের সঙ্গে ওয়াইল্ডকার্ড character ব্যবহার করা হয়। SQL এ ব্যবহৃত wildcard গুলো হচ্ছে:

Wildcard

Description

%

শুন্য কিংবা যে কোনো এক বা একাধিক character খুঁজতে ব্যবহার করা হয়

_

একটিমাত্র character খুঁজতে ব্যবহার করা হয়

[charlist]

একাধিক character এর লিস্ট উল্লেখ করা হয় যেগুলো দিয়ে শুরু হওয়া ডাটা বাছাই করে

[^charlist]
or
[!charlist]

একাধিক character এর লিস্ট উল্লেখ করা হয় যেগুলো বাদ রেখে অন্য সব অক্ষর দিয়ে শুরু হওয়া ডাটা বাছাই করে

এই টিউটিরিয়ালে আমরা Northwind স্যাম্পল ডাটাবেজটি ব্যবহার করব, যেটি মাইক্রোসফট Excel এবং MS SQL Server এর সাথে শিক্ষার্থীদের জন্য তৈরী অবস্থায় (readymade) সংযুক্ত করা থাকে। সেই ডাটাবেজের "Customers" টেবিল থেকে কিছু ডাটা নির্বাচন করা হল:

CustomerID

CustomerName

ContactName

Address

City

PostalCode

Country

1

Alfreds Futterkiste

Maria Anders

Obere Str. 57

Berlin

12209

Germany

2

Ana Trujillo Emparedados y helados

Ana Trujillo

Avda. de la Constitución 2222

México D.F.

05021

Mexico

3

Antonio Moreno Taquería

Antonio Moreno

Mataderos 2312

México D.F.

05023

Mexico

4

Around the Horn

Thomas Hardy

120 Hanover Sq.

London

WA1 1DP

UK

5

Berglunds snabbköp

Christina Berglund

Berguvsvägen 8

Luleå

S-958 22

Sweden

SQL “%” ওয়াইল্ডকার্ড এর ব্যবহার:

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে "ber" দিয়ে।

SELECT * FROM Customers
WHERE City LIKE ‘ber%’;

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নামের মাঝে কোথাও "es" আছে:

SELECT * FROM Customers
WHERE City LIKE ‘%es%’;

SQL “ _” ওয়াইল্ডকার্ডের ব্যবহার:

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে যেকোন অক্ষর দিয়ে, কিন্তু তার পরের অবস্থানেই "erlin" আছে:

SELECT * FROM Customers
WHERE City LIKE ‘_erlin’;

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে “L” দিয়ে, তারপরের অবস্থানে যেকোন অক্ষর, তার পরের অবস্থানে “n”, তার পরের অবস্থানে যেকোন অক্ষর, তার পরেই একসাথে থাকবে "on".

SELECT * FROM Customers
WHERE City LIKE ‘L_n_on’;

SQL [charlist] ওয়াইল্ডকার্ডের ব্যবহার:

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে "b", "s" কিংবা "p" দিয়ে।

SELECT * FROM Customers
WHERE City LIKE ‘[bsp]%’;

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে "a", "b" কিংবা "c" দিয়ে।

SELECT * FROM Customers
WHERE City LIKE ‘[a-c]%’;

নিচের SQL স্টেটমেন্টটি customers টেবিল থেকে সেইসকল কাস্টমারদের তথ্য তুলে আনবে যাদের City এর নাম শুরু হয়েছে "b", "s" কিংবা "p" বাদ দিয়ে।

SELECT * FROM Customers
WHERE City LIKE ‘[!bsp]%’;

or

SELECT * FROM Customers
WHERE City NOT LIKE ‘[bsp]%’;

Feb 04

পিএইচপি ৫ ডাটা টাইপ (PHP 5 Data Types)

আক্তারুজ্জামান

Department of CSE, University of Chittagong
ভেরিয়েবল বিভন্ন রকমের ডাটা স্টোর করতে পারে, এবং বিভন্ন ডাটা টাইপ বিভন্ন রকম কাজ করে। পিএইচপি নিচে উল্লেখিত ডাটা টাইপ গুলো সাপোর্ট করে।

স্ট্রিং (String):

স্ট্রিং তৈরি হয় এক বা একাধিক ক্যারেক্টার মিলে । সোজা কথায় স্ট্রিং হচ্ছে ক্যারেক্টারের সমষ্টি । যেমনঃ “Hello World” হচ্ছে একটি স্ট্রিং।
ডাবল কিংবা সিঙ্গল কোট ব্যবহার করে স্ট্রিং (string) ভেরিয়েবল তৈরি করতে হয়।
উদাহরণঃ

 <?php 
 $x = "Hello world!";
 $y = 'Hello world!';
 
 echo $x;
 echo "<br>"; 
 echo $y;
 ?>

এইখানে $x এবং y হল দুটি string টাইপ ভেরিয়েবল

 

ইন্টিজার (integer)

ইন্টিজার মানে হল পূর্ণ সংখ্যা । এইটি -2,147, 483, 648 এবং +2, 147, 483, 647 এর মধ্যে যে কোন একটি সংখ্যা হতে পারে। নিচের উদাহরণে $x হল একটি ইন্টিজার (integer) টাইপের ভেরিয়েবল।

<?php 
 $x = 5985;
 var_dump($x);
 ?>

var_dump() ফাংশনটি ডাটা টাইপ এবং মান রিটার্ন করে।

 

ফ্লোটিং পয়েন্ট (Float)

ফ্লোট হল একটি decimal point নাম্বার। নিচের উদাহরণে $x হল একটি ফ্লোট টাইপের ভেরিয়েবল।

<?php 
 $x = 10.365;
 var_dump($x);
 ?>

 

বুলিয়ান (boolean)

কোন কিছু সত্য না মিথ্যা তা প্রকাশ করার জন্য বুলিয়ান ডাটা টাইপটি ব্যাবহার করা হয়।বুলিয়ান এর দুইটি মান হতে পারে – true অথবা false
উদাহরনঃ

$x = true
$y = false

 

এ্যারে (Array)

একটি সিঙ্গেল ভেরিয়েবলে একের অধিক মান স্টোর করার জন্য এ্যারে ব্যাবহার করা হয়। নিচের উদাহরণে $cars হল একটি এ্যারে।

<?php 
 $cars = array("Volvo","BMW","Toyota");
 var_dump($cars);
 ?>

এইখানে $cars এ্যারেতে তিনটি স্ট্রিং টাইপের মান রয়েছেঃ
Volvo, BMW এবং Toyota।

 

অবজেক্ট টাইপ (Object)

কোন নির্দিষ্ট একটি ক্লাসের instance কে অবজেক্ট বলা হয়। অবজেক্ট হচ্ছে ভেরিয়েবল এবং ফাংশন এর সমস্টি। অবজেক্ট ইন্সট্যান্স তৈরি করতে হয় new কিওয়ার্ডটি ব্যবহার করে।
উদাহরনঃ

<?php
 class Car {
     function Car() {
         $this->model = "VW";
     }
 }
 
 // create an object
 $herbie = new Car();
 
 // show object properties
 echo $herbie->model;
 ?>

 

নাল টাইপ (Null)

নাল একটি বিশেষ ধরণের ডাটা টাইপ যেটার মান হতে পারে শুধুমাত্র একটি- এবং এইটি হল null । একটি ভেরিয়েবলে কোন মান এসাইন করা না হলে ওইটাকে নাল ডাটা টাইপের ভেরিয়েবল বলা হয়।
উদাহরনঃ

<?php
$x = “Hello world!”;
$x = null;
var_dump($x);
?>

এইখানে $x হল একটি নাল টাইপের ভেরিয়েবল।

Feb 04

jQuery Mobile – Popups

লিখছেন সুদীপ্ত সাহা

জেক্যুয়েরি মোবাইল পপআপস

পপআপ হল অনেকটা বার্তার মতো, যেগুলো একটি পেজের কোন অংশের ওপর দিয়ে আস্তরনের মতো বিস্তৃত হয়। ছোট কোন টেক্সট, ইমেজ, ম্যাপ বা অন্য কোন কন্টেন্ট প্রদর্শনের জন্য পপআপ বক্স উপযোগী।
পপআপ তৈরি করার জন্য ইলিমেন্ট এবং

ইলিমেন্ট দ্বারা শুরু করতে হয়। ইলিমেন্টে অ্যাট্রিবিউট data-rel=”popup” এবং

ইলিমেন্টে অ্যাট্রিবিউট data-role=”popup” অ্যাড করতে হবে। তারপর

এর id নির্দিষ্ট করে এর হাইপারলিঙ্ক সেট করে দিতে হবে যেন নির্দিষ্ট id’র সঙ্গে ম্যাচ করে। ইউজার যখন লিঙ্কে ক্লিক করবে তখন

এর মধ্যে যেই কন্টেন্টগুলো থাকবে সেগুলোই প্রদর্শিত হবে।
ইঙ্গিতঃ পপআপের

এবং লিঙ্ক অবশ্যই এক পেজে হতে হবে।

উদাহরনঃ
Show Popup

This is a simple popup.

আপনার পপআপ বক্সে অতিরিক্ত প্যাডিং বা মার্জিন অ্যাট্রিবিউট ব্যবহার করতে চাইলে

এর ক্লাস “ui-content” দিতে হবে।

উদাহরনঃ

পপআপ ক্লোজিং
পপআপ বক্সের বাইরে ক্লিক করলে অথবা “Esc” কী প্রেস করলে স্বয়ংক্রিয়ভাবে একটি পপআপ শেষ হয়ে যায় বা বন্ধ হয়ে যায়। কিন্তু পপআপ বক্সের বাইরে ক্লিক করলে পপআপ বন্ধ হয়ে যাবে, এরকম যদি আপনি না চান তাহলে আপনি পপআপে অ্যাট্রিবিউট data-dismissible=”false” অ্যাড করতে পারেন (প্রয়োজনীয় নয়)। পপআপের ডানে অথবা বামে অথবা অন্য কোন দিকে আপনি একটি ক্লোজ বাটনও অ্যাড করতে পারেন। এর জন্য পপআপ কন্টেইনারে বাটন লিঙ্ক অ্যাট্রিবিউট data-rel=”back” অ্যাড করতে হবে এবং বাটনের অবস্থান সিএসএস ক্লাসে নির্দিষ্ট করে দিতে হবে।

রাইট ক্লোজ বাটনের উদাহরনঃ
Show Popup

CloseI have a close button at the top right corner.Tip: You can also click outside to close me.

লেফট ক্লোজ বাটনের উদাহরনঃ
Show Popup

CloseI have a close button at the top left corner.Tip: You can also click outside to close me.

আনডিসমিসেবল পপআপের উদাহরনঃ
Show Popup

CloseI am an undismissible button (data-dismissible=”false). The only way to close me is by clicking on the close button, which is positioned at the top right corner. You cannot close me by clicking outside of me.

পজিশনিং পপআপ
পপআপগুলো স্বয়ংক্রিয়ভাবে একেবারে ক্লিকড ইলিমেন্টের উপরেই প্রদর্শিত হয়। কিন্তু পপআপের অবস্থান নিয়ন্ত্রণের জন্য যেই লিঙ্ক পপআপ ওপেনের জন্য ব্যবহৃত হবে সেই লিঙ্কে data-position-to অ্যাট্রিবিউট ব্যবহার করতে হয়।
পপআপের অবস্থান নিয়ন্ত্রণের তিনটি পদ্ধতি হলঃ

অ্যাট্রিবিউট ভ্যালু বর্ণনা
data-position-to=”window” পপআপ উইন্ডোর মাঝে প্রদর্শিত হবে
data-position-to=”#myId” কোন নির্দিষ্ট id’র বর্ণনার অবস্থান অনুসারে পপআপ প্রদর্শিত হবে
data-position-to=”origin” ডিফল্ট পপআপ সরাসরিভাবে ক্লিকড ইলিমেন্টের উপর প্রদর্শিত হবে

উদাহরনঃ
Window
id=”demo”
Origin

ট্রানজিশনস
পপআপের সাথে স্বয়ংক্রিয়ভাবে কোন ট্রানজিশন ইফেক্ট অ্যাড করা থাকে না। ট্রানজিশন চ্যাপ্টারে বর্ণিত ইফেক্টগুলোর যেকোনোটি আপনি ব্যবহার করতে পারেন। শুধুমাত্র যেই লিঙ্ক পপআপ ওপেনের জন্য ব্যবহৃত হবে সেই লিঙ্কে data-transition=”value” অ্যাট্রিবিউট অ্যাড করতে হবে।

সকল ট্রানজিশন ইফেক্টের জন্য একটি ড্যামো দেখানো হলঃ
Fade

পপআপ অ্যারো
পপআপের বর্ডারের মধ্যে কোন অ্যারো ব্যবহারের জন্য data-arrow অ্যাট্রিবিউট অ্যাড করতে হয় এবং লেফট এর জন্য “l” রাইটের জন্য “r” টপের জন্য “t” বোটমের জন্য “b” নির্দিষ্ট করে দিতে হয়।

উদাহরনঃ
Open Popup

There is an arrow on my LEFT border.

পপআপ ডায়ালগ
আপনি একটি মানসম্মত বা পছন্দস্বরূপ কোন ডায়ালগ আপনার পপআপে অ্যাড করতে পারেন (হেডার, ফুটার এবং কন্টেন্ট মার্কআপ)

উদাহরনঃ
Open Dialog Popup

Header Text..

Some text..

some links..

Footer Text..

পপআপ ফটো
পপআপে কোন ইমেজও প্রদর্শন করতে পারবেন।

উদাহরনঃ

Skaret View

Skaret View

 

Feb 03

অ্যাংগুলার-জেএস অ্যাপ্লিকেশন . AngularJS Application

অ্যাংগুলার-জেএস অ্যাপ্লিকেশন
Sheikh Mahfuzur Rahman

অ্যাংগুলার-জেএস অ্যাপ্লিকেশন

আপনি পূর্বের সবগুলো টিউটোরিয়াল পড়ে থাকলে, একটি প্রকৃত অ্যাংগুলার-জেএস সিংগেল পেজ অ্যাপ্লিকেশন(SPA) তৈরির জন্য এটাই উপযুক্ত সময়!

একটি অ্যাংগুলার-জেএস অ্যাপ্লিকেশনের উদাহরণ
আশা করি পূর্বের টিউটোরিয়ালগুলো পড়ে আপনি আপনার প্রথম অ্যাংগুলার-জেএস অ্যাপ্লিকেশন তৈরির জন্য যথেষ্ট কৌশল শিখে নিয়েছেনঃ
My Note

Number of characters left: 100

উদাহরণসহ অ্যাপ্লিকেশনটির ব্যাখ্যাঃ

myNoteApp”>

<head>

</head>

<body>

myNoteCtrl”>

<h2>My Note</h2>

<textarea ng-model=”message” cols=”40″ rows=”10″>

<p>
<button ng-click=”save()”>Save</button>
<button ng-click=”clear()”>Clear</button>
</p>

<p>Number of characters left: <span ng-bind=”left()”></span></p>

</div>

<script src=”myNoteApp.js”></script>
<script src=”myNoteCtrl.js”></script>

</body>
</html>

অ্যাপ্লিকেশন ফাইলটি হলো “myNoteApp.js”:

var app = angular.module(“myNoteApp”, []);

কন্ট্রোলার ফাইলটি হলো “myNoteCtrl.js”:

app.controller(“myNoteCtrl”, function($scope) {
$scope.message = “”;
$scope.left  = function() {return 100 – $scope.message.length;};
$scope.clear = function() {$scope.message = “”;};
$scope.save  = function() {alert(“Note Saved”);};
});

<html> এলিমেন্টটি অ্যাংগুলার-জেএস অ্যাপ্লিকেশন ng-app=”myNoteApp” এর কন্টেইনার হিসেবে কাজ করেঃ

<html ng-app=”myNoteApp”>

একটি <div> এলিমেন্ট এইচটিএমএল পেজে কন্ট্রোলার ng-controller=”myNoteCtrl” এর স্কোপ হিসেবে কাজ করেঃ

<div ng-controller=”myNoteCtrl”>

একটি ng-model ডিরেক্টিভ একটি <textarea> কে কন্ট্রোলার ভ্যারিয়েবল ম্যাসেজে বাইন্ড করেঃ

<textarea ng-model=”message” cols=”40″ rows=”10″></textarea>

ng-click ইভেন্ট দু’টি কন্ট্রোলার ফাংশন clear() এবং clear() কে ইনভোক বা আহবান করেঃ

<button ng-click=”save()”>Save</button>
<button ng-click=”clear()”>Clear</button>

একটি ng-bind ডিরেক্টিভ বাকি থাকা ক্যারেকটারগুলো দেখিয়ে কন্ট্রোলার ফাংশন left() কে <span> তে বাইন্ড করেঃ

Number of characters left: <span ng-bind=”left()”></span>

পেজে অ্যাপনার অ্যাপ্লিকেশন লাইব্রেরিকে যোগ করা হয়েছে (লাইব্রেরির পরে):

<script src=”myNoteApp.js”></script>
<script src=”myNoteCtrl.js”></script>

অ্যাংগুলার-জেএস অ্যাপ্লিকেশনের কাঠামো

উপরে ব্যবহার উপযোগী একটি বাস্তব অ্যাংগুলার-জেএস (single page application অর্থাৎ SPA) এর কাঠামো দেয়া হয়েছে।
<html> এলিমেন্টটি অ্যাংগুলার-জেএস অ্যাপ্লিকেশনের (ng-app=) কন্টেইনার।
<div> এলিমেন্টটি একটি অ্যাংগুলার-জেএস কন্ট্রোলারের (ng-controller=) স্কোপ ঠিক করে দেয়।
একটি অ্যাপ্লিকেশনে অনেকগুলো কন্ট্রোলার ব্যবহার করতে পারবেন।
একটি অ্যাপ্লিকেশন ফাইল (my…App.js) অ্যাপ্লিকেশন মড্যুল কোড নির্ধারণ করে।
এক বা একাধিক কন্ট্রোলার ফাইল (my…Ctrl.js) কন্ট্রোলার কোড নির্ধারণ করে।

পুরো প্রক্রিয়াটির সারাংশ?

অ্যাংগুলার-জেএস লাইব্রেরিটি <head> এ লোড হয়, কারন সঠিকভাবে কম্পাইলড হওয়ার জন্য স্ক্রিপ্টগুলো লাইব্রেরি কোডের উপর নির্ভর করে।
ng-app ডিরেক্টিভটি অ্যাপ্লিশনের রুট এলিমেন্টে রাখা হয়।
সিংগেল পেজ অ্যাপ্লিকেশনের(SPA) জন্য <html> এলিমেন্টটিই অধিকাংশ সময় অ্যাপ্লিকেশন রুট হয়ে থাকে।
এক বা একাধিক ng-controller ডিরেক্টিভ অ্যাপ্লিকেশন কন্ট্রোলার নির্ধারণ করে দেয়। প্রত্যেকটি কন্ট্রোলারের নিজস্ব স্কোপ (যে এইচটিএমএল এলিমেন্টে সেগুলো ডিফাইন করা হয়েছে) রয়েছে।
HTML DOMContentLoaded ইভেন্টে অ্যাংগুলার-জেএস সয়ংক্রিয়ভাবে সচল হয়ে যায়। যদি একটি ng-app ডিরেক্টিভ পাওয়া যায় অ্যাংগুলার-জেএস ঐ ডিরেক্টিভে উল্লেখিত (নেমড) যেকোন মড্যুলকে লোড করবে এবং DOM কে ng-app দিয়ে অ্যাপ্লিকেশনের রুট হিসেবে কম্পাইল করবে।
পুরো পেজটিই অ্যাপ্লিকেশনের রুট হতে পারে; অথবা এর ক্ষুদ্রতর অংশও হতে পারে। পেজের অংশটি যত ক্ষুদ্র হবে অ্যাপ্লিকেশনটি তত দ্রুত কম্পাইল ও অ্যাকজিকিউট করবে।