কোড পান

ব্লকলি কোড পাওয়ার বিভিন্ন উপায় আছে, এবং একবার পাওয়ার পরে এটি লোড করার বিভিন্ন উপায় আছে।

প্যাকেজ তৈরি করুন স্ক্রিপ্ট

ব্লকলি একটি স্ক্রিপ্ট প্রদান করে যা একটি স্টার্টার অ্যাপ্লিকেশন বুটস্ট্র্যাপ করে, যা আপনি পরে পরিবর্তন করতে পারেন। এটি ওয়েবপ্যাক এবং এসলিন্টের মতো সাধারণ ওয়েব ডেভেলপমেন্ট টুল ব্যবহার করে, কিন্তু রিঅ্যাক্ট বা অ্যাঙ্গুলারের মতো কোনও ফ্রেমওয়ার্ক অন্তর্ভুক্ত করে না।

এর জন্য আপনাকে নিম্নলিখিত কমান্ডগুলি চালানোর আগে node.js এবং npm ইনস্টল করতে হবে।

একটি নতুন hello-world ডিরেক্টরিতে জাভাস্ক্রিপ্টে লেখা একটি অ্যাপ্লিকেশন তৈরি করতে:

npx @blockly/create-package app hello-world

একটি নতুন hello-world ডিরেক্টরিতে TypeScript-এ লেখা একটি অ্যাপ্লিকেশন তৈরি করতে:

npx @blockly/create-package app hello-world --typescript

এগুলো এমন একটি প্যাকেজ তৈরি করে যা প্যাকেজ টার্গেট আমদানি করে । এটি নির্ভরতা পরিচালনা করার জন্য একটি package.json ফাইলও ব্যবহার করে, যা ব্লকলির সর্বশেষ সংস্করণের সাথে আপ-টু-ডেট থাকা সহজ করে তোলে।

এটিতে কিছু সহজ স্টার্টার স্ক্রিপ্টও রয়েছে, যেমন ব্রাউজারে স্থানীয়ভাবে প্রকল্পটি পরীক্ষা করার জন্য একটি:

cd hello-world
npm run start

অন্যান্য কমান্ডের জন্য আপনি জেনারেট করা package.json ফাইলটি দেখতে পারেন।

আনপিকেজি

যদি আপনি কেবল আইডিয়া নিয়ে খেলা করেন এবং একটি সম্পূর্ণ অ্যাপ্লিকেশন বুটস্ট্র্যাপ করতে না চান, তাহলে আপনি স্ক্রিপ্ট ট্যাগ ব্যবহার করে unpkg থেকে Blockly লোড করতে পারেন।

আপনি যদি যেকোনো HTML পৃষ্ঠায় নিম্নলিখিতটি যোগ করেন, তাহলে আপনি Blockly ব্যবহার করে পরীক্ষা করার জন্য সরাসরি একটি ব্রাউজারে HTMLটি খুলতে পারেন:

<!-- Load Blockly core -->
<script src="https://unpkg.com/blockly/blockly_compressed.js"></script>
<!-- Load the default blocks -->
<script src="https://unpkg.com/blockly/blocks_compressed.js"></script>
<!-- Load a generator -->
<script src="https://unpkg.com/blockly/javascript_compressed.js"></script>
<!-- Load a message file -->
<script src="https://unpkg.com/blockly/msg/en.js"></script>

ব্লকলি অর্জনের জন্য এটি দীর্ঘমেয়াদী সমাধান নয়, কারণ এটি ওয়েবপ্যাকের মতো বান্ডলারের সাথে কাজ করে না, তবে প্রোটোটাইপিং এবং পরীক্ষা-নিরীক্ষার জন্য এটি ভালো।

কোডটি পান

ব্লকলি চালানোর জন্য কোডটি পেতে আপনি বেশ কয়েকটি উপায় ব্যবহার করতে পারেন।

ব্লকলি টিম প্যাকেজ ম্যানেজারের (যেমন NPM অথবা Yarn ) মাধ্যমে ব্লকলি প্রয়োজন করার পরামর্শ দেয় কারণ:

• ব্লকলিতে পরিবর্তনগুলি সম্পর্কে আপডেট থাকা সহজ।
• এটি ব্লকলিতে মাঙ্কিপ্যাচিংয়ের পরিবর্তে প্লাগইন ব্যবহারকে উৎসাহিত করে।

এনপিএম

npm install blockly --save

সুতা

yarn add blockly

গিটহাব

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

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

কোডটি লোড করুন

একবার কোডটি পেয়ে গেলে, আপনার কোড থেকে এটি অ্যাক্সেস করার বিভিন্ন উপায় রয়েছে।

স্ক্রিপ্ট ট্যাগ

<!-- Load Blockly core -->
<script src="./my-lib-directory/blockly/blockly_compressed.js"></script>
<!-- Load the default blocks -->
<script src="./my-lib-directory/blockly/blocks_compressed.js"></script>
<!-- Load a generator -->
<script src="./my-lib-directory/blockly/javascript_compressed.js"></script>
<!-- Load a message file -->
<script src="./my-lib-directory/blockly/msg/en.js"></script>

স্ক্রিপ্ট ট্যাগ ব্যবহার করার সময়, আপনি গ্লোবাল নেমস্পেস থেকে আমদানি অ্যাক্সেস করতে পারেন:

// Access Blockly.
Blockly.thing;

// Access the default blocks.
Blockly.libraryBlocks['block_type'];

// Access the generator.
javascript.javascriptGenerator;

দ্রষ্টব্য: স্ক্রিপ্ট ট্যাগ ব্যবহার করার সময় আপনার একাধিক বার্তা ফাইল থাকতে পারে না কারণ বার্তাগুলি সরাসরি Blockly.Msg অ্যারেতে প্রয়োগ করা হয়।

আমদানি

দ্রষ্টব্য: আমাদের প্যাকেজ টার্গেটের আমদানি ব্যবহার করার জন্য আপনাকে একটি বান্ডলার (যেমন ওয়েবপ্যাক) ব্যবহার করতে হবে, যেহেতু ব্লকলি একটি ESM হিসাবে নয় বরং একটি UMD হিসাবে প্যাকেজ করা হয়।

// Import Blockly core.
import * as Blockly from 'blockly/core';
// Import the default blocks.
import * as libraryBlocks from 'blockly/blocks';
// Import a generator.
import {javascriptGenerator} from 'blockly/javascript';
// Import a message file.
import * as En from 'blockly/msg/en';

যখন আপনি বার্তা ফাইলগুলি আমদানি করেন, তখন আপনাকে সেগুলিও প্রয়োগ করতে হবে।

Blockly.setLocale(En);

প্রয়োজন

// Require Blockly core.
const Blockly = require('blockly/core');
// Require the default blocks.
const libraryBlocks = require('blockly/blocks');
// Require a generator.
const {javascriptGenerator} =  require('blockly/javascript');
// Require a message file.
const En = require('blockly/msg/en');

যখন আপনার বার্তা ফাইলগুলির প্রয়োজন হয়, তখন আপনাকে সেগুলিও প্রয়োগ করতে হবে।

Blockly.setLocale(En);