what is web development complete road map
7 views
Jun 1, 2024
This video provides a complete roadmap for web development, covering all the essential aspects and stages involved in becoming a proficient web developer. It includes an overview of front-end and back-end development, key programming languages and frameworks, as well as essential tools and resources. Whether you're new to web development or looking to expand your skills, this video offers a clear and comprehensive guide to help you navigate the field effectively.
View Video Transcript
0:00
Hi everyone and welcome to अपना college राजम बात करने वाले है��
0:02
Web Development Roadmap के बारे में तो Web Development वन of the most versatile skills ह��
0:07
अगर हम Tech के अंदर जाना चाहते हैं तो अगर हमें Web D आता है तो उसको use करक��
0:11
हम as a college student अपने लिए projects मना सकते हैं हम internships and placements के लिए apply कर सकते है��
0:16
हम freelancing opportunities को डून सकते हैं हम open source में contribute कर सकते हैं
0:19
अगर हमें खुद के लिए website, portfolio, या अपने startup का project बनाना है, उसे हम बना सकते हैं, नहीं तो हम इसे as a hobby भी सीख सकते हैं
0:26
मैं खुद का अगर example हूँ, तो मेरी दोनों जो Microsoft के अंदर internships थी
0:30
मेरा जो Google SPS का program था, या फिर अगर full time job था Microsoft में
0:48
इस प्रेडियो को डिस्कस करेंगे जिनको हम expect कर सकते हैं अगर इस फील्ड में हम as a fresher जाना जाते हैं त��
0:52
अब step by step road map को डिसकस करने से पहले तीन terms है जिनके बारे में हमें पता होना चाहि��
0:57
इन में से पहली दो है frontend and backend किसी भी website का वो हिस्स��
1:01
जिसके साथ हम as a user interact कर पाते हैं उसे हम frontend कहते है��
1:05
जिसे for example अगर हम Paytm के ऊपर देखें तो Paytm पर हम अपना balance चेक कर सकते है��
1:09
हम चेक कर सकते हैं हमारे contact list में कौन-कौन हैं तो यह हिस्सा frontend होग��
1:13
या फिर अगर आप YouTube के ऊपर मेरी वीडियो देख पा रहे हैं तो इस वीडियो के साथ आप interact कर सकते हैं, इसकी speed हम increase कर सकते हैं, हम चाहे तो comment कर सकते हैं, comments को like कर सकते हैं, तो इस हिस्से को हम frontend कहेंगे, बाकी websites का वो हिस्सा भी होता है जिसके साथ हम interact नहीं कर पाते हैं, ज��
1:43
इसके अलावा websites में databases भी होते हैं databases का काम होता है data को store करके रखन��
1:48
आज की date में जो बड़ी-बड़ी tech companies हैं हर किसी के पास लाखों करोडो users का data ह��
1:53
हमारे जो हम whatsapp use करते हैं whatsapp के उपर जितने भी हम messages भेजते है��
1:57
photos भेजते हैं, videos भेजते हैं यह सारा का सारा data companies के अंदर store होता है
2:01
databases के अंदर, तो यह तीन major component है, pillars हैं, जिनके उपर हमारा पूरा web development चलता है
2:07
तो web development के step by step road map की बात करते हैं, इसमें से सबसे पहला step होता है
2:12
हमारे frontend का, frontend को सीखने के लिए तीन technologies हैं, जिनको हम सीखते हैं
2:16
इसमें से पहला है HTML, दूसरा है CSS, तीसरा है JavaScript अब ये तीनो नाम अगर हम first time सुन रहे है��
2:22
तो हमें सुनने में थोड़ा से अजीब लग रहे होंगे बट ये काफी बढ़िया, काफी useful
2:26
and काफी easy technologies हैं to learn and as a programmer अगर web development पहली चीज़ ह��
2:31
जो आप सीखते हैं programming के अंदर, coding के अंदर, तो definitely आपको काफी मज़ा आने वाला है
2:36
इसमें से HTML तो आपको बहुत जादा असान लगेगा logic में, अब इन तीनों का मतलब क्या होता है
2:41
जिसे हम किसी भी website को एक घर की तरह imagine कर सकते हैं, जब भी कोई घर बनता है तो बहले नीव डाली जाती हैं, इटे लगाई जाती हैं, सिमेंट लगाया जाता है, तो इससे basic structure बनता है, वैसे ही एक website का basic structure बनाता है हमारे लिए HTML, कि website के उपर क्या-क्या content होना चाहिए, कितने button होने चाहिए, कहाँ पे होने चाहिए, इस तरीके ��
3:14
CSS covered CSS one shot notes assignment questions JavaScript web development playlist college
4:06
होते हैं या फिर हमारे जो road maps होते हैं उसके अंदर advice होता है कि तीनों को सीख लो उसके बा��
4:10
हम framework या library सीख लें जैसे react हो गया जैसे angular हो गय��
4:13
जैसे view.js हो गया पर यहाँ पर मैं आपको ऐसी कोई advice नहीं दूगी इन तीनों को करने के बाद हमें किस��
4:19
framework या library की तरफ नहीं भागना है सबसे पहले इन ही तीनों क��
4:23
हमें अच्छे से practice करना है कैसे हम practice करेंगे with the help of projects
4:27
हमारा जो step 2 होगा that will be to make projects हम कैसे projects बना सकते है��
4:32
सबसे इसमें जो ideal projects होते हैं जो हमें काफी अच्छी styling का experience देंग��
4:37
HTML आड़ करने का, जावास्क्रिप्ट आड़ करने का experience देंगे, वो हमारे clone based
4:41
projects होते हैं, क्योंकि एक तो इसमें हमें कुछ design नहीं करना पड़ता, clone
4:45
कहने का मतलब है, कि already Amazon जैसी website या Flipkart जैसी website
4:49
बनी हुई है, हम क्या करेंगे, हम उनका website का front end copy करने क��
4:53
कोशिश करेंगे उससे हमें अपनी website design करने का जो भारी काम है उसको नहीं लेना पड़त��
4:58
already किसी की अच्छी website है design कर रखा उन्होंने काफी जारा time लगा के उससे हम replicate करने क��
5:03
कोशिश करेंगे तो clone की terms में एक amazon clone का project already हमने अपना college के उपर डाला हुआ ह��
5:08
नहीं तो आप ऐसी कोई भी famous website ले सकते हैं जिसको mostly लोग use करते है��
5:12
क्योंकि generally websites के जो designs prepare होते हैं अच्छे designs prepare होते हैं उसमें कई-कई महिनों कई-कई सालों लग जाते है��
5:18
तो आपको वो बनाया-बनाया मिल जाएगा आप उसी को replicate करने की कोशिश करिए practice के लि��
5:22
दूसरे type के projects जो हम बना सकते हैं वो portfolio based project
5:26
कि हम खुद के लिए ही एक simple सा portfolio बना सकते हैं शुरुवात में एक single page आप बनाई है single page website
5:32
जिसके अंदर अपने बारे में हम information आड़ कर सकते हैं और projects करने के बाद जो तीसरी चीज़ हम सीख सकते है��
5:37
वो होते हैं हमारे CSS के frameworks CSS के frameworks कहने का मतलब ह��
5:41
कि ये CSS को styling को ही लिखने का एक और easier तरीका होते है अब frameworks के अंदर generally
5:46
जो सबसे popular framework है industry के अंदर जो सबसे जादा use होता ह��
5:50
वो होता है bootstrap तो हम bootstrap को सीख सकते हैं वरना कई सारे students ऐसे भी है��
5:54
जो tailwind को भी सीख सकते हैं आप चाहें तो इसे भी सीख सकते हैं, पर यह हमें जरूर याद रखना है कि सारे frameworks नहीं सीखने होते, इन में से एक ही सीखना होता है अच्छे से, क्योंकि बाकी सारे almost similar ही होते हैं usage में, तो इसलिए कोई भी एक के साथ हम start कर सकते हैं, उसको हम implement कर सकते हैं, एक बार हमारा step 2 complete
6:26
choice लेनी है, अब वैसे तो यह अजीव से नाम देखकर हमें लग रहे होंगे क��
6:29
Node.js क्या होता है, Django क्या होता है, बट एक बार आप frontend सीख लेंगे तो हमे��
6:34
और जादा clarity मिलेगी कि development के अंदर किस-किस तरीके की चीज़ें होती हैं
6:37
किस-किस तरीके से उनको हमें सीखना होता है अब अगर आप first time back-end सीखने है��
6:41
तो मैं इसमें आपको genuinely advise करूँगी that you start with Node.js Node.js को सीखने के कई सारे benefits है��
6:47
सबसे पहला यह है कि JavaScript आप already सीख चुके हैं front-end के लिए और Node.js का मतलब भी JavaScript के अंद��
6:53
code node java script runtime environment java script use syntax easy process easy plus node popular industry websites node use build job opportunities as such worry and Java options PHP Java developers advice experience
7:28
अभी back-end development करते हुए, और फिर हम इनके ऊपर shift हो रहे हैं, बाकि generally जो हमारी modern websites होती हैं
7:33
वो Django या Node.js के उपर ही work करती है, PHP पहले काफी ज़्यादा popular होता था
7:38
websites को build करने के लिए, अब जब हम back-end सीख रहे होंगे, तो back-end का मतलब यह नहीं है
7:42
कि सिर्फ हमें back-end की technology सीखनी है, उसका मतलब यह भी है, कि हमें databases के बारे में भी सीखना पड़ेग��
7:47
और industry के अंदर databases के लिए दो सबसे popular options होते हैं एक होता है SQL और एक दूसरा option होता ह��
7:53
जिसको हम कहते है no SQL SQL का मतलब कि data को ह��
7:56
tables की form में store करा रहे हैं जैसे हम excel sheet के अंदर अपनी table बनाते है��
8:01
वैसे से ही हम अपने data को tables की form में store कराते हैं, उसको हम SQL कहे देते हैं, structured query language, और no SQL मतलब data को कैसे भी store कराओ, बस table में नहीं store कराना, उसमें सबसे popular होता है MongoDB database, अब अगर आप Node.js को सीख रहे हैं, तो हम prefer कर सकते हैं कि हम MongoDB को use करें, Django को सीख रहे हैं, तो हम prefer कर सकते हैं कि हम SQL
8:31
हमें SQL आ जाता है, तो उसके बाद MongoDB को समझना और ज़्यादा असान हमारे लिए हो जाता है, तो इसमें you can start with SQL, हम थोड़ा सा basic सीख सकते हैं, then we can switch to MongoDB, अगर आपको MongoDB का भी tutorial चाहे, तो उसके बारे में आप मुझे नीचे comment करके बता सकते हैं, and एक बार back-end सीखने के बाद ह��
9:01
web developer बनने का मतलब है कि हम tech के अंदर, technology के अंदर problems को solve कर सकते हैं, और इन problems को solve करने के लिए कुछ-कुछ tools and technologies हैं, जिनको हमें extra जाकर सीखना पड़ेगा, इन्हें आप कभी भी सीख सकते हैं, इन्हें frontend सीखते टाइम भी सीख सकते हैं, backend सीखते टाइम भी, basically ये development से related नहीं ह��
9:31
files को कैसे access किया जाता है, data को कैसे manipulate किया जाता है, इस तरीके की चीज़े��
9:35
second चीज़ जो हमें सीखनी पड़ेगी वो है git and github, अब git and github
9:38
version control system होते हैं, version control system क्या होता है उसके मैं detail में नहीं जाओंग��
9:42
क्योंकि वो थोड़ा सा complex हो जाएगा अभी के लिए पर अगर आपको get and get up सीखना है तो हमने complete tutorial अपना college channel के उपर डाला हुआ है उसको जाकर आप सीख सकते है��
9:50
and third चीज जो हमें आनी चाहिए वो है deployment deployment कहने का मतलब है कि हम जितने भी projects बनाएंगे webd को use करक��
9:56
शुरुवात में वो सारे के सारे projects सिर्फ हमारे laptop या computer पे ही चलेंग��
10:00
हम अपने दोस्तों को कैसे वो भेजें project हम कैसे ऐसा link बना दे जैसे हम google.com search करक��
10:06
google की website पे हम में से हर कोई जा पाता है तो हम अपने projects को कैसे host करवाएं कैसे उनका link share करपाए��
10:12
उससे हम deployment कहते हैं तो deployment projects की हमें आनी चाहि��
10:16
and जैसे हमारा step 4 complete हो जाएगा हम आ जाएगे step 5 त��
10:20
step 5 तक आने में हमें करीबन 4-4.5 महीने लगेंगे क्योंकि ये सारी जो हमने technologies की बात करी वो ऐसे तो मैंने single word बोल दिय��
10:28
और उसमें हम बहुत सारी चीजें सीख रहे होते हैं अगर हम back-end की बात करें हैं तो सिर्फ उसमें एक language नहीं ह��
10:33
सिर्फ उसमें एक framework नहीं है back-end के अंदर APIs कैसे बनती हैं protocols कैसे काम करती है��
10:38
request, response, cycle, error handling कैसे होती है templating कैसे होती ह��
10:42
बहुत सारी चीज़े हैं जो हम आपर सीखते हैं अब इसके बाद finally जब हमने front and back end databases सीख ल��
10:48
तो हम full stack projects के उपर काम करेंगे जिसमें हम front end भी बनाएंगे, back end भी बनाएंग��
10:52
and databases भी बनाएंगे तो हमें end to end projects बनाने है��
10:56
तीनों को use करके और at least projects resume profile strong process time front end
11:28
यानि एक बार projects बन गए, resume के अंदर डल गए, तो अब हमें apply करना है
11:32
फिर चाहे वो internship के लिए हो, फिर चाहे वो jobs के लिए हो, या फिर चाहे वो freelancing opportunities के लिए हो
11:37
क्योंकि जो भी projects हमने build की है, वो बहुत अच्छा तरीका है लोगों को दिखाने के
11:40
कि हमें development को करना आता है क्योंकि जब तक हमारे पास कोई internship या job experience नहीं होत��
11:45
तब तक project सबसे ज़्यादा important part होते हैं हमारे resume के जो हमें पता होनी चाहि��
11:50
तो इस तरीके से six steps को complete करके हम एक अच्छे web developer बन सकते है��
11:55
हम web development को बढ़िया तरीके से सीख सकते हैं और उसे apply कर सकते हैं, अब इसके बाद कुछ-कुछ next steps हैं, जो हम ले सकते हैं, जैसे for example इतना अगर हमने part कर लिया, तो उसके साथ हम कुछ और नई चीज़ें हैं, जिनको सीख सकते हैं, जैसे हम किसी front end के framework या library को सीख सकते हैं, जो और ज़ादा better हमारी portfolio को बनाएगा, इसम��
12:28
कुछ stacks बोल सकते हैं, जैसे murn हो गया, जैसे mean हो गया
12:32
तो murn के अंदर m का मतलब होता है MongoDB database, e का मतलब होता है express
12:35
JS, जो node JS के अंदर ही होता है, n का मतलब node JS होता है, r का मतलब होता है react
12:40
JS, इसी तरीके से तीनों same रहते हैं और a का मतलब होता है angular, त��
12:43
अगर आपको ये चारो आते हैं, तो मतलब आपने एक tech stack है, एक ऐसी चीज है, एक technologies का हिस्सा है, जो सीख लिया है, जिसको यूज़ करके, आप पूरी की पूरी website बना सकते हो, या फिर अगर आपने इन्हें सीख लिया है, तो फिर आप इनको भी यूज़ करके बना सकते हो, ��
13:13
तो इस तरीके से हमारी end to end तयारी हो जाएगी एक अच्छे web developer बननी ह��
13:18
अब अगर हम average salaries की बात करें तो एक glass door के figures है 2023 के अंदर जो एक front end developer की average salary industry के अंदर as a fresher
13:26
यानि अगर आप industry के अंदर शुरुआत कर रहे हैं तो that is going to be 5.75 LPA and for a back end developer it is going to be 7 LPA
13:33
but क्योंकि ये इतनी versatile field है इसके अंदर अगर आपको अच्छा experience ह��
13:38
इसमें अगर आपको अच्छे से काम करना आता है तो आपके salary packages की literally
13:42
कोई limit नहीं है कई सारे ऐसे developers होते हैं जिनको शुरुवात में ह��
13:45
इससे भी काफी जादा high packages मिल जाते हैं क्यों? क्योंकि उन्हें अच्छे से अपना काम करना आता है, उन्होंने resume अच्छे से बनाया होता है, अपने projects को अच्छे से create किया होता है, impressive level of skill उनके पास already होता है, तो जब हम भी target करेंगे, तो हमें अच्छे level के skill level को target करना है, जिसको करने में हो सकता है, हमें कई महीनें ल��
14:17
हमें driving तब भी आईगी जब हम खुद से गाड़ी को चलाएंगे वैसे ही coding के tutorials या videos हम कितने भी देख लेंग��
14:23
हमें खुद coding तब आईगी जब हम खुद से बैठ के code लिखेंगे उसके logic को समझेंगे और उस logic को apply करेंग��
14:29
तो सिर्फ tutorials को देखना नहीं है उन्हें actually बैट के code करके implement करना ह��
14:33
और उनको समझने की हमें कोशिश करनी है तो आज के लिए इतना ही अगर आप चाहते हैं हम किसी और topic को cover कर जाए तो उसके बारे मे��
14:39
आप मुझे नीचे comment करके बता सकते हैं आज के लिए इतना ही मिलते हैं next video में till then keep learning and keep exploring
#Computer Education
#Flash-Based Entertainment
#Internships
#Programming
#Video Game Development
#Web Design & Development