თემის მონახაზი

  • კურსის მიზანი

    საბაზისო კურსი მიზნად ისახავს დამწყები დეველოპერებისთვის და/ან ენთუზიასტებისთვის  ფუნდამენტური ცოდნის გადაცემას, პრაქტიკული უნარ-ჩვევების გამომუშავებას და დასაქმების ბაზრისთვის კონკურენტუნარიანი ჯუნიორ დეველოპერისთვის საჭირო გზის გავლაში დახმარებას.

    კურსი მსმენელს საშუალებას აძლევს მომავალში დამოუკიდებლად განაგრძოს სწავლა და განვითარება ან ჩაირიცხოს პროფესიულ კურსზე და გადადგას დიდი ნაბიჯები უფრო რთული გამოწვევებისკენ პროგრამირებაში.

    სტუდენტები შეისწავლიან ვების ძირითად პრინციპებს, განვითარების ეტაპებს, HTML, CSS, SASS, JavaScript-ის საფუძვლებს და გამოიყენებენ ამ ცოდნას მარტივი ვებ აპლიკაციების შესაქმნელად.


  • #1 შესავალი დეველოპმენტში

    • რა არის ვებ დეველოპმენტი                                                                                

    • რატომ უნდა ვისწავლო ვებ-დეველოპმენტი:

      • კარიერა და სფეროს გამოწვევები

      • რა დრო მჭირდება ფრონტის სასწავლად

      • რა ძალისხმევაა საჭირო ფრონტის სასწავლად

    • ვებ დეველოპმენტის მიმართულებები

      • Front-end Development

      • Back-end Development

    • კურსის მიზანი და როადმეფი

      • HTML - მიმოხილვა

      • CSS - მიმოხილვა

      • JS - მიმოხილვა

      • Responsive design - მიმოხილვა

      • ვერსიის კონტროლი

      • კოდის ედიტორი - მიმოხილვა

    • Front-end ის ტექნოლოგიები და მცირე მაგალითის დემონსტრაცია ვიზუალიზაციისთვის.

      • HTML

      • CSS

      • SASS

      • JavaScript

    • ბიბლიოთეკები და ფრეიმვორქები:

      • React - რა არის რეაქთი რაში გამოიყენება

      • Angular - რა არის ანგულარი და რაში გამოიყენება

      • Vue - რა არის ვიუ და რაში გამოიყენება

    • Front-end დეველოპერის როლი პროექტში

    • კომუნიკაცია მენეჯმენტთან და პროექტებზე მუშაობის პროცესი.

      • მუშაობა:

        • დიზაინერთან

        • ფროდაქთ მენეჯერთან

        • სკრამ მასტერთან

    • როგორ მოვემზადოთ ფრონტის შესწავლისთვის

      • დეველოპმენტ გარემო

      • Github -  მცირე მიმოხილვა

      • კოდის ედითორები - vs code, sublime text, atom, webstorm

      • დიზაინის ხელსაწყოები - Figma


  • #2 ინტერნეტის მუშაობის პრინციპები და განვითარების ეტაპები

    შესავალი ვებ დეველოპმენტში:

    • ინტერნეტის შექმნის მოკლე ისტორია

    • ინფორმაციის გადაცემის პრინციპი

      • ერთიანად გადაცემა

      • პაკეტებად გადაცემა

      • განვითარების ისტორია

        • DSL

        • კაბელი

        • Fiber ოპტიკური კაბელი

    • დღევანდელი ინტერნეტის მუშაობის პრინციპები

      • TCP/IP პროტოკოლი

    • ვებ დეველოპმენტის ისტორია

      • ვების ფუნდამენტური ბლოკები: HTML, URI/URL, HTTP/HTTPS


  • #3 კოდის წერის სამუშაო გარემო

    • ედიტორები

    • ექსთენშენები


    HTML - სინტაქსი

    • რა არის HTML

    • ელემენტი

      • სინტაქსი - გამხსნელი დამხურავი და თვითდახურვადი თეგები

    • ატრიბუტი

    • <!Doctype html>


    ძირითადი სტრუქტურა - თეგების წერის წესები და სინტაქსი: 

    • head

      • head, body

      • meta (meta attributes)

      • link

      • style

      • title

    • body

    HTML ელემენტები და თეგები

    • პარაგრაფი

    • ჰედინგები

    • ლინკები

    • ფოტოები

    • კომენტირება HTML - ში


    • HTML  ატრიბუტები

      • class, id, name, title


    დოკუმენტის გასტილვა ატრიბუტების გამოყენებით - style ატრიბუტი


    html ის სარენდერო გარემო:

    • ბრაუზერები

      • როგორ მუშაობს ბრაუზერი და როგორ არენდერებს კოდს ვიზუალის სახით

      • ძრავის მიმოხილვა

    წერის სტილი:

    • წერის სტილი და გამოყოფა


  • #4 HTML - სემანტიკური HTML


    • სემანტიკური html - ის მნიშვნელობა

      • Accessibility

      • SEO

      • Code Clarity

      • Future-proofing


    • სემანტიკური HTML - ის თეგები და მიმოხილვა

      • header

      • footer

      • main

      • aside

      • section

      • article

      • nav

      • ul

      • li


  • #5 CSS - სინტაქსი და ძირითადი მანიპულაციები

    • CSS სინტაქსი და წერის სტილი
    • კომენტირება CSS - ში
    • CSS -ის მიმოხილვა, რა არის CSS და მისი გამოყენების გზები
      • თეგში ჩაწერილი CSS (inline)
      • head თეგში ჩაწერილი CSS
      • გამოყოფილ ფაილში ჩაწერილი CSS
    • CSS  მიმთითებლები ( selectors)
    • CSS  ძირითადი ბრძანებები(ეს არ არის ექსკლუზიური სია თუმცა ყველაზე ხშირად გამოყენებადი ბრძანებებია):
      • font-size; font-family; color; background-color;padding; width; border; border-radius; text-align; text-decoration; list-style; opacity; 
    • CSS Box-model


    • Display block; inline-block; inline;


  • #6 HTML - ცხრილები


      • ცხრილის სტრუქტურა

      • ცხრილის გამოყენების პრაქტიკები

      • ცხრილის თეგები:

        • table, tr, td, th, thead, tbody, tfoot,colgroup, col, caption, summary


  • #7 HTML - ფორმები


      • HTML ფორმის სტრუქტურა და მნიშვნელობა

      • შეყვანის ყელსაწყოები ტიპები(input types):

        • text, password, email, number, date, time, url, search, color, range, radio, checkbox, file, submit, reset

        • select, textarea, button, label, legend, action, method


  • #9 CSS - მანიპულაციები ელემენტების განლაგებაში 2

    • Display: grid

    • სად რომლის გამოყენება ჯობია გრიდის თუ ფლექსის. მაგალითით ვიზუალიზაცია


  • #11 CSS - პოზიციები (დოკუმენტის ნორმალური ნაკადი და ნაკადის დარღვევა)

    • Css პოზიციები

      • გამოყენების წესი და საუკეთესო მიდგომები

      • პოზიციების გამოყენება პრაქტიკული ქეისის განხილვით

      • relative

      • absolute

      • static

      • sticky

      • Fixed