ვებ დეველოპმენტი
ინფო:
4 თვე, 32 ლექცია, სამშაბათი-შაბათი, ჰიბრიდული
ონლაინ-19:30-21:30/ ფიზიკური დასწრებით-11:00-13:00 სთ
ი. ჭავჭავაძის გამზ. #33ე
ფასი: 1600 Gel (შეგიძლიათ ნაწილობრივ გადახდა)
კურსის აღწერა:
სტუდენტები გაეცნობიან ვებ-დეველოპმენტის საწყისებს – HTML, CSS, Javascript და ANGULAR-ს , რომელიც ფართოდ გამოიყენება ვებ-აპლიკაციების შესაქმნელად. კურსი შედგენილია იმგვარად, რომ სტუდენტები უკვე რამდენიმე კვირაში შეძლებენ მარტივი გვერდების შექმნას და თეორიის პარალელურად, პრაქტიკული ამოცანების კეთებას. კურსის ბოლო ეტაპზე სტუდენტები შეასრულებენ ჯგუფურ პრაქტიკულ ამოცანას, რაც მათ გარკვეულწილად შეამზადებს გუნდური მუშაობისთვის.
ლექტორი:
დავით პაიჭაძე – პროგრამული უზრუნველყოფის უფროსი ინჟინერი კომპიუტერული მეცნიერებისა და ვებდეველოპმენტის 10 წლიანი გამოცდილებით, ვებდეველოპერული კომპანია KeyTech-ის დამფუძნებელი და გუნდის ხელმძღვანელია. კარიერის განმავლობაში, დავითს უმუშავია როგორც back-end და full-stack დეველოპერად, ასევე გუნდის ლიდერად 50+ საერთაშორისო თუ ქართულ პროექტზე. მისი ხელმძღვანელობით კომპანია “ქითექი” ორგანიზაციებისთვის ვებ-აპლიკაციებს, custom software-სა და E-commerce გადაწყვეტებს ქმნის. დავითის სპეციალიზაციაში შედის მასშტაბირებადი და კომპლექსური ვებ-აპლიკაციების დაგეგმვა და შექმნა, მრავალფუნქციური გუნდების რეკრუტინგი, ჩამოყალიბება, მენეჯმენტი და ა. შ.
სილაბუსი:
მოდული 1: ვებ-დეველოპმენტის შესავალი; პირველი HTML
გვერდი
ლექცია #1: ვებ-დეველოპმენტის მიმოხილვა და სამუშაო გარემოს გამართვა
● ვებ-ტექნოლოგიების კონცეპტები – როგორ მუშაობს ვები
● Client-server არქიტექტურა – Front-end და Back-end მიმოხილვა
● HTML, CSS, და JavaScript-ის როლი და დანიშნულება – პირველი HTML
გვერდი
● ხელსაწყოები და ედიტორი (VS Code, Sublime Text)
● ინტერნეტ browser-ის developer tools და debugging
● Git-ის გაცნობა კოდის ვერსიების კონტროლისთვის
ლექცია #2: HTML საფუძვლები და ელემენტები
● ვებ-გვერდის ძირითადი სტრუქტურა (doctype, head, body) – Documet Object
Model
● ტექსტუალური ელემენტები (სათაურები, აბზაცები, სიები)
● ბმულებთან და სურათებთან მუშაობა:
■ ჰიპერბმულების შექმნა
■ სურათებისა და მულტიმედიის ინტეგრაცია
● ფორმები და input ელემენტები
მოდული 2: CSS; ვებ-გვერდის სტილისტიკა
ლექცია #3: CSS-ის შესავალი
● CSS სინტაქსი, სელექტორები და მახასიათებლები
● ფსევდო-კლასები და ფსევდო-ელემენტები
● CSS საზომი ერთეულები
● ტექსტების, პარაგრაფების და სურათების სტილებთან მუშაობა
ლექცია #4: CSS Box Model და Layout-ის აწყობის ტექნიკები
● Margin, border, padding
● Flexbox
● CSS Grid
ლექცია #5: Responsive CSS და CSS საუკეთესო პრაქტიკები
● CSS inheritance
● Responsive CSS flexbox-ის გამოყენებით
● Media queries
● საუკეთესო პრაქტიკები: BEM, Atomic CSS, etc
ბონუს ლექცია: CSS ანიმაციები და ცვლადები
მოდული 3: Javascript
ლექცია #6: JavaScript საფუძვლები
● ცვლადები, მონაცემთა ტიპები, ოპერატორები
● საკონტროლო სტრუქტურები
● შესავალი მასივებსა და ობიექტებში
ლექცია #7: Complex data types, ფუნქციები და DOM მანიპულაცია
● მასივები
● ობიექტები, პროტოტიპები, კლასები
● ფუნქციები, scope, და hoisting
● DOM მანიპულაცია და event-ებთან მუშაობა
● Event-Driven პროგრამირება
ლექცია #8: Advanced JavaScript და ასინქრონული პროგრამირება
● ES6+ features
● Callbacks
● Promises, async/await მეთოდები
ლექცია #9: HTTP და Javascript Ajax
● სერვერთან მუშაობა
● AJAX-ის შესავალი
● XMLHttpRequest-ის და Fetch API-ის გამოყენება სერვერთან საკომუნიკაციოდ
ლექცია #10: Javascript Wrap-up: Js-ის პრაქტიკაში გამოყენება
● ჩვენი HTML გვერდის Javascript-ით გაცოცხლება
● DOM მანიპულაცია
● ფორმებთან მუშაობა და სერვერზე მოთხოვნების გაგზავნა
მოდული 4: Bootstrap Framework and HTML/CSS/JS Wrap-up
ლექცია #11: Responsive Design with Bootstrap
● ჩვენი HTML გვერდის Bootstrapi-ით გადაწყობა
● HTML, CSS, JS-ის გადამეორება და პრაქტიკული დავალებისთვის მომზადება
ლექცია #12: პროექტი – ვებ-გვერდის აწყობა Bootstrap-ითა და Js-ით (Workshop)
● წინასწარმიცემული დავალების განხილვა
● პროექტის განხორციელების საუკეთესო პრაქტიკების ჩვენება
● კითხვა-პასუხი
მოდული 5: Angular – შესავალი
ლექცია #13: შესაბალი Angular-სა და TypeScript-ში.
○ რა არის Single Page Application (SPA) და Angular?
○ Angular-ის უპირატესობები
○ Angular CLI გამართვა
○ TypeScript-ისა და OOP Javascript-ის გაცნობა
ლექცია #14: კომპონენტები და მოდულები
○ მოდულარობის კონცეპტი Angular-ში
○ კომპონენტების გამოყენება და custom კომპონენტების შექმნა
ლექცია #15: Data Binding and Directives
○ Property binding, event binding
○ Structural and attribute directives
ლექცია #16: Services and Dependency Injection
○ Angular სერვისების შექმნა და გამოყენება
○ Angular Dependency injection
მოდული 5: Angular in Depth
ლექცია #17: Routing in Angular
○ Routing-ის გამართვა
○ Single Page Applications (SPA) კოცეპტი სიღრმეში
○ მრავალგვერდიანი SPA-ს აწყობა Angular-ში
ლექცია #18: Form-ებთან მუშაობა Angular-ში
○ Template-driven ფორმები
○ რეაქტიული ფორმები
○ მომხმარებლის input-ის დამუშავება და ვალიდაცია
ლექცია #19: Observable and HTTP კლიენტი
○ Using RxJS observables
○ სერვერთან ურთიერთობა Angular-ით
○ Making HTTP requests with HttpClient
მოდული 6: პრაქტიკული პროექტები – ; კურსის შეჯამება
ლექცია #20: საბოლოო პროექტის დაგეგმვა
○ საბოლოო პროექტის დაგეგმვა და დაწყება
○ ნასწავლი მასალის გამოყენება რეალურ პროექტში
ლექცია #21: პროექტის პრეზენტაცია და კურსის შეჯამება
○ პროექტის საბოლოო პრეზენტაცია
○ პროექტის ფარგლებში Feedback-ის მიცემა და მნიშვნელოვან ასპექტებზე
ყურადღების გამახვილება
ლექცია #22: კურსის შეჯამება და შემდეგი ნაბიჯები
○ სხვა ფრეიმვორკების გაცნობა
○ დისკუსია შემდგომი ნაბიჯებისა და რესურსების შესახებ
○ რეალური production პროექტების განხორციელებისთვის საჭირო მასალა
○ გუნდური მუშაობა Development-ში
○ Interview-ებისთვის მომზადება
ლექცია #23+: ჯგუფური პროექტი და პროგრესის მონიტორინგი