Anonim

यदि आपने बूटस्ट्रैप के बारे में कभी नहीं सुना है, तो सुंदर वेबसाइटों को बनाने के लिए ट्विटर द्वारा विकसित एक रूपरेखा, आप याद कर रहे हैं! बूटस्ट्रैप सीएसएस (कैस्केडिंग स्टाइल शीट्स) में बहुत अधिक ज्ञान के बिना एक वेबसाइट डिजाइन करने के लिए काफी त्वरित और आसान बनाता है। यदि आप वेब के लिए प्रोग्रामिंग में नए हैं, तो आपको यह जानने के लिए सीएसएस के बारे में एक बात जानने की जरूरत नहीं है कि बूटस्ट्रैप कैसे काम करता है; आप सभी की आवश्यकता होगी एक एकल HTML दस्तावेज़ है। हम बूटस्ट्रैप पर एक नज़र डालने जा रहे हैं, आपको दिखाते हैं कि यह सब क्या है, यह कैसे काम करता है, और यदि यह आपके द्वारा बनाई गई प्रत्येक वेबसाइट के लिए एक अच्छा विकल्प है।

आपकी HTML फ़ाइल में बूटस्ट्रैप एपीआई सम्मिलित करना

आपके पास अपनी मुख्य परियोजना फ़ाइल में बूटस्ट्रैप डालने के लिए कुछ विकल्प हैं। पहला विकल्प यह है कि आप अपनी परियोजना में सभी आवश्यक बूटस्ट्रैप फ़ाइलों को सम्मिलित करें। आप पैकेज डाउनलोड करके और इसे अपने प्रोजेक्ट फ़ोल्डर में अपलोड करके कर सकते हैं। आप निश्चित रूप से, प्राथमिक बूटस्ट्रैप CSS फ़ाइल को अपने दस्तावेज़ से जोड़ना होगा। बूटस्ट्रैप की आधिकारिक वेबसाइट पर चरण-दर-चरण मार्गदर्शिका है कि यह कैसे करना है।

अन्य विकल्प पैकेज डाउनलोड करना छोड़ना और सामग्री वितरण नेटवर्क (सीडीएन) का उपयोग करना है। एक सीडीएन आपको प्राथमिक बूटस्ट्रैप फ़ाइलों को कभी भी डाउनलोड किए बिना अपने HTML दस्तावेज़ से लिंक करने की अनुमति देता है। यह, निश्चित रूप से, पेशेवर वेबसाइटों के लिए हमेशा अच्छी बात नहीं होती है, क्योंकि मैं अपने व्यवसाय या पोर्टफोलियो पेज को भाग्य के लिए छोड़ने के लिए बहुत जल्दी नहीं होगा यदि उस सर्वर को कभी भी नीचे जाना था। आपके प्रोजेक्ट में फ़ाइलों का होना सबसे अच्छा है, लेकिन सीखने के उद्देश्य के लिए, सीडीएन ठीक काम करेगा।

अपने HTML डॉक्यूमेंट में बूटस्ट्रैप डालने के लिए, आपको बस निम्नलिखित कोड को अंदर डालना होगा आपके HTML दस्तावेज़ में टैग:

एक बार उन लिंक को उस हेड टैग में डालने के बाद, आपको बूटस्ट्रैप कक्षाओं का उपयोग शुरू करने के लिए बिल्कुल तैयार होना चाहिए। आपके दस्तावेज़ को कुछ इस तरह दिखना चाहिए:

बूटस्ट्रैप और कक्षाएं

बूटस्ट्रैप तत्व कक्षाओं में टूट गए हैं, जो पूर्व-लिखित सीएसएस का एक गुच्छा है जिसे आप अपने मार्कअप में सम्मिलित कर सकते हैं। अपने मार्कअप में कक्षाओं को सम्मिलित करना आसान है, आपको बस उस वर्ग का नाम पता होना चाहिए जिसे आप उपयोग करना चाहते हैं और फिर कक्षा = "क्लासनाम" मान का उपयोग करके अपने HTML तत्वों में से एक पर लागू करें, जैसा कि पिछले लेख में चर्चा की गई है।

मुश्किल हिस्सा यह पता लगा रहा है कि कैसे सब कुछ सुंदर बनाने के लिए एक साथ काम करता है। आप आधिकारिक दस्तावेज़ से सीधे बूटस्ट्रैप में उपलब्ध सभी विभिन्न वर्गों की जांच कर सकते हैं। अब, बूटस्ट्रैप में महारत हासिल करना एक और कहानी है। यह कोई ऐसी चीज नहीं है जिसे हम या कोई और आपको सिखा सकता है। आप ट्यूटोरियल को ट्यूटोरियल के बाद देख सकते हैं, लेकिन फ्रेमवर्क का उपयोग करने में अच्छा पाने के लिए, यह बहुत परीक्षण और त्रुटि के साथ आता है। और, इसके लिए आपको अपने स्वयं के प्रोजेक्ट्स में हाथ मिलाना पड़ता है।

इसे ध्यान में रखते हुए, मैं आपको एटम या कुछ अन्य टेक्स्ट एडिटर का उपयोग करके अपने कंप्यूटर पर अपनी खुद की HTML परियोजना शुरू करने के लिए बाध्य करता हूं, समीक्षा करें कि HTML और CSS कक्षाएं सभी के बारे में क्या हैं, और फिर बूटस्ट्रैप के साथ खेलना शुरू करें। और यदि आप पर्याप्त मार्कअप जानते हैं, तो शायद परीक्षण अभ्यास के रूप में अपनी खुद की पोर्टफोलियो वेबसाइट भी बनाएं।

क्या बूटस्ट्रैप हर वेबसाइट के लिए एक व्यवहार्य विकल्प है?

बूटस्ट्रैप एक महान रूपरेखा है, लेकिन क्या यह आपके द्वारा बनाई गई प्रत्येक वेबसाइट के लिए एक व्यवहार्य विकल्प है? यह वास्तव में डेवलपर के साथ-साथ परियोजना की आवश्यकताओं पर निर्भर करता है। कई पेशेवर परिवेशों में, आपके पास वास्तव में इस बात का विकल्प नहीं होगा कि आप किन तकनीकों का उपयोग कर रहे हैं, क्योंकि यह काफी हद तक परियोजना प्रबंधक तक होगा। यदि प्रोजेक्ट मैनेजर बूटस्ट्रैप का उपयोग करने का विकल्प चुनता है, तो आप इसे कस्टम सीएसएस के एक टन के साथ भी जोड़ सकते हैं। यह वही है जो आमतौर पर आपकी वेबसाइट को अद्वितीय बनाता है और बूटस्ट्रैप का उपयोग करने वाली अन्य वेबसाइटों से अलग है।

मैं, व्यक्तिगत रूप से, बूटस्ट्रैप को हर वेबसाइट के लिए एक बेहतरीन विकल्प के रूप में नहीं देखता। निश्चित रूप से, यह कुछ शॉर्टकटों को मदद और प्रदान कर सकता है, लेकिन मैंने अंततः पाया है कि सीएसएस के साथ ग्राउंड-अप से डिजाइनिंग बड़े पैमाने पर सबसे अच्छा मार्ग है क्योंकि आपके पास इस पर नियंत्रण है। लेकिन एक बार फिर, यदि आप अभी वेब प्रोग्रामिंग में शुरुआत कर रहे हैं, तो बूटस्ट्रैप का उपयोग करना कोई बुरी बात नहीं है, लेकिन अपने करियर के लिए इस पर भरोसा न करें।

यह ध्यान देने योग्य है कि यदि आप एक शुरुआती डेवलपर हैं, तो आपको अपने पोर्टफोलियो की सभी परियोजनाओं के लिए बूटस्ट्रैप का उपयोग नहीं करना चाहिए। यह सामने आ सकता है कि आप एपीआई के साथ कुशल हो सकते हैं, लेकिन आप पूरी तरह से सीएसएस के आसपास अपना रास्ता नहीं जानते हैं। उस ने कहा, आपके पोर्टफोलियो पर (या विशेष रूप से CSS, दोनों का एक अच्छा मिश्रण होना अच्छा है, क्योंकि बूटस्ट्रैप पिक करना आसान है)।

समापन

बस यही बूटस्ट्रैप संक्षेप में है। जैसा कि मैंने पहले उल्लेख किया है, मैं आपको अपना स्वयं का HTML प्रोजेक्ट शुरू करने के लिए प्रोत्साहित करता हूं और कुछ अलग-अलग वर्गों को तत्वों के साथ जोड़कर फ्रेमवर्क के साथ खेलना शुरू कर सकता हूं। आप बूटस्ट्रैप के सभी विभिन्न घटकों को यहां स्पष्टीकरण और कोड उदाहरणों के साथ पा सकते हैं।

बूटस्ट्रैप वास्तव में एक साफ-सुथरा उपकरण है, लेकिन याद रखें कि इस पर अकेले भरोसा न करें! इसके साथ परिचित होना अच्छा है और फ्रेमवर्क के आसपास अपना रास्ता पता है, लेकिन यह भी सुनिश्चित करें कि आप सीएसएस में गोता लगाने के लिए सही मायने में समझते हैं कि पीछे क्या हो रहा है। इतना ही नहीं, लेकिन CSS तारीफों में एक दृढ़ ज्ञान बूटस्ट्रैप बहुत कुछ है, जो आपको वास्तव में अपने स्वयं के अनुकूलन के साथ कुछ अद्वितीय और सुंदर वेबसाइट बनाने की अनुमति देता है।

सुंदर वेबसाइट बनाने के लिए आप बूटस्ट्रैप का उपयोग कैसे कर सकते हैं