Form Design Tips in Hindi – Best Practices 2019

Form Design Tips in Hindi – Best Practices 2019

हम सभी ने कभी ना कभी किसी website पर registration का फॉर्म जरूर भरा हैं फिर चाहे वह gmail पर नया email account बनाना हो, या पासपोर्ट के लिए online form भरना हो या फिर facebook जैसे social website पर नया account बनाना हो. Registration form एक अकेला माध्यम हैं जिसके जरिये आप किसी भी website पर register या login करते हैं, इसीलिए यह बहुत जरूरी होता हैं की ऐसे website के form design करते समय हम कुछ ख़ास बातों का ध्यान रखें. यहाँ हम कुछ form design tips देखेंगे जिन्हे अगर आप अपने design में integrate करें तो अपने user को एक delightful experience दे सकते हैं.

Form Design Tips

Form को छोटा रखें

अपने users को कम से कम सवाल करें और सिर्फ जरूरी जानकारी की बारे में ही पूछें. जैसे के दिए गए पहले उदहारण में Address 1 और Address 2 जैसे field की कोई जरूरत नहीं हैं. कम सवाल पूछने से user जल्दी form भरेगा और उसे परेशानी भी नहीं होगी.
form design tips, in hindi, indiauiux

Sections को ठीक से Align करें

एक effective form design के लिए Alignment बहुत जरूरी हैं. यह आपके form के structure को professional और वह बहुत ज्यादा effective बनाता हैं. आप चाहे तो form के fields को LEFT, RIGHT या CENTER align रख सकते हैं, यह आपके design पर depend करता हैं, पर सारे alignment एक ही form डिज़ाइन में ना डाले.
form design tips, in hindi, indiauiux

coreldraw vs allustrator, indiauiux

Instant help message इस्तेमाल करें

कैसा लगेगा की जब आपने form के सारे field को भर दिया और submit करने पर सारे errors एक साथ दिखाई दे – आप frustrate (परेशान ) हो जाओगे. बेहतर यही होगा की हर mistake की error को आप immediate उसी field के नीचे दिखाए ताकि user को form भरने में आसानी हो.
form design tips, in hindi, indiauiux

Optional label का उपयोग करें

जैसे की हमने पहले देखा की आपको सिर्फ जरूरी जानकारी के field ही form में रखना चाहिए. फिर भी अगर आप “optional” field रखना चाहते हैं तो – सारे जरूरी field को “Required” या  * (asteric ) sign देने से बेहतर हैं की आप optional field के लिए “Optional” label का इस्तेमाल करें.
form design tips, in hindi, indiauiux

Primary और Secondary Actions का ध्यान रखें

नीचे दिए गए form को देखें और बताये की इस form में आप user से क्या करवाना चाहते हैं? अगर आप देखें “Login” और “Cancel ” दोनों ही बटन के आकार, कलर, और आकार एक समान हैं, क्योंकि आप दोनों को एक जैसा महत्त्व (importance) दे रहे हैं जो की गलत हैं. अगर आप चाहते हैं की user का primary action “Login” हो तो उसे prominent रखें और ज्यादा महत्त्व दे, उसी तरह से “Cancel” बटन जो की secondary action हैं, उसे छोटा रखें और कम महत्त्व दे.
login screen design, in hindi, indiauiux

Inspiring title का उपयोग करें

प्रेरणादायक (inspiring) title हमेशा से ही success हुए हैं. आपके form के title को इस तरह से लिखे जिससे की user excited हो जाये और जल्द से जल्द form भरें। साथ ही, Call to Action बटन जैसे की “Show me the 10 fonts” जैसे term का उपयोग करने से user को लगेगा की आप उन्हें बहुत ज्यादा महत्त्व (importance) दे रहे हैं और उनको काफी फायदा होने वाला हैं.
10 best design fonts

हमेशा Alternate option रखें

आप चाहते हैं user आपके website को subscribe करें या register करें पर इसके साथ आपको यह भी ध्यान में रखना हैं की आप user को force न करें। उसे Cancel करने का option भी दे. नीचे दिए गए उदहारण में अगर user को FREE COPY नहीं चाहिए तो उसे “Skip” करने का option भी दे. वही अगर user आपके website पर register नहीं होना चाहता तो उसे अपने दुसरे social profile के जरिये, जैसे की google , facebook या twitter से login करने का option भी दे.
evernote login page, in hindi, indiauiux

Matching Keypad का उपयोग करें

Form के input field के मुताबिक ही correct keypad का उपयोग करें, जैसे की अगर user को credit card number भरना हैं तो आपके form का numeric keypad दिखाई दे नाकि Alphabet keypad. इससे user का वक़्त बचेगा और वह form को जल्दी से भर सकेंगे.
amazon app design, in hindi, indiauiux
देखा गया हैं की user को हमेशा online form भरने में हिचकिचाहट होती हैं, तो यह आप जैसे designer का काम हैं की किस तरह से इस form filling process को user के सुविधा (comfort) के मुताबिक design करें और उन्हें एक बेहतर experience प्रधान करें.
आप अपने form के design कैसे बनाते हैं? अगर आपके पाद भी form design tips हैं तो comments में जरूर बताये और यह post अपने दोस्तों के साथ जरूर शेयर करें.
, , etc.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/html-kya-hai-in-hindi-indiauiux.jpg" alt="html kya hai, what is html in hindi, indiauiux" class="wp-image-1897" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/html-kya-hai-in-hindi-indiauiux.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/html-kya-hai-in-hindi-indiauiux-768x228.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> HTML पेज बनाने के लिए आप कोई भी Text Editor का इस्तेमाल कर सकते हैं जैसे की Notepad, Sublime, Brackets या Atom और फिर उसे <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">.html</span> या <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">.htm</span> extensions के साथ save कर सकते हैं. HTML के जरिये आप website के pages में images, text, audio, video, forms, tables को add कर सकते हैं. HTML की अच्छी बात यह हैं की इसे बड़ी आसानी से सीखा जा सकता हैं.</p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">CSS क्या हैं?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> CSS (Cascading Stylesheets) इस्तेमाल होता हैं HTML के साधारण pages में styles को add करने के लिए. जैसे के colours add करना, buttons के size को define करना, background images का इस्तेमाल करना, pages के margin और padding को ठीक तरीकें से position करना, animation दिखाना, etc.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/css-kya-hai-in-hindi-indiauiux.jpg" alt="css kya hai, what is css in hindi, indiauiux" class="wp-image-1898" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/css-kya-hai-in-hindi-indiauiux.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/css-kya-hai-in-hindi-indiauiux-768x228.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> CSS के जरिये आप यह भी बता सकते हैं की आपका website अलग अलग devices जैसे की desktops, mobile phones और tablet पर कैसे दिखाई देगा. CSS इस्तेमाल करके आप एक बेहतर User Experience provide कर सकते हैं.</p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">CSS Preprocessor क्या हैं?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> एक बार आपने CSS सीखा और आप Advance CSS सीखना चाहते हैं तो आप CSS Preprocessor की तरफ बढ़ सकते हैं. CSS Preprocessor में कई options हैं जैसे की SaSS, LeSS, PostCSS, Stylus etc. जो आपके CSS को और बेहतर functionality देने में मदद करता हैं. SaSS और PostCSS बहुत ही कम समय में बहुत ज्यादा popular हुए हैं और developers के बीच काफी demand में हैं. CSS Preprocessor के बारे में ज्यादा जानना हैं तो यहाँ क्लिक करें।</p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Javascript क्या हैं?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Javascript एक programming language हैं एक Front End Developer को सीखना ही चाहिए. HTML और CSS इस्तेमाल करके आप web के pages तो develop कर सकते हो पर उनमे functionality जोड़ने के लिए आपको Javascript आना बहुत जरूरी हैं.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-kya-hai-in-hindi-indiauiux.jpg" alt="javascript kya hai, what is javascript in hindi, indiauiux" class="wp-image-1901" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-kya-hai-in-hindi-indiauiux.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-kya-hai-in-hindi-indiauiux-768x228.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Javascript Developer की काफी demand हैं क्योंकि यह language – Front End Development और Back End Development दोनों में इस्तेमाल होती हैं. Javascript के जरिये आप किसी भी webpage पर</p> <ul style="margin: 0px 0px 1.75em 30px; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"> <li style="margin: 0px 0px 10px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; line-height: 1.4;">Popup/ Modal window बना सकते हैं</li> <li style="margin: 0px 0px 10px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; line-height: 1.4;">Interactive form develop और validate कर सकते हैं</li> <li style="margin: 0px 0px 10px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; line-height: 1.4;">Sidebar के साथ साथ Image slider/ gallery बना सकते हैं</li> <li style="margin: 0px 0px 10px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; line-height: 1.4;">Website का navigation design कर सकते हैं</li> <li style="margin: 0px 0px 10px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; line-height: 1.4;">Event को trigger कर सकते हैं</li> </ul> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Front End Development सीखने के शुरुआत में HTML और CSS के साथ साथ Javascript सीखने से आपको नौकरी मिलने के chances ज्यादा बढ़ जाते हैं.</p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Bootstrap क्या हैं ?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Bootstrap भी एक Front End Development Framework हैं जो आपको responsive website बनाने में मदद करता हैं, क्योंकि इसमे पहले से ही re-usable HTML, CSS और Javascript होते हैं जिसकी वजह से आपको नए CSS लिखने की जरूरत नहीं पड़ती.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/bootstrap-kya-hai-in-hindi-indiauiux.jpg" alt="bootstrap kya hai, what is bootstrap in hindi, indiauiux" class="wp-image-1905" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/bootstrap-kya-hai-in-hindi-indiauiux.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/bootstrap-kya-hai-in-hindi-indiauiux-768x255.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Bootstrap एक free framework हैं और आप इसे <a rel="noreferrer noopener nofollow external" aria-label="http://www.getbootstrap.com (opens in a new tab)" href="http://www.getbootstrap.com/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">http://www.getbootstrap.com</a>से download कर सकते हैं और इसके इस्तेमाल से आप बड़ी आसानी से मिनटों में website बना सकते हैं. Bootstrap में customized website बनाने के लिए आपको HTML, CSS और Javascript का knowledge होना जरूरी हैं.</p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Javascript Libraries और Frameworks</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> जैसा की हमने देखा की हम Developer skills के साथ website बना सकते हैं पर अगर हम advance level development की बात करें तो उसके लिए Javascript के libraries और framework इस्तेमाल करना भी आना चाहिए. यह libraries और framework आपके development का काम काफी आसान बनाते हैं.</p> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Libraries और Frameworks में क्या अंतर हैं?</span></h2> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-libraries-in-hindi.jpg" alt="javascript libraries in hindi, jquery logo, d3 logo, react js logo" class="wp-image-1902" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-libraries-in-hindi.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-libraries-in-hindi-768x119.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Javascript Libraries में codes/ scripts होते हैं जो re-usable होते हैं मतलब आप इसे कितनी ही बार, किसी भी तरह के projects के लिए इस्तेमाल कर सकते हैं, इसमे आपको अलग अलग तरह के functions/ objects/ methods मिलेंगे जो आप अपने applications के programming language के अनुसार इस्तेमाल या कहे link कर सकते हैं.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-frameworks-in-hindi.jpg" alt="what is javascript framework in hindi, bootstrap logo, angular js logo, vue js logo, polymer logo" class="wp-image-1903" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-frameworks-in-hindi.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/javascript-frameworks-in-hindi-768x150.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Frameworks आपके project का पूरा architecture कंट्रोल करता हैं जिसमे आपको अलग अलग बहुत सारे libraries मिलेंगे जो आप अपने project के functionality के अनुसार इस्तेमाल कर सकते हैं.</p> <figure class="wp-block-image" style="margin: 0px 0px 1em; padding: 0px; border: 0px; outline: 0px; font-size: 16px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; max-width: 100%; font-family: Roboto, Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: 0.32px;"><img src="https://www.indiauiux.com/wp-content/uploads/2019/07/front-end-developer-job-in-india.jpg" alt="front end developer job, in india, in hindi, in bangalore, in mumbai, in delhi, in hyderabad" class="wp-image-1922" srcset="https://www.indiauiux.com/wp-content/uploads/2019/07/front-end-developer-job-in-india.jpg 1024w, https://www.indiauiux.com/wp-content/uploads/2019/07/front-end-developer-job-in-india-768x98.jpg 768w" sizes="(max-width: 1024px) 100vw, 1024px" style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; max-width: 100%; height: auto;"></figure><hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Front End Development कैसे सीखें?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> जिस तरह Front End Developer की काफी demand हैं उसी तरह से fed सीखने के लिए इंटरनेट पर बहुत सारे resources मौजूद हैं.</p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">HTML</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://htmldog.com/guides/html/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://htmldog.com/guides/html/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://developer.mozilla.org/en-US/docs/Learn/HTML" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://developer.mozilla.org/en-US/docs/Learn/HTML</a><br><a href="https://learn.shayhowe.com/" target="_blank" rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://learn.shayhowe.com/</a><br><a rel="noreferrer noopener nofollow external" aria-label="https://www.htmldog.com/guides/html/ (opens in a new tab)" href="https://www.htmldog.com/guides/html/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.htmldog.com/guides/html/</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">CSS</span><br><a rel="noreferrer noopener nofollow external" aria-label="https://webdesign.tutsplus.com/series/learn-css-the-complete-guide--cms-1065 (opens in a new tab)" href="https://webdesign.tutsplus.com/series/learn-css-the-complete-guide--cms-1065" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://webdesign.tutsplus.com/series/learn-css-the-complete-guide–cms-1065</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.htmldog.com/guides/css/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.htmldog.com/guides/css/</a><br><a href="https://marksheet.io/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://marksheet.io (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://marksheet.io</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Bootstrap</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://scrimba.com/g/gbootstrap4" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://scrimba.com/g/gbootstrap4</a><br><a rel="noreferrer noopener nofollow external" aria-label="https://websitesetup.org/bootstrap-tutorial-for-beginners/ (opens in a new tab)" href="https://websitesetup.org/bootstrap-tutorial-for-beginners/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://websitesetup.org/bootstrap-tutorial-for-beginners/</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Javascript</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://htmldog.com/guides/javascript/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://htmldog.com/guides/javascript/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://javascript30.com/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://javascript30.com/</a><br><a href="https://developer.mozilla.org/bm/docs/Web/JavaScript" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://developer.mozilla.org/bm/docs/Web/JavaScript (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://developer.mozilla.org/bm/docs/Web/JavaScript</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Angular JS</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://angular.io/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://angular.io/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.udemy.com/angularjs-for-beginners-udemy/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.udemy.com/angularjs-for-beginners-udemy/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://egghead.io/browse/frameworks/angularjs" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://egghead.io/browse/frameworks/angularjs</a><br><a href="https://www.javatpoint.com/angularjs-mvc-architecture" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://www.javatpoint.com/angularjs-mvc-architecture (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.javatpoint.com/angularjs-mvc-architecture</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Vue.JS</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://adrianmejia.com/vue-js-tutorial-for-beginners-create-a-todo-app/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://adrianmejia.com/vue-js-tutorial-for-beginners-create-a-todo-app/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://vueschool.io/lessons/getting-started-with-vuejs" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://vueschool.io/lessons/getting-started-with-vuejs</a><br><a href="https://coursetro.com/courses/23/Vue-Tutorial-in-2018---Learn-Vue.js-by-Example" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://coursetro.com/courses/23/Vue-Tutorial-in-2018---Learn-Vue.js-by-Example (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://coursetro.com/courses/23/Vue-Tutorial-in-2018—Learn-Vue.js-by-Example</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Polymer</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.tutorialspoint.com/polymer/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.tutorialspoint.com/polymer/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.polymer-project.org/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.polymer-project.org/</a><br><a href="https://auth0.com/blog/build-your-first-app-with-polymer-and-web-components/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://auth0.com/blog/build-your-first-app-with-polymer-and-web-components/ (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://auth0.com/blog/build-your-first-app-with-polymer-and-web-components/</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">ReactJS</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://facebook.github.io/react/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://facebook.github.io/react/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://scrimba.com/g/glearnreact" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://scrimba.com/g/glearnreact</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://egghead.io/browse/frameworks/react" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://egghead.io/browse/frameworks/react</a><br><a href="https://reacttraining.com/courses/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://reacttraining.com/courses/ (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://reacttraining.com/courses/</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">D3</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.dashingd3js.com/table-of-contents" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.dashingd3js.com/table-of-contents</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://octoperf.com/blog/2018/04/12/d3-js-getting-started-tutorial/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://octoperf.com/blog/2018/04/12/d3-js-getting-started-tutorial/</a><br><a href="https://www.freecodecamp.org/news/learn-d3-js-in-5-minutes-c5ec29fb0725/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://www.freecodecamp.org/news/learn-d3-js-in-5-minutes-c5ec29fb0725/ (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.freecodecamp.org/news/learn-d3-js-in-5-minutes-c5ec29fb0725/</a></p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> Front End Developer कैसे बने?</h2> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">नौकरी कैसे मिलेगी?</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> अब जब आपने Front End Developer के सारे skills सीख लिया हैं अब तो बारी हैं के कैसे Entry Level Developer की नौकरी पायी जाये. बड़े IT Companies नये developers को recruit करने से कतराते हैं, क्योकि उन्हें experience नहीं होता, तो यह जरूरी हैं की शुरुआत में आप किसी छोटे IT company में नौकरी तलाश करें जिसके लिए आपको बहुत सारी तैयारी करनी होगी जैसे की</p> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> 1. <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">अपना खुद का website बनाये</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> आपको नौकरी देने से पहले companies जानना चाहेगी हैं की आप पास किस तरह के skills हैं और किस तरह के projects के साथ आप comfortable हैं. Companies को यह बताने के लिए आपको खुद का website बनाना होगा और उसमे अपने develop किये हुए websites दिखाने होंगे. यह आपका portfolio website होगा जिसमे आपका Best काम ही होगा और जिसमे आप बताओगे की आपने एक website develop करने के लिए कौनसे process और language का इस्तेमाल किया हैं? आपका coding करने का तरीका कैसा हैं? यह portfolio website आप blogspot.com या wordpress.com पर भी बना सकते हो और इसका link आपको अपने biodata/ resume में हमेशा दिखाना होगा.</p> <h2 style="margin: 0px 0px 30px; padding: 0px; border: 0px; outline: 0px; font-size: 22px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-weight: 400; color: rgb(27, 27, 27); line-height: 1.3; font-family: Mukta; letter-spacing: 0.32px;"> 2. <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">Online Forums /Slack Channel से जुड़े</span></h2> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> आप बहुत सारे Development Forums या Slack Community से जुड़ सकते हैं और दुसरे developers के सवालों के जवाब दे सकते हैं या फिर किसी technologies/ languages से जुड़े कोई सवाल पूछ सकते हैं. ऐसे forums में जुड़ने से आप हमेशा नये trends और technologies से update रहोगे और आपको freelance project मिलने के अवसर भी मिल सकते हैं. कुछ forums/ slack आप join कर सकते हैं जैसे के:</p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> <span style="margin: 0px; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background: transparent; font-weight: 700;">FORUMS</span><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.webdesignerforum.co.uk/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.webdesignerforum.co.uk/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.webdeveloper.com/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.webdeveloper.com/</a><br><a href="https://www.sitepoint.com/community/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://www.sitepoint.com/community/ (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.sitepoint.com/community/</a></p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> Slack<br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://discordapp.com/invite/aBx8dcu" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://discordapp.com/invite/aBx8dcu</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://www.reactiflux.com/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://www.reactiflux.com/</a><br><a rel="noreferrer noopener nofollow external" aria-label=" (opens in a new tab)" href="https://embercommunity.slack.com/" target="_blank" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://embercommunity.slack.com</a><br><a href="https://ios-developers.slack.com/" target="_blank" rel="noreferrer noopener nofollow external" aria-label="https://ios-developers.slack.com/ (opens in a new tab)" data-wpel-link="external" style="margin: 0px; padding: 0px; vertical-align: baseline; background: transparent; color: rgb(51, 51, 51); outline: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0.196);">https://ios-developers.slack.com/</a></p> <hr class="wp-block-separator" style="height: 1px; border: 0px; margin: 1em 0px 18px; padding: 0px; background-color: rgb(237, 237, 237); clear: both; font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; letter-spacing: 0.32px;"> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> कुछ सालों से Front End Developer एक बहुत ही आकर्षक career option बन गया हैं. Experienced Developers की कमी होने के कारण Entry Level Front End Developer की demand अचानक से बढ़ गयी हैं. इसका मतलब हैं की coding में career plan करने का यही सही मौका हैं.</p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> एक बार आपने Front End Development के basics में expertise कर ली तो Full-time job के अलावा आपको freelancing development के भी काफी offers आ सकते हैं. इसीलिए focus करें, अच्छे से coding की practice करें, अपने खुद की website बनाये और Front End Development के क्षेत्र में entry करें.</p> <p style="margin-bottom: 1.75em; padding: 0px; border: 0px; outline: 0px; vertical-align: baseline; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; font-family: Mukta; font-weight: 400; line-height: 1.7; letter-spacing: 0.32px;"> अगर आपको यह post अच्छा लगा तो इसे अपने friends के साथ social media पर जरूर शेयर करें और comments में बताये की Front End Development के बारे में आप क्या सोचते हैं.</p> <div> <br></div> </span></div> </div> </div>

Post a Comment

Previous Post Next Post