আচ্ছা, এটা একটা ঘটনা হতে পারে, কিন্তু এরকম অনেক ঘটনাই দেখা দিতে পারে, যখন আপনি কোনো কোনো কন্টেন্ট নির্দিষ্ট কিছু আইপি ঠিকানার ব্যবহারকারীদের দেখাতে চান না। এই কোড স্নিপেটটি (তাবিজ! 🙂 ) আপনাকে রক্ষা করবে ইনশাল্লাহ:

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

আর ফাংশনটা এভাবে ব্যবহার করা যাবে:

ওয়ার্ডপ্রেসে ব্যবহারবিধি

• থিমের জন্য: আপনি ফাংশন দুটোকে থিমের functions.php-তে বসিয়ে নিয়ে থিমের সর্বত্র ব্যবহার করতে পারবেন।
• প্লাগইনের জন্য: আপনি ফাংশন দুটোকে প্লাগইনের যেকোনো ফাইলে বসিয়ে নিয়ে প্লাগইন এমনকি থিমের সর্বত্র ব্যবহার করতে পারবেন।

– মঈনুল ইসলাম
mayeenulislam.github.io

The post কোড স্নিপেট: পাবলিক আইপি ঠিকানা ফিল্টার করে কন্টেন্ট দেখান appeared first on Tuts by Mayeenul Islam.

CSV ফাইল কী?

Comma Separated Values কথাটিকে সংক্ষেপে CSV বলে। এধরণের ফাইলগুলোর এক্সটেনশন হলো .csv [ডট সিএসভি]। ব্যাপারটা খুব সহজ:

1,Someone Extraordinary,Developer
2,Someone New,Debugger
3,John Kauwa Kala,QA Manager

এই যে ফাইলের তথ্যগুলো উপরে দেখা যাচ্ছে, এখানে তথ্য থেকে তথ্যকে আলাদা করা হয়েছে কমা (,) দিয়ে আর একেকটা আলাদা আলাদা তথ্যগোষ্ঠিকে আলাদা করা হয়েছে এন্টার চেপে লাইন ব্রেক করে। এখন এই তথ্যগুলো একটা ফাইলে রেখে তার এক্সটেনশন .csv করে নিলেই তা হয়ে যাবে আমাদের কাঙ্ক্ষিত CSV ফাইল।

কখন লাগবে সিএসভি ফাইল?

ধরা যাক, আপনার ডাটাবেযের টেবিলে তিনটা ফিল্ড আছে: id, name, এবং designation। এই টেবিলে ৫০০০ [পাঁচ হাজার] জন আলাদা আলাদা ব্যক্তির তথ্য আছে। এবারে কোনো কারণে আরেকটা ফিল্ড বাড়ানো লাগলো: age। তখন এই ৫০০০ জনের তথ্য আলাদা আলাদা করে এডিট করে করে তাদের প্রত্যেকের বয়স ডাটাবেযে ঢুকিয়ে নিতে হবে। চিন্তা করুন তো একবার? ৫০০০টা তথ্য খুলে, এডিট করে, সংরক্ষণ করা… কতটা বিরক্তিজনক কাজ হবে! …কিংবা এমনও হতে পারে, একটা কোম্পানী ২০ বছর ধরে খাতায়-পত্রে তাদের কোম্পানীর কর্মচারীদের তথ্য লিখে রাখতো। এখন তারা আপনাকে দিয়ে একটা সফ্‌টওয়্যার বানিয়েছে। তো তারা চায় নতুন যারা আসবে, তাদের তথ্য তো সফ্‌টওয়্যারে নতুন করে লিখে নিবেনই, কিন্তু ২০ বছরের পুরোন সব কর্মচারীদের তথ্যও যেন সফ্‌টওয়্যারে ঢোকানো থাকে। এখানেই বিপুল পরিমাণ তথ্য একবারে ঢুকিয়ে দেয়ার জন্য ব্যবহার করা হয় CSV।

CSV কিভাবে তৈরি করতে হয়?

এরকম ক্ষেত্রে আমরা সাধারণত মাইক্রোসফ্‌ট এক্সেল-এর বহুল ব্যবহার করে থাকি, তবে অন্য যেকোনো স্প্রেডশিট সফ্‌টওয়্যার ব্যবহার করা যেতে পারে। আমরা এখানে এক্সেল এবং Open Office-এর OpenOffice Calc ব্যবহার করে কাজটি করা দেখাবো ইনশাল্লাহ। স্প্রেডশিটে মূলত দরকারি তথ্যগুলো বিভিন্ন রো’ এবং কলামে লিখে ফেলা হয়:

+----+-----------------------+----------------+-----+
| id | Name                  | Designation    | Age |
+----+-----------------------+----------------+-----+
| 1  | Someone Extraordinary | Developer      | 26  |
| 2  | Someone New           | Debugger       | 21  |
| 3  | John Kauwa Kala       | QA Manager     | 32  |
+----+-----------------------+----------------+-----+

যেমন আমরা মান্ধাত্যা আমলের সব তথ্য নিতে হলে এভাবে নিলাম। কিন্তু ধরা যাক, আগের সব তথ্য আছে, এখন শুধু ‘বয়স’-এর তথ্যটা নতুন যোগ হবে, সেক্ষেত্রে id আর age কলামই শুধু লিখলাম। আইডি এজন্য লিখলাম, যাতে একটা আনকোরা (unique) তথ্য যেন থাকে, যা দিয়ে আমরা একটা তথ্য থেকে আরেকটা তথ্যকে আলাদা করতে পারি, এবং বয়সের তথ্যটা ঠিক সেই ব্যক্তির ক্ষেত্রেই বসে, যার বয়স যেটা। সেক্ষেত্রে তাদের আইডি ধরে ধরে বসানোটাই সবচেয়ে সহজ।

মনে রাখতে হবে, স্প্রেডশিটে তথ্য ঢোকানোর সময় যদি কোনো কলামের তথ্যে কমা (,) থেকে থাকে, তাহলে পুরো কলামের তথ্যটাকে অবশ্যই ডাবল কো’ট (“) দিয়ে আলাদা করে নিতে হবে। এই তথ্যগুলোকে আলাদা করার পদ্ধতি নিচে ফাংশনের ডেলিমিটার অংশে আলোচিত হলো।

এভাবে যত লক্ষ-কোটি তথ্য ইচ্ছা, আপনি প্রস্তুত করে নিতে পারেন স্প্রেডশিটে। এরপর .csv ফাইলে একে সংরক্ষণ করে নিতে হবে:

মাইক্রোসফ্‌ট এক্সেল (২০০৭+) হলে:

• ধরে নিচ্ছি আপনি স্প্রেডশিটে এভাবে তথ্যগুলো বসিয়ে নিয়েছেন, এবং একটা .xlsx কিংবা .xls ফাইল আছে আপনার। এবারে সেই ফাইল খুলে Office Button > Save As > Other Formats
• ফাইলের একটা নাম দিয়ে, Save as type: ড্রপডাউন মেনু থেকে CSV (Comma delimited) (*.csv) বাছাই করুন
• Save বোতাম চাপুন
• ওয়ার্নিং আসতে পারে: প্রথম ওয়ার্নিং বলছে, শুধু কিন্তু এই শিটটা সংরক্ষণ হচ্ছে (বাদবাকি শিট-এর খবর জানি না) – আমরা Ok চাপবো
• দ্বিতীয় ওয়ার্নিং বলছে, CSV-তে এমন কিছু ফিচার আছে, যেগুলো কিন্তু সাপোর্ট করবে না – আমরা সেটা মেনে নিবো – Yes চাপবো
• এক্সেল বন্ধ করে দিই, এবং কোনো ডায়লগ বক্স এলে বলে দিই – No – আমরা আর সংরক্ষণ করতে চাই না (কারণ আমাদের কাজ তো হয়ে গেছে)

ওপেনঅফিস ক্যাল্‌ক (4+) হলে:

• ধরে নিচ্ছি আপনি ক্যাল্‌ক-এর স্প্রেডশিটে তথ্যগুলো বসিয়ে নিয়েছেন, এবং একটা .ods ফাইল আছে আপনার। এবারে সেই ফাইল খুলে File > Save as (Ctrl + Shift + S) চাপুন
• ফাইলের একটা নাম দিয়ে, Save as type: ড্রপডাউন মেনু থেকে Text CSV (.csv) (*.csv) বাছাই করুন
• Save বোতাম চাপুন
• ওয়ার্নিং আসতে পারে: আপনি কি আসলেই ODS ফর্মেটের বাইরে সেভ করতে যাচ্ছেন – আমরা Keep Current Format বাছাই করবো
• Export Text File নামের একটা ডায়লগ বক্স আসবে, এখানে: Character set: থেকে Unicode (UTF-8) বাছাই করে দিন। আর বাকিগুলো যেমন আছে থাকুক: আমরা কমা (,) দিয়ে আলাদা করছি, আর টেক্সট ডেলিমিটার ডাবল কো’ট রাখছি (“) – OK বোতাম চাপুন
• ওয়ার্নিং আসতে পারে: শুধু কিন্তু এই শিটটা সংরক্ষিত হচ্ছে – আমরা বলবো – OK

কাজ শেষ।

আমাদের .csv ফাইল তৈরি। এবারে ফাইলটা সরাসরি Open না করে মাউসের ডান বোতাম চেপে Notepad (অথবা যেকোনো টেক্সট এডিটর, যেমন: Notepad++, Sublime Text)-এ খুলি। তাহলেই দেখতে পাবো, আমাদের স্প্রেডশিটে দেয়া তথ্যগুলো কমা দিয়ে আলাদা আলাদা হয়ে সুন্দর করে বসে গেছে।

কিভাবে PHP দিয়ে CSV ফাইল পড়বো?

এবারে খুব সহজেই আমরা PHP ব্যবহার করে তথ্যগুলো পড়তে পারি। নিচের কোড স্নিপেটটি একটা ফাইলে রেখে ফাইলটা সার্ভার থেকে খোলা যাক… ইনলাইন মন্তব্যগুলো দেখুন, বিস্তারিত পরে বলছি:

এবারে এই পাতাটা খুললে আমরা খুব সাধারণ একটা এইচটিএমএল ফর্ম দেখতে পাবো:

এখানে আমাদের তৈরি করা .csv ফাইলটা আপলোড করে Submit বোতাম চাইলেই সিএসভি’র চারটা কলামের তথ্যকে আমরা খুব সহজে দেখতে পাবো পর্দায়।

উপরের কোডটা এবার বোঝা যাক: একেবারে নিচে আমরা খুবই সাধারণ একটা এইচটিএমএল ফর্ম ব্যবহার করেছি, যা দিয়ে আমরা ফাইল আপলোড করতে পারি। ফর্মে post মেথড ব্যবহার করেছি, এবং এনক্রিপশন টাইপ রেখেছি multipart/form-data। এই ফর্মটা সাবমিট হলে উপরের পিএইচপি ব্লকে যায়। সেখানে চেক করে আসলেই কি কোনো ফাইল আপলোড হয়েছে কিনা, ফাইলের আকার (size > 0) দেখে। তারপর আমরা ফাইলটাকে $file ভ্যারিয়েবলে রেখেছি। $handle-এ এসে আমরা ফাইলটাকে খুলে পড়েছি। এরপরে while loop-এর ভিতরে আমরা পিএইচপি’রই দেয়া fgetcsv()^ ফাংশনটা ব্যবহার করেছি সিএসভি ফাইলটা নিজেদের মতো করে পড়ার জন্য। বাকিটা কেবলই ইতিহাস।

এপর্যায়ে fgetcsv() ফাংশনটাকে চেনা যাক:

fgetcsv( file, length, separator, enclosure);

এখানে:

• file হচ্ছে প্রথম প্যারামিটার, যা দিতেই হয়, এখানে আমরা আমাদের সিএসভি ফাইলটাকে দিবো
• length হচ্ছে আমাদের প্রতিটা লাইনে কতগুলো ক্যারেক্টার থাকবে তার পরিমাণ (যদি নিশ্চিত না হোন, তাহলে উল্লেখ করা থেকে বিরত থাকুন, কারণ ভুল হলে তথ্য ভেঙে যেতে পারে)
• separator হচ্ছে সেই ক্যারেক্টার, যা দিয়ে আপনার কলামগুলো আলাদা করা থাকবে, আমরা কমা দিয়ে কাজটি করছি। এক্ষেত্রে ফাংশনে তাই ডিফল্ট করা কমা (,), আমরা যদি অন্য কিছু দিয়ে করতাম, তাহলে এই প্যারামিটারে তা বলে দিতাম
• delimiter হচ্ছে স্ট্রিং-কে চিনিয়ে দেয়ার পদ্ধতি। CSV-তে কমা পেলেই সে আলাদা কলাম ধরে নিবে। কিন্তু আপনার তথ্যের মধ্যেই যদি কোনো কমা থেকে থাকে (যেমন: “He, you and I went there”), তখন কী হবে? তখন ঐ লেখাটিকে ডাবল কো’ট (“) দিয়ে আটকে দিতে হবে। আর সেটা এই প্যারামিটারে বলে দিলে একেকটা ডাবল কোটের ভিতরকার তথ্যে কমা থাকলেও সে সেটাকে কলাম ধরে নিবে না। এর ডিফল্ট হিসেবে ডাবল কো’ট (“) নির্ধারণ করে দেয়া আছে

আমরা তথ্যগুলো পিএইচপি দিয়ে পড়ে ফেলার পর এতটুকু নিশ্চয়ই বুঝে গেছি যে, আমাদের স্প্রেডশিটে লেখা তথ্যগুলোর উপর দখল নিতে পেরেছি আমরা। তাহলে এপর্যায়ে আমরা এই তথ্য নিয়ে যা ইচ্ছা তা করতে পারি। আমরা নিশ্চয়ই এও বুঝে গেছি যে, কমা (,) দিয়ে আলাদা করা প্রতিটা কলামকে fgetcsv() একটা পিএইচপি অ্যারেতে নিয়েছে, তাই প্রথম কলামটা পেতে আমরা অ্যারের যিরো ইনডেক্স ($data[0]) ধরেছি। এভাবে প্রতিটা লাইনকে fgetcsv() আমাদের জন্য আলাদা করে বের করে নিয়ে এসেছে। যারা আগে থেকে কাজ করছেন, তাদেরকে আর বুঝিয়ে বলা লাগবে না, কিভাবে এই তথ্যকে ডাটাবেযে নিয়ে যেতে হবে। তবু আমরা সেবিষয়েও আলোকপাত করছি:

কিভাবে MySQL ব্যবহার করে CSV ফাইলের তথ্য ডাটাবেযে নিবো?

আমার উপরে কোড স্নিপেটটির সাথে MySQL কোড যোগ করে এখানে দেখিয়েছি, কিভাবে সিএসভি ফাইল থেকে আমরা যা পড়তে পারছি, তা খুব সহজে ডাটাবেযে নিয়ে যেতে পারি:

সচেতন থাকুন, অপরিশোধিত তথ্য ডাটাবেযে নেয়া খুবই বিপজ্জনক। এজন্য অবশ্যই তথ্যকে যথাযথ sanitization, validation আগে থেকে আপনাকে করে নিতে হবে – যা আমরা এখানে দেখাইনি।

আমরা ধরে নিয়েছি আপনি একটা MySQL ডাটাবেয তৈরি করে নিয়েছেন, যার নাম csv_db এবং তাতে একটা টেবিল আছে, যার নাম csv_table, যেখানে id, name, designation, age নামে চারটা কলাম তৈরি করাই আছে (এতগুলো বিষয় আমরা ইচ্ছে করেই দেখাচ্ছি না, টিউটোরিয়ালটাকে যথাসম্ভব ছোট রাখার জন্য)।

$find_header > 1 কেন?

আপনারা আগের কোডের সাথে এখানে অতিরিক্ত একটা পিএইচপি কাউন্টার দেখতে পাচ্ছেন। আপনারা আগের কোডটি রান করালে দেখতে পাবেন, id, name, designation, age – স্প্রেডশিটের এই লাইনটাও আমাদের সিএসভি থেকে সে রিড করে ফেলেছে। এখন যখন আপনি বিপুল পরিমাণ ডাটা ডাটাবেযে ঢুকাতে যাবেন, তখন কিন্তু প্রথম ডাটা হিসেবে সে হেডারের এই তথ্যগুলোও নিয়ে নিবে। তাই আমরা প্রথম লুপটা অযথাই ঘুরিয়ে আনছি, আর যখন লুপটা একবার ঘুরে গেল, তার মানে প্রথম রো’-টা পার করে গেল, তখনই আমরা বলছি: এবার তুমি ইনসার্ট করা শুরু করো। তাই আমরা আমাদের কাউন্টার ১-এর বেশি হলে তখন থেকে শুরু করতে বলে দিচ্ছি।

ব্যস, আমরা আমাদের সিএসভি থেকে বিপুল পরিমাণ তথ্য নিয়ে ডাটাবেযে ঢুকিয়ে নিতে পেরেছি।

CSV’র তথ্য যদি হয় বাংলায়?

এটা একটা মহামসিবতের কথা!

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

তখন আমরা OpenOffice ব্যবহার করতাম না। কারণ ওপেনঅফিস-এর পদ্ধতিতে ৫ নম্বর ধাপে এনকোডিং যে Unicode (UTF-8)-এ হবে, তা বলে দেয়া যায়। আর তাতেই সমাধানটা হয়ে যায়। আমরা সমস্যায় পড়েছিলাম মাইক্রোসফ্‌টের Excell দিয়ে কাজটা করতে গিয়ে।

আমরা অনেক ঘাঁটাঘাঁটি করে তখন দুটো সমাধান পেয়েছিলাম, এখন আরেকটা বোনাস:

এক্সেল দিয়ে Unicode CSV – সমাধান ১ (ঝামেলার):

• প্রথম ধাপ আগের মতো
• দ্বিতীয় ধাপে এসে Save as type: থেকে Unicode Text (*.txt) বাছাই করুন (বুঝতেই পারছেন, আমরা সরাসরি সিএসভি বানাচ্ছি না)
• ওয়ার্নিংগুলো আগের মতোই ডীল করুন, এবং এক্সেল বন্ধ করে দিন (এক্সেলে আর কোনো কাজ নেই)
• এবারে যে .txt ফাইলটা তৈরি হয়েছে, তা Notepad-এ খুলুন, দেখবেন সবগুলো লেখাই পড়া যাচ্ছে, আগের মতো প্রশ্নবোধক চিহ্ন হয়ে যায়নি। কিন্তু এটা সিএসভি না, কারণ কলামগুলো কমা দিয়ে আলাদা নয়, বরং ট্যাব দিয়ে আলাদা করা
• এবারে নোটপ্যাডের Edit > Replace (Ctrl + H) চেপে Find&Replace ডায়লগ বক্সটা খুলে নিয়ে Find what:-এ ছবিতে দেখানো পদ্ধতিতে ট্যাব-স্পেসটুকু কপি করে বসিয়ে দিতে পারেন। এতে দৃশ্যত প্রথম ফিল্ডটা আসলে ফাঁকাই দেখা যাবে। এবারে Replace with:-এ একটা কমা (,) বসিয়ে দিন। …হ্যা, বুঝে ফেলেছেন, যেহেতু পুরো ডকুমেন্ট ট্যাব দিয়ে আলাদা করা, আমরা ট্যাবগুলোকে কমা বানিয়ে ফেললেই এটা একটা কমা সেপারেটেড ফাইল হয়ে যাবে। …এবারে Replace All চাপুন
• এবারে সাবধানতার জন্য ফাইলের এনকোডিংকে Unicode থেকে Unicode (UTF-8) করে নিতে হবে। এজন্য নোটপ্যাডে File > Save as-এ ক্লিক করুন, এবং একেবারে নিচে Save বোতামের বাম দিকে Encoding থেকে UTF-8 বাছাই করে দিন। ফাইলের নতুন একটা নাম দিলে ঝামেলা নেই, একই নাম দিলে, রিপ্লেস করে নিতে হবে। কাজ শেষ, নোটপ্যাড বন্ধ করে দিন
• এবারে ফাইলটা রিনেম করে এর .txt এক্সটেনশনটাকে বদলে .csv করে ফেলুন। যদি ফাইলের নাম হয়: data.txt, তাহলে একে আপনি বানাচ্ছেন data.csv

এক্সেল দিয়ে Unicode CSV – সমাধান ২ (তুলনামূলক ঝামেলাহীন):

• আমরা Jaimon Mathew-এর এই ব্লগ পোস্টটি^ পেয়েছিলাম, যেখানে তাঁর তৈরি একটা অ্যাডইন রয়েছে (পুরো প্রোজেক্টের কোডটি তিনি গিটহাবে হোস্ট^ করে রেখেছেন)। অ্যাডইনটি ডাউনলোড করে নিতে হবে আগে (ডাউনলোড লিংক^ : setupfiles.zip – filesize: 247kb)
• সেটআপ চালু হলে পিসি রিস্টার্ট নিবে, তাই কোনো কাজ থাকলে আগে ব্যাকআপ নিয়ে নিন
• আনযিপ করে নিয়ে Setup.exe চালু করুন (ওটা কাজ না করলে UnicodeCSVAddin.vsto ফাইলটা চালু করতে নির্দেশনা রয়েছে)
• এতে সে তার প্রয়োজনীয় ফাইল ইন্টারনেট ব্যবহার করে নামিয়ে নিয়ে তা কম্পিউটারে ইন্সটল করে নিবে। ইন্সটলেশনের অংশ হিসেবে সে পিসিকে নিজে থেকেই রিস্টার্ট করে নিবে। পিসিকে রিস্টার্ট হতে দিন
• ইন্সটল করা হয়ে গেলে সরাসরি আপনার বাংলা লেখা এক্সেল ফাইলটা খুলে নিন এক্সেলে। এবারে রিবনে একটা আলাদা নাম দেখতে পাবেন: Unicode CSV। ওটাতে গিয়ে Save বোতাম চাপুন। নাম দিয়ে ফাইলটা সংরক্ষণ করে নিন
• ব্যস, ইউনিকোডে আপনার সিএসভি ফাইল প্রস্তুত। যাচাই করতে এক্সেল বন্ধ করে দিয়ে .csv ফাইলটা নোটপ্যাডে খুলে দেখে নিন

এক্সেল দিয়ে Unicode CSV – সমাধান ৩ (গুগল ডক্স):

• আপনার এক্সেল ফাইলটা গুগল ড্রাইভে^ আপলোড করে দিন
• এবারে তাকে Open with Google Sheets করে নিন
• নতুন গুগল শিটে এবারে আপনার বাংলা স্প্রেডশিটটা খুললে File > Download as > Comma-separated values (.csv, current sheet) বাছাই করুন
• ব্যস, ইউনিকোডে বদলে সিএসভি হয়ে নেমে আসবে আপনার স্প্রেডশিটটা

পরিশেষ

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

বোনাস: ওয়ার্ডপ্রেসে CSV পড়া

ওয়ার্ডপ্রেসও কিন্তু PHP-MySQL-ভিত্তিক সিএমএস, সুতরাং আলাদা ঝামেলার কিছুই নেই। তবু আমি যেহেতু একজন ওয়ার্ডপ্রেস ডেভলপার, তাই ওয়ার্ডপ্রেসে কাজটি সহজে কিভাবে করা যায়, তা হয়তো বলে দিতেই পারি।

ওয়ার্ডপ্রেসে একটা পিএইচপি কোড রান করানোর জন্য বিভিন্নরকম প্লাগইন রয়েছে, যেমন: Otto’র PHP Code Widget^। এই উইজেটে আপনার পিএইচপি কোড বসিয়ে নিয়ে তা ওয়ার্ডপ্রেসের যেকোনো উইজেট সক্রীয় অংশে রান করাতে পারবেন।

যাদের প্লাগইন ব্যবহার করতে মন চাইছে না, তারা কোডের বিপুল ঝামেলায় না গিয়ে যে কাজটি করতে পারেন খুব সহজে, তা হলো একটা Page Template বানিয়ে ফেলা, কিছুই না, শুধুমাত্র কমেন্টের ভিতরে Template Name: CSV বসিয়ে নিলেই যেকোনো ফাইলকে WordPress-এর পাতায় রান করানো যায়। এই ফাইলটা থিমের ফোল্ডারে থাকলে Add New Page থেকে নতুন পাতা তৈরি করে পেজ টেমপ্লেট হিসেবে CSV (আমাদের টেমপ্লেটের নাম) বাছাই করে দিলেই হলো।

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

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

-মঈনুল ইসলাম
mayeenulislam.github.io

____________________________________________________________

কৃতজ্ঞতা

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

প্রচ্ছদের ছবি Christlich Soziale Volkspartei-এর তৈরি ছবি^, উইকিমিডিয়া কমন্স থেকে নিয়ে বদলে নেয়া হয়েছে প্রয়োজনমতো।

The post PHP-MySQL দিয়ে CSV ফাইল থেকে বাংলা তথ্য আপলোড appeared first on Tuts by Mayeenul Islam.

জ্ঞানস্তর: মাধ্যমিক

লক্ষ্যণীয়: এই আলোচনায় ধরে নেয়া হয়েছে যে, পাঠকের পিএইচপি কন্ডিশনাল স্টেটমেন্ট এবং লুপ সম্পর্কে প্রাথমিক ধারণা রয়েছে।

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

আমরা এরকম একটি অতি সাধারণ for loop নিলাম, যেখানে কিছু CSS ব্যবহার করে আমরা একটা প্রাথমিক চেহারা দাঁড় করাবো বিষয়টা বোঝার জন্য।

আমরা এজন্য কিছু CSS লিখলাম, যাতে বিষয়টা একটু বোধগম্য হয়, এই সিএসএস-এর সাথে কলামের এখনও কোনো সম্পর্ক নেই; আমরা আসলে, কলামটা যে ঠিকমতো কাজ করছে, সেটা যাতে বুঝতে পারি, তারই জন্য একটা প্রস্তুতি নিচ্ছি মাত্র।

এবারে পাতাটা যদি আমরা ব্রাউযারে রান করি, তাহলে তা দেখা যাবে এরকম:

আমরা জানি পিএইচপি লুপ দিয়ে একইরকমের কাজের পুণরাবৃত্তি করা যায়। যেমন: আমরা এখানে মাত্র একটাই content-body ডিভ ৫ বার দেখিয়েছি। আমরা আগেই বলেছি, কলাম করার জন্য এটা শ্রেফ প্রস্তুতি, এবারে আমরা এই কোড দিয়েই কলাম তৈরি করবো। লক্ষ করলে দেখবেন test নামক ক্লাস দিয়ে একটা ডিভ রেখেছি, এখানে আমরা বিভিন্ন পরীক্ষা-নিরীক্ষাগুলো করবো, যে পরীক্ষা-নিরীক্ষাগুলো আমরা ব্রাউযারে দেখবো।

২ কলাম তৈরি

কলাম তৈরি করার জন্য একটু ছোটবেলায় ঢু মেরে আসা যাক। আচ্ছা…, ভাগ অংকের কথা মনে আছে? একটু দেখা যাক। ৪-কে ২ দিয়ে ভাগ করুন। না না না না, ক্যালকুলেটর দিয়ে ভাগ করলে হবে না, একটু হাতে-কলমে করুন। করা হয়ে গেলে, এরপর ৩-কে ২ দিয়ে ভাগ করুন।

বিষয়টা কী হলো? ৪-কে ২ দিয়ে ভাগ দেয়ায় তা দেয়া গেলো, অর্থাৎ ৪, ২ দিয়ে নিঃশেষে বিভাজ্য। কিন্তু ৩-কে ২ দিয়ে ভাগ দেয়া গেলো না, কারণ তাতে ১ ভাগশেষ হিসেবে অবশিষ্ট থাকে। হ্যা, আমাদের উদ্দেশ্য আসলে ঐ ভাগ অংক শেখানো নয়, বরং ঐ ভাগশেষের সাথে আপনাকে পরিচয় করিয়ে দেয়া, কারণ এই সাধারণ একটা গাণিতিক হিসাব আমাদেরকে কলাম তৈরিতে খুব সহায়তা করবে। এবং মজার ব্যাপার হলো আপনি ক্যালকুলেটরেই ভাগশেষের হিসাব বের করতে পারবেন, তাই মাথা খাটিয়ে অংক করার ঝামেলা নেই, সুতরাং শান্তিই শান্তি!

ক্যালকুলেটরে কিংবা কম্পিউটারে গাণিতিক হিসাবে ভাগশেষকে বলা হয় modulus (উচ্চারণ: মড্যূলাস)। আর ভাগশেষের প্রতীকটা হলো %, একে বলা হয় modulo (উচ্চারণ: মড্যূলো)। অর্থাৎ 4 % 2 = 0 এবং 3 % 2 = 1। তাহলে ক্যালকুলেটরে কিভাবে তা বের করা যায়? এজন্য লাগবে সাইন্টিফিক ক্যালকুলেটর। একজন প্রোগ্রামারের জন্য কম্পিউটারেই আছে একটা ক্যালকুলেটর, সেটাকে সাইন্টিফিক মোডে খুলে নিলেই হবে। সেখানে ভাগশেষকে ইংরেজিতে লেখা আছে Mod। তাহলে করা যাক: 4 Mod 2, আর 3 Mod 2, যথাক্রমে 0 এবং 1 দেখাবে। আমরা কলাম তৈরিতে এই ভাগশেষকে খুব বেশি ব্যবহার করবো।

আমরা যেহেতু ২ কলামের জন্য কোড করছি, ২ কলাম করলে তা কীরকম হবে, সেটা দেখা যাক:

এবারে এই সংখ্যাগুলোকে ২ দিয়ে ভাগ করি, যাতে ভাগশেষ জানতে পারি: 1 mod 2 = 1; 2 mod 2 = 0; 3 mod 2 = 1; 4 mod 2 = 0; 5 mod 2 = 1। কী বোঝা গেল? যেহেতু দুটি কলাম, তাই প্রথম ভাগশেষটা ১ এবং দ্বিতীয় ভাগশেষটা শূণ্য – এই ধারা বজায় রেখেই বারবার তারা ঘুরে ঘুরে আসছে। আমরা আসলে এই সুযোগটারই সদ্ব্যবহার করে আমাদের কলামের জন্য প্রয়োজনীয় ক্লাস লোড করবো।

আমরা এবারে লুপের মধ্যে কাউন্টার বসিয়ে ভাগশেষ করে একটা মজার বিষয় দেখবো, আগের কোডের মধ্যে নিচের মতো করে কোডগুলো লিখে ফেলুন:

কোডটা লিখে পেজটা রিফ্রেশ করুন… মজাটা কি এবারে দেখা যাচ্ছে? অবশ্যই দেখা যাচ্ছে। কী দেখা যাচ্ছে?

এখানে দেখতেই পাচ্ছেন, যখন ডিভটা হচ্ছে ‌১ (মানে প্রথম ডিভ), তখন ২ দিয়ে ভাগ করলে তার ভাগশেষটা হচ্ছে ১; যখন ডিভ ২, তখন ২ দিয়ে ভাগ করলে তার ভাগশেষটা ০। প্রশ্ন হচ্ছে আমরা দুই দিয়ে ভাগ করছি কেন?

উত্তরটা খুব সহজ: কারণ আমরা দুই কলাম (2-column code) তৈরি করার জন্য কোড করছি।

এবারে আমরা পরীক্ষা করার জন্য যে লাইনটা লিখেছিলাম, সেটা এখনই ফেলে না দিয়ে ওটা ব্যবহার করে কিছু কন্ডিশন বা শর্ত দেয়া যাক। আমরা জানি, পিএইচপি-তে শর্ত দেয়া মানেই if-else-এর ব্যবহার।

আমরা ঐ ভাগশেষকে কাজে লাগিয়ে মাত্র একটা শর্ত দিয়ে কী দারুণভাবে কিছু ডায়নামিক লেখা যোগ করে ফেললাম। আমরা আমাদের test ডিভে সেটা দেখতে পাচ্ছি। (দেখার জন্যই তো রেখেছি ওটাকে 🙂 )

শর্তটা হলো:

যদি ডিভটাকে ২ দিয়ে ভাগ করলে ভাগশেষ শূণ্য পাও, তাহলে $class ভ্যারিয়েবলে রাখো “ second-div” কথাটা, নাহলে রাখো “ first-div” কথাটা।

আপনি ব্রাউযারে Inspect Element করলেই আসল মজাটা পাবেন, কারণ দেখতে পাবেন, আপনার content-body ক্লাসের পাশে এবারে খুব সুন্দর করে যথাক্রমে first-div এবং second-div নামে দুটো HTML ক্লাস বসে গেছে। আসলে যে, ঐ first-div আর second-div কথাটা দুটো ক্লাসের নাম আমরা এখন সেটা বুঝতে পারছি আমরা। এজন্যই নামগুলোর আগে, ডাবল কোটের ভিতরে একটা স্পেস বা ফাঁকা স্থান রেখে নিয়েছি, যাতে, যখন তা ক্লাস হিসেবে বসবে, তখন যেন অন্য আরেকটা ক্লাসের সাথে লেগে না যায়, তাহলে কাজ করবে না।

আমরা যেহেতু আমাদের ডিভের মধ্যে ডায়নামিকভাবে ক্লাস লোড করতে পেরেছি, আসল কাজটাই হয়ে গেছে আমাদের। বাকিটা এবার CSS-এর কারসাজি।

এবারে আমাদের content-body ক্লাসে দেয়া width-কে কমিয়ে অর্ধেকের একটু কম করে ফেলবো (অর্ধেক করছি কারণ পুরো ডিভ যদি 100%, তাকে 2 দিয়ে ভাগ করলে তা 50% হয়, আমরা দুটো কলামের মাঝে একটা ফাঁকা স্থান রাখার জন্য তা আরো একটু কমিয়ে এনেছি), এছাড়া এতে একটু float দিবো; আর নতুন দুটো ক্লাসে প্রোপার্টি দিবো।

ব্যস, হয়ে গেলো আমাদের কলাম। এই প্রোপার্টিগুলো একটা একটা করে দিয়ে দিয়ে প্রিভিউ দেখলে বুঝতে পারা যাবে, কিভাবে কাজটি হচ্ছে। তবুও বলছি: আমরা content-body-তে বামে ফ্লট দিয়ে width [অর্ধেকেরও কমে] কমিয়ে দিতেই ডিভগুলো বাম বরাবর পাশাপাশি এসে যাবে। তারপর শুধু ডানপাশের ডিভগুলোকে (.second-div) ডানে ফ্লট করে দিতেই আমাদের কাঙ্ক্ষিত কলাম তৈরি হয়ে গেলো। শুধু একটাই সমস্যা: এখনতো সবগুলো ডিভের উচ্চতা সমান, তাই বিষয়টা বোঝা যাচ্ছে না, কিন্তু যখন ডায়নামিক কন্টেন্ট দিয়ে ডিভগুলো ভরবে, তখন এগুলো কোনটা উচ্চতায় ছোট, কোনোটা বড় হবে। তখন second-div-এর উচ্চতা কমলেই first-div লাফ দিয়ে ডানদিকে সরে গিয়ে উপরের ঐ ফাঁকা জায়গাটা ভরতে যাবে, কারণ সব ডিভেই ফ্লট দেয়া – যা আমরা কোনোভাবেই চাই না। এজন্য আমরা প্রত্যেকটা first-div-কে বলে দিলাম, তুমি ডানে-বামে কোনোদিকেই ফ্লট মানবে না। সব মিলে যা দাঁড়ালো:

ব্যস, হয়ে গেল আমাদের ২ কলাম তৈরি। শুধু আরেকটু সুন্দর করে উপস্থাপন করার জন্য আর কোড কমিয়ে আনার জন্য এবারে কোডে কিছু যাদু প্রয়োগ করা যাক:

আমরা test ডিভটা ফেলে দিবো, ওটার কাজ শেষ। আমরা যে কন্ডিশনাল স্টেটমেন্টটা লিখেছিলাম, তাকে শর্ট ফর্মে লিখতে পারি। তাহলে…

<?php if( $divCounter % 2 == 0 ) { $class = ' second-div'; } else { $class = ' first-div'; } ?>

হয়ে যাবে…

<?php $class = ( $divCounter % 2 == 0 ? ' second-div' : ' first-div' ); ?>

আর সিএসএস-এ .content-body থেকে box-shadow’র লাইনটা বাদ দিয়ে দিই, তাহলে বর্ডারটা চলে যাবে। ব্যস হয়ে গেলো আমাদের দুই কলাম তৈরির কাজ। এবারে পূর্ণাঙ্গ কোডটি নিচের লিংক থেকে নামিয়ে মিলিয়ে নিতে পারেন।

৩ কলাম তৈরি

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

সাথে লাগবে এই সিএসএসগুলো:

এবারে পাতাটি ব্রাউযারে খুললেই দেখা যাবে বিষয়টা কী হচ্ছে।

এখানে লক্ষ করুন: প্রথমত বিষয়টা বুঝার জন্য for-loop-এর লিমিটটা একটু বাড়িয়ে নিয়েছি। তারপর সেই ভাগ শেষ পন্থায় আমরা ক্লাস লোড করেছি। যখন আমরা তিন কলামের জন্য কাজ করছি, তখন কলামগুলো কিভাবে পড়ছে, দেখা যাক:

এবারে ৩ দিয়ে একটা একটা করে ভাগ করা যাক, 1 mod 3 = 1; 2 mod 3 = 2; 3 mod 3 = 0; 4 mod 3 = 1; 5 mod 3 = 2; 6 mod 3 = 0; 7 mod 3 = 1। দেখা যাচ্ছে, যে সংখ্যাকে ভাগ করিনা কেন, তিনটা আলাদা আলাদা ভাগশেষ আসার পরই, আবার ঐ একই ভাগশেষই তিনবার তিনবার করে ঘুরে ঘুরে আসছে। আমরা আসলে এই ব্যাপারটাকেই টার্গেট করছি আর এর অনুপাতে প্রয়োজনীয় ডিভ ক্লাস লোড করছি।

লক্ষ করলে দেখবেন, আমরা মাত্র দুটো ক্লাস লোড করে দুটো কলামকে চিহ্নিত করেছি। কারণ, আমাদের কলাম তৈরি করাতে দ্বিতীয় কলাম কোনটি, তা না জানলেও চলছে। প্রথম কলামের জন্য লজিক আগের মতোই, ফ্লটকে ক্লিয়ার করে দিচ্ছি। তবে .content-body-তে অতিরিক্ত হিসেবে যোগ হয়েছে margin-right। ডানদিকে মার্জিন দেয়ার কারণে প্রথম কলাম থেকে দ্বিতীয় কলাম পর্যন্ত একটা ফাঁকা স্থান তৈরি হয়েছে, তেমনি দ্বিতীয় কলাম থেকে তৃতীয় কলাম পর্যন্ত ফাঁকা স্থান, তেমনি তৃতীয় কলাম থেকে ডানদিকে ফাঁকা স্থান। দেখা যাচ্ছে, এই ডানদিকে-মার্জিনের প্রভাব পড়ছে সবগুলো ডিভে, অথচ তৃতীয় কলামের ডানে আর মার্জিনের দরকার নেই আমাদের, কারণ ওপাশে আর কোনো কলাম নেই, তাই আমরা .third-div-এ margin: 0 করে দিয়েছি।

ব্যস, লজিকটা আমরা এবারে জেনে গেছি।

পুরো প্রজেক্টের সোর্স কোড নিচের লিংক থেকে নামিয়ে নিতে পারেন। সাথে, তিন কলাম দিয়ে করা নমুনা ডিযাইনও থাকছে।

৪, ৫ ইত্যাদি আরো বেশি কলাম

লজিকটা এখন আর আশা করি বুঝিয়ে বলা লাগবে না। এই এক লজিকে আমরা মনের মতো করে ডিভে ইচ্ছেমতো ক্লাস লোড করে নিতে পারি, আর সে অনুপাতে সিএসএস দিয়ে সাজিয়ে নিতে পারি আমাদের ডিভগুলোকে আলাদা আলাদা করে। শুধু সূত্রে পরির্বতনটা হবে, যে সংখ্যা দিয়ে ভাগ করা হচ্ছে, তা: কারণ ২ কলামের সময় ভাগ দিয়েছি ২ দিয়ে, ৩ কলামের সময় ৩… তো ৩৯ কলামের জন্য???

শেষ কথা

এই টিউটোরিয়ালে আমরা পিএইচপি লুপ কাজে লাগিয়ে ক্লাস লোড করে করে তাতে সিএসএসের প্রয়োগ করে কলাম তৈরি করেছি। এখানে আমরা CSS2 ব্যবহার করেছি। কিন্তু CSS3 দিয়ে, ক্লাস লোড না করেই এরকম কলাম তৈরি করা যায়। সেটা আমরা অন্য অরেকদিন দেখবো। তবে, এই লুপ দিয়েই এখনকার মতো অনেক কাজ আপনারা সেরে নিতে পারবেন।

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

-মঈনুল ইসলাম
mayeenulislam.github.io

The post পিএইচপি লুপ দিয়ে কলাম তৈরি – ২ কলাম, ৩ কলাম এবং যত ইচ্ছা appeared first on Tuts by Mayeenul Islam.