কোনও ওয়েবসাইটের জন্য ডিরেক্টরি কাঠামো (জেএস / সিএসএস / আইএমজি ফোল্ডার)

Question

কয়েক বছর ধরে আমি আমার ওয়েবসাইটগুলির জন্য নিম্নলিখিত ডিরেক্টরি কাঠামোটি ব্যবহার করছি:

<root>
  ->js
    ->jquery.js
    ->tooltip.js
    ->someplugin.js
  ->css
    ->styles.css
    ->someplugin.css
  ->images
    -> all website images...

যতক্ষণ না আমি তৃতীয় পক্ষের বিভিন্ন উপাদান ব্যবহার শুরু করি ততক্ষণ আমার কাছে এটি পুরোপুরি ঠিক ছিল।
উদাহরণস্বরূপ, আজ আমি একটি ডেটটাইম পিকার জাভাস্ক্রিপ্ট উপাদান ডাউনলোড করেছি যা এটির সিএসএস ফাইলটি অবস্থিত একই ডিরেক্টরিতে এর চিত্রগুলির সন্ধান করে (সিএসএস ফাইলে "ইউআরএল ('ক্যালেন্ডার.পিএনজি')") এর মতো ইউআরএল রয়েছে।

সুতরাং এখন আমার কাছে 3 টি বিকল্প রয়েছে:

1) আমার CSS ডিরেক্টরিতে ডেটপিকারের সিএসএস রাখুন এবং এর চিত্রগুলি বরাবর রেখে দিন। আমি এই বিকল্পটি সত্যিই পছন্দ করি না কারণ আমার সিএসএস ডিরেক্টরিতে CSS এবং চিত্র উভয়ই থাকবে এবং এটি অদ্ভুত। এছাড়াও আমি একই নামের সাথে বিভিন্ন উপাদানগুলির ফাইলগুলি দেখতে পেলাম, যেমন 2 টি পৃথক উপাদান, যা তাদের সিএসএস ফাইল থেকে ব্যাকগ্রাউন্ড.পিএনজি-তে লিঙ্ক করে। আমাকে সেই নাম সংঘর্ষগুলি সংশোধন করতে হবে (ফাইলগুলির মধ্যে একটির নাম পরিবর্তন করে এবং লিঙ্কযুক্ত সংশ্লিষ্ট ফাইলটি সম্পাদনা করে)।

2) আমার সিএসএস ডিরেক্টরিতে ডেটপিকারের সিএসএস রাখুন, ইমেজ ডিরেক্টরিতে ইমেজ ডিরেক্টরিতে রাখুন এবং ইমেজ ডিরেক্টরিতে ইমেজগুলি সন্ধানের জন্য ডেটপিকার সিএসএস সম্পাদনা করুন। এই বিকল্পটি ঠিক আছে তবে তৃতীয় পক্ষের উপাদানগুলি আমার সাইটের কাঠামোর সাথে মানিয়ে নিতে আমাকে কিছুটা সময় ব্যয় করতে হবে। আবার, নামের সংঘাতগুলি এখানে ঘটতে পারে (পূর্ববর্তী বিকল্পে বর্ণিত হিসাবে) এবং আমাকে সেগুলি ঠিক করতে হবে।

3) ডেটপিকার.জেএস, ডেটপিকারের সিএসএস এবং এর চিত্রগুলি একটি পৃথক ডিরেক্টরিতে রাখুন, আসুন / থার্ড পার্টি / ডেটপিকার / বলুন এবং ফাইলগুলি লেখকের দ্বারা যেমন ইচ্ছা করা হয়েছিল (যেমন, উদাহরণস্বরূপ, / 3rdParty / ডেটপিকার / সিএসএস / ডেটপিকার) .css, /3rdParty/datepicker/css/something.png, ইত্যাদি)। এখন আমি ভাবতে শুরু করি যে এই বিকল্পটি সবচেয়ে সঠিক।

অভিজ্ঞ ওয়েব বিকাশকারীগণ, আপনি কী প্রস্তাব দিচ্ছেন?

Answer 1

আমি সর্বদা তৃতীয় পক্ষের উপাদানগুলির জন্য একটি lib ডিরেক্টরি তৈরি করি, আপনি সত্যই তৃতীয় পক্ষের লাইব্রেরিগুলি পরিবর্তন করতে চান না যদি না এটি কঠোরভাবে প্রয়োজন হয়।

3 য় বিকল্প সহ যান।

Answer 2

ফাইলটি টাইপ করে যা আমার কাছে স্বেচ্ছাসেবী বোধ করে সেগুলি আলাদা করার পরিবর্তে, বিকাশকারীরা কীভাবে সেগুলি ব্যবহার করবেন এবং সেগুলি সম্পর্কে কী ভাবেন সেগুলি দিয়ে আমি ফাইলগুলি সংগঠিত করি। আমি জিনিসগুলিকে কয়েকটি প্রাথমিক বিভাগে বিভক্ত করি:

myapp/
  ui/ # or "www"
    lib/ # third-party
      jquery/
      sugarjs/
      backbone/
      underscore/
    app/ # application logic
      main.js
      router.js
      views.js
      models.js
    style/ # all presentation
      main.css
      buttons.css
      icons/
        add.svg
        log.png
      img/
        logo.png
        signup.png
    components/ # standalone bundles of html/css/js, if necessary
  server/ # or "api" (all server-side logic)

Answer 3

বিকল্প # 2 ব্যবহারিক এবং বিপজ্জনকও নয় কারণ আপনার 3 য় পক্ষের লাইব্রেরিগুলি আপগ্রেড করার সময় আপনার সমস্ত পরিবর্তনগুলি পুনরায় প্রয়োগ করতে হবে (এবং তাই কিছু ভুলে যেতে পারে)। এটি অবশ্যই একটি বড় নো! বিকল্প # 1 এবং # 3 এর প্রতিটি ক্ষেত্রে সুবিধা এবং অসুবিধা রয়েছে। তাই আমি সাধারণত উভয় সংমিশ্রণে যাই।

আমার সমাধানটি হ'ল আমার ফাইলগুলির জন্য বিকল্প # 1 এবং তৃতীয় পক্ষের লাইব্রেরির জন্য বিকল্প # 3 ব্যবহার করা।

উদাহরণ:

<root>
  -> js
    -> jquery.js
    -> main.js
  -> css
    -> reset.css
    -> style.css
  -> img
    -> img1.jpg
    -> img2.jpg
  -> lib
    -> someplugin1
      -> original folder/file structure of this plugin
    -> someplugin2
      -> original folder/file structure of this plugin