फ्रंटएंड डेवलपर: HTML/CSS/जावास्क्रिप्ट पर वेबसाइटें - पाठ्यक्रम 18,000 रूबल। बच्चों के लिए प्रोग्रामिंग के कोडी स्कूल से, प्रशिक्षण 3 मॉड्यूल (महीने)

अनेक वस्तुओं का संग्रह / by admin / December 03, 2023

click fraud protection

उम्र: 11-14 साल

स्तर: शुरुआती लोगों के लिए.

अवधि: 3 मॉड्यूल (महीने) से, 24 घंटे* से।

प्रारूप: व्यक्तिगत और समूह पाठ, ऑफ़लाइन और ऑनलाइन (वास्तविक समय)।

बच्चों की संख्या: 1 से 8 तक.

कीमत:

एक ऑनलाइन समूह में 750 रूबल/घंटा से,
ऑफ़लाइन समूह में 850 रूबल/घंटा से,
1050 रूबल/घंटा से व्यक्तिगत रूप से ऑनलाइन,
1980 रूबल/घंटा से व्यक्तिगत रूप से ऑफ़लाइन।

आधुनिक दुनिया में, कोई भी गंभीर कंपनी अपनी वेबसाइट हासिल करने का प्रयास करती है, क्योंकि यह एक तरह की वेबसाइट है इंटरनेट पर "बिजनेस कार्ड", जिसके बिना व्यापार करना पहले से ही पुराना, तुच्छ और बेकार लगता है निराशाजनक।

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

instagram viewer

वेबमास्टरिंग क्या है और वेबमास्टर कैसे बनें?

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

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

वेबमास्टर बनने के लिए आपको किन ज्ञान और तकनीकों में महारत हासिल करनी होगी?

वेबमास्टर बनने से पहले, आपको कई तकनीकों, कार्यक्रमों और प्रणालियों से परिचित होना और उनका अध्ययन करना होगा। यहां मुख्य कदम हैं जो आपके भविष्य के पेशे की नींव रखेंगे:
1. HTML सीखना - हाइपर टेक्स्ट मार्कअप लैंग्वेज।
एक बार जब आप HTML सीखना शुरू कर देंगे, तो आप वेब दस्तावेज़ की संरचना को समझ जाएंगे और सरल वेबसाइट बनाना सीख जाएंगे।

2. सीएसएस सीखना - वेब पेज प्रदर्शन शैली भाषा। दस्तावेज़ में सीएसएस शैलियों की शुरूआत के लिए धन्यवाद, साइट अपना स्वयं का स्वाद और अद्वितीय स्वरूप प्राप्त करती है। आप वेब पेज पर रंग, आकार, पृष्ठभूमि और बहुत कुछ सेट कर सकते हैं।

3. सीएमएस का परिचय - सामग्री प्रबंधन प्रणाली या साइट का "इंजन"।

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

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

6. डेटाबेस के साथ कार्य करना.

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

शैक्षिक प्रक्रिया के दौरान निम्नलिखित विषयों का अध्ययन किया जाएगा:

1. हाइपरटेक्स्ट मार्कअप लैंग्वेज (HTML) और कैस्केडिंग स्टाइल शीट्स (CSS) की मूल बातें

2. आधुनिक वेबसाइटों का लेआउट

3. वेब पेज स्टाइलिंग की विशेषताओं का गहन अध्ययन

4. Adobe Photoshop के साथ काम करने की मूल बातें और वेबसाइट डिज़ाइन लेआउट के साथ काम करना

प्रारंभिक चरण में, हम वेब इंटरफ़ेस डेवलपर के पेशे की मूल बातें से परिचित होंगे और नियमों का अध्ययन करेंगे वेबसाइटों की संरचना और तर्क का निर्माण, व्यावहारिक प्रोग्रामिंग कौशल प्राप्त करना वेब इंटरफ़ेस. प्रत्येक छात्र HTML और CSS कोड लिखने की मूल बातें सीखेगा।

इस विषय के पूरा होने पर, आपका बच्चा अपनी खुद की आधुनिक वेबसाइट बनाएगा।

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

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

पाठ्यक्रम के अंत में, मैं और मेरे छात्र नवीनतम वेब प्रोग्रामिंग टूल का उपयोग करके तैयार डिज़ाइन लेआउट का उपयोग करके एक वेबसाइट बनाएंगे और अपने काम के परिणाम को इंटरनेट पर प्रकाशित करेंगे।

एला टी.

पाठ्यक्रम

पाठ्यक्रम शिक्षक:
"माइनक्राफ्ट: आर्टिफिशियल इंटेलिजेंस का परिचय", "यूनिटी 3डी", "फ्रंटएंड डेवलपर: एचटीएमएल/सीएसएस/जावास्क्रिप्ट वेबसाइट्स", "एनीमे स्टाइल में ड्राइंग", "छोटों के लिए प्रोग्रामिंग", "माइनक्राफ्ट प्रोग्रामिंग", "डिज़ाइन सोच", "पायथन में बॉट्स", "फ़ोटोशॉप ग्राफिक डिज़ाइन", "वीडियोब्लॉगिन"

शिक्षा:

अंतर्राष्ट्रीय कंपनियों में आईटी कौशल में सुधार के लिए कई पाठ्यक्रम (चैटबॉट हैकथॉन, कृत्रिम बुद्धिमत्ता के क्षेत्र में प्रोटोटाइप, आईटी वास्तुकला, आदि)। हेइलब्रॉन विश्वविद्यालय, हेइलब्रॉन, जर्मनी (बिजनेस एडमिनिस्ट्रेशन के मास्टर)। बेलारूसी राज्य आर्थिक विश्वविद्यालय, मिन्स्क, बेलारूस (बिजनेस एडमिनिस्ट्रेशन के मास्टर)।

अनुभव:

वह कानूनी प्रणालियों, ऑडिट समाधानों के लिए प्रणालियों और प्रक्रिया स्वचालन के लिए ग्राहक परामर्श में लगे हुए हैं, आईटी के नवोन्मेषी क्षेत्र में काम करते हैं और जर्मनी में एक अंतरराष्ट्रीय कंपनी में स्टार्ट-अप हैं।

रूचियाँ:

व्यक्तिगत विकास, ज्ञान साझा करने का जुनून, नेटवर्कर, विश्व सलामी बल्लेबाज, जीवन डिजाइनर, खेल कार्यकर्ता।

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

सेर्गेई टी.

पाठ्यक्रम

शिक्षा:

अंतरराष्ट्रीय कंपनियों (एसएपी, प्रोसेस ऑटोमेशन, ई-कॉमर्स) में आईटी कौशल में सुधार के लिए कई पाठ्यक्रम। एफओएम यूनिवर्सिटी ऑफ स्टटगार्ट, स्टटगार्ट, जर्मनी (मास्टर ऑफ बिजनेस एडमिनिस्ट्रेशन) कारागांडा स्टेट टेक्निकल यूनिवर्सिटी, कारागांडा, कजाकिस्तान।

अनुभव:

जर्मनी में एक सफल ऑनलाइन इलेक्ट्रिकल स्टोर के संस्थापक, ग्राहक परामर्श में लगे हुए बिक्री प्रक्रियाओं के स्वचालन का क्षेत्र, अंतरराष्ट्रीय स्तर पर जर्मनी में आईटी बिक्री के क्षेत्र में काम करता है कंपनियां.

रूचियाँ:

यात्रा, मछली पकड़ना, खेल, शतरंज।

आई. गोएथे ने कहा: "आप केवल वही सीख सकते हैं जो आपको पसंद है"

पहला मॉड्यूल

पहला दिन

वेब पेज लेआउट मूल बातें

HTML दस्तावेज़ संरचना
HTML मार्कअप भाषा का उपयोग करने वाला पहला वेब पेज
उदात्त पाठ 3 संपादक का परिचय

पाठ का परिणाम: पहला वेब पेज बनाया, टैग का उपयोग करके टेक्स्ट को चिह्नित करने के बुनियादी तरीके सीखे।
व्यावहारिक कार्य: HTML मार्कअप भाषा का उपयोग करके एक वेब पेज बनाएं।

दूसरा दिन

Div तत्व और टैग विशेषताएँ

वेब इंस्पेक्टर के साथ काम करना
एक बहु-पृष्ठ वेबसाइट बनाना
नए टैग तत्व और विशेषताएँ सीखना

पाठ का परिणाम: साइट पर लिंक और चित्र जोड़ना सीखा, टैग में विशेषताएँ जोड़ीं
व्यावहारिक कार्य: अपनी पहली बहु-पृष्ठ वेबसाइट बनाएं।

तीसरा दिन

व्यापक शैली पत्रक

कैस्केडिंग स्टाइल शीट्स का परिचय
HTML तत्वों को स्टाइल करना
चयनकर्ताओं का उपयोग करना
एम्मेट प्लगइन को इंस्टॉल करना और उसके साथ काम करना और लोरेम टेक्स्ट जोड़ना

पाठ का परिणाम: HTML तत्वों की पृष्ठभूमि का रंग और टेक्स्ट का रंग बदलना, दो प्रकार के चयनकर्ताओं का उपयोग करना, एम्मेट प्लगइन का उपयोग करके लोरेम टेक्स्ट बनाना सीखा।
व्यावहारिक कार्य: CSS गुणों का उपयोग करके पृष्ठ का स्वरूप बदलें।

चौथा दिन

जगुआर वेबसाइट निर्माण

एक बहु-पृष्ठ जगुआर वेबसाइट का निर्माण
एक प्रोजेक्ट फ़ाइल संरचना बनाना
तत्वों की पैडिंग और पैडिंग के साथ कार्य करना

पाठ का परिणाम: बाहरी सीएसएस फ़ाइल के साथ काम करना सीखा, तत्वों की बाहरी और आंतरिक पैडिंग से परिचित हुआ।
व्यावहारिक कार्य: एक बहु-पृष्ठ जगुआर वेबसाइट बनाएं।

दूसरा मॉड्यूल

पहला दिन

सीएसएस में बॉक्स मॉडल

सीएसएस में बॉक्स मॉडल
असामान्य आकार के ब्लॉक बनाना
किसी तत्व की चौड़ाई और ऊंचाई की गणना करने के तरीके को बदलने के लिए बॉक्स-साइज़िंग प्रॉपर्टी के साथ काम करना

पाठ का परिणाम: असामान्य आकृतियों के ब्लॉक बनाना सीखा, किसी तत्व की चौड़ाई की सही गणना करने के लिए बॉर्डर-बॉक्स मान के साथ बॉक्स-आकार की संपत्ति का उपयोग करना और माप की विभिन्न इकाइयों में तत्वों के आकार निर्धारित करना सीखा।
व्यावहारिक कार्य: विभिन्न बॉक्स-आकार वाले गुण मानों का उपयोग करके टेक्स्ट वाले कार्ड बनाएं।

दूसरा दिन

सीएसएस में उन्नत पाठ हेरफेर

विभिन्न प्रकार के फ़ॉन्ट
वेबसाइटों के लिए फ़ॉन्ट चुनना
नई शैलियाँ बनाना जो आपको पाठ प्रदर्शन को उन्नत स्तर पर अनुकूलित करने की अनुमति देती हैं

पाठ का परिणाम: विभिन्न प्रकार के फ़ॉन्ट का उपयोग करके एक पेज बनाया, पारित गुणों का उपयोग करके पाठ की उपस्थिति और पठनीयता में सुधार किया।
व्यावहारिक कार्य: बुनियादी फ़ॉन्ट प्रकारों का उपयोग करके एक पेज बनाएं।

तीसरा दिन

सीएसएस में पोजिशनिंग तत्व

फ्लोट प्रॉपर्टी के साथ काम करना
पृष्ठ पर तत्वों की स्थिति के प्रकार
स्थिति संपत्ति

पाठ का परिणाम: फ़्लोट और स्थिति गुणों के साथ काम करना, छवियों के चारों ओर टेक्स्ट रैपिंग बनाना सीखा
व्यावहारिक कार्य: एक वेब पेज बनाएं और फ़्लोट और स्थिति गुणों का उपयोग करके उस पर तत्व रखें

चौथा दिन

एक ब्लॉग पेज बनाना

एक ब्लॉग पेज बनाना
पृष्ठ पर मेनू और पोस्ट रखने के लिए तत्व स्थिति निर्धारण गुण
सिमेंटिक टैग

पाठ का परिणाम: पोजिशनिंग गुणों का उपयोग करके सिमेंटिक टैग के साथ काम करना सीखा, ब्लॉग के मुख्य घटकों को पेज पर रखा
व्यावहारिक कार्य: सिमेंटिक टैग का उपयोग करके एक ब्लॉग पेज बनाएं

तीसरा मॉड्यूल

पहला दिन

छद्म-वर्ग और सीएसएस में छवियों के साथ काम करना

किसी वेब पेज पर पृष्ठभूमि छवियों का उपयोग करना
छद्म वर्ग मंडराते हैं, सक्रिय होते हैं और देखे जाते हैं
किसी अन्य तत्व पर छद्म वर्ग को सक्रिय करते समय एक तत्व की शैली बदलना
पृष्ठभूमि पैटर्न बनाना

पाठ का परिणाम: पृष्ठभूमि छवियों के साथ काम करना सीखा, छवियों के साथ काम करने के लिए गुणों का अध्ययन किया
व्यावहारिक कार्य: जब आप माउस कर्सर से तत्वों पर होवर करते हैं तो उनमें बाहरी परिवर्तन जोड़ें।

दूसरा दिन

सीएसएस में फ्लेक्सबॉक्स

सीएसएस फ्लेक्सिबल बॉक्स लेआउट के साथ कार्य करना
फ्लेक्स कंटेनर में तत्वों को संरेखित करने के लिए गुण
फ्लेक्स-मेंढक शैक्षिक खेल

पाठ का परिणाम: लचीले लेआउट बनाने के लिए फ्लेक्स तकनीक के साथ काम करना सीखा, कवर की गई सामग्री को समेकित करने के लिए फ्लेक्स-फ्रॉग गेम पूरा किया
व्यावहारिक कार्य: कवर की गई सामग्री को समेकित करने के लिए फ्लेक्स-फ्रॉग गेम को पूरा करें

तीसरा दिन

स्नीकर्स शॉप वेबसाइट का विकास। भाग पहला

मॉडलों के साथ एक साइट संरचना बनाना
किसी फ़ॉन्ट साइट से कनेक्ट हो रहा है
साइट हेडर और उसके चाइल्ड तत्वों के गुण
ग्रेडिएंट पेज पृष्ठभूमि बनाने के लिए कार्य

पाठ का परिणाम: मॉडलों के साथ एक साइट संरचना बनाई, फ़ॉन्ट को साइट से जोड़ा।
व्यावहारिक कार्य: मॉडलों के साथ चित्र चुनें और डाउनलोड करें, साइट हेडर में एक छाया जोड़ें

चौथा दिन

स्नीकर्स शॉप वेबसाइट का विकास। भाग 2

साइट पर काम पूरा करना
कार्डों से एक ब्लॉक बनाना
तत्वों पर मँडराते समय उनका व्यवहार बदलना
कार्ड पोजीशनिंग के लिए फ्लेक्सबॉक्स तकनीक

पाठ का परिणाम: मॉडल कार्ड के साथ एक वेबसाइट बनाई
व्यावहारिक कार्य: FlexBo तकनीक का उपयोग करके एक गैलरी जोड़ें

चौथा मॉड्यूल

पहला दिन

सीएसएस में ग्रिड लेआउट

ग्रिड प्रणाली का परिचय
ग्रिड का उपयोग करके एक पेज बनाना
ग्रिड कोशिकाओं के साथ उन्नत कार्य के लिए गुण

पाठ का परिणाम: द्वि-आयामी लेआउट प्रणाली (सीएसएस ग्रिड लेआउट) का अध्ययन किया, सीखा कि पृष्ठ पर ग्रिड कोशिकाओं को कैसे रखा जाए।
व्यावहारिक कार्य: कवर की गई सामग्री को समेकित करने के लिए ग्रिड गार्डन गेम को पूरा करें।

दूसरा दिन

छद्म तत्व बाद और पहले

पहले और बाद में छद्म तत्व
किसी चित्र को अंदर के पाठ के साथ संयोजित करना
प्रथम-अक्षर और प्रथम-पंक्ति छद्म-तत्व वाले तत्व

पाठ का परिणाम: पहले, बाद, पहले अक्षर और पहली पंक्ति में छद्म तत्वों के साथ काम करना सीखा, सुंदर ब्लॉक बनाने के लिए विभिन्न गुणों के साथ छद्म तत्वों को संयोजित किया
व्यावहारिक कार्य: बाद और पहले छद्म तत्वों का उपयोग करके एक तत्व बनाएं।

तीसरा दिन

सीएसएस में एनिमेशन और परिवर्तन

सीएसएस परिवर्तन
HTML तत्वों में परिवर्तन लागू करना
सीएसएस में एनिमेटेड ब्लॉक बनाना
कीफ़्रेम पर टाइमिंग फ़ंक्शंस लागू करना

पाठ का परिणाम: सीएसएस में परिवर्तनों के साथ काम करना, सीएसएस में अंतहीन एनिमेशन बनाना सीखा।
व्यावहारिक कार्य: एक बटन बनाएं, होवर होने पर उसमें परिवर्तन जोड़ें।

चौथा दिन

सीएसएस में एनिमेशन बनाने का अभ्यास करें

एनीमेशन का अनुप्रयोग और व्यवहार में परिवर्तन
हमारे सौर मंडल में ग्रहों की एक एनिमेटेड कक्षीय प्रणाली बनाना

पाठ का परिणाम: सौर मंडल में ग्रहों की गति और एक एनिमेटेड पृष्ठभूमि को प्रदर्शित करने वाला एक पेज बनाया।
व्यावहारिक कार्य: हमारे सौर मंडल में ग्रहों की एक एनिमेटेड कक्षीय प्रणाली बनाएं।

5वां मॉड्यूल

पहला दिन

एक ऑनलाइन स्टोर का निर्माण

ऑनलाइन स्टोर क्या है?
एक परियोजना संरचना बनाना
प्रोजेक्ट सेटअप

पाठ का परिणाम: एक ऑनलाइन स्टोर बनाना शुरू किया।
व्यावहारिक कार्य: साइट पर उपयोग किए जाने वाले आइकन का चयन करें।

दूसरा दिन

एक ऑनलाइन स्टोर हेडर बनाना

सीएसएस में वेरिएबल्स और उनका उपयोग कैसे करें
यूआरएल फ़ंक्शन का उपयोग करके फ़ॉन्ट को बाहरी स्टाइलशीट से कनेक्ट करना
ऑनलाइन स्टोर हेडर, इसकी शैली
जावास्क्रिप्ट प्रोग्रामिंग भाषा का उपयोग करके अतिरिक्त मेनू कार्यक्षमता जोड़ना

पाठ का परिणाम: प्रोजेक्ट में वैश्विक चर कॉन्फ़िगर किए गए, एक मेनू के साथ एक बहुक्रियाशील हेडर बनाया गया, अतिरिक्त मेनू कार्यक्षमता जोड़ने के लिए एक जावास्क्रिप्ट फ़ाइल कनेक्ट की गई।
व्यावहारिक कार्य: पृष्ठ स्क्रॉल करते समय साइट हेडर की पृष्ठभूमि बदलना जोड़ें

तीसरा दिन

मुख्य उत्पाद के साथ पहली स्क्रीन बनाना

प्रेजेंटेशन ब्लॉक की HTML संरचना
तत्वों के सही प्रदर्शन के लिए ग्रिड प्रणाली
चर का उपयोग करके सीएसएस संपत्ति मान
स्टाइलिंग तत्व

पाठ का परिणाम: ऑनलाइन स्टोर का प्रेजेंटेशन भाग बनाया
व्यावहारिक कार्य: किसी ऑनलाइन स्टोर का प्रेजेंटेशन भाग बनाएं

चौथा दिन

लोकप्रिय उत्पादों के साथ एक ब्लॉक बनाना

उत्पादों वाले ब्लॉक के लिए HTML मार्कअप
उत्पाद कार्ड के लिए स्टाइलिंग
कार्ड पोजीशनिंग के लिए ग्रिड ग्रिड
कंपनी के इतिहास के साथ एक ब्लॉक का स्टाइलीकरण

पाठ का परिणाम: लोकप्रिय उत्पादों और कंपनी के इतिहास के साथ एक ब्लॉक बनाया
व्यावहारिक कार्य: कंपनी के इतिहास के साथ ब्लॉक में तत्वों में बाहरी और आंतरिक पैडिंग जोड़ें

छठा मॉड्यूल

पहला दिन

ग्राहक समीक्षाओं के साथ एक स्लाइडर बनाना।

समीक्षा ब्लॉक
सीएसएस में स्क्रॉल करने योग्य कंटेनर बनाने के तरीके
स्क्रॉल-व्यवहार और स्क्रॉल-स्नैप-प्रकार गुण
स्लाइडर एंकर पॉइंट

पाठ का परिणाम: HTML और CSS का उपयोग करके ग्राहक समीक्षाओं के साथ एक स्लाइडर बनाया।

व्यावहारिक कार्य: साइट के मुख्य अनुभागों में एंकर पॉइंट जोड़ें और जब आप बटन पर क्लिक करें तो इन ब्लॉकों पर एक स्वचालित स्क्रॉल बनाएं।

दूसरा दिन

प्रपत्रों और वीडियो सामग्री के साथ कार्य करना।

किसी वेबसाइट में वीडियो सामग्री डालने के लिए HTML5 टैग
फ़ुल-स्क्रीन वीडियो क्लिप के साथ एक अनुभाग को स्टाइल करना
इनपुट फ़ील्ड टैग - और इसकी विशेषताएँ
HTML में फॉर्म बनाने के लिए टैग
टेक्स्ट इनपुट तत्व को स्टाइल करना

पाठ का परिणाम: एक वीडियो के साथ एक अनुभाग और एक फीडबैक फॉर्म के साथ एक ब्लॉक बनाया

व्यावहारिक कार्य: एक फीडबैक फॉर्म बनाएं, तत्वों को स्टाइल करें

तीसरा दिन

एक अलग गैलरी पेज बनाना

गैलरी पृष्ठ के लिए कस्टम ग्रिड ग्रिड
ग्रिड में छवियों के साथ ब्लॉक जोड़ना
छवियों के साथ छद्म तत्व और ब्लॉक के विभिन्न एनिमेशन
गैलरी विज़ुअल डिज़ाइन को बेहतर बनाने के लिए सीएसएस फ़िल्टर

पाठ का परिणाम: फोटो गैलरी के साथ एक अलग पेज बनाया

व्यावहारिक कार्य: पारभासी असामान्य पृष्ठभूमि बनाने के लिए विभिन्न प्रकार की स्थिति का उपयोग करना।

चौथा दिन

सभी प्रकार के उपकरणों के लिए सामग्री का अनुकूलन।

मोबाइल उपकरणों के लिए सामग्री को अनुकूलित करने के तरीके
अलग-अलग चौड़ाई वाले उपकरणों पर एक ही तत्व में अलग-अलग गुण लागू करने के लिए मीडिया क्वेरीज़
तीन प्रकार के उपकरणों के लिए सीएसएस नियम

पाठ का परिणाम: हमने वेबसाइट को टैबलेट और फ़ोन के लिए अनुकूलित किया है।

व्यावहारिक कार्य: मीडिया प्रश्नों का उपयोग करके, सभी प्रकार के उपकरणों के लिए सामग्री को अनुकूलित करने के लिए HTML तत्वों के गुण मूल्यों को बदलें

सातवाँ मॉड्यूल

पहला दिन

टेलविंड एसएस ढांचे का परिचय।

फ़्रेमवर्क क्या हैं और वे परियोजना विकास प्रक्रिया को कैसे तेज़ करते हैं?
टेलविंड सीएसएस फ्रेमवर्क और प्लगइन्स इंस्टॉल करना
टेलविंड सीएसएस फ्रेमवर्क अवधारणाएँ
टेलविंड सीएसएस में टाइपोग्राफी और रंगों के साथ काम करना

पाठ का परिणाम: टेलविंड सीएसएस फ्रेमवर्क का उपयोग करके पहला वेब पेज बनाया।
व्यावहारिक कार्य: टेलविंड कक्षाओं का उपयोग करके टेक्स्ट, शैली तत्वों के साथ एक ब्लॉक बनाएं।

दूसरा दिन

एक प्रतिक्रियाशील वेबसाइट बनाने के लिए टेलविंड कक्षाएं

एक प्रतिक्रियाशील वेबसाइट बनाने के लिए टेलविंड कक्षाओं के साथ काम करना
होवर और फोकस प्रभाव जोड़ने के लिए कक्षाएं
तत्वों में छाया जोड़ने की कक्षाएं
तत्व आकार के साथ काम करने के लिए कक्षाएं
तत्वों की बाहरी और आंतरिक पैडिंग के साथ काम करने के लिए कक्षाएं

पाठ का परिणाम: हमने सभी प्रकार के उपकरणों के लिए एक अनुकूली पृष्ठ बनाया है।
व्यावहारिक कार्य: बटन बनाएं, टेलविंड कक्षाओं का उपयोग करके उन पर क्लिक करने पर प्रभाव जोड़ें

तीसरा दिन

टेलविंड फ्लेक्स लेआउट।

टेलविंड फ्लेक्स लेआउट के साथ कार्य करना
फ्लेक्स कंटेनर में बाल तत्वों को संरेखित करने के लिए कक्षाएं
किसी उत्पाद की कीमत के साथ एक कार्ड बनाना
प्रगति संकेतक बनाना
टेलविंड सीएसएस में छद्म तत्वों के साथ काम करना

पाठ का परिणाम: उत्पाद कार्ड के साथ एक फ्लेक्स कंटेनर बनाया
व्यावहारिक कार्य: उत्पाद के विवरण के साथ एक कार्ड बनाएं.

चौथा दिन

टेलविंड सीएसएस में ग्रिड प्रणाली।

रो-स्पैन और कोल-स्पैन गुण
तत्वों के साथ ग्रिड में रिक्त स्थान को स्वचालित रूप से भरने के लिए गुण
प्रोजेक्ट टीम पेज

पाठ का परिणाम: टेलविंड ग्रिड प्रणाली का उपयोग करके एक अनुकूली प्रोजेक्ट टीम पेज बनाया गया।
व्यावहारिक कार्य: ग्रिड तत्वों पर मँडराते समय उनमें प्रभाव जोड़ें

आठवां मॉड्यूल

पहला दिन

प्रोजेक्ट सेटअप

"प्रबंधित करें" एप्लिकेशन साइट प्रोजेक्ट की स्थापना
एक प्रतिक्रियाशील वेबसाइट हेडर बनाना
जावास्क्रिप्ट का उपयोग करके हैमबर्गर मेनू बनाना
किसी उत्पाद के साथ एक प्रस्तुतिकरण अनुभाग बनाना

पाठ का परिणाम: "प्रबंधित करें" एप्लिकेशन वेबसाइट की पहली स्क्रीन बनाई गई
व्यावहारिक कार्य: पहली स्क्रीन पर एक पृष्ठभूमि छवि जोड़ें।

दूसरा दिन

एप्लिकेशन के विवरण के साथ एक अनुभाग बनाना

एप्लिकेशन और उसके लाभों के विवरण वाला अनुभाग
सभी प्रकार के उपकरणों के लिए बनाए गए ब्लॉक को अनुकूलित करें
आवेदन संचालन के साथ अनुभाग
किसी छवि पर टेलविंड फ़िल्टर लागू करें

पाठ का परिणाम: "प्रबंधित करें" साइट के दो अनुभाग बनाए गए
व्यावहारिक कार्य: एप्लिकेशन निर्माण के इतिहास के साथ एक अतिरिक्त अनुभाग बनाएं

तीसरा दिन

प्रोजेक्ट टीम के बारे में एक अनुभाग बनाना

टीम के बारे में अनुभाग
टेलविंड सीएसएस और जावास्क्रिप्ट का उपयोग कर स्लाइडर
कर्मचारी कार्ड

पाठ का परिणाम: प्रोजेक्ट टीम के बारे में एक अनुभाग बनाया
व्यावहारिक कार्य: CTA बटन के साथ एक अनुभाग बनाएं

चौथा दिन

कीमतों के साथ एक अनुभाग बनाना

कीमतों के साथ एक अनुभाग बनाएं
एक प्रतिक्रियाशील वेबसाइट फ़ुटर बनाएं
प्रोजेक्ट ख़त्म करें

पाठ का परिणाम: प्रोजेक्ट पर काम पूरा किया, "प्रबंधित करें" एप्लिकेशन के लिए वेबसाइट बनाई
व्यावहारिक कार्य: प्रोजेक्ट को अंतिम रूप दें, साइट को इंटरनेट पर डालें

9वां मॉड्यूल

पहला दिन

अपने खुद के प्रोजेक्ट पर काम करना शुरू करें.

एक प्रोजेक्ट विषय चुनें
अपनी खुद की वेबसाइट विकसित करना शुरू करें

पाठ का परिणाम: एक विषय चुन लिया गया है और परियोजना पर काम शुरू हो गया है
व्यावहारिक कार्य: परियोजना कार्य

दूसरा दिन

प्रोजेक्ट पर काम जारी है

प्रोजेक्ट पर काम करना जारी रखें
प्रोजेक्ट में त्रुटियाँ ठीक करें

पाठ का परिणाम: वेबसाइट पेजों का निर्माण
व्यावहारिक कार्य: परियोजना कार्य

तीसरा दिन

एक प्रोजेक्ट प्रेजेंटेशन तैयार करना.

अपने प्रोजेक्ट का वर्णन करें
अपने प्रोजेक्ट का बचाव करने के लिए एक प्रेजेंटेशन टेम्पलेट बनाएं
प्रोजेक्ट ख़त्म करें
साइट को इंटरनेट पर डालें

पाठ का परिणाम: एक प्रेजेंटेशन तैयार किया और भाषण की रिहर्सल की.
व्यावहारिक कार्य: प्रोजेक्ट का प्रेजेंटेशन तैयार करें, वेबसाइट को इंटरनेट पर डालें।

चौथा दिन

परियोजना सुरक्षा.

प्रोजेक्ट प्रेजेंटेशन को अंतिम रूप दें
दर्शकों के सामने अपने प्रोजेक्ट का बचाव करें

पाठ का परिणाम: हमने पाठ्यक्रम परियोजना पर काम पूरा किया और इसे माता-पिता के सामने प्रस्तुत किया।
व्यावहारिक कार्य: प्रोजेक्ट को अंतिम रूप देना, प्रेजेंटेशन तैयार करना और संचालन करना।

टैग बादल

अनेक वस्तुओं का संग्रह

रेटिंग

दृश्य

टिप्पणियाँ