aboutsummaryrefslogtreecommitdiff
path: root/files/bn/archive/b2g_os/quickstart
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:15 -0500
commit4b1a9203c547c019fc5398082ae19a3f3d4c3efe (patch)
treed4a40e13ceeb9f85479605110a76e7a4d5f3b56b /files/bn/archive/b2g_os/quickstart
parent33058f2b292b3a581333bdfb21b8f671898c5060 (diff)
downloadtranslated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.gz
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.tar.bz2
translated-content-4b1a9203c547c019fc5398082ae19a3f3d4c3efe.zip
initial commit
Diffstat (limited to 'files/bn/archive/b2g_os/quickstart')
-rw-r--r--files/bn/archive/b2g_os/quickstart/index.html49
-rw-r--r--files/bn/archive/b2g_os/quickstart/your_first_app/index.html212
-rw-r--r--files/bn/archive/b2g_os/quickstart/ওপেন_ওয়েব_অ্যাপ_পরিচিতি/index.html55
3 files changed, 316 insertions, 0 deletions
diff --git a/files/bn/archive/b2g_os/quickstart/index.html b/files/bn/archive/b2g_os/quickstart/index.html
new file mode 100644
index 0000000000..ebe1f7c220
--- /dev/null
+++ b/files/bn/archive/b2g_os/quickstart/index.html
@@ -0,0 +1,49 @@
+---
+title: Build
+slug: Archive/B2G_OS/Quickstart
+tags:
+ - NeedsTranslation
+ - TopicStub
+translation_of: Archive/B2G_OS/Quickstart
+---
+<div class="summary">
+ <p>Quickstart information on coding open web apps.</p>
+</div>
+<dl>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_open_web_apps">Introduction to open web apps</a></dt>
+ <dd>
+ What are open web apps? How they differ from regular web pages? Why is this significant? This article aims to answer these questions and more.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Your_first_app">Your first app</a></dt>
+ <dd>
+ This article takes you through the basic steps and additional knowledge on top of regular web development required to create installable open web apps.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_Firefox_OS">Introduction to Firefox OS</a></dt>
+ <dd>
+ An introduction to Firefox OS, Mozilla's new open web app-based mobile platform.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_manifests">Introduction to manifests</a></dt>
+ <dd>
+ An FAQ designed to answer any questions you may have about manifests, hosting apps, origins, and other such topics.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/For_Web_developers">App development for web developers</a></dt>
+ <dd>
+ If you're a web developer, how do open web apps differ from what you're used to? This article explains all.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/For_mobile_developers">App development for mobile developers</a></dt>
+ <dd>
+ If you're a native mobile application developer, what advantages can open web apps bring to you, and how do they differ from what you are used to? Here are some ideas.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Developing_app_functionality">Developing app functionality</a></dt>
+ <dd>
+ This page talks about the kinds of different functionality that you might want to build into your apps, with links to further information.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/Payments">Payments</a></dt>
+ <dd>
+ How do you build functionality to make people pay for installing your open web apps? Here is the lowdown.</dd>
+ <dt>
+ <a href="/en-US/docs/Web/Apps/Quickstart/Build/App_tools">App tools</a></dt>
+ <dd>
+ Last for this section, we provide some links to more information on the tools available to help you develop great open web apps.</dd>
+</dl>
diff --git a/files/bn/archive/b2g_os/quickstart/your_first_app/index.html b/files/bn/archive/b2g_os/quickstart/your_first_app/index.html
new file mode 100644
index 0000000000..12f1bdc260
--- /dev/null
+++ b/files/bn/archive/b2g_os/quickstart/your_first_app/index.html
@@ -0,0 +1,212 @@
+---
+title: আপনার প্রথম অ্যাপ
+slug: Archive/B2G_OS/Quickstart/Your_first_app
+tags:
+ - Apps
+ - Beginner
+ - Guide
+ - অ্যাপ
+ - গাইড
+ - নতুনদের জন্য
+translation_of: Archive/B2G_OS/Quickstart/Your_first_app
+---
+<article class="brush: js">
+ <div class="summary">
+ <p>ডেভেলপাররা এত দিন ধরে যা চেয়েছিলেনঃ শুধুমাত্র HTML, CSS আর জাভাস্ক্রিপ্ট দিয়ে অ্যাপ তৈরি করতে যা সব প্ল্যাটফর্মে চলবে - ওপেন ওয়েব অ্যাপ ঠিক তাই। এসব অ্যাপ ডিভাইসে ইন্সটল করা যায়। ফায়ারফক্স ওএস হচ্ছে প্রথম প্ল্যাটফর্ম ওপেন ওয়েব অ্যাপ এর জন্য! এই গাইড লেখা হয়েছে যাতে আপনি খুব অল্প সময়ের মধ্যেই অ্যাপ সম্পর্কে প্রাথমিক আইডিয়া নিয়ে ফাটাফাটি একটা অ্যাপ তৈরি করা শুরু করে দিতে পারেন!</p>
+ </div>
+ <p>গাইডটি ভালভাবে বুঝার জন্য আপনি <a href="https://github.com/chrisdavidmills/mdn-app-template">দ্রুত অ্যাপ বানানোর টেম্পলেট</a> ডাউনলোড করে নিতে পারেন। এর ভেতর কি আছে সেটা জানার জন্য <a href="/bn-BD/docs/Project:MDN/Style_guide/Sample_app_coding_guidelines#.E0.A6.85.E0.A7.8D.E0.A6.AF.E0.A6.BE.E0.A6.AA_.E0.A6.9F.E0.A7.87.E0.A6.AE.E0.A7.8D.E0.A6.AA.E0.A6.B2.E0.A7.87.E0.A6.9F">অ্যাপ টেম্পলেট</a> গাইডটি পড়ুন।</p>
+ <h2 id="অ্যাপ_স্ট্রাকচার">অ্যাপ স্ট্রাকচার</h2>
+ <h3 id="প্যাকেজড_বনাম_হোস্ট-করা_অ্যাপ">প্যাকেজড বনাম হোস্ট-করা অ্যাপ</h3>
+ <p>দুই ধরণের ওপেন ওয়েব অ্যাপ আছেঃ প্যাকেজড আর হোস্ট-করা। প্যাকেজড অ্যাপ হচ্ছে <code>zip</code> ফাইল যার ভেতর অ্যাপ এর সব ফাইলঃ HTML, CSS, JavaScript, ছবি, মেনিফেস্ট, ইত্যাদি দিয়ে দেওয়া থাকে। আর হোস্ট-করা এপ গুলো কোন একটা ডোমেইন এ সার্ভারে হোস্ট করা থাকে, স্ট্যান্ডার্ড ওয়েবসাইট গুলোর মতই। উভয় ধরণের অ্যাপ এরই বৈধ মেনিফেস্ট ফাইল লাগে। ফায়ারফক্স মার্কেটপ্লেসে যদি অ্যাপ জমা দিতে চান, তাহলে হয় আপনাকে অ্যাপটি জিপ ফাইল হিসেবে আপলোড করতে হবে অথবা কোন সার্ভারে হোস্ট-করে তার লিঙ্ক দিতে হবে।</p>
+ <div style="width: 480px; margin: 0 auto;">
+ <p><iframe frameborder="0" height="270" src="https://www.youtube.com/embed/Q7x-B13y33Q/?feature=player_detailpage" width="480"></iframe></p>
+ <div class="video-caption">
+ <p>Treehouse এর সাথে যৌথ উদ্যোগে বানানো হয়েছেঃ <a class="button" href="http://teamtreehouse.com/?cid=1154">Treehouse এর ব্যাপারে জানতে দেখুন!</a></p>
+ </div>
+ </div>
+ <p>এই গাইডের উদ্দেশ্য হল আপনার কম্পিউটারের <code>localhost</code> এড্রেসে একটি হোস্ট-করা অ্যাপ তৈরি করা। যখন আপনার মনে হবে আপনার অ্যাপ ফায়ারফক্স মার্কেটপ্লেসে জমা দেওয়ার জন্য রেডি, আপনার সিদ্ধান্ত নিতে হবে আপনি কি প্যাকেজড অ্যাপ হিসেবে দিবেন নাকি কোন সার্ভারে হোস্ট করে দেবেন।</p>
+ <h3 id="অ্যাপ_মেনিফেস্ট">অ্যাপ মেনিফেস্ট</h3>
+ <p>প্রত্যেক ফায়ারফক্স অ্যাপ এর রুট ফোল্ডারে একটি <a href="/bn-BD/docs/Web/Apps/Manifest"><code>manifest.webapp</code></a> ফাইল থাকা লাগে। এই ফাইলের কাজ হল অ্যাপ সম্পর্কে গুরুত্বপূর্ণ তথ্য, যেমন ভার্সন, নাম, বর্ণনা, আইকন কোথায় আছে, লোকালাইজেশনের তথ্য, কোন কোন ডোমেইন থেকে অ্যাপটি ইন্সটল করা যাবে এবং আরো অনেক কিছু সরবরাহ করা। তবে শুধুমাত্র নাম আর বর্ণনাই হল আবশ্যকীয়, বাকিগুলো ঐচ্ছিক। অ্যাপ টেম্পলেটের সাথে আসা খুবই সহজ মেনিফেস্টটি নিচের মত দেখতেঃ</p>
+ <pre class="brush: js">{
+ "version": "0.1",
+ "name": "Open Web App",
+ "description": "Your new awesome Open Web App",
+ "launch_path": "/app-template/index.html",
+ "icons": {
+ "16": "/app-template/app-icons/icon-16.png",
+ "48": "/app-template/app-icons/icon-48.png",
+ "128": "/app-template/app-icons/icon-128.png"
+ },
+ "developer": {
+ "name": "Your Name",
+ "url": "http://yourawesomeapp.com"
+ },
+ "locales": {
+ "es": {
+ "description": "Su nueva aplicación impresionante Open Web",
+ "developer": {
+ "url": "http://yourawesomeapp.com"
+ }
+ },
+ "it": {
+ "description": "La tua nuova fantastica Open Web App",
+ "developer": {
+ "url": "http://yourawesomeapp.com"
+ }
+ }
+ },
+ "default_locale": "en"
+}</pre>
+ <div style="width: 480px; margin: 0 auto;">
+ <p><iframe frameborder="0" height="270" src="https://www.youtube.com/embed/dgAUgHQOm8M#t/?feature=player_detailpage" width="480"></iframe></p>
+ <div class="video-caption">
+ <p>Treehouse এর সাথে যৌথভাবে বানানো হয়েছেঃ <a class="button" href="http://teamtreehouse.com/?cid=1154">দেখুন!</a></p>
+ </div>
+ </div>
+ <p> </p>
+ <p>এরকম প্রাথমিক একটা মেনিফেস্ট-ই দরকার অ্যাপ শুরু করার জন্য। মেনিফেস্ট নিয়ে আরো জানতে পড়ুন <a href="/bn-BD/docs/Web/Apps/Manifest">অ্যাপ মেনিফেস্ট</a>।</p>
+ <h2 id="অ্যাপ_লে-আউট_এবং_ডিজাইন">অ্যাপ লে-আউট এবং ডিজাইন</h2>
+ <p>বিভিন্ন ডিভাইসে আজকাল অনেক বেশি আর বিভিন্ন রকম রেজ্যুলেশনের ব্যবহার দেখা যায়। তাই রেস্পন্সিভ ডিজাইনের দিকেই সবাই আজকাল ঝুঁকে পড়ছেন। মোবাইল প্ল্যাটফর্ম যেমন ফায়ারফক্স ওএস যদি আপনার আসল টার্গেট হয়, এরপরেও মানুষজন অন্য ডিভাইস থেকেও আপনার অ্যাপ যাতে ব্যবহার করতে পারে, সেজন্য রেস্পন্সিভ ডিজাইন মেনে চলা উচিত। <a href="//developer.mozilla.org/docs/CSS/Media_queries">CSS media queries</a> ব্যবহার করে নিচের CSS উদাহরণের মত করে বিভিন্ন ডিভাইসে আপনার অ্যাপ যাতে সুন্দরমত দেখায় তা নিশ্চিত করতে পারেনঃ</p>
+ <pre class="brush: css">/* The following are examples of different CSS media queries */
+
+/* Basic desktop/screen width sniff */
+@media only screen and (min-width : 1224px) {
+ /* styles */
+}
+
+/* Traditional iPhone width */
+@media
+ only screen and (-webkit-min-device-pixel-ratio : 1.5),
+ only screen and (min-device-pixel-ratio : 1.5) {
+ /* styles */
+}
+
+/* Device settings at different orientations */
+@media screen and (orientation:portrait) {
+ /* styles */
+}
+@media screen and (orientation:landscape) {
+ /* styles */
+}</pre>
+ <p>রেস্পন্সিভ ডিজাইন আর মোবাইলের অ্যাপ লেখার জন্য অনেক জাভাস্ক্রিপ্ট আর সিএসএস ফ্রেমওয়ার্ক আছে (<a href="http://twitter.github.com/bootstrap">Bootstrap</a>, ইত্যাদি।) আপনার অ্যাপ আর ডেভেলপমেন্ট-স্টাইলের সাথে মিলে যায় এমন ফ্রেমওয়ার্কগুলোই ব্যবহার করুন।</p>
+ <h2 id="ওয়েব_API_সমূহ">ওয়েব API সমূহ</h2>
+ <p>যেমন নতুন নতুন ডিভাইস বের হচ্ছে, জাভাস্ক্রিপ্ট API ও তার সাথে তাল মিলিয়েই তৈরি হচ্ছে। মজিলা <a href="https://wiki.mozilla.org/WebAPI">WebAPI</a> এর মাধ্যমে ডজন ডজন স্ট্যান্ডার্ড মোবাইল ফিচার জাভাস্ক্রিপ্ট API এর মাধ্যমে আমাদের হাতে এনে দিয়েছে। <a href="https://wiki.mozilla.org/WebAPI">WebAPI</a> পাতায় কোন কোন ডিভাইস সমর্থিত এবং তাদের স্ট্যাটাস দেখতে পাবেন। জাভাস্ক্রিপ্টের মাধ্যেম ডিভাইসে কোন একটা ফিচার আছে কিনা চেক করে নেওয়া উচিত, নিচের উদাহরণে দেখানো হয়েছে কিভাবে এটা করা যায়ঃ</p>
+ <pre class="brush: js">// If this device supports the vibrate API...
+if('vibrate' in navigator) {
+ // ... vibrate for a second
+ navigator.vibrate(1000);
+}</pre>
+ <p>ডিভাইসের ব্যাটারির অবস্থা'র ওপর নির্ভর করে কোন একটা <code>&lt;div&gt;</code> এর স্টাইল কিভাবে বদলানো যায়, নিচের উদাহরণে তা দেখানো হয়েছেঃ</p>
+ <pre class="brush: java">// Create the battery indicator listeners
+(function() {
+ var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery,
+ indicator, indicatorPercentage;
+
+ if(battery) {
+ indicator = document.getElementById('indicator'),
+ indicatorPercentage = document.getElementById('indicator-percentage');
+
+ // Set listeners for changes
+ battery.addEventListener('chargingchange', updateBattery);
+ battery.addEventListener('levelchange', updateBattery);
+
+ // Update immediately
+ updateBattery();
+ }
+
+ function updateBattery() {
+ // Update percentage width and text
+ var level = (battery.level * 100) + '%';
+ indicatorPercentage.style.width = level;
+ indicatorPercentage.innerHTML = 'Battery: ' + level;
+ // Update charging status
+ indicator.className = battery.charging ? 'charging' : '';
+ }
+})();</pre>
+ <p>ওপরের কোডেঃ যখন আপনি নিশ্চিত যে <a href="/bn-BD/docs/DOM/window.navigator.battery">ব্যাটারি API</a> সমর্থিত, আপনি <code>chargingchange</code> এবং <code>levelchange</code> ইভেন্টের জন্য লিসেনার যোগ করতে পারবেন HTML এলিমেন্টটির ডিসপ্লে পরিবর্তন করার জন্য। দ্রুত-শুরু করার টেম্পলেটে নিচের মত করে যোগ করে দেখুন তো কোড কাজ করে কিনা।</p>
+ <p>মাঝেমধ্যেই <a href="https://wiki.mozilla.org/WebAPI">WebAPI</a> পাতাটি পড়ুন যাতে বিভিন্ন ডিভাইসে বিভিন্ন API এর সমর্থন সম্পর্কে আপনি আপডেটেড থাকেন।</p>
+ <h3 id="API_ফাংশনালিটি_ইন্সটল_করা">API ফাংশনালিটি ইন্সটল করা</h3>
+ <p>আমাদের template এ, আমরা একটা install button যোগ করেছি যাতে ক্লিক করে আপনি আপনার আপ্লিকেশনটি ওয়েবপেজ হিসেবে দেখতে পারবেন। , আপ্লিকেশন হিসেবে সাইটটি FirefoxOS এ দিতে হলে Button টির মার্কাআপ তেমন কঠিন নয়।</p>
+ <pre class="brush: html">&lt;button id="install-btn"&gt;Install app&lt;/button&gt;</pre>
+ <p> Install API ব্যাবহার করে এই বাটনের ফাংশনটি যোগ করা হয়েছে।  (দেখুন install.js):</p>
+ <pre class="brush: js">var manifest_url = location.href + 'manifest.webapp';
+
+function install(ev) {
+  ev.preventDefault();
+  // define the manifest URL
+  // install the app
+  var installLocFind = navigator.mozApps.install(manifest_url);
+  installLocFind.onsuccess = function(data) {
+    // App is installed, do something
+  };
+  installLocFind.onerror = function() {
+    // App wasn't installed, info is in
+    // installapp.error.name
+    alert(installLocFind.error.name);
+  };
+};
+
+// get a reference to the button and call install() on click if the app isn't already installed. If it is, hide the button.
+var button = document.getElementById('install-btn');
+
+var installCheck = navigator.mozApps.checkInstalled(manifest_url);
+
+installCheck.onsuccess = function() {
+  if(installCheck.result) {
+    button.style.display = "none";
+  } else {
+    button.addEventListener('click', install, false);
+  };
+};
+</pre>
+ <p>Let's run through briefly what is going on:</p>
+ <ol>
+ <li>We get a reference to the install button and store it in the variable <code>button</code>.</li>
+ <li>We use <code>navigator.mozApps.checkInstalled</code> to check whether the app defined by the manifest at <code>http://people.mozilla.com/~cmills/location-finder/manifest.webapp</code> is already installed on the device. This test is stored in the variable <code>installCheck</code>.</li>
+ <li>When the test is successfully carried out, its success event is fired, therefore <code>installCheck.onsuccess = function() { ... }</code> is run.</li>
+ <li>We then test for the existence of <code>installCheck.result</code> using an <code>if</code> statement. If it does exist, meaning that the app is installed, we hide the button. An install button isn't needed if it is already installed.</li>
+ <li>If the app isn't installed, we add a click event listener to the button, so the <code>install()</code> function is run when the button is clicked.</li>
+ <li>When the button is clicked and the <code>install()</code> function is run, we store the manifest file location in a variable called <code>manifest_url</code>, and then install the app using <code>navigator.mozApps.install(manifest_url)</code>, storing a reference to that installation in the <code>installLocFind</code> variable. You'll notice that this installation also fires success and error events, so you can run actions dependent on whether the install happened successfully or not.</li>
+ </ol>
+ <p>You may want to verify the <a href="/en-US/docs/Web/Apps/JavaScript_API">implementation state of the API</a> when first coming to Installable web apps.</p>
+ <div class="note">
+ <p>Note: Installable open web apps have a "single app per origin" security policy; basically, you can't host more than one installable app per origin. This makes testing a bit more tricky, but there are still ways around this, such as creating different sub-domains for apps, testing them using the Firefox OS Simulator, or testing the install functionality on Firefox Aurora/Nightly, which allows you to install installable web apps on the desktop. See <a href="/en-US/docs/Web/Apps/FAQs/About_app_manifests">FAQs about apps manifests</a> for more information on origins.</p>
+ </div>
+ <h2 id="WebRT_APIs_(Permissions-based_APIs)">WebRT APIs (Permissions-based APIs)</h2>
+ <p>There are a number of WebAPIs that are available but require permissions for that specific feature to be enabled. Apps may register permission requests within the <code>manifest.webapp</code> file like so:</p>
+ <pre class="brush: js">// New key in the manifest: "permissions"
+// Request access to any number of APIs
+// Here we request permissions to the systemXHR API
+"permissions": {
+ "systemXHR": {}
+}</pre>
+ <p>The three levels of permission are as follows:</p>
+ <ul>
+ <li>Normal — APIs that don't need any kind of special access permissions.</li>
+ <li>Privileged — APIs available to developers to use in their applications, as long as they set access permissions in the app manifest files, and distribute them through a trusted source.</li>
+ <li>Certified — APIs that control critical functions on a device, such as the call dialer and messaging services. These are generally not available for third party developers to use.</li>
+ </ul>
+ <p>For more information on app permission levels, read <a href="https://developer.mozilla.org/en-US/docs/Web/Apps/Packaged_apps#Types_of_packaged_apps" title="/en-US/docs/Web/Apps/Packaged_apps#Types_of_packaged_apps">Types of packaged apps</a>. You can find out more information about what APIs require permissions, and what permissions are required, at <a href="/en-US/docs/Web/Apps/App_permissions">App permissions</a>.</p>
+ <div class="note">
+ <p>It's important to note that not all Web APIs have been implemented within the Firefox OS Simulator.</p>
+ </div>
+ <h2 id="Tools_Testing">Tools &amp; Testing</h2>
+ <p>Testing is incredibly important when supporting mobile devices. There are many options for testing installable open web apps.</p>
+ <h3 id="Firefox_OS_Simulator">Firefox OS Simulator</h3>
+ <p>Installing and using the <a href="https://marketplace.firefox.com/developers/docs/firefox_os_simulator">Firefox OS Simulator</a> is the easiest way to get up and running with your app. After you install the simulator, it is accessible from the Tools -&gt; Web Developer -&gt; Firefox OS Simulator menu. The simulator launches with a JavaScript console so you can debug your application from within the simulator.</p>
+ <h3 id="App_Manager">App Manager</h3>
+ <p>The new kid on the block with regards to testing tools is called the <a href="/en-US/docs/Mozilla/Firefox_OS/Using_the_App_Manager">App Manager</a>. This tool allows you to connect desktop Firefox to a compatible device via USB (or a Firefox OS simulator), push apps straight to the device, validate apps, and debug them as they run on the device.</p>
+ <h3 id="Unit_Testing">Unit Testing</h3>
+ <p>Unit tests are extremely valuable when testing on different devices and builds. jQuery's <a href="http://qunitjs.com">QUnit</a> is a popular client-side testing utility, but you can use any set of testing tools you'd like.</p>
+ <h3 id="Installing_Firefox_OS_on_a_Device">Installing Firefox OS on a Device</h3>
+ <p>Since Firefox OS is an open source platform, code and tools are available to build and install Firefox OS on your own device. Build and installation instructions, as well as notes on what devices it can be installed on, can be found on <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Platform">MDN</a>.</p>
+ <p>Dedicated Firefox OS developer preview devices are also available: read our <a href="https://marketplace.firefox.com/developers/dev_phone">Developer preview phone page</a> for more information.</p>
+ <h2 id="App_Submission_and_Distribution">App Submission and Distribution</h2>
+ <p>Once your app is complete, you can host it yourself like a standard web site or app (read <a href="/en-US/docs/Web/Apps/Publishing/Self-publishing_Apps">Self-publishing apps</a> for more information), or it can be <a href="https://marketplace.firefox.com/developers/submit/app/manifest">submitted</a> to the <a href="https://marketplace.firefox.com">Firefox Marketplace</a>. Your app's manifest will be validated and you may choose which devices your app will support (e.g. Firefox OS, Desktop Firefox, Firefox Mobile, Firefox Tablet). Once validated, you can add additional details about your app (screenshots, descriptions, price, etc.) and officially submit the app for listing within the Marketplace. Once approved, your app is available to the world for purchase and installation.</p>
+ <h3 id="More_Marketplace_Listing_Information">More Marketplace &amp; Listing Information</h3>
+ <ol>
+ <li><a href="/en-US/docs/Web/Apps/Publishing/Submitting_an_app">Submitting an App to the Firefox OS Marketplace </a></li>
+ <li><a href="/en-US/docs/Web/Apps/Publishing/Marketplace_review_criteria">Marketplace Review Criteria </a></li>
+ <li><a href="http://s.vid.ly/embeded.html?link=8k2n4w&amp;autoplay=false">App Submission Video Walkthrough  </a></li>
+ </ol>
+</article>
diff --git a/files/bn/archive/b2g_os/quickstart/ওপেন_ওয়েব_অ্যাপ_পরিচিতি/index.html b/files/bn/archive/b2g_os/quickstart/ওপেন_ওয়েব_অ্যাপ_পরিচিতি/index.html
new file mode 100644
index 0000000000..97d0b6bf84
--- /dev/null
+++ b/files/bn/archive/b2g_os/quickstart/ওপেন_ওয়েব_অ্যাপ_পরিচিতি/index.html
@@ -0,0 +1,55 @@
+---
+title: ওপেন ওয়েব অ্যাপ পরিচিতি
+slug: Archive/B2G_OS/Quickstart/ওপেন_ওয়েব_অ্যাপ_পরিচিতি
+tags:
+ - Apps
+ - NeedsReview
+ - অ্যাপ
+translation_of: Archive/B2G_OS/Quickstart/Intro_to_open_web_apps
+---
+<p><img alt="Multi devices" src="https://developer.mozilla.org/files/4523/multidevices.png" style="width: 640px; height: 225px;"></p>
+<div class="summary">
+ <p>যারা ওপেন ওয়েব অ্যাপ সম্পর্কে জানতে আগ্রহী তাদের জন্য এই প্রবন্ধটি একটি ভাল প্রারম্ভিকা হিসেবে সাজানো হয়েছে। আপনি একজন ডেভেলপার অথবা একজন প্রজেক্ট ম্যানেজার অথবা অ্যাপ তৈরি ও সরবরাহের যেকোন অংশের সাথে আপনি জড়িত - যাই হোক না কেন এই আর্টিকেল আপনার জন্যই। এখানে আমরা আপনাকে ওপেন ওয়েব অ্যাপ সম্পর্কে অল্পস্বল্প জানাবো। এছাড়াও আপনি জানবেন কেন ওয়েব অ্যাপ - এর পেছনে আমাদের দর্শনটা কি!</p>
+</div>
+<p>মুক্ত (ওপেন) <em>ওয়েব অ্যাপ</em> এবং অন্যান্য স্ট্যান্ডার্ড ওয়েবসাইট অথবা ওয়েবপেজ এর মধ্যে তেমন কোন পার্থক্য নেই । স্ট্যান্ডার্ড, <em>মুক্ত</em> ওয়েব টেকনোলজি যেমন - এইচটিএমএল, সিএসএস, জাভাস্ক্রিপ্ট লিখেই এদের তৈরি করা হয়। ওয়েব ব্রাউজার দিয়েই আপনি অ্যাপগুলো ব্যবহার করবেন। ওয়েবপেজ এবং ওয়েব অ্যাপ এর মধ্যে মূল পার্থক্য হল ওয়েব অ্যাপ গুলোর ইন্সটল হওয়ার  এবং অফলাইনে কাজ করার ক্ষমতা রয়েছে। উন্নত API যেগুলো ডিভাইসের বিভিন্ন ফিচার যেমন ক্যামেরা, এড্রেস বুক এবং আরও অনেক কিছুর সাথে যোগাযোগ করতে পারে, ওয়েব অ্যাপ সেগুলো নিয়ে কাজ করতে পারে। আর চেষ্টা করা হয়েছে যেন যথাসম্ভব, মুক্ত প্রযুক্তি ব্যবহার করা যায়। যদি বিভিন্ন প্লাটফর্ম এ ওয়েব অ্যাপ সাপোর্ট করাতে যেয়ে প্রযুক্তিগত পার্থক্য পাওয়া যায়, তাহলে চেষ্টা করতে হবে যেন যত বেশি সম্ভব প্ল্যাটফর্মে এদের সাপোর্ট দেওয়া যায়। আপনি যে ফিচার চাচ্ছেন সেটি কোন একটি প্ল্যাটফর্মে আছে কিনা তা জেনে নেওয়া, বিভিন্ন প্ল্যাটফর্মের জন্য উপযুক্ত কোড ব্যবহার করা ইত্যাদির মাধ্যমে বিভিন্ন প্ল্যাটফর্মে যাতে আপনার এপ্লিকেশন চলতে পারে সেটি নিশ্চিত করতে পারবেন।</p>
+<h2 id="ওপেন_ওয়েব_অ্যাপের_সুবিধাসমূহ" style="line-height: 30px;">ওপেন ওয়েব অ্যাপের সুবিধাসমূহ </h2>
+<p>আসুন ওপেন ওয়েব অ্যাপের সুবিধা সমূহ আরও একটু বিস্তারিত ভাবে দেখি:</p>
+<ul>
+ <li><strong>লোকাল ইন্সটলেশন এবং অফলাইন স্টোরেজ</strong>: মুক্ত ওয়েব এপ্লিকেশনগুলোকে ডিভাইসে ইন্সটল করা যায়। এরা APIs যেমন <a href="/bn-BD/docs/Web/Guide/DOM/Storage" title="/en-US/docs/Web/Guide/DOM/Storage">লোকাল স্টোরেজ</a> এবং <a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a> ব্যবহার করে ডিভাইসেই তথ্য সংরক্ষণ করে রাখতে  পারে। এছাড়াও, মুক্ত ওয়্যাপ প্রযুক্তি অল্পস্বল্প জায়গা নেয়, আপনার ডিভাইসের নেটিভ এপ্লিকেশনের সাথে তুলনা করলে এদেরকে আরো আরামে, স্বয়ংক্রিয়ভাবেই আপডেট করা যায়, পুরোপুরি নতুন একটা প্যাকেজ ইন্সটল করা লাগে না এদের আপডেট করার জন্য। (তবে প্যাকেজড ওয়াপ আপডেট করতে গেলে পুরোটাই ডাউনলোড করতে হয়)। এসব অ্যাপ ব্যবহার করতে সবসময় ইন্টারনেটে যুক্ত হয়ে থাকা লাগে না, তাই নেটোয়ার্কে সমস্যা থাকলেও অ্যাপগুলো ভালভাবেই কাজ করে।</li>
+ <li><strong>হার্ডওয়ার ব্যবহারঃ</strong> ওপেন ওয়েব অ্যাপ এর সাথে মেটাডেটা ব্যবহার করে এপ্লিকেশনকে হার্ডওয়ারের সাথে যোগাযোগ করে এমন APIs ব্যবহার করার অনুমতি দিতে পারেন। এই সুবিধা গতানুগতিক ওয়েব প্ল্যাটফর্মে ছিল না।</li>
+ <li><strong>বাঁধা ভেঙ্গে দিনঃ</strong> মোবাইল প্ল্যাটফর্মে এতদিন আমরা দেখেছি একেক কোম্পানি নিজেদের মত করে প্রযুক্তি দিত আমাদের, এক ডিভাইসের জন্য লেখা অ্যাপ অন্য ডিভাইসে চলত না। অনেক স্মার্টফোন প্রস্তুতকারক এপ্লিকেশন কেনার জন্য ক্রেডিট কার্ড চেয়ে থাকে, তাই এসব প্ল্যাটফর্মে খরচেরও একটা ব্যাপার থাকে। ওপেন ওয়েব অ্যাপ এসব বাঁধা ভেঙ্গে দিয়ে অনেক স্বস্তা, আর প্রায় সব ডিভাইসেই যাতে আপনার এপ্লিকেশন চলে, সেই সুবিধা করে দেয়। বিশেষ করে ফায়ারফক্স ওএস ডিভাইসের কথা বলতেই হয় যেখানে আসলে হাল্কা-পাতলা একটা লিনাক্স কার্নেলের ওপরে ফায়ারফক্স ছাড়া আর কিছুই চলছে না! এসব ডিভাইসের জন্য ওপেন ওয়েব অ্যাপ বিশেষভাবে উপযোগী, ওয়েব হচ্ছে এমন একটা প্ল্যাটফর্ম যা সব ডিভাইসেই সমর্থিত। এছাড়া আপনি যদি আপনার লেখা এপ্লিকেশন বিক্রি করতে চান বা গ্রাহকের মোবাইল বিলের মাধ্যমে বিল নিতে চান, ফায়ারফক্স ওএস সহজেই এগুলো করা যায়।</li>
+ <li><strong>ওপেন ওয়েব অ্যাপ স্টোরঃ</strong> আগের পয়েন্টের আলোচনার সূত্র ধরেঃ আপনার অ্যাপ চাইলে প্রতিষ্ঠিত মার্কেট-প্লেসে (যেমন <a href="https://marketplace.firefox.com/">ফায়ারফক্স মার্কেটপ্লেস</a>) অথবা অন্য যেকোন জায়গায় রাখতে পারেন (হোস্ট করতে পারেন)। আপনি - ডেভেলপার যাতে সহজে অ্যাপ তৈরি থেকে শুরু করে বিতরণ, ক্রেতার সাথে সম্পর্ক সবকিছুই যাতে নিয়ন্ত্রণ করতে পারেন এটাই মজিলা'র উদ্দেশ্য।  আর ওয়েবের অন্যান্য জিনিসের মতই সহজে আপনার অ্যাপ খোঁজা (সার্চ) করা যাবে।</li>
+</ul>
+<p>নিচের ভিডিওতে দেখুন ওপেন ওয়েব অ্যাপ এর সুবিধা কী, আর ফায়ারফক্স ওএস প্ল্যাটফর্মে কিভাবে ডেভেলপ করা যায়ঃ</p>
+<p style="text-align: center;"><iframe frameborder="0" height="270" src="https://www.youtube.com/embed/RJJkFshnnVc/?feature=player_detailpage" width="480"></iframe></p>
+<h2 id="ওয়েব-ই_প্ল্যাটফর্ম" style="line-height: 30px;">ওয়েব-ই প্ল্যাটফর্ম</h2>
+<p>যখন ওপেন ওয়েব অ্যাপ কোন প্ল্যাটফর্মে (যেমন ফায়ারফক্স ওএস) এ ইন্সটল করা হয়, তখন এটি শুধু একটি সাধারণ বুকমার্কের থেকেও বেশিকিছু। এটা সিস্টেমের-ই একটা অবিচ্ছেদ্য অংশ হয়ে যায়। ওপেন ওয়েব অ্যাপ এই বিশাল সুযোগ নিয়েই এসেছে। আমাদের এই সুযোগ হাতছাড়া করা উচিত নয়, তা নাহলে ওয়েব যেমন একসময় এলোমেলো অবস্থায় ছিল, সেযুগে ফেরত যেতে পারে। এটা পরিষ্কার যে ওপেন ওয়েব অ্যাপ (সংক্ষেপে OWA) একটি স্ট্যান্ডার্ড, আর ওয়েবের অংশ হিসেবেই আমরা দেখি। সফল হলে একসময় ওপেন ওয়েব অ্যাপ সব ব্রাউজারেই কাজ করবে, যেমনটা কাজ করবে সব অপারেটিং সিস্টেম আর ডিভাইসে।</p>
+<p>মজিলা'তে আমরা দিনরাত কাজ করছি এই  অ্যাপ প্ল্যাটফর্ম তৈরি করতে - যেটা পুরোপুরিভাবে ওপেন ওয়েবের ওপর দাঁড়িয়ে আছে। একে "মজিলা প্ল্যাটফর্ম" বা "ফায়ারফক্স প্ল্যাটফর্ম" হিসেবে তৈরি করার আমাদের কোন উদ্দেশ্য নেই। <strong>এর প্ল্যাটফর্ম হচ্ছে ওয়েব।</strong> আমরা এক গাদা মুক্ত APIs তৈরি করছি আর এগুলো কার্যকরী করছি, যাতে পোর্টেবল অ্যাপ ওয়েবের ওপর ভিত্তি করে চলতে পারে হার্ডওয়ার <a href="http://en.wikipedia.org/wiki/Vendor_lock-in">প্রস্তুতকারকের ওপর নির্ভরশীল হওয়া</a> ছাড়াই।  অন্যান্য গ্রুপ যেমন ফেসবুক আর গুগল ক্রম ও কাজ করছে ওয়েব-ভিত্তিক অ্যাপ প্লাটফর্মের ওপর। <a href="https://developers.facebook.com/docs/guides/canvas/">ফেসবুক অ্যাপ</a> ফেসবুকের সাথে ভালভাবেই যুক্ত আর <a href="http://www.google.com/intl/en/chrome/webstore/apps.html">ক্রোম অ্যাপ</a> ডিজাইন করা হয় এমনভাবে যাতে সেটা ক্রোম ওএস আর গুগল সার্ভারের ওপর নির্ভর করে চলে। তবে ওপেন ওয়েব অ্যাপ এর সাথে সবচেয়ে বেশি মিল আছে ক্রোম অ্যাপ এরই। আমরা গুগল ক্রোম টিমের সাথে মিলে কাজ করি অ্যাপ স্ট্যান্ডার্ডের উত্তরোত্তর উন্নতির জন্য আর আমাদের অনেক দর্শন-ও মিলে যায়। সব ওয়েব-ভিত্তিক অ্যাপ প্লয়াটফর্ম মিলে গিয়ে একটি প্ল্যাটফর্ম হয়ে যাওয়ার বেশ ভাল সম্ভাবনা আর সুযোগ রয়েছে, তাই আমরা সব ভেন্ডরদের আমন্ত্রণ জানাই সঠিক ওপেন ওয়েব অ্যাপ APIs গুলো তৈরি করতে আমাদের সাহায্য করার জন্য।</p>
+<p>যদিও এখন ওপেন ওয়েব অ্যাপ ব্যবহার করতে আপনার অবশ্যই মজিলা ফায়ারফক্স ভিত্তিক কোন ইঞ্জিন ("ওয়েব রানটাইম") ব্যবহার করতে হবে, আমরা আশা করি ভবিষ্যতে আর এই বাধা থাকবে না। ওপেন ওয়েব অ্যাপ প্রজেক্টের অনেক অংশ নিয়ে এখনো কাজ চলছে তাই সব ব্রাউজারে একই সাথে এদের প্রয়োগ করা সম্বব নয়। তাই এর অনেক অংশ স্ট্যান্ডার্ড হয়ে গেছে সত্য, কিন্তু অনেক কিছুই আছে যা এখনো স্ট্যান্ডার্ড না। আশা করা যায়, সব ব্রাউজারেই ওপেন ওয়েব অ্যাপ স্ট্যান্ডার্ড হিসেবে পুরোপুরি সমর্থিত হবে।</p>
+<p>সেজন্য, যখন আপনি ওপেন ওয়েব অ্যাপ নিয়ে MDN এর বিভিন্ন আর্টিকেল পড়ছেন, মনে রাখবেন বেশিরভাগ তথ্যই এখন ফায়ারফক্সের জন্য প্রযোজ্য হলেও আশা করা যায় ভবিষ্যতে আপনার ওপেন ওয়েব অ্যাপ সব ব্রাউজারেই সমর্থিত হবে।</p>
+<h2 id="ওয়েব_স্ট্যান্ডার্ডসমূহ" style="line-height: 30px;">ওয়েব স্ট্যান্ডার্ডসমূহ</h2>
+<p>ও. ডব্লিও. এ প্রযুক্তি শুধুমাত্র একটি টুকরো নয়, এটি একটি ক্লাবের মত যা বিভিন্ন প্রযুক্তিকে সংযোগ করে এবং তাদের কিছু খুবই নতুন। এই মুহূর্তে, parts of OWA are standardized (HTML5, CSS, JavaScript, IndexedDB, etc.). Other parts are not yet standardized and the Mozilla implementation is thus specific to Firefox or to some other Mozilla technology. কিন্তু মোজিলার মিশন হলো সবার সাথে শেয়ার করা এবং সবাইকে ক্ষমতাবান করা, এই পরিস্থিতি শুধুমাত্র সাময়িক। এই জন্যে ও. ডব্লিও. এ ডকুমেন্টে আমরা পরিষ্কারভাবে ও. ডব্লিও. এ অংশ চিহ্নিত করার চেষ্টা করব যা এখনো প্রমিত হয় নি।</p>
+<p>দয়া করে নোট করুন যে কিছু ও. ডব্লিও. এ সংক্রান্ত প্রস্তাব এবং  potential standards যা মোজিলা দ্বারা ব্যবহার করা হয় না থাকতে পারে।</p>
+<h3 id="Intended_eventual_standards" style="line-height: 24px; letter-spacing: normal;">Intended eventual standards</h3>
+<p>So here are the parts not standardized yet across the different Web platforms and that still are Firefox-only for the moment:</p>
+<ul>
+ <li><a href="/en-US/docs/Web/Apps/Manifest">OWA manifest</a> একটি অ্যাপ্লিকেশন সংজ্ঞায়িত করার জন্য</li>
+ <li><a href="/en-US/docs/Web/Apps/JavaScript_API">The Complete OWA API</a> অ্যাপ্লিকেশন এর কাজ করার জন্য</li>
+ <li><a href="https://wiki.mozilla.org/WebAPI">Web APIs</a> ফোন, ভূঅবস্থান ইত্যাদি জিনিস অ্যাক্সেস করতে। স্ট্যাটাস রিপোর্ট এর জন্য <a href="http://arewemobileyet.com/">arewemobileyet.com</a> দেখুন।</li>
+ <li><a href="/en-US/docs/Mozilla/Persona">Identity (Persona)</a> ব্যবহারকারীর তথ্যের সাথে কাজ করার জন্য।</li>
+ <li><a href="https://wiki.mozilla.org/WebAPI/WebPayment">WebPayment API</a> কোনো মার্কেটপ্লেস থেকে ক্রয় এবং ইন-অ্যাপ্লিকেশন পেমেন্ট সহজতর করার জন্য।</li>
+ <li><a href="https://wiki.mozilla.org/Apps/WebApplicationReceipt">OWA Receipts</a> যেকোনো ডিভাইসে পেইড অ্যাপস যাচাই এবং যেকোনো মার্কেটপ্লেস থেকে Apps বিক্রি করার জন্য।</li>
+</ul>
+<h3 id="মার্কেটপ্লেস" style="line-height: 24px; letter-spacing: normal;">মার্কেটপ্লেস</h3>
+<h4 id="কিনুন_একবার_চালান_সবখানে" style="line-height: 18px; letter-spacing: normal;">কিনুন একবার, চালান সবখানে</h4>
+<p>From the ground up Mozilla has been building an apps system that lets users buy an app once and run it on all of their HTML5 devices. Very soon Mozilla will <a href="http://bits.blogs.nytimes.com/2012/09/07/a-firefox-smartphone-for-the-poor/">launch the first Firefox OS phone</a> but that will be just one device on which to run your apps. When you purchase an app through the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a>, the system installs a receipt on your device. The <a href="https://wiki.mozilla.org/Apps/WebApplicationReceipt">receipt</a> is a JSON Web Token with metadata that links to the Marketplace’s public key and its verification service URL. When an app starts up it can verify the receipt but the receipt on the device <em>is not tied</em> to the Firefox Marketplace. The receipt is just a cryptographically verifiable proof of purchase. Anyone can sell open Web apps if they follow the receipt specs. <strong>When you buy an app, it is intended to be portable across any device that supports the Open Web Apps system.</strong></p>
+<p>Mozilla is building the infrastructure needed to run Open Web Apps on any HTML5 device. <a href="http://www.mozilla.org/en-US/firefox/mobile/features/">Firefox for Android</a> will let you install and run apps (you can try it today on the <a href="http://nightly.mozilla.org/">nightly</a> build). Installed app icons go to your home screen just like regular Android apps. You can also install and run Web apps on your Windows, Mac, or Linux desktop using Firefox (this currently works in the <a href="http://nightly.mozilla.org/">nightly</a> build). Currently some version of Firefox is required, but it is intended that the Open Web Apps system will eventually be supported by all major browsers as a set of standards. From day one Mozilla has included all major HTML5 compliant browsers in its proof of concepts; you can take a look at this hosted JavaScript <a href="https://persona.org/include.js">shim</a> for ideas on how to support the apps platform on a non-Firefox browser.</p>
+<p>In the future the Open Web Apps system will support <a href="http://docs.services.mozilla.com/aitc/">syncing your installed apps</a> across devices. Since receipts are portable you could just sync them yourself if you wanted to. In case it’s not obvious, you can always run a free open Web app in any browser because it is no different than a website. It might, however, use new <a href="https://wiki.mozilla.org/WebAPI/">mobile specific web APIs</a> which are not implemented on all platforms.</p>
+<p>The video below provides a useful overview of the advantages of open marketplaces and an open web approach to app discovery:</p>
+<p style="text-align: center;"><iframe frameborder="0" height="270" src="https://www.youtube.com/embed/QCH_ncCrZfE/?feature=player_detailpage" width="480"></iframe></p>
+<h3 id="WebPayment_API" style="line-height: 24px; letter-spacing: normal;">WebPayment API</h3>
+<h4 id="Commerce_For_Apps" style="line-height: 18px; letter-spacing: normal;">Commerce For Apps</h4>
+<p>Part of the success of mobile app platforms like iOS and Android is that they make it very easy to try out new business models through mobile payments. Those models are still evolving but commerce is no doubt something that, at the moment, is awkward on the desktop Web and more natural on mobile. Specifically, it’s very convenient to charge something to your phone bill when you’re already accessing it from your phone anyway. With the launch of Firefox OS, the apps ecosystem will support app purchases and in-app payments through the <a href="https://wiki.mozilla.org/WebAPI/WebPayment">WebPayment API</a>. Supporting commerce is crucial for the growth of an apps platform. <strong>The use of the proposed payment API is completely <em>optional</em></strong>. Mozilla won’t prevent any app from using its own in-app payment system.</p>
+<div>
+  </div>
+<p> </p>