\n Dreamweaver on k\u00f5igi Interneti-p\u00f5histe tegevuste ema. Enamiku inimeste jaoks on Dreamweaver vaid t\u00f6\u00f6riist veebisaitide loomiseks, kuid ainult professionaalid teavad, et Dreamweaver on j\u00f5uallikas.\n<\/p>\n
\n Dreamweaveril on palju funktsioone ja valikuid, mis muudavad selle veebiarendajate k\u00f5ige lemmikumaks t\u00f6\u00f6riistaks. Sellel tarkvaral on kahtlemata k\u00f5ige tuntum IDE (integreeritud arenduskeskkond), mida praegusel turul pole \u00fchelgi teisel veebiarendustarkvaral. Kas arendus-, koost\u00f6\u00f6- ja kodeerimist\u00f6\u00f6riistad pakuvad Dreamweaver veebiarendajatele m\u00e4ngimiseks korralikku valikut. Seet\u00f5ttu on algajate veebiarendajate jaoks oluline teada, kuidas nad saavad Dreamweaverit maksimaalselt kasutada.\n<\/p>\n
\n K\u00f5ik asjatundlikke veebiarendajaid ja tavalisi veebiarendajaid eristavad aspektid on peidetud kahetsusv\u00e4\u00e4rsete intuitiivsete men\u00fc\u00fcde alla, mist\u00f5ttu on uutel veebiarendajatel raske oma oskusi t\u00e4iendada. Kuid selles artiklis n\u00e4itan teile neid Dreamweaveri peidetud ja v\u00f5imsaid funktsioone, mida on t\u00e4nap\u00e4eva turu n\u00f5udmiste t\u00e4itmiseks v\u00e4ga oluline teada. See artikkel aitab teil nendele funktsioonidele kiiresti juurde p\u00e4\u00e4seda ja pakub teile k\u00fcmmet k\u00f5ige kasulikumat h\u00e4kkimist, mis parandavad teie t\u00f6\u00f6 kvaliteeti ja parandavad oluliselt teie kodeerimist.\n<\/p>\n
\n K\u00f5ik teavad, et Dreamweaver pakub staatilist vaadet v\u00f5i meie avatud faile. K\u00fcsimus j\u00e4\u00e4b aga vastuseta sellise rakenduse nagu WordPressi d\u00fcnaamiliste vaadete kohta. D\u00fcnaamilise vaate seadistamiseks peame Dreamweaverile teatama d\u00fcnaamiliste vaadete jaoks kasutatavatest s\u00e4tetest. Selle m\u00e4\u00e4ramiseks avage HTTP-p\u00e4ringu s\u00e4tted, kl\u00f5psates vaade > Otsevaade > suvandite men\u00fc\u00fc ja seej\u00e4rel sisestage GET v\u00f5i POST, mis on teie rakenduse \u00f5igeks vaatamiseks vajalik.\n<\/p>\n
\n P\u00e4rast seda l\u00fclitage Dreamweaveris otsevaade, mis asendab kujundusvaate paneeli teie lehe reaalajas, pikslitega t\u00e4iuslikult renderdatud WebKiti vastu. Seej\u00e4rel t\u00e4iendage seda reaalajas Javascripti, DOM-i manipulatsioonide, andmebaasip\u00e4ringute, serveripoolse koodi ja renderdatud CSS-iga, mitte kujundusvaate liidese kohat\u00e4iteikooniga.\n<\/p>\n
\n Navigeerimine on tundliku veebisaidi \u00fche lehe komponent, millel peaks olema kohanemisv\u00f5ime, et rahuldada v\u00e4iksemate ekraanide vajadusi, mille puhul Bootstrap v\u00f5ib palju aidata. Bootstrap v\u00f5imaldab h\u00f5lpsasti seadistada navigeerimisriba ja l\u00fclituda horisontaalselt ribalt vertikaalsele paneelile. P\u00f5hjus on selles, et Dreamweaver toetab kogu Bootstrapi navigeerimispaindlikkust ja seda funktsiooni on lihtne kasutada t\u00f5husa ja tundliku veebisaidi v\u00e4ljat\u00f6\u00f6tamiseks.\n<\/p>\n
\n Selle kiire \u00fclevaate saamiseks on j\u00e4rgmine kiire demo selle kohta, kuidas Bootstrapi oma arenduses kasutada.\n<\/p>\n
\n Bootstrapiga navigeerimise kiirendamine algab Dreamweaveri uue dokumendidialoogiga. Lihtsalt kl\u00f5psake uues dokumendidialoogis nuppu Bootstrap Framework ja m\u00e4rkige ka eelehituse paigutuse valiku m\u00e4rkeruut, et kasutada t\u00e4isfunktsionaalseid navigeerimisvalikuid, nagu;\n<\/p>\n
\n Kui see on raske, on veel \u00fcks v\u00f5imalus. Dreamweaver v\u00f5imaldab teil luua kohandatud navigeerimisriba. Kui eelistate tumedat paletti, lisage lihtsalt klass .navbar-inverse\n<\/p>\n
\n tag. Saate isegi sellega m\u00e4ngida. Kui soovite navigeerimist alati lehe kohal kuvada, tippige .navbar-fixe-top. Kui soovite seda allpool kuvada, tippige .navbar-fixed-bottom. K\u00f5ik need Bootstrapi klassid on standardsed ja Dreamweaveri koodivihjendus toetab ka neid kodeerimist, nii et te ei pea kogu kodeerimist silmas pidama. Peate lihtsalt elementide kuvale tippima .navbar ja kuvatakse h\u00fcpikloend, kus saate valida soovitud valiku.\n<\/p>\n
\n Ajax on v\u00e4ga d\u00fcnaamilise iseloomuga. Seet\u00f5ttu peame sageli suhtlema lehega, mille \u00fcksused ei ole esimese lehe laadimisel saadaval v\u00f5i renderdamata. Need \u00fcksused v\u00f5ivad p\u00e4rast m\u00f5nda laadimisaega lehele sisestada, mist\u00f5ttu neid esimesel laadimisel ei kuvata. N\u00e4iteks kui soovite v\u00f5ib-olla muuta t\u00e4ielikult JavaScriptis juurutatud t\u00f6\u00f6riistaspikri stiili, otsisite metoodiliselt skriptide kaudu teed, et leida, milline \u00fcksus kus loodi. Skriptide otsimise asemel proovige j\u00e4rgmist.\n<\/p>\n
\n Pange oma Dreamweaver otsevaatesse ja renderdage oma leht. Seej\u00e4rel vajutage JavaScripti igal ajal k\u00fclmutamiseks klahvi F6, mis v\u00f5imaldab teil lehe d\u00fcnaamilise \u00fcksuse mis tahes koodi lahata ja sihtida. See mitte ainult ei aita teil sihtida d\u00fcnaamilise \u00fcksuse t\u00e4pset koodi, vaid muudab teie arenduse kiireks, v\u00e4hendades d\u00fcnaamilisel veebisaidil mis tahes koodi otsimiseks kuluvat aega.\n<\/p>\n
\n Kodeerimisskript v\u00f5ib olla v\u00e4ga segane, kui te pole harjunud n\u00e4gema keerulist kodeerimist iga p\u00e4ev ja \u00f6\u00f6sel. Siin aitab koodide esilet\u00f5stmine kogu skriptis eraldada. Selle asemel, et silmi veritseva servaga liigutada, on Dreamweaveril funktsioon, mis t\u00f5stab esile kodeeringu, mis aitab teil seda lugeda. Selleks avage Dreamweaveri eelistused ja l\u00fclitage sisse tehnoloogia eelvaadete jaotis. Seej\u00e4rel kl\u00f5psake koodi esilet\u00f5stmise lubamise suvandil ja laske Dreamweaveril oma \u00fclesanne \u00e4ra teha. Siiski peate v\u00f5ib-olla v\u00e4rskendama oma Dreamweaveri versiooni, kuna see funktsioon on saadaval ainult uusimas versioonis.\n<\/p>\n
\n Kui olete esilet\u00f5stmise valiku lubanud, topeltkl\u00f5psake mis tahes sildil ja see t\u00f5stab esile k\u00f5ik sildi eksemplarid praegusel lehel. Parameetrid tuleks siiski m\u00e4\u00e4ratleda. See t\u00f6\u00f6riist on suurep\u00e4rane sarnaste elementide kiireks tuvastamiseks ja nende juurde minemiseks. Kui olete m\u00f5ne elemendi esile t\u00f5stnud, kasutage kiirklahve f3 arvutis ja CMD-G Macis), et liikuda \u00fchelt esilet\u00f5stetud elemendilt j\u00e4rgmisele elemendile. Samuti saab nihkemuutja minna tagasi eelmisele jaotisele. Lisaks t\u00f6\u00f6tab koodi esilet\u00f5stmine ka HTML-i siltide atribuutide ja v\u00e4\u00e4rtustega, et saaksite konkreetseid klasse h\u00f5lpsasti tuvastada.\n<\/p>\n
\n Dreamweaver on suurep\u00e4rane platvorm, kus on intelligentsed ja t\u00e4ielikud HTML- ja CSS-koodid. Kuid m\u00f5ned inimesed usuvad, et JavaScript pole t\u00e4ielik. JQuery v\u00f5i protot\u00fc\u00fcbi puhul peaksite Dreamweaveris teadma, et on olemas API laiendused, mis pakuvad Javascripti l\u00f5pukoode. Need koodid kiirendavad arendusprotsessi, kuna nende koodide kasutamisel pole vaja tippida terveid skripte ja need on kiirete kodeerijate jaoks \u00fcsna mugavad.\n<\/p>\n
\n Dreamweaver on ainus veebiarendustarkvara, mis v\u00f5imaldab kasutada sellist t\u00fc\u00fcpi jQuery ja Prototype l\u00f5pukoode, mis aitavad igal veebiarendajal oma \u00fclesannet kiirendada ja toota parima v\u00f5imaliku toote minimaalse pingutusega.\n<\/p>\n
\n CSS ja JavaScript on s\u00f5ltumatute failide nimed, mida n\u00e4ete HTML- ja PHP-failide avamisel. PHP-faili avades n\u00e4ete seda akna \u00fclaosas. Kuna need k\u00f5ik suvandid asuvad ees, saate h\u00f5lpsalt nendele failidele l\u00fclituda ja teha muudatusi, mida saab salvestada isegi neid avamata. Kui kl\u00f5psate seotud failiribal mis tahes faili, mis n\u00e4itab selle allikat koodivaates ja emalehte kujundusvaates.\n<\/p>\n
\n Lisaks saate kasutada mis tahes koodinavigaatori t\u00f6\u00f6riista, et kiiresti p\u00e4\u00e4seda juurde CSS-i l\u00e4htekoodile, mis m\u00f5jutab teie praegust lahendust. See kiire juurdep\u00e4\u00e4s CSS-i l\u00e4htekoodile v\u00e4hendab kodeerimise aega ja v\u00f5imaldab veebiarendajal keskenduda oma arendusprotsessi erinevatele aspektidele.\n<\/p>\n
\n Korraldamata ja sassis koodiread n\u00e4itavad, et selle kodeerimise arendaja ei olnud piisavalt professionaal ja osav, et koode j\u00e4rjekorda kirjutada. See on ka midagi, mis loeb veebisaidi otsingumootori optimeerimisel palju. Kuid oma koodide korrastamine ja kaunistamine pole nii keeruline, kui inimesed usuvad. Kui tunnete Dreamweaveri valikuid \u00f5igesti ja saate oma koode lennult korraldada. Kasutage lihtsalt valikut \u201eRakenda l\u00e4htekoodi vorming” ja muutke see t\u00e4pselt oma eelistuste j\u00e4rgi. Kodeerimise puhtaks ja korrastamiseks kl\u00f5psake kodeerimise t\u00f6\u00f6riistariba allosas valikul \u201eVorminda l\u00e4htekood” ja seej\u00e4rel valige \u201eredigeeri > t\u00f6\u00f6riistaribad > kodeerimine”. ja seej\u00e4rel valige “koodivormingu s\u00e4tted”, et m\u00e4\u00e4rata oma eelistatud seade.\n<\/p>\n
\n Teine viis skripti korraldamiseks on avada vormingusuvand k\u00e4sud K\u00e4sud > Rakenda allika vorming v\u00f5i rakendada seda ainult kodeerimisplokile, valides valiku Rakenda valikule allika vormindamine.\n<\/p>\n
\n Pole t\u00e4htis, kui palju Adobe Dreamweaveri v\u00f5imsate t\u00f6\u00f6riistade ja funktsioonidega varustab, mida rohkem veebisaitidel t\u00f6\u00f6tate, seda rohkem peate tegema t\u00f6\u00f6d kodeerimise poolel. See v\u00f5ib teie oskusi suurendada, kuid avab ka l\u00f5putute vigade uksed, sest liiga palju kodeerimist pole lihtne teha. Dreamweaver teab seda ja seep\u00e4rast on Dreamweaveri uusimas versioonis, milleks on Creative Cloud (CC), funktsioon nimega Linting tugi. Linting on p\u00f5hiline programmeerimise s\u00fcntaksi kontrollimise t\u00f6\u00f6riist, mis on saadaval CSS-i, HTML-i ja JavaScripti jaoks. Selle kaudu saadab Dreamweaver iga kord, kui mis tahes probleemi v\u00f5i vea tuvastab, mitmeid nii \u00fcldisi kui ka spetsiifilisi signaale.\n<\/p>\n
\n Testi k\u00e4ivitamiseks avage Dreamweaveris koodidega leht ja n\u00e4ete olekuriba paremal k\u00fcljel ringis v\u00e4ikest rohelist linnukest. Kui \u00fcmbritsetud on ainult v\u00e4ike roheline linnuke, on teie koodiga k\u00f5ik korras. Kui seal on punasega \u00fcmbritsetud punane rist, siis on teie kodeerimisel probleeme ja veebisaidi n\u00f5uetekohaseks k\u00e4itamiseks peate selle \u00fcle vaatama. Veelgi enam, kl\u00f5psates vea m\u00e4rgil, v\u00f5ib see viia teid veergu ja reale, kus te veakirjeldusega vea tegite. Parim asi selle juures on see, et sellel funktsioonil pole piiranguid ja saate seda kasutada seni, kuni te ei saa rohelist m\u00e4rki.\n<\/p>\n
\n Sirvimisv\u00f5imalus on iga veebiarendusprotsessi \u00fcks elementaarsemaid asju. Seet\u00f5ttu tegi Dreamweaver selle teie jaoks lihtsamaks, nii et te ei saa kunagi enne veebiarenduse alustamist neid p\u00f5hilisi asju kahe silma vahele j\u00e4tta. Avage Dreamweaveris dokument, mille \u00fchilduvust soovite kontrollida. Men\u00fc\u00fcribal, kuhu on paigutatud koodi-, poolitus- ja kujundusvaadete valikute ikoonid, on veel \u00fcks valik, mida nimetatakse nupuks “Kontrolli lehte”.\n<\/p>\n
\n Kl\u00f5psamisel avaneb rippmen\u00fc\u00fc, valige kontrollige brauseri \u00fchilduvust ja n\u00e4ete oma \u00fchilduvuse tulemust eraldi aknas.\n<\/p>\n
\n Suurt veebisaiti kodeerides juhtub sageli, et m\u00f5ni koodijupp hakkab teid ekraanil \u00e4rritama. V\u00e4ga v\u00e4hesed inimesed teavad, et nad saavad selle kodeerimise osa minimeerida, vajutades klaviatuuril \u00fchte nuppu. Kui olete kindel, et kodeerimise osa pole vaja muuta, valige lihtsalt see plokk ja kl\u00f5psake koodirea numbri k\u00f5rval “-“. See t\u00fckk v\u00e4heneb ja ei h\u00e4iri teid enne, kui seda laiendate.\n<\/p>\n<\/p>\n