FrontEnd разработка: CodePen или Sublime Text?

CodePen или възвишен текст?

CodePen или възвишен текст? Ако говорим за уеб програмиране, името на HTML, CSS и JavaScript идва веднага при нас. Има няколко начина да стигнете до там. Дори, ако отворим бележник, можем да започнем да пишем "html". Вярно е, че за да видите резултата от това, което програмирате от подложка, ще ви е необходима трудоемка процедура, за да забележите напредък.

Тези сайтове са основните площадки за разработчици на приложения за потребителите на деня. За да научим повече за предимствата и недостатъците на тези програми, ще ги анализираме задълбочено в тази статия (поне всичко, което знаем). Както винаги казвам, със сигурност някои от вас тук познават темата повече. Ако е така, коментирайте всичко, което ни убягва тук. Ще се радваме да обсъдим!

Днес ще анализираме CodePen, JSBin, Plunkr, sublime, CSSDeck, Dabblet и LiveWeave. Кои са най-известните и инструментите, които се използват най-много в тази среда. Има и още, разбира се.

Но за всички вас, които не знаете за какво е FrontEnd или BackEnd, нека да обясним малко. Front-End или интерфейсът е визуалната част, която потребителят с навигация ще може да види в мрежата. BackEnd ще бъде частта, която администраторът на сайта контролира. При програмирането, ако въведете код чрез инструмент, който показва резултата едновременно, това ще се нарече front-end.

CodePen

За мнозина най-пълният инструмент от всичко, което говорим. Използва се като уеб инструмент, който е най-близо до общността за показване на работата ви. Един вид Youtube от програмиста. В това можете да видите работата на програмистите, свързани с мрежата, и да се свържете с тях, в случай че имате някакъв интерес, да видите техния профил, да ги следвате в мрежите и дори да се абонирате за техния канал, за да видите всички техни бъдещи проекти.

Представяне на съдържание, поддръжка и клавишни комбинации

Презентацията на CodePen е най-интереснаЗащото само с няколко щраквания можете да преминете през процеса веднага. С много добре разделени редове на html, css и javascript. В допълнение към визуалната част, която можете да редувате нагоре и надолу, за да видите ясно напредъка си. По този начин помага да се разграничи добре всеки език. Нещо, което е полезно за по-новите програмисти.

Вашата уеб поддръжка, прави го по-поносимо, когато искате да започнете да използвате нещо, което всъщност не знаем много добре. Това не означава, че е по-добре за вас, зависи от нуждите, които имаме. Но да, за да опознаете околната среда малко по-добре, преди да се ангажирате да инсталирате каквото и да било на компютъра от „неизвестен“ произход.

Ако сте от тези, които са свикнали да използват CASI напълно клавиатура, когато работите, CodePen ще бъде прекрасен за вас. Други инструменти се нуждаят плъгини за да можете да използвате клавишни комбинации за запълване на средата. Това прави работата малко по-неудобна (макар и също толкова ефективна, след като бъде инсталирана). CP. интегрира стандартно система, която ще ви накара да попълните същите редове от код, които се повтарят, както би могло да бъде в списък. Пишете как искате да се появи списъкът и щракнете върху Tab.

Версията Pro също така позволява много повече опции на цена от 9,00 евро за основния пакет до 29,25 евро за пакета „Супер“. Възможност за актуализиране на няколко устройства едновременно какво правим в едно. Също така кооперативен режим, „учителски режим“ и т.н. Възползвайте се, ако искате тук.

JSBin

JSBin е инструмент, който бихме могли да квалифицираме като директен. Тъй като след като отидете на вашия уеб домейн, той ще бъде готов да започне да изготвя следващия ви проект, без забавяне. И въпреки че първата му постановка не е особено привлекателна, тя е удобна.

JSBin е прост, с основната структура, създадена в html, за да не губите време, ще се разпръснете между различните езици, за да завършите работата. Първо има HTML, след това CSS, Javascript и накрая вашата работа визуално. И макар да изглежда по-трудно, ще имате същите видове преки пътища, без да инсталирате нищо. Директно от браузъра.

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

Той има само две вноски, безплатни или платени. Това е малко по-скъпо от CodePen, въпреки че ако го плащате годишно, е по-изгодно, ако можете да платите 120 евро.

CSSDeck

CSSDeck

Работната среда на CSSDeck е различен от този, който се вижда по-горе. Разделен само на две колони, визуален код, CSSDeck работи с 3 реда надолу, с които разделя различните видове език. С презентация под формата на социална мрежа и по-чиста работна среда в светли цветове. Изглежда като прост инструмент. Въпреки че понякога това не означава, че е отрицателно.

С повече от шестдесет хиляди регистрирани потребители и над двеста и петдесет хиляди създадени проекта, търсенето и намирането на това, което искате, няма да бъде трудно. Езикът както винаги, ако може да създаде неудобство за тези, които не знаят английски, но в това социална мрежа Изображението е много важно, така че не мисля, че е голямо предизвикателство.

plunkr

plunkr това е най-малко привлекателният инструмент, който съм срещал досега. Презентацията е агрегирана в съобщения и липса на изображения. Зареждането на съдържание е бавно и не е много полезно на пръв поглед. В допълнение, подреждането по дата прави всяко програмиране, независимо колко просто, да бъде на първо място. За да видите нещо по-интересно, трябва да отидете в раздела, който казва: «Най-гледан«. Тоест, ако досега не сте го превеждали с Google.

Също така кажете, че според мрежата те са във версия 1.0.0. Така че това обяснява малко дизайна, презентацията и възможните грешки, които откривате при сърфиране в мрежата.

Като предимство, ако останете без идеи, няма да се налага да напускате или отваряте друг раздел в Plunkr, тъй като директно от дясната странична лента можете да ходите с други проекти и да ги разглеждате незабавно. Това ще ви улесни да събирате бързи идеи и да ги прилагате едновременно към вашия проект.

поглъщам

поглъщам това е прост инструмент, влизате и създавате. Въпреки че можете да се регистрирате и да имате вашето потребителско име чрез GitHub, това не е нещо, което се откроява много в мрежата. С фон в жълт до червен градиент, във визуалната част и бял фон в кодовата част (както е нормално), проектът Dabblet е представен, въпреки че можете да го промените от раздела CSS. За мен е по-добре да го има празно, тъй като този градиент, който дава само малко живот a

Когато редактирате, можете да конфигурирате разделите, които виждате лесно. Дори и ако искате да превключите към колони или редове за удобно гледане в зависимост от човека, който редактира. Промяната на размера на шрифта, запазването като анонимно без регистриране или валидиране на HTML кода са повече възможности, които Dabblet предлага на пръв поглед. Въпреки че не е първата опция, която бих избрал, може да е да се вземат предвид в бъдещите версии, ако бъдат актуализирани.

Едно от нещата, които най-малко ми харесаха, но които може да се харесат на големите програмисти, е това нямате възможност да поставите етикет в таблица и той да го напише сам. Тоест, поставете HTML и щракнете върху раздела и напишете автоматично "html" и "/ html". Нещо, което в другите приложения, ако е направено.

LiveWeave

liveweave

LiveWeave Той е много подобен на другите, няма нищо, което останалите не могат да предложат по отношение на полезността. Това, което подчертаваме при този проект, е неговият дизайн, тъмен цвят, подобен на CodePen, но с квадратно разпределение. Възможност за промяна на размера да опитам. Има и ясния режим и «извън линия« където кодът, който редактирате, няма да се отрази във визуалното, докато не го активирате. Това не е функция, която намирам за много полезна, тъй като като дизайнер е важно винаги да виждате какво редактирате в реално време, но някой със сигурност ще намери полза от него. И въпреки че, както винаги, можете да се регистрирате, потребителят няма водеща роля. Тъй като дори да не се регистрирате, можете да запазите проекта си.

Sublime Текст

Този инструмент Тотално се различава от това, което сте виждали досега в анализа. Sublime Text не е като уеб ресурс, а като приложение. От една страна, със сигурност е по-полезно да го имате на работния плот. Особено поради възможни сривове в интернет или замръзване поради излишък и възможна загуба на работа. От друга страна, това не е толкова визуален инструмент, колкото предишните. Освен че няма възможност общността да споделя проекти.

Тук всичко е от нулата. Трябва да създадете раздели, за да поставите редовете на кода и да ги преименувате, за да знаете кой е. Ако първият е HTML, вторият CSS ... или обратно. Той също няма преки пътища за това, което ще бъде напълно ръчно, с изключение на офертите.

Заключение

Всички програми са сходни с определени лични щрихи на всяка компания, които водят до плюсове и минуси в тях. Всеки ще избере този, който най-добре му подхожда, моята препоръка е да използвате CodePen или CSSDeck за околната среда и социалната мрежа, която обработва. Но ако сте харесали още един, оставете коментар и обяснете причините си, те със сигурност ще ви бъдат полезни.


Оставете вашия коментар

Вашият имейл адрес няма да бъде публикуван. Задължителните полета са отбелязани с *

*

*

  1. Отговорен за данните: Мигел Анхел Гатон
  2. Предназначение на данните: Контрол на СПАМ, управление на коментари.
  3. Легитимация: Вашето съгласие
  4. Съобщаване на данните: Данните няма да бъдат съобщени на трети страни, освен по законово задължение.
  5. Съхранение на данни: База данни, хоствана от Occentus Networks (ЕС)
  6. Права: По всяко време можете да ограничите, възстановите и изтриете информацията си.