অ্যাপ এম এল ডাটা (AppML Data)

রিদওয়ান বিন শামীম

 

অ্যাপ এম এল এর প্রধান কাজ হল এইচটিএমএল পেজে ডাটা সরবরাহ করা।

অ্যাপ এম এল কে ডাটার সাথে সংযুক্ত করা

  • অ্যাপ এম এল চলক থেকে ডাটা প্রদর্শন করতে পারে,
  • অ্যাপ এম এল ফাইল থেকে ডাটা প্রদর্শন করতে পারে,
  • অ্যাপ এম এল ডাটাবেস থেকে ডাটা প্রদর্শন করতে পারে।

 

অ্যাপ এম এল জাভাস্ক্রিপ্ট অবজেক্ট ব্যবহার করলে

এইচটিএমএলকে ডাটা থেকে পৃথক রাখার একটি ভাল পদ্ধতি হল ডাটাকে জাভাস্ক্রিপ্ট অবজেক্টে সংরক্ষণ করা।

উদাহরণ,


 <table appml-data="dataObj">
 <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
 </tr>
 <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
 </tr>
 </table>
<script>
 var dataObj = {
 "records":[
 {"CustomerName":"Alfreds Futterkiste","City":"Berlin","Country":"Germany"},
 {"CustomerName":"Ana Trujillo Emparedados y helados","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Antonio Moreno Taquería","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Around the Horn","City":"London","Country":"UK"},
 {"CustomerName":"B's Beverages","City":"London","Country":"UK"},
 {"CustomerName":"Berglunds snabbköp","City":"Luleå","Country":"Sweden"},
 {"CustomerName":"Blauer See Delikatessen","City":"Mannheim","Country":"Germany"},
 {"CustomerName":"Blondel père et fils","City":"Strasbourg","Country":"France"},
 {"CustomerName":"Bólido Comidas preparadas","City":"Madrid","Country":"Spain"},
 {"CustomerName":"Bon app'","City":"Marseille","Country":"France"},
 {"CustomerName":"Bottom-Dollar Marketse","City":"Tsawassen","Country":"Canada"},
 {"CustomerName":"Cactus Comidas para llevar","City":"Buenos Aires","Country":"Argentina"},
 {"CustomerName":"Centro comercial Moctezuma","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Chop-suey Chinese","City":"Bern","Country":"Switzerland"},
 {"CustomerName":"Comércio Mineiro","City":"São Paulo","Country":"Brazil"}
 ]};
</script>

 

 

অ্যাপ এম এল জেএসওএন ফাইল ব্যবহার করে

এইচটিএমএলকে ডাটা থেকে পৃথক রাখার আর একটি ভাল পদ্ধতি হল ডাটাকে জেএসওএন ফাইলে সংরক্ষণ করা।

customers.js


 {
 "records":[
 {"CustomerName":"Alfreds Futterkiste","City":"Berlin","Country":"Germany"},
 {"CustomerName":"Ana Trujillo Emparedados y helados","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Antonio Moreno Taquería","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Around the Horn","City":"London","Country":"UK"},
 {"CustomerName":"B's Beverages","City":"London","Country":"UK"},
 {"CustomerName":"Berglunds snabbköp","City":"Luleå","Country":"Sweden"},
 {"CustomerName":"Blauer See Delikatessen","City":"Mannheim","Country":"Germany"},
 {"CustomerName":"Blondel père et fils","City":"Strasbourg","Country":"France"},
 {"CustomerName":"Bólido Comidas preparadas","City":"Madrid","Country":"Spain"},
 {"CustomerName":"Bon app'","City":"Marseille","Country":"France"},
 {"CustomerName":"Bottom-Dollar Marketse","City":"Tsawassen","Country":"Canada"},
 {"CustomerName":"Cactus Comidas para llevar","City":"Buenos Aires","Country":"Argentina"},
 {"CustomerName":"Centro comercial Moctezuma","City":"México D.F.","Country":"Mexico"},
 {"CustomerName":"Chop-suey Chinese","City":"Bern","Country":"Switzerland"},
 {"CustomerName":"Comércio Mineiro","City":"São Paulo","Country":"Brazil"}
 ]
 }

 

 

অ্যাপ এম এল এর মাধ্যমে জেএসওএন ফাইলকে অ্যাপ এম এল ডাটা এট্রিবিউটে ডাটা সোর্স হিসেবে দেখানো যায়


 <table appml-data="customers.js">
 <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
 </tr>
 <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
 </tr>
 </table>

 

 

অ্যাপ এম এল ডাটাবেস ব্যবহার করে

ওয়েব সার্ভারের অল্প একটু সাহায্য নিয়ে এপ্লিকেশনকে এসকিউএল ডাটা দ্বারা পরিপুষ্ট করা যায়,

নিচের উদাহরণে মাইএসকিউএল ডাটাবেস থেকে ডাটা পড়তে পিএইচপির সাহায্য নেয়া হয়েছে।


<table appml-data="http://www.w3schools.com/appml/customers.php">
 <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
 </tr>
 <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
 </tr>
 </table>

 

 

নিচের উদাহরণে এসকিউএল সার্ভার ডাটাবেস থেকে ডাটা পড়তে ডটনেটের সাহায্য নেয়া হয়েছে।


 <table appml-data="http://www.w3schools.com/appml/customers.aspx">
 <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
 </tr>
 <tr appml-repeat="records">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
 </tr>
 </table>

 

 

অ্যাপ এম এল এর কার্যকর ক্ষমতা

আমরা কার্যক্ষেত্রে অ্যাপ এম এল এর ক্ষমতা সম্পর্কে ধারণালাভ করতে শুরু করেছি,

অ্যাপ এম এল আমাদেরকে ডাটা, কন্ট্রোলার, মডেল ব্যবহার করতে দেয় যেসব ক্ষেত্রে,

  • সহজ এইচটিএমএল এপ্লিকেশন ডেভলাপমেন্টের ক্ষেত্রে,
  • সহজ মডেলিং, প্রোটোটাইপিং, ও টেস্টিঙের ক্ষেত্রে।

কোনও এইচটিএমএল পেজের ভেতর যত খুশি অ্যাপ এম এল এপ্লিকেশন রাখা যায়। অ্যাপ এম এল পেজের অন্য অংশের সাথে কোনও সম্পৃক্ততায়  যায় না। আমরা এক্ষেত্রে এইচটিএমএল, সিএসএস ও জাভাস্ক্রিপ্টের ব্যবহারে পরিপূর্ণ স্বাধীনতা পেতে পারি। পরিপূর্ণ সিআরইউডি(CRUD) এপ্লিকেশন ডেভলাপমেন্টের ক্ষেত্রেও অ্যাপ এম এল ব্যবহার করা যায়।

নোটঃ CRUD: Create, Read, Update, Delete