Frontend React JS
Toza kod yozish orqali xalqaro talablarga javob beruvchi veb ilovalar va saytlar yaratishni oʻrganing. Mahalliy yoki xalqaro kompaniyalarda oʻz oʻrningizni toping, yoki frilans dastruchi boʻling.
Ulug'bek SamigjOnov
Kurs 1 aprel, 2024 yil tayyorlangan
Eng aktual ma'lumotlar
300+ topshiriqlar, takrorlanmas keyslar
Kurs eksperti bilan onlayn uchrashuvlar
Tez start olish uchun
ko'nikmalarni rivojlantirish
Soha kuchlilaridan iborat jamiyat va netvorking
Istagan vaqtingizda oʻqiysiz, ammo intizom uchun muddatlar beriladi
6 oyda nimani o’rganasiz?
HTML, CSS va JavaScriptʼda kod yoza olasiz
React kutubxonasi yordamida sayt va ilova yarata olasiz
Xalqaro kompaniyalar talabi darajasida toza kod yoza olasiz
Bizneslarning ixtiyoriy talabi va ehtiyojiga mos sayt yoki ilova yarata olasiz
Biznes vazifalarga dasturlash orqali yechim bera olasiz
Sayt va ilovalarni testdan oʻtkazasiz, xatolarni toʻgʻrilaysiz
Va yana...
- Vaqtingizni toʻgʻri boshqarishni o'rganasiz
- Rezyume tuzishni mashq qilasiz, ish qidirish va oʻzingizni namoyish eta olish boʻyicha tavsiyalar olasiz
- Fikr bildirish va uni toʻgʻri qabul qilishni oʻrganasiz
- Buyurtmachi va hamkasblar bilan qanday muloqot qilishni bilasiz
Eng muhimi, dasturlash sohasidagi tanishlaringiz safini kengaytirasiz, ekspertlar bilan aloqa oʻrnatasiz, yopiq jamiyat aʼzosiga aylanasiz
Kurs kim uchun
mos keladi?
mos keladi?
Dasturlashga yangi kirganlar uchun
Kod yozishni noldan oʻrganing va birinchi portfolioingizni yarating
Mustaqil oʻrganishni boshlaganlar
Tajribali soha mutaxassislar yordamida bilimingizni tizimlashtiring, dasturlashni oʻrganishda davom eting
Boshqa soha
vakillari
vakillari
Oʻzingizni yangi sohada sinab koʻring, ishga joylashish boʻyicha maslahatlar oling, mutaxassislar bilan netvorkingda qatnashing
Modul 1
HTML kursi
HTML kursi
HTML texnologiyasini o’rganish davomida veb-sahifalarning tuzilishini va ularning yaratailishini o’rganasiz. Shuningdek matn, sarlavhalar, paragraflar yaratish va ularni formatlash ko’nikmalariga ega bo’lsaiz. Tasvirlar, havolalar va jadvallar kabi muhim elementlardan foydalanish, audio va video kabi multimedialarni veb-saytga joylashni o’rganasiz.
- Kurs haqida
- WEB haqida
- Kirish
- Development Environment (Dasturlash Muhiti)
- Hujjat strukturasi va "!DOCTYPE"
- Elementlar va attributlar
- Headings (Sarlavhalar)
- Paragraphs (Abzaslar)
- Styles (Stillar)
- Formatting (Formatlash)
- Comments (Izohlar)
- CSS 1-qism
- CSS 2-qism
- Links (Havolalar)
- Images (Rasmlar)
- Tables (Jadvallar)
- Lists (Roʻyhatlar)
- ID
- Class
- Block va “Inline” elementlar
- div va span
- Forms 1-qism
- Forms 2-qism
- Forms 3-qism
- Layout va Semantics
- Head
- Audio, Video va Youtube
- En yaxshi misollar (Best practices)
- Loyiha (Project)
Modul 2
CSS kursi
CSS kursi
CSS texnologiyasi sizga tasvirlarni o'zingiz xohlagan joyga joylashtirishni, maketlarni boshqarishni,matnlarga ko'zni qamashtiruvchi shriftlar, ranglar va uslublar qo'shishni, hatto ajoyib animatsiyalar yaratishni o'rgatadi. Shuningdek, veb-saytlaringiz telefonlardan tortib to katta o’lchamdagi gadjetlarda ham ajoyib ko'rinishga ega bo’ladigan o’zgaruvchan dizayn yaratishni o’rgatadi.
- Kirish
- CSS va uning versiyalari. Kurs loyihasi
- HTML hujjat va CSS. Loyiha strukturasi
- Selectors (Tanlab oluvchilar)
- Comments (Izohlar)
- Specificity (Oʻziga xoslik)
- Inheritance (Meros olish)
- Combinators (Kombinatorlar)
- Classʼlar va qoʻshma (combined) selektorlar
- Class yoki ID. “!important” haqida
- Loyihani yaxshilash
- Box model (Quti modeli). Margin, Padding, Border
- Margin collapsing. Shorthands (Qisqartmalar)
- Height (balandlik), Width (kenglik). Max / Min - height / width
- “Display” xossasi
- Text-align, Vertical Align va Float
- Text decoration. Pseudo klasslar va qoidalarni guruhlash
- Asosiy xossalar yordamida loyihani yaxshilash (1-qism)
- Asosiy xossalar yordamida loyihani yaxshilash (2-qism)
- Asosiy xossalar yordamida loyihani yaxshilash (3-qism)
- Joylashish va Static qiymati
- Relative va Fixed
- Absolute va Sticky
- Z-index va Overflow
- Positioning yordamida loyihani yaxshilash
- Fon (Background)
- Rasmlarni uslublash (Styling images)
- Gradient va filterlar (Gradient and Filters)
- Rasmlar (images) yordamida loyihani yaxshilash
- Formalarga uslub (Style) berish (1-qism)
- Formalarga uslub (Style) berish (2-qism)
- Formalar yordamida loyihani yaxshilash
- Oʻlchov birliklari (Units)
- Foiz (%) oʻlchov birligi
- “em” oʻlchov birligi
- “rem” oʻlchov birligi
- Viewport oʻlchov birligi
- Units yordamida loyihani yaxshilab olish
- Responsive Web Design (RWD)
- Media queries
- Breakpoints
- RWD yordamida loyihani yaxshilash (1-qism)
- RWD yordamida loyihani yaxshilash (2-qism)
- Shriftlar (Fonts)
- Yangi shrift (font) qoʻshish
- Local font qoʻshish
- Shrift (font) xossalari
- Shrift (fonts) yordamida loyihani yaxshilab olish
- 2D transforms
- 3D transforms
- Transitions
- Animations (1-qism)
- Animations (2-qism)
- CSS Advanced yordamida loyihani yaxshilash
- Flexbox: asos va terminlari
- Flexbox: flex-direction, flex-wrap, flex-flow va justify-content
- Flexbox: align-items va align-content
- Flexbox: order, flex-grow va flex-shrink
- Flexbox: flex-basis, flex va align-self
- Flexbox yordamida loyihani yaxshilash
- CSS Grid
- Best practices
- Loyihani yakunlash. Kurs yakuni
Modul 3
Bootstrap
Bootstrap
Bootstrap frameworki sizga tez, oson, va moslashuvchan veb-saytlar yaratish imkonini beradi. Asosiy sahifalar, navigatsiya paneli, tugmalar va boshqalar, barchasi Bootstrap-ning oldindan o'rnatilgan komponentlari va klasslari bilan. Bootstrap rasmlar va forma elementlaridan tortib, veb-saytlaringiz dizayni va o’lchamini o’zgartirmagan holatda, istalgan qurilmada ochishini ta’minlab beradi. Bootsrap yordamida minimal kodlash bilan zamonaviy va professional ko'rinishdagi veb-saytlarni yaratasiz.
- Kirish
- Bootstrap va uning versiyalari. Kurs loyihasi
- Bootstrapʼni oʻrnatib olish
- Breakpoints va Containers
- Grid (1-qism)
- Grid (2-qism)
- Columns
- Gutters
- Tipografiya (Typography)
- Rasmlar (Images)
- Jadvallar (Tables)
- Formalar. Form control
- Select. Checks & Radios. Range
- Input group
- Floating labels. Form layout
- Validation
- Accordion, alerts, badge, breadcrumb
- Button, button group
- Card
- Carousel
- Collapse, Dropdowns, List group
- Modal
- Navs, tabs, navbar
- Offcanvas, pagination
- Popover, progress
- Scrollspy, spinners
- Toasts, Tooltips
- Clearfix, coloured links, ratio, position
- Visually hidden, stretched links, text-truncation
- Fon, chegaralar, ranglar (background, borders, colors)
- Display, flex
- Float, interactions, overflow
- Joylashuv, soyalar, oʻlcham (position, shadows, sizing)
- Masofa, matn (spacing, text)
- Vertikal tekislash, koʻrinish (vertical align, visibility)
- Bootstrap icons
- Bootstrapʼni moslashtirish
- Loyiha (1-qism)
- Loyiha (2-qism)
- Loyiha (3-qism)
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
Modul 4
SASS
SASS
Sass bilan CSS ish jarayonini soddalashtiring! Ushbu texnologiya sizning mavjud CSS bilimlaringizdan foydalanib, o’'zgaruvchilar, miksinlar va nesting orqali toza va har qanday brauzer qo'llab-quvvatlaydigan CSS kodlarini yozishga imkon beradi. Takroriy vazifalarni avtomatlashtirish va ulardan qayta foydalanish xususiyatlari orqali ish samaradorligini oshiradi.
- Kirish
- Bootstrap va uning versiyalari. Kurs loyihasi
- Bootstrapʼni oʻrnatib olish
- Breakpoints va Containers
- Grid (1-qism)
- Grid (2-qism)
- Columns
- Gutters
- Tipografiya (Typography)
- Rasmlar (Images)
- Jadvallar (Tables)
- Formalar. Form control
- Select. Checks & Radios. Range
- Input group
- Floating labels. Form layout
- Validation
- Accordion, alerts, badge, breadcrumb
- Button, button group
- Card
- Carousel
- Collapse, Dropdowns, List group
- Modal
- Navs, tabs, navbar
- Offcanvas, pagination
- Popover, progress
- Scrollspy, spinners
- Toasts, Tooltips
- Clearfix, coloured links, ratio, position
- Visually hidden, stretched links, text-truncation
- Fon, chegaralar, ranglar (background, borders, colors)
- Display, flex
- Float, interactions, overflow
- Joylashuv, soyalar, oʻlcham (position, shadows, sizing)
- Masofa, matn (spacing, text)
- Vertikal tekislash, koʻrinish (vertical align, visibility)
- Bootstrap icons
- Bootstrapʼni moslashtirish
- Loyiha (1-qism)
- Loyiha (2-qism)
- Loyiha (3-qism)
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
- Qoʻshimcha CSS freymvorklar
- Kurs yakuni, keyingi rejalar
Modul 5
Git asoslari
Git asoslari
Git texnologiyasi loyihadagi kodlaringizni samarali boshqarish imkonini beradi. Kodingizdagi o'zgarishlarni kuzatish, boshqa dasturchilar bilan hamkorlik qilish va kerak bo'lsa kodingizda o’zgarishlardan oldingi versiyalariga qayta olasiz. Github platformasida repositories, commits va branches kabi tushunchalarni tushunib olib, loyihalar ustida muammosiz ishlaysiz.
- Kirish
- Git haqida
- MacOS uchun Git oʻrnatish
- Windows uchun Git oʻrnatish
- Git bilan ishlash
- Git ishlash tamoyili
- Loyihaga Git qoʻshish
- Staging maydoni
- Commits
- Git tarixi (history)
- Gitignore
- Git remote
- Git push & pull
- Nizoni hal etish (merge conflict)
- Jamoaviy ishlash
- Tarmoqlanish (Branching)
- PR yaratish
- FAQ
- Kurs yakuni
Modul 6
Javascript asoslari
Javascript asoslari
JavaScript yordamida veb-saytlaringizni jonlantiring! JavaScript dasturlash tili sizga interaktivlik kuchini beradi. Statik HTML sahifalaridan tashqariga chiqamiz va veb-saytlarimizni dinamik va jozibali qilamiz.Javascript oʻzgaruvchilar, maʼlumotlar turlari va boshqaruv oqimi kabi asosiy tushunchalar yordamida animatsiya qoʻshish, foydalanuvchi maʼlumotlarini qayta ishlash va moslashuchan veb-sahifalarni yaratish vositalarini taqdim etadi. JavaScripti bilan veb-saytlarni passivdan interaktivga aylantirishni oʻrganamiz.
- Kirish
- Javascript va uning versiyalari
- Salom dunyo!
- Qiymat va oʻzgaruvchilar
- Maʼlumot turlari
- let, const va var
- Asosiy operatorlar
- String
- Mantiqiy operatorlar
- Turni (type) oʻzgartirish
- Funksiya va uni eʼlon qilish
- Function expression va arrow function
- Funksiyalar boʻyicha amaliyot
- Array
- Array methods
- Obyektlar (Objects)
- Obyekt metodi (Object methods)
- if / else
- switch
- for
- while
- Oqim boshqaruvi boʻyicha amaliyot
- DOM
- Elementlarni tanlab olish
- Elementlarni oʻzgartirish
- Elementlarni qoʻshish va oʻchirish
- Hodisalar (events)
- Koʻp uchraydigan hodisalar
- DOM boʻyicha amaliyot
- Kurs yakuni
Modul 7
Javascript advanced
Javascript advanced
JavaScript Advanced kodlash ko'nikmalaringizni keyingi bosqichga olib chiqadi. Javascript Advanced yordamida obyektga yo'naltirilgan dasturlash, Promises va async/wait bilan asinxron kodni bajarish va kengaytirilgan DOM manipulyatsiyasi kabi kuchli xususiyatlar orqali murakkab foydalanuvchi interfeyslarini yaratish, real vaqtda ma'lumotlar bilan ishlash va samarali, kengaytiriladigan veb-ilovalarni yaratish kabi imkoniyatlarga ega bo’lamiz.
- Kirish
- Destructuring, spread va rest operatorlari
- Short circuit, Nullish va Optional chaining
- Maps va Sets
- JS Runtime va Engine
- EventLoop
- Hoisting va TDZ
- Value va reference ma’lumot turlari
- “this” kalit soʻzi
- Higher Order Functions (HOF)
- call, bind va apply metodlari
- Style, attribute va class’lar bilan ishlash
- Hodisa tarqalishi (event propagation)
- DOM’ni aylanib chiqish
- OOP
- JS’da OOP
- Constructor Function
- Prototiplar (Prototypes)
- ES6 klasslari (Classes)
- Inheritance
- Encapsulation
- OOP boʻlimiga xulosa
- Async, API
- HTTP request
- Promise
- Async/await
- Loyiha: Kirish
- Loyiha: UI
- Loyiha: Valyutalar roʻyxati
- Loyiha: Valyuta konvertatsiyasi
- Loyiha: Keyingi qadamlar
- Yakun
Modul 8
Typescript asoslari
Typescript asoslari
TypeScript yordamida JavaScript-ni yuqoriolib chiqamiz! Ushbu texnologiya kodingizni statik kod yozish bilan mustahkamlaydi va veb-saytingizni ishga tushirmasdan oldin xatolarni aniqlash imkoniga ega bo’lasiz .TypeScript JavaScript kodlariga aniqlik va struktura qo'shib, katta loyihalarni saqlash va hamkorlik qilishni osonlashtiradi.
- Kirish
- Typescript haqida
- Dasturlash muhiti
- Typescript asoslari
- Funksiya va interfeyslar
- Klasslar va obyektlar (Classes and Objects)
- Generics
- Modules
- JSʼda TS
- Bagsizlash (Debugging)
- Lintlash va formatlash (Linting and Formatting)
- Yakun
Modul 9
ReactJS
ReactJS
ReactJS bilan komponentlarga asoslangan dasturlashni amalga oshiramiz! ReactJS orqali veb-saytingiz uchun takroriy kodlarsiz, murakkab interfeyslarni birlashtirishga imkon beruvchi, qayta ishlatiladigan qurilish bloklarini yaratish imkoniga ega bo’lasiz. ReactJS sizga o’zgaruvchan ma’lumotlarni boshqarish bilan qayta foydalanish mumkin bo'lgan UI komponentlarini yaratishda yordam beradi. Ushbu texnologiya orqali foydalanuvchi interfeyslarini vizualizatsiya qilishni osonlashadi. Dinamik va sezgir veb-ilovalarni yaratibgina qolmasdan nafaqat ajoyib ko’rinishga ega, balki samarali va texnik xizmat ham ko’rsata oladi.
- Kirish
- React bilan tanishuv
- Dasturlash muhitini sozlash
- TSX (Typescript XML)
- Class komponentlar
- Funksional komponentlar
- Komponent hayot davri (lifecycle)
- Komponent holati (state)
- Hodisalar bilan ishlash
- Roʻyxatlar (lists)
- Shartli koʻrsatish
- Forma va boshqariladigan komponentlar
- Component Composition
- Context API
- Xato bilan ishlash
- React Router bilan tanishuv
- Route va Query parametrlari
- Nested routes
- Route qoʻriqchilar (Route Guards)
- Programmatik navigatsiya
- Redux bilan tanishuv
- Redux’ni sozlash
- Actions va Action Creators
- Reducers
- Functional component’da Redux
- Redux Thunk
- Redux Toolkit
- Redux DevTools
- Yuqori tartibli komponentlar
- Render Props
- Context API (qaytarish)
- React Hooks
- Custom hooks
- Optimallashtirish
- NextJS (qisqacha)
- Loyiha bilan tanishuv
- React loyihani yaratish
- Asosiy UI Layout
- OpenAI API
- Form component
- OpenAI bilan ma’lumot almashish
- OpenAI javobini chiqarish
- Dastur State’tini boshqarish
- Xatolar bilan ishlash
- Validatsiya bilan ishlash
- Responsiveness
- Soʻrov tarixi (Requests history) (1-qism)
- Soʻrov tarixi (Requests history) (2-qism)
- Text Editor qoʻshish
- Feedback yigʻish
- Sharing feature
- User register
- User login
- User bilan ishlash
- Multi-Language
- Lending sahifa qurish (Building the Landing Page)
- Testing va Debugging
- Unit Testing
- E2E Testing
- Deployment and Hosting
- User Analytics
- Project Wrap-up and Future Enhancements
- Loyiha taqdimoti
- Kurs yakuni
Modul 10
Intervyuga tayyorgarlik
Intervyuga tayyorgarlik
O’z sohangizdagi eng yirik va top kompaniyalarda ishlashni yoki shunday kompaniyalarda intervyu o’tkazishni orzu qilganmisiz? Ish uchun ntervyular qo'rqinchli bo'lib tuyulishi mumkin, lekin ular asosan ish beruvchi bo’lajak xodim o’rtasidagi suhbatlar bo'lib, unda siz o'z mahoratingizni ko'rsatasiz va nima uchun siz ushbu kompaniya nega sizni tanlashi kerakligi haqida faktorlarni ko’rsatib berasiz.
- Kursga kirish
- HTMLʼga oid suhbat savollari
- CSS box model va layout boʻyicha savollar
- Responsive design va media soʻrovlari
- Tavsiyalar
- Javascript Core**
- Scope, closures va callbacks
- ES6+ xususiyatlari
- Tavsiyalar
- React component lifecycle metodlari
- State va props
- Events va forms
- Tavsiyalar
- Asosiy React hooks (useState, useEffect, useContext)
- Hooks ishlatish qoidasi va eng yaxshi amaliyotlar
- Class komponentlarini hooks bilan almashtirish
- Tavsiyalar
- Redux asosiy tushunchalari (store, actions, reducers)
- Redux Thunk yordamida asinxron amallarni boshqarish
- ContextAPI
- Tavsiyalar
- Typing React komponentlari va props
- TypeScriptʼni React va Redux bilan ishlatish
- Tavsiyalar
- React ilovalarida routingʼni sozlash
- React Router va Next.js
- Dinamik routing va route parametrlari
- Tavsiyalar
- Jest va React testing kutubxonasi
- React ilovalarini Debug qilish
- Code quality tools va amaliyotlar
- Tavsiyalar
- Veb faoliyatni yaxshilovchi texnikalar
- Sahifani yuklash vaqtini qisqartirish va renderlashni optimallashtirish
- Lazy loading va code splitting
- Tavsiyalar
- Browser developer tools
- Continuous integration va deployment (CI/CD) pipelines
- Deploying va hosting web applications
- Tavsiyalar
- Frontendchilar uchun asosiy soft skillʼlar (kommunikatsiya, jamoada ishlash, moslashuvchanlik)
- Suhbat paytida soft skillʼlarni qanday qilib samarali namoyish etish kerak
- Tavsiyalar
- Frontend dasturchilari uchun ish imkoniyatlari
- Samarali rezyume va portfolio yaratish
- Ishga kirish uchun elektron pochta xabarlarini yozish
- Texnik intervyular va kodlash qiyinchiliklariga tayyorgarlik
- Ish qidirish jarayonini samarali boshqarish
- Suhbat oʻtkazish va suhbatdan keyingi etiket
- Kurs yakuni
Nimaga ega boʻlasiz?
Ommabop savollar
Kursda siz hammasini boshidan boshlaysiz, chunki kurs sohaga endi kirib kelayotgan yangilarni hisobga olib yaratilgan. Sizdan oʻqishga xohish va harakat talab qilinadi, xolos. Kursimizdagi qadam-baqadam yoʻllanmalar va amaliy vazifalar oʻrganib olishingizni osonlashtiradi. Savol berishdan va jamiyatda faol boʻlishdan uyalmasangiz boʻldi.
Oʻzingizga qulay tezlikda oʻqiy olishingiz uchun darslar moslashuvchan qilib ishlangan. Kurs metodistlari haftasiga necha soatdan oʻqishga vaqt ajrata olishingizni hisoblab chiqqan. Haftasiga 3–4 soatdan vaqt ajratsangiz, kursni muammosiz tugata olasiz. Undan tashqari kurs haftalarga boʻlingan, materiallardan esa muddatsiz foydalanish mumkin.
Biz sizga 6 oy ichida hech qanday qoʻshimcha haqlarsiz boʻlib toʻlash imkonini beramiz. Agar sizda boʻlib toʻlash boʻyicha yoki kursni tanlashda savollar paydo boʻlsa, yordam jamoamiz koʻmak berishga tayyor.
Kurs 11 ta modul va 300 dan ortiq vazifa, shuningdek, har oylik ekspert tomonidan beriladigan yangi keyslarni oʻz ichiga oladi. Bu dasturlashdagi yangiliklardan ortda qolmay, aktual va amaliyotga asoslangan taʼlim olish imkonini beradi.
Kursni yuqori malakali ekspert olib boradi, bu esa materialni chuqur va izchillikda tushunish imkonini beradi. Oʻqituvchimiz Ulugʻbek Samigjonov – sohasida salmoqli tajriba va yutuqlarga ega professional. Oʻqituvchi haqida koʻproq maʼlumotni saytimizdagi kurs sahifasadan olishingiz mumkin.
Videokontentning umumiy hajmi 55 soatni tashkil etadi. Kursni oʻtash tezligi individual boʻlib, faqat sizga bogʻliq. Videodan tashqari materialni mustahkamlashga qaratilgan amaliy topshiriqlar uchun ham vaqt ajratish lozim. Kursni kun tartibingizga moslab olsangiz boʻladi, sotuv boʻlimi esa savollar paydo boʻlganida yordam koʻrsatadi.
6 oy ichida mutaxassisdan toza kod yozishni oʻrganing.
Birinchi qadamni qoʻying yoki kasbingizni oʻzgartiring
Boʼlib toʼlash
3 VA 6 MARTALIK TOʼLOV
3 oydan 6 oygacha foizsiz muddatli toʼlov
asosida kursni xarid qilishingiz mumkin.
500 000 soʼm × 6 oy
Yoki
1 000 000 soʼm × 3 oy
Yoki
1 000 000 soʼm × 3 oy
XARID QILISH
Barcha huquqlar himoyalangan.
© Mohirdev 2023.
© Mohirdev 2023.
KOMPANIYA
