7.1 İlk html-sənəd
Gəlin ilk html-sənədimizi (html-fayl) yaradaq. Adətən web-layihənin əsas html-faylı index.html adlanır: bu əla ənənədən uzaqlaşmamağı təklif edirəm. Bunun üçün sağ siçan düyməsi ilə web-storm-10 qovluğuna klikləyirik:
Və faylın adını daxil edirik:
WebStorm sizin üçün faylı yaradacaq və onu dərhal açacaq:
Əslində bu boş html-sənəddir. Burada gördüyünüz hər şey — bu, xidmət məlumatlarıdır. Bütün faktiki məlumatlar <body> və </body> taglarının içində yerləşəcək. Taglar nədir, növbəti mühazirədə daha ətraflı öyrənəcəksiniz.
Bu tagların içində maraqlı və motivasiyaedici bir mesaj yazaq. Məsələn belə:
10 min millik yol bir addımla başlayır!
Sadəcə olaraq bunu kopyalayın və 8-ci sətrə yapışdırın (tagların <body> içərisinə). Ümumiyyətlə, mətnləri kopyalamağa alışın — bu, səhvləri və yazı xətalarını azaldır. Budur, hazırda mənim sənədim belə görünür:
Əgər mənim mətn variantım sizin üçün kifayət qədər tünd və motivasiyaedici deyilsə, özünüz birini seçin — axı bu sizin ilk Web-layihənizdir. Seçim üçün daha 3 variant təklif edirəm:
- "Qaranlıq tərəf mənə işıqlı tərəfin verə bilməyəcəyi bir şeyi təklif edir: əsl azadlıq."
- "Qaranlıq tərəf — sərhəd tanımayan gücün yoludur."
- "Mən öz taleyimi seçirəm və o, qaranlıqdadı."
7.2 İlk layihənin işə salınması
İndi gəlin layihəmizi "işə salaq" və brauzerin bizim html-faylı necə göstərəcəyinə baxaq.
Layihəni işə salmaq üçün yuxarı menyuda yaşıl üçbucağa klikləyin. Onun solunda icra olunacaq faylın adı yazılıb:
Faylınızı işə salmaq üçün Shift+F10 düymələrinə də basmağı istifadə edə bilərsiniz.
Gəlin bunu edək, və brauzerin sizin ilk html-faylınızı necə göstərəcəyinə baxaq. Mənim brauzerim bunları göstərdi:
Narıncı rənglə yazılmış url-dəki host — WebStorm-un başladığı layihəmizin veb-serveridir.
Yaşıl rənglə yazılmış url-dəki yol — layihəmizin kökündən index.html-ə gedən yoldur.
Mavi rəng — WebStorm üçün xidməti məlumatdır.
Qırmızı rənglə seçilmiş mətn, bizim html-sənədimiz əsasında brauzerin göstərdiyi mətndir.
7.3 Səhvlərlə iş
Bəs birdən biz hansısa səhv etsək, nə baş verəcək? Brauzer və WebStorm buna necə reaksiya verəcək?
Gəlin, 9-cu sətirdəki ilk simvolu silək və WebStorm-un reaksiyasına baxaq. Baxın, məndə necə oldu:
Burada nə görürük:
- 9-cu sətirdəki söz artıq tag olmayıb, buna görə də WebStorm onu sarı rəngdə yox, boz rəngdə göstərir.
- 10-cu sətirdə bağlanan
<html>tagını görürsünüz, halbuki bağlanmadan əvvəl<body>tagı olmalıdır. Buna görə də WebStorm burada səhv görür. - Sənəddəki səhvlərin sayı sağ yuxarı küncdə göstərilir – bizdə bir səhv var.
- Səhvin yeri sağ aşağıda scrollbar üzərində də göstərilir. Uzun sənədlər üçün çox rahatdır.
İndi gəlin bu faylı işə salaq və brauzerin səhvə necə reaksiya verdiyinə baxaq:
Brauzer də tam olmayan <body> tagını sadəcə mətn kimi qəbul edir, buna görə də onu adi mətn kimi göstərir.
Bağlanan <body> tagının olmaması brauzeri də narahat etmədi: taglarla problemlər bundan da pis olur. Ümumilikdə, hər şey kifayət qədər yaxşı göründü.
GO TO FULL VERSION