![Онлайн редактори на кодове]()
Програмистът не винаги разполага със специален софтуер, чрез който да работи с кода. Ако се случи така, че трябва да редактирате кода, а съответният софтуер не е под ръка, можете да използвате безплатните онлайн услуги. По-нататък ще разкажем за два такива сайта и подробно ще анализираме принципа на работа в тях.
Редактиране на програмния код онлайн
Тъй като има голям брой такива редактори и просто не ги разглеждаме, решихме да се съсредоточим само върху двата онлайн ресурса, които са най-популярни и представляват основния набор от необходими инструменти.
Вижте също: Как да напишем Java програма
Метод 1: CodePen
На сайта CodePen много разработчици споделят свои собствени кодове, записват и работят с проекти. Няма нищо трудно да създадете профила си и веднага да започнете да пишете, но това се прави по следния начин:
Отидете на уебсайта на CodePen
- Отворете главната страница на сайта CodePen, използвайки връзката по-горе и продължете със създаването на нов профил.
![Отидете на регистрацията на сайта CodePen]()
- Изберете удобен начин за регистриране и, следвайки дадените инструкции, създайте своя собствена сметка.
![Завършете процедурата по регистрация на уебсайта на CodePen]()
- Попълнете информацията за страницата си.
![Попълнете личната информация на уебсайта на CodePen]()
- Сега можете да отидете до разделите, да разширите изскачащото меню „Създаване“ и да изберете елемента „Проект“ .
![Създайте нов проект на сайта CodePen]()
- В прозореца вдясно ще видите поддържаните файлови формати и програмни езици.
![Поддържани типове файлове в услугата CodePen]()
- Започнете да редактирате, като изберете един от шаблоните или стандартната HTML5 маркировка.
![Използване на шаблони за услугата CodePen]()
- Всички създадени библиотеки и файлове ще се показват отляво.
![Използване на шаблони за услугата CodePen]()
- Щракването с левия бутон на даден обект го активира, а кодът се показва в прозореца вдясно.
![Редактиране на файлове на услугата CodePen]()
- В долната част има бутони, които ви позволяват да добавяте свои собствени папки и файлове.
![Добавяне на нови файлове в услугата CodePen]()
- След създаването дайте име на обекта и запишете промените.
![Задайте ново име на файла на услугата CodePen]()
- По всяко време можете да отидете в настройките на проекта, като кликнете върху „Настройки“ .
![Отидете в настройките на услугата CodePen]()
- Тук можете да зададете основната информация - името, описанието, етикетите, както и параметрите на визуализацията и отмяната на кода.
![Променете и запазете настройките на услугата CodePen]()
- Ако не сте доволни от текущия изглед на работното пространство, можете да го промените, като кликнете върху „Промяна на изгледа“ и изберете желания прозорец за преглед.
![Променете вида на услугата CodePen]()
- Когато редактирате необходимите редове от код, кликнете върху "Save All + Run", за да запишете всички промени и да стартирате програмата. Съставеният резултат се показва по-долу.
![Процесът на компилиране на код на услугата CodePen]()
- Запазете проекта на компютъра си, като кликнете върху „Експортиране“ .
![Подготовка на проект за изтегляне на CodePen]()
- Изчакайте, докато обработването приключи и изтеглете архива.
![Изтеглете проекта на услугата CodePen]()
- Тъй като потребителят не може да има повече от един активен проект в безплатната версия на CodePen, той ще трябва да бъде изтрит, ако трябва да създадете нов. За да направите това, кликнете върху „Изтриване“ .
![Отидете, за да изтриете проекта от услугата CodePen]()
- Въведете чековата дума и потвърдете изтриването.
![Потвърдете изтриването на проекта от услугата CodePen]()
По-горе разгледахме основните функции на онлайн услугата CodePen. Както можете да видите, той е много подходящ не само да редактирате кода, но и да го напишете от нулата и след това да го споделите с други потребители. Единственият недостатък на сайта са ограниченията в безплатната версия.
Метод 2: LiveWeave
Сега бих искал да се спра на уеб ресурса на LiveWeave. Той съдържа не само вградения редактор на кодове, но и други инструменти, които ще обсъдим по-долу. Работата с сайта започва по следния начин:
Отидете на уебсайта на LiveWeave
- Следвайте връзката по-горе, за да стигнете до страницата на редактора. Тук веднага ще видите четири прозореца. Първият е писането на код в HTML5, вторият е JavaScript, третият е CSS, а четвъртият показва резултата от компилацията.
![Четири активни прозореца на услугата LiveWeave]()
- Една от функциите на този сайт може да се разглежда като подсказки при въвеждане на етикети, те ви позволяват да увеличите скоростта на писане и да избегнете правописни грешки.
![Показване на съвети за услугата LiveWeave]()
- По подразбиране компилацията се извършва в режим на живо, т.е. обработва се веднага след извършване на промени.
![Компилация на живо в LiveWeave]()
- Ако искате да деактивирате тази функция, трябва да преместите плъзгача срещу желания елемент.
![Деактивирайте автоматичното компилиране в услуга LiveWeave.]()
- Наблизо на разположение и изключване на нощния режим.
![Изключете нощния режим на услугата LiveWeave]()
- Можете да отидете на работа с CSS контролери, като кликнете върху съответния бутон в панела вляво.
![Отидете в CSS редактора на услугата LiveWeave]()
- В отвореното меню етикетът се редактира чрез преместване на плъзгачите и промяна на определени стойности.
![Редактирайте CSS в услуга LiveWeave]()
- След това препоръчваме да се обърне внимание на определящия фактор за цветовете.
![Отидете в цветовете на браузъра в LiveWeave]()
- Предоставя се широка палитра, където можете да изберете всеки нюанс, а кодът му ще се покаже най-отгоре, който по-късно се използва при писане на програми с интерфейс.
![Работа с цветен браузър в LiveWeave]()
- Преминете към менюто "Вектор редактор" .
![Отидете на векторния редактор на услугата LiveWeave]()
- Работи с графични обекти, които понякога ще бъдат полезни и при разработката на софтуер.
![Работа във векторния редактор на услугата LiveWeave]()
- Отворете изскачащото меню "Инструменти" . Тук можете да изтеглите шаблона, да запишете HTML файла и генератора на текст.
![Отидете, за да запазите услугата LiveWeave]()
- Проектът се изтегля като един файл.
![Отворете записания документ от услугата LiveWeave]()
- Ако искате да запазите работа, първо трябва да преминете през процедурата за регистрация в тази онлайн услуга.
![Запазване на проекта в услуга LiveWeave]()
Сега знаете как да редактирате кода в LiveWeave. Можем спокойно да препоръчаме използването на този интернет ресурс, тъй като на него има много функции и инструменти, които позволяват да се оптимизира и опрости процеса на работа с програмния код.
Това завършва нашата статия. Днес ви предоставихме две подробни инструкции за работа с код, използвайки онлайн услуги. Надяваме се, че тази информация е полезна и помогна да се определи изборът на най-подходящия уеб ресурс за работа.
Вижте също:
Избор на среда за програмиране
Програми за създаване на Android приложения
Изберете програма за създаване на игра