Языки программирования > Разработка сайтов (Web development)

Создание сайтов с помощью Eclipse

(1/1)

SysAdmin:
В данной статье я покажу простой пример как с помощью Eclipse можно создавать или вносить изменения в обычные HTML сайты. Разработка сайтов в Eclipse удобна тем, что Eclipse нам будет подсказывать, если есть ошибки на сайте, которые можно быстро устранить.
Eclipse - это бесплатная и очень мощная IDE (Интегрированная среда разработки) используемая программистами для разработки программного обеспечения, в IDE очень много возможностей для программирования и отладки на многих языках.


* Скачайте последнюю версию Eclipse: http://www.eclipse.org/downloads/
* При установке Eclipse в нашем случае для создания сайтов нужно выбрать "Eclipse IDE for JavaScript and Web Developers" (см. скриншот: sc1.png)
* Путь для установки Eclipse можно указать любой, но я указал в корень диска, мне так удобнее: E:\Eclipse
* При первом запуске Eclipse вас попросит указать рабочую папку, где будут лежать ваши проекты, можно указывать любой путь какой вам удобен. Я указал: E:\Eclipse\workspace (см. скриншот: sc2.png)
* Теперь создаем новый проект: нажимаем "Create a new web project", вводим название нашего нового проекта в поле "Project name", остальное можно не заполнять, нажимаем "Finish", на появившийся вопрос отвечаем "Да" (см. скриншот: sc3.png)
* Слева в списке мы увидим наш проект, в моем случае это "mytreenotes", раскрываем его, устанавливаем курсор на папку "WebContent" - это папка где будет лежать наш сайт.
* Создаем HTML страничку(сайт): нажимаем правой кнопкой мыши на "WebContent" далее "New" далее "HTML File" (см. скриншот: sc4.png)
* Пишем название главной странички сайта, это название обычно должно быть "index.html" и нажимаем "Finish" (см. скриншот: sc5.png)
* Теперь осталось наполнить сайт текстом, картинками и т.п. Все необходимые теги Eclipse создал уже сам. Текст сайта находится между тегами "<BODY>...</BODY>", например вводим туда текст "Мой первый сайт" и этот текст мы увидим на сайте. (см. скриншот: sc6.png)
* Теперь нам нужно запустить наш новый сайт и посмотреть, что у нас получилось: Для этого, нажимаем зеленую кнопку с треугольником как показано на скриншоте "sc7.png" и нажимаем "Yes"
* Появится окно, где будет предложено запустить просмотр сайта на сервере, в данном случае, я оставил все настройки по умолчанию и сайт запустится на нашем компьютере точно так же как и на удаленном сервере. Ничего не трогаем, просто нажимаем "Finish". При первом запуске сайта, Eclipse один раз скачает сам необходимые ему библиотеки, просто подождите пока он будет что-то качать, это нормально.
* Вот и все, теперь вы видите свой сайт (см. скриншот: sc9.png), теперь этот файл "index.html" можно выложить на ваш сервер в интернете и вы увидите в интернете свой сайт.
Можно было сделать все проще, в текстовом редакторе и т.п., но в Eclipse есть огромное количество средств для разработки, подсветка синтаксиса, проверка ошибок, просмотр сайта и т.п., что дает больше удобства в работе.

Навигация

[0] Главная страница сообщений

Перейти к полной версии