კურსის აღწერა
კურსის განმავლობაში ისწავლი ვებგვერდის შექმნას ნულიდან. დეტალურად გაეცნობი HTML-ის ძირითადად სტრუქტურას და CSS-ის სტილებს (სილაბუსის მიხედვით). გაიგებ, როგორ უნდა ააწყო გვერდის სტრუქტურა, როგორ უნდა დაამატო სტილები და ლოგიკა.
კურსის დასრულების შემდეგ დამოუკიდებლად შეძლებ ვებგვერდის ვიზუალის აწყობას, რომელიც მორგებული იქნება დესკტოპის, პლანშეტისა და მობილურის რეზოლუციებზე.
კურსის მენტორები
ქეთევან გაგუა
Front-end დეველოპერი, ლექტორი
“ჩემი მიზანია, რომ ყველა სტუდენტმა მიიღოს საფუძვლიანი ცოდნა და პრაქტიკული გამოცდილება, რაც მათ რეალურ სამუშაო გარემოში სწრაფად ადაპტირებასა და კარიერის საწყის ეტაპზე წარმატებული ტექნიკური და ზოგადი გასაუბრების გავლაში დაეხმარება”.
4 წელზე მეტია, რაც დეველოპმენტის პროცესშია ჩართული. როცა პირველად ბრაუზერში ტექსტი “Hello World” გამოიტანა, მიხვდა, რომ ის საქმე იყო, რაც უნდა ეკეთებინა. ამის შემდეგ დაიწყო დამოუკიდებლად ვებ-დეველოპმენტის სწავლა და და დასაქმდა მარქაფ დეველოპერად.
არის განათლების მეცნიერებების მაგისტრი და ფლობს სხვადასხვა სერტიფიკატსა და პროფესიულ კვალიფიკაციას, როგორც ქართული, ასევე საერთაშორისო კურსებიდან. არის Epam Georgia Lab-ის წევრი, რადგან წარმატებით გაიარა მათი 9 თვიანი გადამზადების პროგრამა.
ორი წელია, რაც თავის ცოდნასა და გამოცდილებას უზიარებს სხვებს, მათ შორის სტუდენტებს ბიზნესისა და ტექნოლოგიების უნივერსიტეტში, სადაც ასწავლის მესამე კურსის სტუდენტებს Front-End დეველოპმენტს. გარდა ამისა, ასწავლიდა 4 ჯგუფს საგანმანათლებლო დაწესებულება ედუსითიში. და მოზარდებს – საერთაშორისო IT სკოლა KiberOne-ში.
აქტიურად მონაწილეობს ისეთ პროექტებში, როგორიცაა “Woman in AI”, “Coding School
for 1500 Women” და ”Women mentorship for Tech Programmes”, არის რეაქტ დეველოპერი Prime-ში და Velara system-ის Front-end (markup-design) დეველოპერი.
უმუშავია ისეთ საერთაშორისო პროექტებზე როგორებიცაა: Prime-ის შიდა გაყიდვების პორტალი, Velara Systems-ის პროექტები (დიზაინი და მარქაფი), Coding School for 1500 Women (საერთაშორისო), Woman in AI, Art space.
ვებ პროგრამირების კურსის სილაბუსი
Workshop 1
- front end დეველოპმენტის კომპონენტების განხილვა
- html5 დოკუმენტის სტრუქტურა
- Visual Studio Code კოდის ედიტორის გარჩვეა
- vs code extension-ების განხილვა
- პროექტისათვის დოკუმენტების ორგანიზება
- html ტეგების დამატება
Workshop 2
- css ფაილების დაკავშირება
- css სელექტორების თვისებები და მათი მნიშვნელობის განხილვა
- html ატრიბუტები
- აბსოლუტური და რელატიური მისამართები
- Figma-ში მუშაობა
- chrome devtools
Workshop 3
- html მნიშვნელობის მქონე ტეგები ვებ გვერდის სტრუქტურისთვის
- display property – block/inline/inline-block/none
- ბრაუზერის სტილების განულება
- რუკის დამატება
Workshop 4
- css ბოქს მოდელი
- html / css კომენტარი
- ფონტები და შესაბამისი ფორმატები ვებისთვის
- ფონტების სტილების/ ზომების მართვა
- ტექსტის ფორმატირება
- საფინალო პროექტზე მუშაობის დაწყება
Workshop 5
- git-ის შესავალი / version control system
- github – ზე რეგისტრაცია
- რეპოზიტორის შექმნა
- github desktop-ის განხილვა
- პროექტის ატვირთვა / ჩამოტვირთვა
- ცვლილებების შეტანა
- git commands
- აბსოლუტური მისამართი
Workshop 6
- flexbox – ის გარჩევა
- fontawesome / icomon;
- ფსევდო კლასები
- border radius
- კოდის ვალიდაცია
- საფინალო პროექტის მიმოხილვა
Workshop 7
- პოზიციონირების განსაზღვრა – position property – static/absolute/relative / fixed / sticky
- transform property
- ჩრდილი – box-shadow / text-shadow
Workshop 8
- hover ეფექტები
- transition property
- keyframe animations
- background image property
- საფინალო პროექტის მიმოხილვა
Workshop 9
- ვებ გვერდის რესპონსიული წყობა
- css@media-ს გამოყენება
- breakpoints in responsive web design
- responsive checker
Workshop 10
- Responsive პრაქტიკა (ჩვენ თვითონ ვაწყობთ დიზაინს)
- დამატებითი პრეფიქსერები – autoprefixer css
Workshop 11
- css grid layout module
- css ცვლადები
- ფსევდო ელემენტები
- საფინალო პროექტის მიმოხილვა
Workshop 12
- html form elements
- meta ტეგები ბრაუზერებისთვის
- სოციალური ქსელებისთვის ინფორმაციის ოპტიმიზაცია
- საფინალო პროექტის მიმოხილვა
Workshop 13
- ჯავასკრიპტის სინტაქსის განხილვა
- პრიმიტიულ მონაცემთა ტიპები
- ცვლადები
- პირობითი გამოსახულება
- რა არის dom?
- dom მანიპულაციები ჯავასკრიპტში
Workshop 14
- ჯავასკრიპტის ფაილების დამატება საიტზე
- html ელემენტებთან მუშაობა
- events(onclick, focus,keydown)
- burger bar ფუნქციონალის დამატება
