মোবাইলে ওয়েব ডেভেলপমেন্ট শিখার খুটিনাটি

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

প্রথমেই যারা ওয়েব ডেভেলপমেন্ট এর কিছুই জানেন না বা একেবারে নতুন তারা কিভাবে শুরু করবেন। যেহেতু আপনি কিছু জানেন না তাই আপনার নিশ্চয়ই ইডিটর এর টেকনিকগুলো জানার কথা না। তাই এজন্য আপনাকে এমন এক পদ্ধতি অবলম্বন করতে হবে যেখানে ঝামেলা কম। তাই যারা কিছু জানেন না তাদের জন্য অল ইন ওয়ান সল্যুশন হচ্ছে solo-learn. এখানে আপনি ওয়েব ডেভেলপমেন্ট এর প্রায় সকল কিছুর বেসিকটা শিখতে পারবেন। যেমন HTML, CSS, JavaScript, jQuery সহ আরো অনেক কিছু। এই অ্যাপের সাথে বিল্ড ইন একটা কোড ইডিটর দেয়া আছে। যেখানে আপনি ১২ টিরও বেশি আধুনিক ভাষায় কোডিং করতে পারবেন। মজার ব্যাপার হচ্ছে web playground টা মানে ওয়েব ডেভেলপমেন্ট এর লাইভ ইডিটর টা পুরোপুরি অফলাইন এ কার্যকর। তাই এখানে একই সাথে কোডিং এবং আউটপুট উভয়েই পাবেন। আরেকটা কথা এটা একটা স্যান্ডবক্সের মতো। তাই এখানে লোকাল ফাইল এবং মাল্টিপল ফাইল নিয়ে কাজ করা যায় না। আবার আপনি ইমেজ এই স্যান্ড বক্সে আপলোড ও করতে পারবেন না। তাই সবাই ইমেজ অ্যাডিং এর যে সমস্যার কথাটা উল্লেখ করেছেন তার একমাত্র সমাধান CDN বা যেকোনো ফটো প্রোভাইডার সাইট থেকে ইমেজ ইমবেড করা। এই অ্যাপের আরো অনেক সুবিধা আছে। সেগুলো সম্পর্কে সামান্য কিছু করে হলেও বলা উচিত। অনেকের বাসায় বা এলাকায়ই ইন্টারনেট সুবিধা তেমন ভালো না। তারা চাইলে এই অ্যাপের লার্নিং মডিউল এবং কোডিং ম্যাটেরিয়ালসগুলো ডাউনলোড করে রাখতে পারেন। তাহলে আপনি ডাটা ছাড়াই পরে পুরোপুরি কাজ চালাতে পারবেন। এছাড়াও এখানে আপনি কুইজ খেলতে পারবেন, কোড প্রোব্লেম পোস্ট করতে পারবেন, ভালো ডেভেলপারদের ফলো করতে পারবেন এবং তাদের সাথে চ্যাট করতে পারবেন। এটি একটি অত্যন্ত জনপ্রিয় সোশ্যাল কোডিং সাইট। এই গেলো বিগিনারদের প্রথম অ্যাপ। 

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

এবার তৃতীয় পদ্ধতি :--

এটা মূলত যারা ওয়েব ডেভেলপমেন্ট ভালোই পারেন তাদের জন্য। ফ্রণ্ট ইন্ড ডেভেলপমেন্ট এর জন্য পিসির অভাবের বিকল্প এই পদ্ধতি। এখানে একটি সাধারণ পদ্ধতিকে একটা সাধারণ ইডিটর দিয়ে বলা হবে বাকি প্রায় সব ইডিটর এ পদ্ধতি কার্যকর।(just file opening tricks. Application functionality varies depending on editor) acode ইডিটর দিয়ে আপনি মোটামুটি পিসির মতো কাজ করতে পারবেন। এখানের স্নিপেট এর কার্যকারিতা সত্যিই প্রশংসনীয়। এখানে পাবেন আপনি বহুল ব্যবহৃত ইমেট(জেনকোডিং) এর সুবিধা(অনেকাংশে) । মানে HTML 5 লিখলেই পুরো একটি ডকুমেন্ট এর ফরম্যাট চলে আসে। এখানে খুবই কম লিখতে হবে আপনাকে। আছে পিসির মতো ফাইল ট্যাবিং এর সুবিধা। এক ফাইল থেকে আরেক ফাইলে মুভ করা অনেক সুবিধাজনক। পরিচিত সব কি সর্টকাট। যেকোনো লোকাল ফোলডারকে প্রজেক্ট হিসেবে ওপেন করতে পারবেন। স্টান্ডার্ড সিনট্যাক্স হাইলাইটিং, জনপ্রিয় বিভিন্ন পিসি টেক্সট ইডিটর এর থিম, কোড বিউটিফাই এর সুবিধা, কনসোল,গিটহাব ও ftp সুবিধাসহ আরো অনেক কিছু। সুবিধা অনেক বললাম এখন একটু ঝামেলা নিয়ে কথা বলি। এই অ্যাপের প্রজেক্ট ফাইল in app and browser দুই ভাবেই প্রিভিউ করা যায়। কিন্ত কথা হচ্ছে ফাইলগুলো লোকাল সার্ভার এর মাধ্যমে প্রিভিউ করানো হয়। অ্যাপ বন্ধ করার পর ফাইল ব্রাউজার থেকে ডিরেক্ট ব্রাউজারে ওপেন করলে নানা সমস্যা তৈরি হতে পারে। যেমন ব্রেকিং ইমেজ, নন স্ট্যাইলড ডিজাইন, শুধু html আসা। এর মূল কারণ প্রোটোকল। যেহেতু এগুলো লোকাল ফাইল তাই এগুলো কে file:/// protocol দিয়ে ওপেন করত হবে অথবা localhost:// থেকে। অ্যাপ অফ মানে localhost অফ। তাই একমাত্র উপায় file protocol.। কিন্ত কথা হচ্ছে যখন আপনি ফাইল এক্সপ্লোরার এর মাধ্যমে html ফাইল webkit বেসড ব্রাউজারে ওপেন করবেন তখন এরা এক অদ্ভুত protocol এর মাধ্যমে সেটা ওপেন করে (গুগল ক্রোম webikt based)। যেমন content://। এটাই আপনাদের বহুল আলোচিত ইমেজ না আসার প্রধান কারন। তাই পিসির মতো লোকাল ফাইল হিসেবে ওপেন করতে হলে আপনাকে অবশ্যই file protocol দিয়ে ওপেন করতে হবে। এটা করার জন্য ব্যবহার করতে হবে ফায়ারফক্স ব্রাউজার। ডিফল্ট ভাবে ফায়ারফক্স লোকাল html ফাইলকে file protocol দিয়ে ওপেন করে। তাই ঝামেলাহীন। ক্রোম দিয়ে করার জন্য ফাইল অথবা ফোল্ডারকে ম্যানুয়ালি নেভিগেট করতে হবে। যেমন:- file:///storage /emulated/0/yourfolder

ধরুন Your folder টা আপনার প্রজেক্ট ফোল্ডার। এভাবে এটা ওপেন করলে পিসির মতো ঐ ফোল্ডার এর সব ফাইল ক্রোম লিস্ট আকারে রাখবে। সেখান থেকে কাংখিত html ফাইলটি ওপেন করলেই হবে। এভাবেই আপনি লোকালি মোবাইল দিয়ে পিসির মতোই কাজ করতে পারবেন। 

এসব কাজের জন্য আপনাদের অনেক কাজে হেল্প করতে পারে es file explorer। যার নিজেরও একটা সুন্দর ইডিটর রয়েছে। তাছাড়া আনুষঙ্গিক অনেক ছোট ছোট কাজেও লাগতে পারে। যেমন যেকোন ফাইল/ফোল্ডারের প্যাথ বের করা ইত্যাদি।