সম্পদের জন্য নামকরণ কনভেনশন (চিত্র, সিএসএস, জেএস)?

Question

আমি এখনও আমার ওয়েব প্রকল্পগুলিতে ব্যবহৃত চিত্র, জেএস এবং সিএসএস ফাইলের মতো সম্পদের জন্য একটি ভাল নামকরণের কনভেনশন খুঁজে পেতে লড়াই করছি strugg

সুতরাং, আমার বর্তমান হবে:

সিএসএস: style-{name}.css
উদাহরণ: style-main.css, style-no_flash.css, style-print.cssইত্যাদি

জাতীয়: script-{name}.js
উদাহরণ: script-main.js, script-nav.jsইত্যাদি

ছবি: এর মধ্যে {imageType}-{name}.{imageExtension}
{imageType} যে কোনও একটি

• আইকন (যেমন সহায়তা সামগ্রীর জন্য প্রশ্ন চিহ্ন আইকন)
• আইএমজি (যেমন <img />উপাদানটির মাধ্যমে একটি শিরোনাম চিত্র imageোকানো )
• বোতাম (যেমন একটি গ্রাফিকাল জমা বোতাম)
• বিজি (চিত্র CSS এর পটভূমি চিত্র হিসাবে ব্যবহৃত হয়)
• স্প্রাইট (চিত্রটি CSS এ ব্যাকগ্রাউন্ড চিত্র হিসাবে ব্যবহৃত হয় এবং এতে একাধিক "সংস্করণ" থাকে)

যেমন-নাম হবে: icon-help.gif, img-logo.gif, sprite-main_headlines.jpg, bg-gradient.gifইত্যাদি

সুতরাং, আপনি কী ভাবেন এবং আপনার নামকরণের সম্মেলনটি কী?

Comments

Javascript File Naming Conventionsকেবলমাত্র সম্পর্কিত সম্পর্কে , স্ট্যাকওভারফ্লো

— অ্যাড্রিয়েন

Answer 1

আমি ফোল্ডারে সিএসএস ফাইল রাখি css, জাভাস্ক্রিপ্ট ইন js, চিত্রগুলি images... ... আপনার উপযুক্ত হিসাবে সাবফোল্ডার যুক্ত করুন। স্বতন্ত্র ফাইলের স্তরের নামকরণের কোনও প্রয়োজন নেই।

Comments

আমি একমত নই অনেক পরিচিত প্রকল্পের নামকরণের সম্মেলন রয়েছে তা বিবেচনা করুন। jQuery দেখুন, এটি ব্যবহার করে <product-name>.<plugin>-<ver.sion>.<filetype>.js, যেমন jquery-1.4.2.min.js, বা jquery.plugin-0.1.js।

— এড্রিয়েন

Answer 2

আমি খেয়াল করেছি ফ্রন্টএন্ড ডেভেলপারদের অনেক থেকে দূরে সরানোর হয় cssএবং jsপক্ষে stylesএবং scriptsসেখানে সাধারণত যেমন সেখানে অন্যান্য উপাদান, কারণ .less, .stylএবং .sassসেইসাথে কিছু জন্য, .coffee। ঘটনাটি হ'ল, আপনার পছন্দ মতো ফোল্ডার সংস্থার নির্দিষ্ট প্রযুক্তি নির্বাচন ব্যবহার করা যদি সবাই তা করেও তবে এটি একটি খারাপ ধারণা। আমি এই অতি সম্মানিত বিকাশকারীদের কাছ থেকে আমি যে স্ট্যান্ডার্ডটি দেখি তা ব্যবহার করতে থাকব:

• src/html
• src/images
• src/styles
• src/styles/fonts
• src/scripts

এবং তাদের গন্তব্য সমতা তৈরি করে যা কখনও কখনও destতারা কী নির্মাণ করছে তার উপর নির্ভর করে:

• ./
• images
• styles
• styles/fonts
• scripts

এটি যাঁরা সমস্ত ফাইল একসাথে রাখতে চান ( srcডিরেক্টরিটি ভাঙার পরিবর্তে ) তা রাখতে দেয় এবং যেগুলি স্পষ্ট হয়ে যায় না তাদের জন্য পরিষ্কারভাবে যুক্ত করে রাখে।

আমি আসলে কিছুটা দূরে গিয়ে যোগ করি

• scripts/before
• scripts/after

যা দুটি main-before.min.jsএবং main-after.min.jsস্ক্রিপ্টগুলিতে মিশে যায় , একটি শিরোনামের জন্য হয় (এর প্রয়োজনীয় উপাদানগুলির সাথে normalizeএবং modernizrএটি দ্রুত চালাতে হয়, উদাহরণস্বরূপ) এবং afterযে জাভাস্ক্রিপ্ট অপেক্ষা করতে পারে সেহেতু শরীরের শেষ জিনিসটির জন্য। এগুলি পড়ার উদ্দেশ্যে নয়, অনেকটা গুগলের মূল পৃষ্ঠার মতো।

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

এই দিনগুলিতে, যদি আপনি কোনও ধরণের গল্প বা গ্রান্টের মতো কোনও বিল্ড প্রক্রিয়া ব্যবহার না করে থাকেন তবে আপনি সম্ভবত মোবাইল কেন্দ্রিক পারফরম্যান্সের বেশিরভাগ লক্ষ্যে পৌঁছছেন না যা আপনি সম্ভবত বিবেচনা করা উচিত।

Comments

ফন্ট ফাইল (.ttf, .eot, ইত্যাদি) স্টাইল / ফন্টে অবস্থিত?

— অ্যান্ড্রু সেভচুক

এটি উচ্চ যুক্তিসঙ্গত ধারণা। ধন্যবাদ!

— ই

আমি মনে করি ফন্ট ফাইলগুলি স্টাইলের ফোল্ডারের বাইরে হওয়া উচিত, সেগুলি পুনরায় সংযুক্ত করা হয়, তবে আমি মনে করি এটি বাইরে সুস্পষ্ট বলে মনে হচ্ছে।

— পাবলো-ন

Answer 3

/ সম্পদ /
  / সিএসএস
  / ছবি
  / জাভাস্ক্রিপ্ট (বা স্ক্রিপ্ট)
    / মিনিফাইড
    /উৎস

আমি দেখেছি এবং আমি পছন্দ করি সেরা কাঠামো। ফোল্ডারগুলির সাথে বর্ণনামূলক নাম সহ আপনার সত্যিকার অর্থে আপনার সিএসএস প্রিফিক্স করার দরকার নেই।

Comments

আমি এটি পছন্দ করি তবে আমি মনে করি যে আরও সাধারণ মূল ফোল্ডারটি "পাবলিক" বা "সামগ্রী"।

— ব্রায়ান বোটরাইট

'সম্পদ' এর জন্য এই ফাইলের কাঠামোটি আমি প্রথমবার যখন দেখেছিলাম তখন আমি কৌনিক একক পৃষ্ঠার অ্যাপ্লিকেশনগুলিতে প্রবেশ করেছি। এটি প্রচুর অ্যাংুলার একক পৃষ্ঠার অ্যাপ টিউটোরিয়ালে ব্যবহৃত হয়েছে - এটি আমার পছন্দ হয়েছে।

— কাইল ভ্যাসেলা

Answer 4

বৃহত্তর সাইটগুলিতে যেখানে CSS অনেকগুলি পটভূমি চিত্র সংজ্ঞায়িত করতে পারে, সেই সম্পদের জন্য একটি ফাইলের নামকরণ কনভেনশন পরে পরিবর্তন করার জন্য সত্যই কার্যকর হয়।

উদাহরণ স্বরূপ:

[component].[function-description].[filetype]

footer.bkg-image.png
footer.copyright-gradient.png

আমরা উপাদান ধরণের যোগ করার বিষয়েও আলোচনা করেছি, তবে আমি নিশ্চিত নই যে এটি কতটা সহায়ক এবং সম্ভবত ভবিষ্যতে প্রয়োজনীয় পরিবর্তনের জন্য বিভ্রান্তিকর হতে পারে:

[component].[element]-[function-description].[filetype]
footer.div-bkg-image.png
footer.p-copyright-gradient.png

Answer 5

আপনি এটির নাম দিতে পারেন:

/ সম্পদ / সিএসএস / - সিএসএস ফাইলের জন্য

/ সম্পদ / ফন্ট / - হরফ ফাইলের জন্য। (বেশিরভাগ ক্ষেত্রে আপনি কেবল ব্যবহারযোগ্য হরফ অনুসন্ধান করতে গুগল ফন্টে যেতে পারেন))

/ সম্পদ / চিত্র / - চিত্র ফাইলের জন্য।

/ সম্পদ / স্ক্রিপ্ট / বা / সম্পদ / জেএস / - জাভাস্ক্রিপ্ট ফাইলগুলির জন্য।

/ সম্পদ / মিডিয়া / - ভিডিও এবং বিবিধ জন্য। নথি পত্র.

আপনি "রিসোর্স" বা "ফাইলগুলি" ফোল্ডারের নাম দিয়ে "সম্পদ" প্রতিস্থাপন করতে পারেন এবং এর সাবফোল্ডারগুলির নাম রাখতে পারেন। ওয়েল এর মতো একটি অর্ডার ফোল্ডার কাঠামো রাখা খুব গুরুত্বপূর্ণ নয় কেবলমাত্র গুরুত্বপূর্ণ আপনার ফাইলগুলি এটির ফর্ম্যাট অনুসারে সাজানো দরকার। সিএসএস ফাইলের জন্য "/ সিএসএস /" অথবা ইমেজ ফাইলগুলির জন্য "/ চিত্র /" ফোল্ডার তৈরি করা।

Answer 6

প্রথমত, আমি ফোল্ডার বিভক্ত: css, js,img ।

সিএসএস এবং জেএস-এর মধ্যে, আমি প্রকল্পের নামের সাথে ফাইলগুলি উপসর্গ করেছি কারণ আপনার সাইটে জেএস এবং সিএসএস ফাইলগুলি অন্তর্ভুক্ত থাকতে পারে যা এটি আপনার সাইটের জন্য নির্দিষ্ট ফাইলগুলি বা প্লাগইনগুলির সাথে সম্পর্কিত কিনা তা পরিষ্কার করে দেয়।

css/mysite.main.css css/mysite.main.js

অন্যান্য ফাইলগুলি এর মতো হতে পারে

js/jquery-1.6.1.js js/jquery.validate.js

অবশেষে চিত্রগুলি তাদের ব্যবহার দ্বারা বিভক্ত।

• img/btn/submit.png একটি বোতাম
• img/lgo/mysite-logo.png একটি লোগো
• img/bkg/header.gif একটি পটভূমি
• img/dcl/top-left-widget.jpg একটি ডিকাল উপাদান
• img/con/portait-of-something.jpg একটি সামগ্রী চিত্র

100 টিরও বেশি হতে পারে এবং সহজেই একসাথে মিশে যেতে পারে এবং বিভ্রান্তিকরভাবে নামকরণ করা যায় এমন চিত্রগুলি সংগঠিত রাখা গুরুত্বপূর্ণ।

Comments

img/con? আমি অনুমান করছি আপনি উইন্ডোজ ভিত্তিক সিস্টেমে এই ফাইলগুলির কোনও সংরক্ষণ করছেন না? দেখা যাচ্ছে কন একটি সংরক্ষিত এমএস-ডস ডিভাইস ড্রাইভারের নাম এবং ফাইলের নাম হিসাবে ব্যবহার করা যায় না ।

— 5

আমি একটি ফোল্ডার নাম হিসাবে img পছন্দ করি কারণ এটি আমাকে মনে করিয়ে দেয় যে ট্যাগের নামটিও ইম্যাগ নয়, চিত্র ।

— user949300

Answer 7

আমি জেনেরিক কিছু এড়ানোর ঝোঁক রাখি যেমন স্মাড্রাজারের পরামর্শ। "mysite.main.css" এর অর্থ মোটেও কিছু নয়।

"মাইসাইট" কি ?? এই যে আমি কাজ করছি? যদি তাই হয় তবে প্রকৃতপক্ষে, তবে এটি ইতিমধ্যে আমার মনে হয়েছে এটি কী হতে পারে এবং যদি এটি প্রকট হয়!

"মাইন" কী? "মেইন" শব্দের কোডার্স জ্ঞানের বাইরে সেই সিএসএস ফাইলের মধ্যে কোনও সংজ্ঞা নেই।

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

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

আমার মনে হয় না যে আপনি সিএসএস ফাইলনেমে "সিএসএস" বা "স্টাইল" লেখার দরকার নেই, কারণ এটি "সিএসএস" বা "স্টাইলস" ফোল্ডারে রয়েছে এবং এর এক্সটেনশন রয়েছে .cssএবং মূলত এই ফাইলগুলি কেবল কখনও বলা হয় মধ্যে<head> এলাকা, আমি প্রায় পরিষ্কারভাবে কি তারা জানি।

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

যেমন: ফাইলের নাম দেখছি Seeing require('libContactFormValidation.php'); দেখা দরকারী। আমি জানি এটি একটি লাইব্রেরি ফাইল (lib) এবং নাম থেকে এটি কী করে।

চিত্র ফোল্ডারগুলির জন্য, আমার সাধারণত থাকে images/content-images/এবংimages/style-images/ । আমি মনে করি না যে আরও কোনও বিচ্ছেদ হওয়া দরকার, তবে এটি আবার প্রকল্পের উপর নির্ভর করে।

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

সাইট-লোগো -150x150.png
সাইট-লোগো -35x35.png
দোকান-চেকআউট-বোতাম -40x40.png
দোকান-সরান-আইটেম -20x20.png
ইত্যাদি

---

অনুসরণ করার একটি ভাল নিয়মটি হ'ল: যদি কোনও নতুন বিকাশকারী ফাইলগুলিতে আসে, তারা কি কয়েক ঘন্টা ধরে মাথা আঁচড়ে বসে থাকত, বা তারা সম্ভবত কী কী কাজগুলি বুঝতে পারে এবং কেবল গবেষণার জন্য (যা অপরিবর্তনীয়) কিছুটা সময় প্রয়োজন?

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

Comments

মাপের চিত্র আমি মধ্যে ডিবেটিং করছি জন্য অস্পষ্টতা মুছে ফেলার জন্য site-logo-150w-150h.png, site-logo-w150x150h.pngঅথবা site-logo-150w150h.pngচিন্তা -

— ড্যানিয়েল সোকলোভস্কি

Answer 8

এটি একটি পুরানো প্রশ্ন, তবে এখনও বৈধ।

আমার বর্তমান সুপারিশটি এই লাইনে কিছু নিয়ে যেতে হবে:

• সম্পদ (বা সম্পদ-ওয়েব বা সম্পদ-www); এই এক ক্লায়েন্ট (ব্রাউজার) দ্বারা ব্যবহৃত স্থির সামগ্রী জন্য
  • তথ্য; কিছু এক্সএমএল ফাইল এবং অন্যান্য স্টাফ
  • হরফ
  • ইমেজ
  • মিডিয়া
  • শৈলী
  • স্ক্রিপ্ট
  • lib (বা তৃতীয় পক্ষ); এইটি কোডটি আপনি তৈরি বা সংশোধন করবেন না, লাইব্রেরিগুলি যেমন আপনি পাবেন তেমন উদ্দেশ্যে is
  • lib-modded (বা তৃতীয় পক্ষ-পরিবর্তিত); এই কোডটি কোডটির উদ্দেশ্যে তৈরি করা হয়েছিল যা আপনি সংশোধন করবেন বলে আশা করা হয়নি, তবে লাইব্রেরি সরবরাহকারী এটি প্রকাশের মধ্যে কোনও কাজের সমাধান / ফিক্স প্রয়োগ করার মতো ছিল
• ইনক (বা সম্পদ-সার্ভার বা সম্পদ-স্থানীয়); এই একটি কনটেন্ট ব্যবহৃত সার্ভার সাইডের জন্য, ক্লায়েন্টের দ্বারা ব্যবহার না করার জন্য, যেমন পিএইচপি বা সার্ভার স্ক্রিপ্টগুলির মতো ভাষার লাইব্রেরির মতো, যেমন বাশ ফাইলগুলি
  • হরফ
  • lib
  • lib-modded

আমি সাধারণকে গা bold়ভাবে চিহ্নিত করেছি, অন্যরা স্বাভাবিক সামগ্রী নয়।

মূল বিভাগের কারণ, ভবিষ্যতে আপনি কোনও সিডিএন থেকে ওয়েব সম্পদগুলি সার্ভার করার সিদ্ধান্ত নিতে পারেন বা সুরক্ষার কারণে, সার্ভারের সম্পদে ক্লায়েন্টের অ্যাক্সেসকে সীমাবদ্ধ করতে পারেন।

উদাহরণস্বরূপ, লাইব্রেরিগুলি সম্পর্কে বর্ণনামূলক হিসাবে ব্যবহার করা lib ডিরেক্টরিগুলির অভ্যন্তরে

• lib
  • jquery.com
    • jQuery
      • vX.YZ
  • গিথুব
    • [পথ]
      • [গ্রন্থাগার / প্রকল্পের নাম]
        • ভিএক্স.ওয়াইজেড (সংস্করণ)

সুতরাং আপনি কোডটি না ভেঙে, লাইব্রেরিটি একটি নতুন দিয়ে প্রতিস্থাপন করতে পারেন, নিজের সহ ভবিষ্যতের কোড রক্ষণাবেক্ষণকারীদেরও লাইব্রেরিটি খুঁজে পেতে এবং আপডেট করতে বা সমর্থন পেতে অনুমতি দেয়।

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

পার্শ্ব নোট হিসাবে, সম্পদের নামটি অর্থবহ, কেবলমাত্র সেখানে আমাদের সংস্থান আছে অর্থাত্ নয়, তবে অর্থ হল সেখানে সংস্থানগুলি অবশ্যই প্রকল্পের জন্য মূল্যবান হতে হবে এবং মৃত ওজন নয় not

Comments

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

— পাবলো-ন

Answer 9

বিবিসির ওয়েব উন্নয়নের সাথে সম্পর্কিত প্রচুর মান রয়েছে।

সিএসএস ফাইলগুলির জন্য তাদের মান মোটামুটি সহজ:

http://www.bbc.co.uk/guidlines/futuremedia/technical/css.shtml

আপনি তাদের প্রধান সাইটে দরকারী কিছু খুঁজে পেতে সক্ষম হতে পারে:

http://www.bbc.co.uk/ গাইডলাইনস / ফিউচারমিডিয়া /