அறிமுகம்
நீங்கள் நிரலாக்கத்திற்கு புதியவராக இருந்தாலும் அல்லது அனுபவமுள்ள டெவலப்பராக இருந்தாலும், புதிய கருத்துக்கள் மற்றும் மொழிகள்/கட்டமைப்புகளைக் கற்றுக்கொள்வது இந்தத் துறையில் போக்குகளுக்குத் தொடர்ந்து இருக்க வேண்டும்.
எடுத்துக்காட்டாக, ரியாக்டை எடுத்துக் கொள்ளுங்கள், இது நான்கு ஆண்டுகளுக்கு முன்பு பேஸ்புக் திறந்த மூலத்தை உருவாக்கியது மற்றும் ஏற்கனவே உலகெங்கிலும் உள்ள ஜாவாஸ்கிரிப்ட் டெவலப்பர்களுக்கான முதல் தேர்வாக மாறியுள்ளது.
Vue மற்றும் Angular, நிச்சயமாக, அவற்றின் சொந்த முறையான ரசிகர் பட்டாளத்தைக் கொண்டுள்ளது. பின்னர் Svelte மற்றும் Next.js அல்லது Nuxt.js போன்ற பிற உலகளாவிய கட்டமைப்புகள் உள்ளன. மற்றும் கேட்ஸ்பி, மற்றும் கிரிட்சம், மற்றும் குவாசர்... மற்றும் பல.
அனுபவம் வாய்ந்த ஜாவாஸ்கிரிப்ட் டெவலப்பராக உங்களை நிரூபிக்க விரும்பினால், பலவிதமான கட்டமைப்புகள் மற்றும் நூலகங்களில் உங்களுக்கு குறைந்தபட்சம் சில அனுபவமாவது இருக்க வேண்டும் - நல்ல பழைய JS உடன் வேலை செய்வதோடு கூடுதலாக.
2020 ஆம் ஆண்டில் நீங்கள் ஒரு முன்-இறுதி மாஸ்டராக மாறுவதற்கு, நான் ஒன்பது வெவ்வேறு திட்டங்களை ஒன்றாக இணைத்துள்ளேன், ஒவ்வொன்றும் வெவ்வேறு ஜாவாஸ்கிரிப்ட் கட்டமைப்பையும் நூலகத்தையும் ஒரு தொழில்நுட்ப அடுக்காக நீங்கள் உருவாக்கி உங்கள் போர்ட்ஃபோலியோவில் சேர்க்கலாம். உண்மையில் விஷயங்களை உருவாக்குவதை விட எதுவும் உங்களுக்கு உதவாது என்பதை நினைவில் கொள்ளுங்கள், எனவே முன்னோக்கி நகர்த்தவும், உங்கள் மனதைப் பயன்படுத்தி அதைச் செய்யவும்
கட்டுரை EDISON மென்பொருளின் ஆதரவுடன் மொழிபெயர்க்கப்பட்டது மேலும் .
ரியாக்டைப் பயன்படுத்தி திரைப்படத் தேடல் பயன்பாடு (கொக்கிகளுடன்)
ரியாக்டைப் பயன்படுத்தி திரைப்படத் தேடல் பயன்பாட்டை உருவாக்குவதே முதலில் நீங்கள் தொடங்கலாம். இறுதி பயன்பாடு எப்படி இருக்கும் என்பதற்கான படம் கீழே உள்ளது:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்தப் பயன்பாட்டை உருவாக்குவதன் மூலம், ஒப்பீட்டளவில் புதிய Hooks API ஐப் பயன்படுத்தி உங்கள் எதிர்வினை திறன்களை மேம்படுத்துவீர்கள். எடுத்துக்காட்டு திட்டமானது ரியாக்ட் கூறுகள், நிறைய கொக்கிகள், வெளிப்புற API மற்றும் சில CSS ஸ்டைலிங் ஆகியவற்றைப் பயன்படுத்துகிறது.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- கொக்கிகள் மூலம் எதிர்வினை
- உருவாக்கு-எதிர்வினை-பயன்பாடு
- JSX
- CSS ஐ
எந்த வகுப்புகளையும் பயன்படுத்தாமல், இந்த திட்டங்கள் செயல்பாட்டு எதிர்வினைக்கான சரியான நுழைவு புள்ளியை உங்களுக்கு வழங்குகின்றன, மேலும் 2020 இல் நிச்சயமாக உங்களுக்கு உதவும். நீங்கள் கண்டுபிடிக்க முடியும் . வழிமுறைகளைப் பின்பற்றவும் அல்லது அதை நீங்களே உருவாக்கவும்.
Vue உடன் அரட்டை பயன்பாடு
நீங்கள் செய்ய வேண்டிய மற்றொரு சிறந்த திட்டம் எனக்கு பிடித்த ஜாவாஸ்கிரிப்ட் நூலகத்தைப் பயன்படுத்தி அரட்டை பயன்பாட்டை உருவாக்குவது: VueJS. பயன்பாடு இப்படி இருக்கும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்த டுடோரியலில், புதிதாக ஒரு Vue பயன்பாட்டை எவ்வாறு உருவாக்குவது என்பதை நீங்கள் கற்றுக் கொள்வீர்கள் - கூறுகளை உருவாக்குதல், நிலையைக் கையாளுதல், வழிகளை உருவாக்குதல், மூன்றாம் தரப்பு சேவைகளுடன் இணைத்தல் மற்றும் அங்கீகாரத்தைக் கையாளுதல்.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- வியு
- vuex
- Vue திசைவி
- Vue CLI
- pusher
- CSS ஐ
Vue உடன் தொடங்குவதற்கு அல்லது 2020 ஆம் ஆண்டில் மேம்பாடு அடைய உங்கள் தற்போதைய திறன்களை மேம்படுத்துவதற்கு இது மிகவும் சிறந்த திட்டமாகும். நீங்கள் கண்டுபிடிக்க முடியும் .
கோண 8 உடன் அழகான வானிலை பயன்பாடு
கோண 8 ஐப் பயன்படுத்தி அழகான வானிலை பயன்பாட்டை உருவாக்க இந்த எடுத்துக்காட்டு உதவும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்த திட்டம் புதிதாக பயன்பாடுகளை உருவாக்குவதில் மதிப்புமிக்க திறன்களை உங்களுக்குக் கற்பிக்கும் - வடிவமைப்பு முதல் மேம்பாடு வரை, வரிசைப்படுத்த-தயாரான பயன்பாடு வரை.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- கோண 8
- Firebase
- சர்வர் பக்க ரெண்டரிங்
- கட்டம் மற்றும் Flexbox உடன் CSS
- மொபைல் நட்பு மற்றும் இணக்கத்தன்மை
- இருண்ட பயன்முறை
- அழகான இடைமுகம்
இந்த அனைத்தையும் உள்ளடக்கிய திட்டத்தில் நான் மிகவும் விரும்புவது என்னவென்றால், நீங்கள் விஷயங்களைத் தனிமையில் படிக்க வேண்டாம். அதற்கு பதிலாக, வடிவமைப்பு முதல் இறுதி வரிசைப்படுத்தல் வரை முழு வளர்ச்சி செயல்முறையையும் நீங்கள் கற்றுக்கொள்கிறீர்கள்.
Svelte ஐப் பயன்படுத்தி செய்ய வேண்டிய பயன்பாடு
ஸ்வெல்ட் என்பது கூறு அடிப்படையிலான அணுகுமுறையில் புதிய குழந்தையைப் போன்றது - குறைந்தபட்சம் ரியாக்ட், வியூ மற்றும் ஆங்குலர் போன்றது. மேலும் இது 2020க்கான வெப்பமான புதிய தயாரிப்புகளில் ஒன்றாகும்.
செய்ய வேண்டிய பயன்பாடுகள் மிகவும் பரபரப்பான தலைப்பு அல்ல, ஆனால் இது உங்கள் Svelte திறன்களை மேம்படுத்த உதவும். இது இப்படி இருக்கும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்த டுடோரியல் Svelte 3 ஐப் பயன்படுத்தி ஒரு பயன்பாட்டை எவ்வாறு உருவாக்குவது என்பதை ஆரம்பம் முதல் இறுதி வரை காண்பிக்கும். நீங்கள் கூறுகள், ஸ்டைலிங் மற்றும் நிகழ்வு ஹேண்ட்லர்களைப் பயன்படுத்துவீர்கள்
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- ஸ்வெல்ட் 3
- கூறுகள்
- CSS உடன் ஸ்டைலிங்
- ES 6 தொடரியல்
பல நல்ல Svelte ஸ்டார்டர் திட்டங்கள் இல்லை, அதனால் நான் கண்டுபிடித்தேன் .
Next.js ஐப் பயன்படுத்தி மின் வணிகம் பயன்பாடு
Next.js என்பது பாக்ஸிற்கு வெளியே சர்வர்-சைட் ரெண்டரிங்கை ஆதரிக்கும் எதிர்வினை பயன்பாடுகளை உருவாக்குவதற்கான மிகவும் பிரபலமான கட்டமைப்பாகும்.
இது போன்ற ஒரு ஈ-காமர்ஸ் பயன்பாட்டை எவ்வாறு உருவாக்குவது என்பதை இந்தத் திட்டம் காண்பிக்கும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்தத் திட்டத்தில், Next.js-ஐப் பயன்படுத்தி எப்படி உருவாக்குவது என்பதை நீங்கள் கற்றுக் கொள்வீர்கள்—புதிய பக்கங்கள் மற்றும் கூறுகளை உருவாக்குவது, தரவைப் பிரித்தெடுத்தல் மற்றும் நடை மற்றும் அடுத்த பயன்பாட்டைப் பயன்படுத்துதல்.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- அடுத்தது
- கூறுகள் மற்றும் பக்கங்கள்
- தரவு மாதிரி
- stylization
- திட்ட வரிசைப்படுத்தல்
- SSR மற்றும் SPA
புதிதாக ஒன்றைக் கற்றுக்கொள்வதற்கு ஈ-காமர்ஸ் பயன்பாட்டைப் போன்ற நிஜ உலக உதாரணத்தை வைத்திருப்பது எப்போதும் சிறப்பானது. உன்னால் முடியும் .
Nuxt.js உடன் முழு அளவிலான பன்மொழி வலைப்பதிவு
Nuxt.js என்பது Vue க்கு, Next.js என்றால் React: சர்வர் பக்க ரெண்டரிங் மற்றும் ஒற்றை பக்க பயன்பாடுகளின் சக்தியை இணைப்பதற்கான சிறந்த கட்டமைப்பு
நீங்கள் உருவாக்கக்கூடிய இறுதி பயன்பாடு இப்படி இருக்கும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்த மாதிரி திட்டப்பணியில், Nuxt.js ஐப் பயன்படுத்தி முழுமையான இணையதளத்தை எவ்வாறு உருவாக்குவது என்பதை ஆரம்ப அமைப்பிலிருந்து இறுதி வரிசைப்படுத்தல் வரை கற்றுக்கொள்வீர்கள்.
பக்கங்கள் மற்றும் கூறுகள் மற்றும் SCSS உடன் ஸ்டைலிங் போன்ற பல சிறந்த அம்சங்களை Nuxt வழங்கும்.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- Nuxt.js
- கூறுகள் மற்றும் பக்கங்கள்
- ஸ்டோரி பிளாக் தொகுதி
- ஹாக்ஃபிஷ்
- மாநில நிர்வாகத்திற்கான Vuex
- ஸ்டைலிங்கிற்கான SCSS
- நக்ஸ்ட் மிடில்வேர்ஸ்
, இது பல சிறந்த Nuxt.js அம்சங்களை உள்ளடக்கியது. நான் தனிப்பட்ட முறையில் Nuxt உடன் பணிபுரிவதை விரும்புகிறேன், எனவே நீங்கள் இதை முயற்சிக்கவும், ஏனெனில் இது உங்களை சிறந்த Vue டெவலப்பராக மாற்றும்.
கேட்ஸ்பியுடன் வலைப்பதிவு செய்யுங்கள்
கேட்ஸ்பி ரியாக்ட் மற்றும் கிராப்க்யூஎல் ஆகியவற்றைப் பயன்படுத்தி ஒரு சிறந்த நிலையான தள ஜெனரேட்டராகும். இது திட்டத்தின் முடிவு:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
இந்த டுடோரியலில், ரியாக்ட் மற்றும் கிராப்க்யூஎல் மூலம் உங்கள் சொந்த கட்டுரைகளை எழுத நீங்கள் பயன்படுத்தும் வலைப்பதிவை உருவாக்க கேட்ஸ்பையை எவ்வாறு பயன்படுத்துவது என்பதை நீங்கள் கற்றுக் கொள்வீர்கள்.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- கேட்ஸ்பை
- வினை
- வரைபடம்
- செருகுநிரல்கள் மற்றும் கருப்பொருள்கள்
- MDX/Markdown
- பூட்ஸ்ட்ராப் CSS
- டெம்ப்ளேட்கள்
நீங்கள் எப்போதாவது ஒரு வலைப்பதிவைத் தொடங்க விரும்பினால், React மற்றும் GraphQL ஐப் பயன்படுத்தி அதை எவ்வாறு உருவாக்குவது என்பது பற்றி.
வேர்ட்பிரஸ் ஒரு மோசமான தேர்வு என்று நான் கூறவில்லை, ஆனால் கேட்ஸ்பை மூலம் நீங்கள் ரியாக்டைப் பயன்படுத்தி உயர் செயல்திறன் கொண்ட இணையதளங்களை உருவாக்கலாம் - இது ஒரு அற்புதமான கலவையாகும்.
கிரிட்சோமுடன் வலைப்பதிவு
Vue க்கான Gridsome... சரி, நாங்கள் இதை ஏற்கனவே Next/Nuxt உடன் வைத்திருந்தோம்.
ஆனால் கிரிட்சோம் மற்றும் கேட்ஸ்பைக்கு இதுவே உண்மை. இருவரும் GraphQL ஐ தங்கள் தரவு அடுக்காகப் பயன்படுத்துகின்றனர், ஆனால் Gridsome VueJS ஐப் பயன்படுத்துகிறது. இது ஒரு அற்புதமான நிலையான தள ஜெனரேட்டராகும், இது சிறந்த வலைப்பதிவுகளை உருவாக்க உதவும்:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
Gridsome, GraphQL மற்றும் Markdown மூலம் தொடங்குவதற்கு எளிய வலைப்பதிவை எவ்வாறு உருவாக்குவது என்பதை இந்தத் திட்டம் உங்களுக்குக் கற்பிக்கும். Netlify மூலம் ஒரு பயன்பாட்டை எவ்வாறு வரிசைப்படுத்துவது என்பதையும் இது உள்ளடக்கியது.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- கடுமையான
- வியு
- வரைபடம்
- markdown
- நெட்லிஃபை
இது நிச்சயமாக மிகவும் விரிவான பயிற்சி அல்ல, ஆனால் இது Gridsome இன் அடிப்படைக் கருத்துகளை உள்ளடக்கியது மற்றும் .
Quasar ஐப் பயன்படுத்தும் SoundCloud போன்ற ஆடியோ பிளேயர்
Quasar என்பது மொபைல் பயன்பாடுகளை உருவாக்கப் பயன்படும் மற்றொரு Vue கட்டமைப்பாகும். இந்த திட்டத்தில் நீங்கள் ஆடியோ பிளேயர் பயன்பாட்டை உருவாக்குவீர்கள், எடுத்துக்காட்டாக:
நீங்கள் என்ன கற்றுக்கொள்வீர்கள்
மற்ற திட்டங்கள் முக்கியமாக இணைய பயன்பாடுகளில் கவனம் செலுத்தும் போது, Vue மற்றும் Quasar கட்டமைப்பைப் பயன்படுத்தி மொபைல் பயன்பாட்டை எவ்வாறு உருவாக்குவது என்பதை இது உங்களுக்குக் காண்பிக்கும்.
Android Studio/Xcode உள்ளமைக்கப்பட்ட கோர்டோவாவை நீங்கள் ஏற்கனவே வைத்திருக்க வேண்டும். இல்லையெனில், கையேட்டில் Quasar வலைத்தளத்திற்கான இணைப்பு உள்ளது, அங்கு அவை அனைத்தையும் எவ்வாறு அமைப்பது என்பதைக் காண்பிக்கும்.
தொழில்நுட்ப அடுக்கு மற்றும் அம்சங்கள்
- குவாசரின்
- வியு
- கோர்டோவா
- அலை சர்ஃபர்
- UI கூறுகள்
, மொபைல் பயன்பாடுகளை உருவாக்குவதற்கான குவாசரின் திறன்களை விளக்குகிறது.
ஆதாரம்: www.habr.com