প্রকল্প সম্পর্কে

# প্রজেক্ট ওভারভিউ এটি vue2 + vuex দিয়ে তৈরি একটি বৃহৎ সিঙ্গেল পেজ অ্যাপ্লিকেশন (SPA) উদাহরণ, যা 'Ele.me' ফুড ডেলিভারি সিনারিওর উপর ভিত্তি করে তৈরি। README অনুযায়ী, লেখক এটি সম্পূর্ণ শূন্য থেকে তৈরি করতে প্রায় দুই মাসের বেশি সময় ব্যয় করেছেন। এই প্রজেক্টটি কোনো সাধারণ ডেমো নয়, বরং জটিল লজিক এবং পূর্ণাঙ্গ ফাংশনালিটির একটি প্র্যাকটিক্যাল এক্সারসাইজ। লেখক উল্লেখ করেছেন যে, এটি মুকুরং (Mooc) এর Ele.me কোর্সের প্রজেক্টের সাথে সম্পর্কিত নয় এবং এটি শুধুমাত্র ব্যক্তিগত অনুশীলনের জন্য; প্রকৃত অর্ডারের জন্য অফিসিয়াল ক্লায়েন্ট ব্যবহার করতে হবে। # টেকনোলজি স্ট্যাক vue2 + vuex + vue-router + webpack + ES6/7 + fetch + sass + flex + svg। README-তে জানানো হয়েছে যে, প্রচুর ES6/7 ফিচার ব্যবহারের কারণে Node-এর ভার্সন ৬.০ বা তার বেশি হতে হবে। # প্রজেক্ট রান করার নিয়ম ``` git clone https://github.com/bailicangdu/vue2-elm.git cd vue2-elm npm install অথবা yarn (সুপারিশকৃত) npm run dev ``` # ইন্টারফেস ডেটা এবং সহযোগী প্রজেক্ট সব ইন্টারফেস ডেটা সহযোগী ব্যাকএন্ড সিস্টেম node-elm থেকে আসে। যারা ফ্রন্টএন্ড এবং ব্যাকএন্ড একসাথে ডেভেলপমেন্ট অভিজ্ঞতা নিতে চান, তারা ব্যাকএন্ড সিস্টেমটি ডাউনলোড করতে পারেন; সেক্ষেত্রে স্টার্ট কমান্ড হবে `npm run local` (npm run dev এর পরিবর্তে)। এছাড়া element-ui দিয়ে তৈরি একটি ব্যাকএন্ড ম্যানেজমেন্ট পেজ vue2-manage প্রদান করা হয়েছে, যা শুধুমাত্র ফ্রন্টএন্ড ডেভেলপারদের জন্য ঐচ্ছিক। README-তে উল্লেখ আছে যে, প্রিভিউ অ্যাড্রেস এবং ইন্টারফেসের জন্য https ব্যবহার করতে হবে। # বাস্তবায়িত ফিচারসমূহ - লোকেশন ফাংশনালিটি - শহর নির্বাচন - ঠিকানা অনুসন্ধান - নির্বাচিত ঠিকানার আশেপাশের মার্চেন্ট তালিকা প্রদর্শন - খাবার এবং রেস্তোরাঁ অনুসন্ধান - দূরত্ব, বিক্রয়, রেটিং, স্পেশাল ডিশ এবং ডেলিভারি মোডের ভিত্তিতে সর্টিং এবং ফিল্টারিং - রেস্তোরাঁর ফুড লিস্ট পেজ - শপিং কার্ট ফাংশনালিটি - দোকানের রিভিউ পেজ - একক খাবারের ডিটেইলস পেজ - মার্চেন্ট ডিটেইলস পেজ - লগইন এবং রেজিস্ট্রেশন - পাসওয়ার্ড পরিবর্তন - পার্সোনাল সেন্টার/প্রোফাইল - SMS এবং ভয়েস ভেরিফিকেশন - অর্ডার প্লেস করার ফাংশনালিটি - অর্ডার লিস্ট এবং অর্ডার ডিটেইলস - অ্যাপ ডাউনলোড - ডেলিভারি অ্যাড্রেস যোগ, মুছে ফেলা এবং পরিবর্তন - অ্যাকাউন্ট ইনফরমেশন - সার্ভিস সেন্টার - রেড এনভেলাপ (Red Packet) - প্রোফাইল ছবি আপলোড অবাস্তবায়িত ফিচার: পেমেন্ট (README-তে লেখক রসিকতা করে লিখেছেন যে এটি তিনি করতে পারেননি)। # প্রজেক্ট স্ট্রাকচার সোর্স কোড src ডিরেক্টরিতে অবস্থিত, যার মধ্যে রয়েছে: components (common, footer, header এর মতো পাবলিক কম্পোনেন্ট যেমন পপ-আপ, কার্ট, কাউন্টডাউন, লোডিং অ্যানিমেশন, রেটিং স্টার, রেস্তোরাঁ লিস্ট), config (env.js এনভায়রনমেন্ট সুইচ, fetch.js ডেটা ফেচিং, mUtils.js কমন মেথড, rem.js ইউনিট কনভার্সন), images, page (বিজনেস অনুযায়ী পেজ ডিরেক্টরি যেমন balance, benefit, city, confirmOrder, download, find, food, forget, home, login, msite, order, points, profile, search, service, shop, vipcard), plugins, router, service (getData.js ইন্টারফেস ম্যানেজমেন্ট, tempdata অস্থায়ী ডেটা), store (vuex এর action, getters, index, modules, mutation-types, mutations) এবং style (common.scss, mixin.scss, swiper.min.css)। রুট ডিরেক্টরিতে build (webpack কনফিগ), config (প্যাকেজিং পাথ), elm (ডিপ্লয়মেন্ট ফাইল), screenshots, App.vue, main.js, index.html ইত্যাদি রয়েছে। README অনুযায়ী এতে ৫৬টি ডিরেক্টরি এবং ২০৩টি ফাইল আছে। # লেখকের সারসংক্ষেপ এবং ভবিষ্যৎ লক্ষ্য README-তে উল্লেখ করা হয়েছে যে, টাকার লেনদেন সংক্রান্ত ওয়েব লজিক বেশ জটিল। মার্চেন্ট এবং খাবারের বৈচিত্র্য এবং পেজ ইন্টারঅ্যাকশন জটিল হওয়ায় শপিং কার্ট এবং অর্ডার লজিক তৈরিতে লেখক বেশ চ্যালেঞ্জের সম্মুখীন হয়েছেন। কোনো ডিজাইন বা API ডকুমেন্টেশন না থাকায় তিনি ধাপে ধাপে এটি শিখেছেন। লেখকের মতে, জটিল ইন্টারঅ্যাকশন লজিক হ্যান্ডেল করার জন্য vuex অপরিহার্য এবং vue + vuex দিয়ে বড় আকারের সিঙ্গেল পেজ প্রজেক্ট করা সম্ভব। ভবিষ্যৎ লক্ষ্যের মধ্যে রয়েছে: node.js দিয়ে একটি সিমুলেটেড ফুড ডেলিভারি ব্যাকএন্ড তৈরি করা, Android এবং iOS এর জন্য নেটিভ অ্যাপ সংস্করণ তৈরি করা এবং সময় পেলে সেলার ভার্সন তৈরি করা। # ডেমো এবং লাইসেন্স README-তে অনলাইন ডেমো লিঙ্ক (Chrome মোবাইল মোডে দেখার পরামর্শ দেওয়া হয়েছে) এবং মোবাইল কিউআর কোড দেওয়া আছে। সাথে মার্চেন্ট লিস্ট, ফিল্টারিং, কার্ট, অর্ডার কনফার্মেশন, সার্চ, লগইন এবং প্রোফাইল পেজের স্ক্রিনশট যুক্ত করা হয়েছে। Gitter গ্রুপ অথবা Issues/PR এর মাধ্যমে প্রজেক্ট নিয়ে আলোচনা করা সম্ভব। লাইসেন্সটি হলো GPL।