Categories
HTML, CSS, JavaScript School

Да научим HTML, CSS, JavaScript, jQuery – част 1 – Подготовка

От отдавна искам да подготвя нещо подобно, но все не остава време… Ето, сега имам стимул- едно приятелче, което иска да се научи. Затова, всеки един урок и занимания, които му давам, ще ги публикувам, за да може и други да се възползват от тях. Всеки един от уроците ще бъдат кратки за изпълнение, в порядъка 30-60 минути, а може и по малко, както в случая. Зависи кой колко бързо се справя. Най- важното, което трябва да научите обаче е да слушате и виждате- т.е. ако някой ви даде съвет за нещо- не го подминавайте, дори и да не е прав (според вас) – дайте му минутка. Ии… така.

Част 1 – Подготовка, среда и едитор

Много е важно да четете какво е написано и какви съвети се дават по сайтовете, затова ще ви е нужен английски език. Не трябва да го знаете перфектно, но малко повече от познания.

Започваме с подготвяне на средата за работа. За целта ни е нужен едитор. Може да се използва всякакъв, дори и NotePad, но специфичните едитори ви дават малко повече детайли, дават ви подсказки и други полезни неща. Ще ви запозная с NetBeans (ако решите, разгледайте и едиторите: Atom , Sublime , Visual Studio Code) – за Windows среда. И стъпка по стъпка:

1. Открийте и инсталирайте едитора NetBeans- версията за HTML & PHP). Тук ще подам и няколко подсказки- Java, Архитектура (64/32). Също така след тези курсове, с малко повече желание – ще има и за PHP, Phalcon.

2. Отворете едитора и разгледайте с какво разполагате. Хвърлете око на опциите

3. Направете си директория в компютъра, кръстете я www и я сложете на D: или на друг дял по желание. Не слагайте интервали в името на папката (за това ще говорим по нататък)

4. В създадената директория създадете нова, наименувайте я first-project

5. Следващите няколко точки са за работа в NetBeans – активирайте дяла с проекти (Projects) и добавете нов проект от тип HTML и изберете пътя на проекта да е създадената по горе директория /www/first-project

6. В този проект, добавете нов файл от тип HTML и с име index.html

7. Ако всичко е наред, отворете файла index.html и разгледайте съдържанието му.

8. Ще имате един таг (така се казва) с име: <body> , а в него <div>TODO write content</div> – променете съдържанието на този елемент, напишете вашето име на мястото на “TODO write content”.

 

А сега- за финал, отворете My Computer/ File explorer и отидете в създадената ни директория  /www/first-project . Сега кликнете два пъти върху index.html и той ще ви се отвори в браузъра. 🙂

 

Следващия урок- ще ви обясня кое какво значи, структура, за какво се използва и как да добавяте нови елементи.