Фронттук иштеп чыгуучу үчүн эң мыкты IDE жана текст редакторлору

Он эки же эки жыл мурун веб-сайттар колдун жана кадимки текст редакторунун жардамы менен жасалган. Өзүңүздүн html тегиңизди жазуу, CSS ичиндеги сап стилдерин колдонуу менен бир аз сыйкырчылык, кызыктуу анимация менен татымал - жана сайт колдонууга даяр. Бүгүнкү күндө веб-сайтты же тиркемени түзүү жана иштеп чыгуу структураланган процесс. Сиз бир мүнөттүн ичинде веб-сайт куруучу аркылуу веб-сайтты түзө аласыз же бир нече ай бою кыйнала аласыз. Вебди иштеп чыгуу өзгөргөн сайын, codeдоону жөнөкөйлөтүү үчүн жаңы алHowтар, плагиндер жана тиркемелер пайда болууда. Кошумча куралдар иш чөйрөңүздү жөнөкөйлөтүп, өндүрүмдүүлүктү жогорулатат. Биз биргелешкен ачык булак долбоорлорун башкаруу жана jQuery сыяктуу китепканалар үчүн versionларды башкаруу системаларын колдонобуз. Өнүгүү чөйрөсү веб-сайтты түзүү процессинде абдан маанилүү ролду ойнойт. Идеалдуу текст процессорун тандоо эмпирикалык изилдөөлөрдү колдонууну талап кылган татаал, бирок аткарыла турган иш болушу мүмкүн. Бул куралдардын, тиркемелердин жана плагиндердин океанында кантип адашып калбоо керек? Күнүмдүк жумуш үчүн кайсы текст редакторун, ал эми үй жаныбарлары үчүн кайсынысын тандоо керек? Биз башталгыч frontend иштеп чыгуучулар үчүн эң популярдуу куралдардын кыскача тизмесин түздүк. Макалада сүйүктүү редакторуңузду айтууну унутуп калдыкпы? Комментарий калтырыңыз!

Блокнот++

Чыгуу: 24-ноябрь, 2003-жыл. Синтаксисти бөлүп көрсөтүү жана өтмөктөр менен эң жөнөкөй тексттик редактор. Көптөгөн программалоо тилдерин жана технологияларын колдойт. Желе иштеп чыгуунун тайгак боорунга жаңы эле кадам таштаган жаңыдан баштагандар үчүн идеалдуу. Мүмкүнчүлүктөр:

• кыстармаларды түзүү;
• түзүлгөн файлдарды автоматтык түрдө көчүрүү жана сактоо;
• стандарттык текст codeдоолорун колдоо жана конвертациялоо;
• колдонуучулар өз алдынча синтаксисти бөлүп көрсөтүү эрежелерин орното алышат;
• ар кандай пайдалуу плагиндерди орнотуу;
• ысык баскычтарды орнотуу жана кайра аныктоо;
• орфографияны текшерүү жана текстти шифрлөө;
• Тетрис ойноо (эгерде сиз codeдоодон чарчасаңыз);
• чоң көлөмдөгү маалыматтарды башкара алат.

Бул редактордун кошумча "өзгөчөлүгү" "Пасхалык жумуртка" болуп эсептелет, ал Dark Атанын - Дарт Вейдердин жана "жек көрүү папкасынын" атасы Билл Гейтстин цитатасын көрсөтүү түрүндөгү. Чымын: азыркы өнүгүү стандарттарына жооп бербеген өтө жөнөкөйлөштүрүлгөн интерфейс. Аны күндүзгү кол чырактын жарыгына салыштырса болот. Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: Windows, ReactOS. Акысыз version: ооба. Шилтеме: https://notepad-plus-plus.org/download/v7.5.1.html

кашаалар

Чыгарылган: 2014-жылдын 4-ноябры. Adobe'дун Frontend иштеп чыгуучулары жана дизайнерлери сүйгөн көптөгөн сонун өнүмдөрү бар. Жана кашаа - алардын бири. Бул акысыз, ачык булактуу, кайчылаш платформа редактору JavaScript, HTML5 жана CSS3'ке негизделген, ошондуктан анын иши атайын аларга багытталган. Эгер сизде JavaScript боюнча негизги түшүнүк бар болсо, анда бул редактор менен иштей башташыңыз керек. Анткени ал экспансия үчүн бардык керектүү шаймандарды камсыздайт. Редактор кээ бир өркүндөтүүгө муктаж, бирок жалпысынан ал активдүү иштеп жатат жана иштеп чыгуучулардын арасында популярдуу. Мындан тышкары, ар бир колдонуучу өз өзгөртүүлөрдү киргизип, кошумча кеңейтүүлөрдү түзө алат. Мүмкүнчүлүктөр:

• JS, CSS жана HTML файлдарын оңдоо боюнча кеңештер;
• реалдуу убакытта браузерде codeду көрүү үчүн колдоо (Live Preview);
• FTP serverи менен синхрондоштуруу;
• аз файлдарга CSSти колдоо жана автоматтык түрдө компиляциялоо;
• текст менен иштөөдө колдоно турган шрифттердин тандоосун (аларды кошуу мүмкүнчүлүгүн) камсыз кылат;
• version башкаруу системасы менен иштөө - Git.

2017-жылдын жаңы versionсы тарыхтан издөө, ар кандай codeдолгон файлдарды жөнөтүү жана кабыл алуу, ысык баскычтарды колдонуу менен түзөтүү тарыхында навигациялоо, кеңейтүүлөрдү жана Linux үчүн жергorктүү менюну иштетүү жана өчүрүү мүмкүнчүлүгүн киргизди. Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: macOS, Windows жана Linux. Акысыз version: ооба. Шилтеме: http://brackets.io

улуу

Чыгуу: 18-январь, 2008-жыл. Платформалар аралык code редактору жана интеграцияланган иштеп чыгуу чөйрөсү (IDE). Биз бул редакторду анын ылдамдыгы жана колдонуунун жеңилдиги үчүн жакшы көрчүбүз, ал эми Coda жана TextMate жолдон чыгып, негизги колдонуучу базасын абдан ыңгайсыз жаңыртуулар менен капа кылды. Мүмкүнчүлүктөр:

• файлдар, символдор жана codeдун айрым бөлүмдөрү аркылуу тез навигация (ушундан улам аны көптөгөн колдонуучулар жакшы көрүшөт);
• Синтаксисти текшерүү функциясы символдорду киргизгенде дароо иштейт;
• макросторду колдонуу менен акыркы аракеттерди оптималдаштыруу жана кайталоо;
• codeду автоматтык түрдө сактоо, анын жоголушун алдын алуу;
• ар кандай визуалдык темаларды жана программалоо тилдерин колдоо;
• көп колдонулган ачкыч сөздөрдү жана code фрагменттерин сактоо;
• Pythonдо даяр плагиндердин топтому;

Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: Windows, Mac OS, GNU/Linux. Акысыз version: ооба (функционалдык чектөөлөрсүз), бирок тиркемени карап чыккандан кийин лицензия сатып алышыңыз керек. Шилтеме: http://www.sublimetext.com/3

WebStorm

Чыгуу: 2015. Бул жөнөкөй текст редактору эмес, ошондой эле JavaScript, CSS жана HTML үчүн интеграцияланган өнүктүрүү чөйрөсү. Анын авторлору JavaRush студенттеринин сүйүктүү IntelliJ IDEA чөйрөсүн түзгөн JetBrains компаниясы. WebStorm эң акылдуу жана эң популярдуу редакторлордун бири. Негизги алHowтарды колдойт: AngularJS, React жана Meteor жана Node.jsде тиркемени түзүү үчүн колдонулат. WebStorm - бул абдан татаал чөйрө, бирок ошол эле учурда ал көптөгөн кеңейтүүлөрдү жана функцияларды талап кылгандар үчүн сонун. Мүмкүнчүлүктөр:

• Git, GitHub, Mercurial versionларын башкаруу системалары менен интеграциялоонун аркасында ар кандай өлчөмдөгү долбоорлор менен эффективдүү иштейт. Бул файлдарды "милдеттендирүүгө", өзгөртүүлөрдү карап чыгууга жана IDE ичинде чыр-чатактарды чечүүгө мүмкүндүк берет;
• LiveEdit - бетти кайра жүктөөсүз алдын ала өзгөртүүлөрдү көрсөтөт (Google Chrome браузери менен иштейт);
• түзөтүү учурунда codeду талдоо;
• Javascript жана Node.js тиркемелери үчүн рефакторинг жана мүчүлүштүктөрдү оңдоо codeу;
• ECMAScript, TypeScript, CoffeeScript жана Dart тилдерин колдоо;
• Node.js Express үлгүсүн колдонуу менен тиркемелерди түзүү;
• Mocha, Karma жана Protractor сыяктуу алHowтар ​​менен ишке киргизүү жана мүчүлүштүктөрдү оңдоо. Сиз аны редактордун өзүндө же ыңгайлуу дарак менюсунда сынап көрсөңүз болот, андан текстке тез кайтууга болот;
• LESS, Sass, SCSS, Stylus препроцессорлору толугу менен колдоого алынат;
• терминал терезесинде тез издөө;
• бир нече Javascript китепканаларын камтыган долбоорлорду структуралаштыруу;
• jQuery, YUI, Prototype, DoJo, MooTools, Qooxdoo жана Bindows үчүн колдоо;
• баштапкы колдоо жана Angular 2 менен иштөө.

Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: Windows, Mac OS, GNU/Linux. Акысыз version: 30 күндүк сыноо versionсы бар, андан кийин лицензия сатып алышыңыз керек. Шилтеме: http://www.jetbrains.com/webstorm/

Atom

Чыгуу: 2014-жылдын 26-февралы. Ар бир адамдын сүйүктүү Github авторлору тарабынан түзүлгөн бекер ачык программалык камсыздоо . Ал 50 модулда курулган жана Node JS, CoffeeScript, CSS, HTML жана C++ тилдеринде жазылган. Сиз ошондой эле өзүңүздүн модулдарыңызды иштеп чыгып, аларды ачык кирүү үчүн репозиторийге жайгаштырсаңыз болот. Бул иштеп чыгуу чөйрөсүн колдонуу абдан оңой жана кошумча плагиндер аны менен иштөө мүмкүнчүлүктөрүн кеңейтүүгө жардам берет. Мүмкүнчүлүктөр:

• json файлдарынын ордуна конфигурациялоо үчүн GUI колдонот;
• codeдун жана анын фрагменттеринин мини-картасын көрүү;
• долбоорлор жана файлдар боюнча тез издөө;
• ыңгайлуу каптал тилкеси жана файл дарагы;
• Githubда жеткorктүү кеңейтүү пакеттеринин көп саны;
• Emmet, Autoprefixer, Livereload колдоо;
• капталдагы дарак аркылуу файлды көрүү;
• редакторду колдонуучунун жеке каалоосуна ылайыкташтыруу мүмкүнчүлүгү;
• камтылган файл менеджеринин болушу;
• плагиндер менен башкаруу пакетин орнотуунун кереги жок, колдонуучунун графикалык интерфейсин колдонуу жетиштүү;
• Node.jsде жазылган плагиндерди колдоо;
• PNG, JPEG сүрөттөрүн түздөн-түз редактордо алдын ала көрүү;
• Git versionсын башкаруу системасы менен иштөөнү сунуш кылат.

Майдагы чымын ал көп эстутумду талап кылат жана чоң маалымат файлдарын иштете алbyte. Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: Windows 7, 8, Mac OS 10.8, Linux. Акысыз version: ооба. Шилтеме: https://atom.io

Vim

Чыгуу: 2-ноябрь, 1991-жыл. Сиз суроо беришиңиз мүмкүн: эски Вим заманбап редакторлордун бул тизмесинде эмнени унуткан? Чынында, Vim UNIX операциялык системаларында жеткorктүү эски vi негизинде түзүлгөн, толугу менен заманбап жана күчтүү текст редактору. Жана ал тынымсыз өнүгүүдө. Иштеп чыгуучулар дээрлик жыл сайын өзгөртүүлөрдү киргизип, жаңы плагиндерди жана кошумчаларды кошуп турушат. Акыркы жолу бул 2016-жылы болгон жана кеңейтүүлөрдүн саны жана ылдамдыгы чындап эле укмуштуу жана текшерип көрүүгө арзырлык. Vim - көп режимдүү редактор. Сиз бир эле учурда бир нече иштей аласыз: буйрук, кыстаруу же визуалдык. Бирок, бул башталгыч иштеп чыгуучу үчүн абдан татаал экенин эске алуу керек. Көп жылдык тажрыйбасы бар адистер анын көп функцияларын бorшпейт да. Мүмкүнчүлүктөр:

• стандарттык текст codeдоо үчүн колдоо;
• бир эле учурда бир нече файлдар менен иштей аласыз;
• файлдарды автоматтык түрдө таануу жана конвертациялоо;
• Perl, Tcl, Python жана Ruby программалоо тилдери менен шайкештик;
• ар бир колдонуучунун муктаждыктары үчүн ыңгайлуу орнотууларды түзүү;
• макросторду жазуу жана ишке ашыруу;
• визуалдык режим көптөгөн пайдалуу функцияларды аткара алат (мисалы, тексттин блокторун бөлүп көрсөтүү);
• оңдон солго жазылган стандарттуу эмес тилдерди колдоо (араб же иврит сыяктуу);
• издөө сөздөрү жана буйрук тарыхы үчүн ыңгайлуу орнотуулар;
• Чычкансыз клавиатураны толук колдонууну колдойт;
• чоң файлдар менен иштөөдө укмуштуудай натыйжалуулугун көрсөтөт.

Синтаксисти бөлүп көрсөтүү: + Автоматтык түрдө тег аныктоо: + OS шайкештиги: Windows, DOS, Linux, BSD жана Mac OS, iOS, Android, AmigaOS, Atari MiNT, BeOS, NextStep, OS/2, OSF, RISC OS, SGI, VMS. Акысыз version: ооба. Шилтеме: https://vim.sourceforge.io/download.php

Netbeans

Чыгарылган: 1997. Акысыз, ачык булак IDE, Oracle тарабынан каржыланган жана дилгир иштеп чыгуучулар тарабынан колдоого алынган. Ыңгайлуулукту жана ылдамдыкты жакшыртуу үчүн дайыма иштелип чыгып, ар кандай кеңейтүүлөр менен толукталууда. Мүмкүнчүлүктөр:

• терезе жана сактоо башкаруу;
• интерфейсти жана дизайнды өзгөртүү (анын ичинде менюларды жана калкыма терезелерди);
• алыскы server менен байланышты орнотуу;
• Кодду рефакторинг жеткorктүү;
• кошумчалар, шаблондор жана code генераторлору бар;
• көптөгөн программалоо тилдерин колдойт;
• автоматтык синтаксис текшерүү жана оңдоо;
• редакторду колдонуучунун муктаждыктарына ылайыкташтыруу;
• JavaScript жана Node.JS тиркемелерин ишке киргизүү жана мүчүлүштүктөрдү оңдоо;
• PHP алHowтарын колдоо (Symfony, Zend жана Yii).

Майда учуу: ал эстутумду көп талап кылат. Синтаксисти бөлүп көрсөтүү: + Tagди автоматтык түрдө аныктоо: + OS шайкештиги: Microsoft Windows, Linux, FreeBSD, Mac OS X, OpenSolaris жана Solaris. Акысыз version: ооба. Болгону бекер. Шилтеме: https://netbeans.org

Хардкор бонусу: Блокнот, ака "Блокнот"

Чыгуу: 1985, Windows 1.0 менен бирге. Ооба, ооба, бардык Windows компьютерлериңизде демейки боюнча орнотулган ошол эле блокнот. «Бул жерде эмне унутулуп калды, мунун өнүгүүгө кандай тиешеси бар?» деп сурайсың. Чынында, биз бүгүн классикалык блокнотто эч ким олуттуу нерсени жаратышы күмөн экенин түшүнөбүз. Бирок, дал ушул программада көптөгөн башталгыч иштеп чыгуучулар акыркы 15-20 жыл ичинде өздөрүнүн биринчи веб-сайттарын "бириктирүүгө" жана биринчи программаларын жазууга жумшашкан. Эмне демекчибиз, эгер сиз үйрөнгүңүз келсе, сизге эч нерсе тоскоол болбошу керек. Чыныгы иштеп чыгуучу (жана бирөө болгусу келгендер) үчүн Блокнот тоскоолдук кылbyte. Өзгөчөлүктөрү: бир гана кара текст, бир гана хардкор. Майда учуп кетиңиз: майда чымын жок: "Блокнот" өзүнүн минимализми менен эң сонун! Синтаксисти бөлүп көрсөтүү: жок. Эс тутумуңузду машыктырыңыз! Автоматтык түрдө тег аныктоо: оо! Акысыз version: Блокнот сиздин Windows сыяктуу акысыз.